import{j as t,P as m,G as d,r as c,d as x,e as b,E as h,F as y,f,a as g}from"./index-BTeXlNCi.js";import{I as v,a as j}from"./ImageListItem-BIQLLH7Z.js";const E=["https://www.youtube.com/watch?v=pzaEb8Gfcfs&t=358s","https://www.youtube.com/watch?v=Be0UDFZXB_M&t=57s","https://www.youtube.com/shorts/0lpO0Zu-sH8","https://www.youtube.com/shorts/TJxnDbCfKYo","https://www.youtube.com/watch?v=hGiOaRFTp1E&t=126s","https://www.youtube.com/watch?v=QCZgQ6IWOUQ","https://www.youtube.com/watch?v=5VM-pY4vBcw","https://www.youtube.com/shorts/jjrHIY4Zdcs","https://www.youtube.com/watch?v=1pCEdlGUJnY&t=6s","https://www.youtube.com/watch?v=Jd5ctpdx71I&t=725s","https://www.youtube.com/watch?v=1ptxa8pfL1U&t=29s","https://www.youtube.com/watch?v=0riUQdRJquc&t=198s","https://www.youtube.com/watch?v=ebAMC08CDTE"];function C(o){const i=o.match(/v=([a-zA-Z0-9_-]{11})/);return i?i[1]:null}function u({src:o}){return t.jsx("div",{style:{position:"relative",paddingBottom:"56.25%",height:0,overflow:"hidden",pointerEvents:"auto"},children:t.jsx("iframe",{style:{position:"absolute",top:0,left:0,width:"100%",height:"100%"},src:o,frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",allowFullScreen:!0,title:"YouTube video player"})})}u.propTypes={src:m.string};function V(){const{screen:o}=d,[i,p]=c.useState({col:0}),[n,w]=c.useState(E.map(e=>({link:e,id:C(e),title:""})));return c.useEffect(()=>{n.forEach((e,s)=>{fetch(`https://noembed.com/embed?url=${encodeURIComponent(e.link)}`).then(a=>a.json()).then(a=>{w(l=>{const r=[...l];return r[s]={...r[s],title:a.title||""},r})}).catch(()=>{})})},[]),c.useEffect(()=>{p(e=>({...e,col:o>701?2:(o>700,1)}))},[o]),t.jsxs(t.Fragment,{children:[t.jsx(x,{}),t.jsxs(b,{mask:!0,children:[t.jsx(h,{p:"clamp(3rem, 3vw + 1rem, 3rem) clamp(3rem, 3vw + 1rem, 3rem)",children:t.jsx(y,{text:"Video Gallery"})}),t.jsx(f,{sx:{width:"100%",height:"100%"},children:t.jsx(v,{variant:"masonry",cols:i.col,gap:8,style:{padding:"8px"},children:n.map((e,s)=>{if(!e.id)return null;const a=`https://img.youtube.com/vi/${e.id}/hqdefault.jpg`,l=`https://www.youtube.com/embed/${e.id}`,r=()=>window.setChildren(t.jsx(u,{src:l}));return t.jsxs(j,{sx:{width:"100%",img:{transition:"all 200ms",borderRadius:"8px","&:hover":{cursor:"pointer",boxShadow:"0 0 10px #9999991a"}},...o<700&&{maxHeight:"300px",height:"300px",img:{height:"240px !important"}}},children:[t.jsx("img",{src:a,alt:e.title||`Video ${s+1}`,style:{height:400,objectFit:"cover",borderRadius:8},onClick:r}),t.jsx(h,{sx:{marginTop:.5,overflow:"hidden",display:"-webkit-box",WebkitBoxOrient:"vertical",WebkitLineClamp:1},children:t.jsx(g,{sx:{textAlign:"left",textOverflow:"ellipsis",color:"#b2b2b2",transition:"all 200ms","&:hover":{cursor:"pointer",color:"#e8e8e8"}},onClick:r,text:e.title||`Video ${s+1}`})})]},s)})})})]})]})}export{V as default};