https://nomion.io/_next/static/chunks/8321.8c5792b8c3b68431.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[8321],{8321:(e,l,s)=>{s.r(l),s.d(l,{VideoIntroSectionUI:()=>o});var i=s(97221),a=s(9788),n=s(4553),t=s(95155),c=s(92664),r=s(12115),u=s(80559),d=s(3941),o=e=>{var l,s;let{sectionData:o,onLoadEnd:h,configTheme:v,isMytam:f}=e,m=e.id,{currentSection:x,isInViewport:j}=(0,n.f)(m),{registerMedia:p,unregisterMedia:N,play:g,pause:b}=(0,n.b)(),{video:w,is_autoplay:y,has_controls:T,is_video_fullscreen:_,thumbnails:k}=o,C=null==w?void 0:w.value,S=null==y?void 0:y.value,E=(null==T?void 0:T.value)||!0,I=null===(s=null==_?void 0:_.value)||void 0===s||s,P=(null==C?void 0:C.thumbnail_url)||(null==k?void 0:null===(l=k.value)||void 0===l?void 0:l.url),[z,M]=(0,r.useState)(S),[V,F]=(0,r.useState)(!1),Q=(0,r.useRef)(null),[B,D]=(0,r.useState)(!0);(0,r.useEffect)(()=>(Q.current&&p({id:m,type:"video",element:Q.current}),()=>N(m)),[]);let L=()=>{b(m)},A=()=>{g(m)};return(0,r.useEffect)(()=>{F(!0);let e=setInterval(()=>F(!1),2e3);return()=>clearInterval(e)},[z]),(0,r.useEffect)(()=>{x&&(j&&S?A():L())},[j]),(null==C?void 0:C.url)||f?(0,t.jsx)(n.g,{className:"max-h-full",name:m,children:(0,t.jsxs)(c.P.div,{className:(0,u.QP)("relative m-auto flex h-full w-full max-w-[600px] flex-col items-center overflow-hidden",I&&"items-center justify-center"),initial:{opacity:0,scale:.8},animate:{opacity:1,scale:1},transition:{duration:1},children:[(0,t.jsxs)(c.P.div,{initial:{opacity:0}

1,animate:{opacity:1},transition:{duration:.2},className:(0,u.QP)("absolute h-[250px] w-full",I&&" h-full items-center flex justify-center"),children:[(0,t.jsx)("video",{ref:Q,controls:E,src:null==C?void 0:C.url,muted:z,onEnded:()=>{b(m),h()},onPlay:()=>{g(m)},onPause:()=>{b(m)},className:"h-full w-full object-cover"}),f&&(0,t.jsxs)("div",{className:"p-4 space-y-5",children:[(0,t.jsxs)("div",{className:"border-b p-3",children:[(0,t.jsx)(a.a,{field:{value:"Ước g\xec"},configTheme:v}),(0,t.jsx)("div",{className:"text-sm",children:"Tốp ca / s\xe1ng t\xe1c V\xf5 Thiện Thanh"})]}),(0,t.jsxs)("div",{className:"border-b p-3",children:[(0,t.jsx)(a.a,{field:{value:"T\xecnh Y\xeau Chưa N\xf3i - Nh\xe9 Anh"},configTheme:v}),(0,t.jsx)("div",{className:"text-sm",children:"Li\xean kh\xfac / s\xe1ng t\xe1c Mỹ T\xe2m - Nguyễn H\xe0"})]}),(0,t.jsxs)("div",{className:"border-b p-3",children:[(0,t.jsx)(a.a,{field:{value:"Chuyện Như Chưa Bắt Đầu"},configTheme:v}),(0,t.jsx)("div",{className:"text-sm",children:"S\xe1ng t\xe1c"})]}),(0,t.jsxs)("div",{className:"border-b p-3",children:[(0,t.jsx)(a.a,{field:{value:"Ng\xf4i Sao C\xf4 Đơn"},configTheme:v}),(0,t.jsx)("div",{className:"text-sm",children:"biểu diễn Quang Dũng / S\xe1ng t\xe1c Thanh T\xf9ng"})]})]})]}),B?(0,t.jsxs)("div",{className:"relative h-full w-full z-10",onClick:()=>{D(!1),A()},children:[!!P&&(0,t.jsx)(d.K,{src:P,alt:"Intro Thumbnail",className:"h-full w-full object-cover z-0"}),(0,t.jsx)("div",{className:"cursor absolute flex h-full w-full items-center justify-center z-10 top-0 left-0",children:(0,t.jsxs)("div",{className:"relative flex h-full w-full items-center justify-center",children:[(0,t.jsx)("div",{className:"absolute inline-flex h-[55px] w-[55px] animate-ping rounded-full bg-white"}),(0,t.jsx)("div",{className:"z-50 flex h-[80px] w-[80px] items-center justify-center rounded-full bg-black",onClick:A,children:(0,t.jsx)(i.a,{})})]})})]}):!E]})}):null}},97221:(e,l,s)=>{s.d(l,{a:()=>a});var i=s(95155),a=e=>{let{...l}=e;return(0,i.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"40",height:"40",fill:"none",viewBox:"0 0 40 40",...l,children:(0,i.jsx)("path",{fill:"#F0F0F0",d:"M8.334 20v-5.934c0-7.366 5.217-10.383 11.6-6.7l5.15 2.967 5.15 2.967c6.383 3.683 6.383 9.716 0 13.4l-5.15 2.966-5.15 2.967c-6.383 3.683-11.6.667-11.6-6.7V20z"})})}}}]);