"use strict";(self.__cfswpl__=self.__cfswpl__||[]).push([[233],{7233:(e,t,n)=>{n.r(t),n.d(t,{Controls:()=>rn,default:()=>ln,fasterPlaybackRate:()=>nn,slowerPlaybackRate:()=>an});var a=n(3807),r=n(3661),l=n(5152),i=n(310),o=n(1703),s=n(176),c=n(4598);const u=()=>{const{videoRef:e}=(0,a.dT)(),[t,n]=(0,l.useState)("WebKitPlaybackTargetAvailabilityEvent"in window);return(0,l.useEffect)((()=>{const t=(0,s.Z)(e.current),a=e=>{n(void 0!==window.WebKitPlaybackTargetAvailabilityEvent&&e instanceof window.WebKitPlaybackTargetAvailabilityEvent&&"available"===e.availability)};return t.addEventListener("webkitplaybacktargetavailabilitychanged",a),()=>{t.removeEventListener("webkitplaybacktargetavailabilitychanged",a)}}),[e]),t?l.createElement(i.B,{onClick:()=>{(0,s.Z)(e.current).webkitShowPlaybackTargetPicker()}},l.createElement(o.J,{type:"airplay"}),l.createElement(c.T,null,"Airplay")):null};var m=n(3687),d=n(7535);const p=r.iv` border-radius: 50%; background: hsl(0 0% 0% / 0.3); `,h=r.iv` --glow-color: var(--primary-color); display: block; /* normalize across UA styles */ padding: 0; margin: 0; border: none; background-color: transparent; color: var(--primary-color); cursor: pointer; `,f=r.iv` display: block; /* Visually balance the icon within the circle */ transform: translateX(3%); height: min(25vh, 12em); `,g=r.iv` position: absolute; top: 0; right: 0; bottom: 0; left: 0; height: 100%; width: 100%; display: flex; justify-content: center; align-items: center; `;function v(e){let{onClick:t}=e;const{setPaused:n,autoPlay:r,playbackStarted:i,playbackFailed:s,src:u}=(0,a.dT)(),{error:v}=(0,d.py)(),[E,b]=(0,l.useState)(!1);return(0,l.useEffect)((()=>{b(!1)}),[u]),E||v||i||r&&!s?null:l.createElement("div",{className:g,onClick:e=>{b(!0),n(!1),t&&t(e)}},l.createElement("div",{className:p},l.createElement(m.j,{glowSize:".25em",className:h},l.createElement(o.J,{className:f,type:"play"}),l.createElement(c.T,null,"Play Video"))))}const E=e=>{let{to:t,className:n,children:a}=e;return t?l.createElement("a",{className:n,href:t,target:"_top"},a):l.createElement(l.Fragment,null,a)},b=r.iv` display: block; height: 3rem; width: 3rem; border-radius: 100%; `,y=r.iv` img { box-shadow: 0px 0px 8px hsl(0 0% 0% / 50%), 0px 0px 16px hsl(0 0% 0% / 50%); transition: box-shadow 0.25s ease; :hover { box-shadow: 0px 0px 8px hsl(0 0% 100% / 50%), 0px 0px 16px hsl(0 0% 100% / 50%); } } `,x=e=>{let{src:t,link:n}=e;return l.createElement(E,{className:y,to:n},l.createElement("img",{className:b,src:t,alt:"Channel Logo"}))},w=(0,l.createContext)({controlsVisible:!0,showControls:()=>{},hideControls:()=>{}}),k=e=>{let{children:t}=e;const n=(0,l.useRef)(-1),[a,r]=(0,l.useState)({intentType:"hide"}),[i,o]=(0,l.useState)("show"===a.intentType);(0,l.useEffect)((()=>("hide"===a.intentType?o(!1):(o(!0),a.options?.hideAfter&&(n.current=window.setTimeout((()=>{o(!1)}),a.options.hideAfter))),()=>{clearTimeout(n.current)})),[a]);const s={controlsVisible:i,showControls:(0,l.useCallback)((e=>{r({intentType:"show",options:e})}),[]),hideControls:(0,l.useCallback)((()=>{r({intentType:"hide"})}),[])};return l.createElement(w.Provider,{value:s},t)};function N(){return(0,l.useContext)(w)}const S=()=>{const{fullscreenEnabled:e,fullscreenActive:t,toggleFullscreen:n}=(0,a.dT)();return e?l.createElement(i.B,{onClick:n},l.createElement(o.J,{type:t?"exitFullscreen":"enterFullscreen"}),l.createElement(c.T,null,t?"Exit Fullscreen":"Enable Fullscreen")):null};var T=n(6626),L=n(8428);const M=800,C=r.F4` 0% { /* We're not changing the translate, but it needs to be present in the animation because we're changing the scale, and transform can only have one value assigned at a time. */ transform: translate(-50%, -50%) scale(1); opacity: 1; } 100% { transform: translate(-50%, -50%) scale(.8); opacity: 0; } `,P=r.iv` position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: white; height: 7em; width: 7em; padding: 1.5em; background-color: rgba(0, 0, 0, 0.5); border-radius: 300px; display: flex; flex-direction: column; justify-content: center; align-items: center; animation: ${C} ${.8-.2}s ease ${.2}s forwards; `,A=r.iv` font-size: 1em; `,D=r.iv` margin-top: 0.5em; `,O={play:"play",pause:"pause",muted:"volumeMuted",unmuted:"volumeHigh"},R=e=>{let{indication:t}=e;return l.createElement("div",{className:P},l.createElement(o.J,{className:(n="play"===t.type,r.iv` margin-left: ${n?"0.125em":0}; `),type:O[t.type]}),l.createElement("span",{"aria-label":t.type}));var n},j=e=>{let{indication:t}=e;const{volume:n}=t;return l.createElement("div",{className:P},l.createElement(T.eU,{className:A,volume:n,muted:!1}),l.createElement("span",{className:D},Math.round(100*n),"%"))},I=e=>{let{indication:t}=e;const{type:n,skipSeconds:a}=t;return l.createElement("div",{className:P},l.createElement(o.J,{className:A,type:n}),l.createElement("span",{className:D},a,"s"))},F=e=>{let{indication:t}=e;const{type:n,playbackRate:a}=t;return l.createElement("div",{className:P},l.createElement(o.J,{className:A,type:n}),l.createElement("span",{className:D},a,"x"))},$={play:R,pause:R,muted:R,unmuted:R,volumeUp:j,volumeDown:j,skipForward:I,skipBackward:I,fastForward:F,fastBackward:F},B=()=>{const e=(0,L.iu)(M);if(!e)return null;const t=$[e.type];return l.createElement(t,{key:JSON.stringify(e),indication:e})};var z=n(5769);var U=n(8840);const J=r.iv` display: flex; align-items: baseline; gap: 0.5rem; svg { height: 1em; width: auto; align-self: center; } `;const V=()=>{const e=function(){const[e,t]=(0,l.useState)(0),{resourceUrl:n}=(0,z.A)(),a=(0,l.useRef)(-1);return(0,l.useEffect)((()=>{let e;const r=()=>e&&e.abort(),l=()=>{e=new AbortController,clearTimeout(a.current),a.current=window.setTimeout(r,5e3),fetch(n+"/views",{signal:e.signal}).then((e=>200===e.status?e.json():{liveViewers:0})).then((e=>{let{liveViewers:n}=e;return t(n)})).catch(U.r).finally((()=>clearTimeout(a.current)))},i=setInterval(l,1e4);return l(),()=>{clearInterval(i),r()}}),[n]),e}();return e<1?null:l.createElement("div",{className:J},l.createElement(o.J,{type:"eye"}),(t=e)<1e3?t.toString():t<1e6?(t/1e3).toFixed(1)+"K":t<1e9?(t/1e6).toFixed(1)+"M":(t/1e9).toFixed(1)+"B"," ",l.createElement(c.T,null,"viewers"));var t},_=r.iv` display: flex; gap: 0.75rem; align-items: baseline; `,K=r.iv` display: flex; align-items: center; cursor: var(--cursor); background: transparent; border: none; &:before { content: ' '; background: var(--color); height: 0.75rem; width: 0.75rem; margin-right: 0.5rem; border-radius: 100%; } `,X=e=>{let{dvrEnabled:t}=e;const{seek:n,liveEdge:r,currentTime:i}=(0,a.dT)(),o="false"===new URLSearchParams(location.search).get("liveViewerCount"),{flavor:s}=(0,z.A)(),c="LIVE"+("llhls"===s?" (Low Latency)":""),u=null===r||r-i<10;return l.createElement("div",{className:_,onClick:()=>{r&&n(r)}},l.createElement("button",{disabled:!t||!r,style:{"--color":u?"red":"#bbb","--cursor":t?"pointer":"auto"},className:K},c),!o&&l.createElement(V,null))},Y=()=>{const{videoRef:e}=(0,a.dT)(),[t,n]=(0,l.useState)(!1);return(0,l.useEffect)((()=>{const t=(0,s.Z)(e.current),a=()=>{n(!0)},r=()=>{n(!1)};return t.addEventListener("enterpictureinpicture",a),t.addEventListener("leavepictureinpicture",r),()=>{t.removeEventListener("enterpictureinpicture",a),t.removeEventListener("leavepictureinpicture",r)}}),[e]),document.pictureInPictureEnabled?l.createElement(i.B,{onClick:()=>{if(t)document.exitPictureInPicture();else{(0,s.Z)(e.current).requestPictureInPicture()}}},l.createElement(o.J,{type:t?"exitPictureInPicture":"enterPictureInPicture"}),l.createElement(c.T,null,t?"Exit Picture in Picture":"Enable Picture in Picture")):null};var W=n(1857);const Z=r.iv` flex-shrink: 0; padding-left: 1em; display: flex; align-items: center; justify-content: flex-end; font-variant-numeric: tabular-nums; `,H=e=>Math.floor(e/60%60),q=e=>Math.floor(e/60/60),Q=(e,t,n)=>[n>0&&Math.floor(q(e)).toString().padStart(n.toString().length,"0"),Math.floor(H(e)).toString().padStart(n>0?2:t.toString().length,"0"),Math.floor((e=>e%60)(e)).toString().padStart(2,"0")].filter(Boolean).join(":"),G=()=>{const{currentTime:e,duration:t}=(0,a.dT)(),n=isNaN(t)?0:t,r=isNaN(e)?0:e;return l.createElement("div",{className:Z},Q(r,H(n),q(n))," ","/"," ",Q(n,H(n),q(n)))};var ee=n(5850);var te=n(1638);const ne=r.iv` position: absolute; width: 100%; height: 100%; top: 0; left: 0; pointer-events: none; `,ae=e=>{let{children:t,className:n,transform:a}=e;return l.createElement("div",{className:(0,te.A)(ne,n),style:{transform:a}},t)};function re(e){return Math.min(1,Math.max(0,e))}function le(){const[e,t]=(0,l.useState)(window.matchMedia("(hover: hover)").matches?"mouse":"touch");return(0,l.useEffect)((()=>{const n=n=>{e!==n.pointerType&&t(n.pointerType)};return window.addEventListener("pointerdown",n,!0),window.addEventListener("pointermove",n,!0),()=>{window.removeEventListener("pointerdown",n,!0),window.removeEventListener("pointermove",n,!0)}}),[e]),e}n(8921),n(6248),n(3599),n(1477),n(4362),n(5389),n(401),n(5164),n(1238),n(4837),n(7485),n(465),n(6651),n(1437),n(5285),n(9865);function ie(){return ie=Object.assign?Object.assign.bind():function(e){for(var t=1;t{let{sources:t,onLoad:n,...a}=e;const r=(0,l.useMemo)((()=>t.reduce(((e,t,n)=>oe.has(t)?n:e),0)),t),[i,o]=(0,l.useState)(r);return(0,l.useEffect)((()=>{o(r)}),[r]),l.createElement("img",ie({src:t[i],onLoad:e=>{oe.add(e.currentTarget.src);const a=i+1;a0&&void 0!==arguments[0]?arguments[0]:0;return r.iv` /* Important that the height here resolves to a whole pixel value because the container is going to hold a spritesheet and translate it within based on the height and image index. If this value renders with sub-pixel values, it can lead to an inaccurate translation calculation and cause a bad "scrolling" */ --height: 7rem; @media (max-height: 280px) { --height: 5rem; } @media (max-height: 180px) { --height: 3rem; } @media (max-height: 150px) { --height: 2rem; } height: var(--height); width: calc(var(--height) * ${e}); overflow: hidden; position: relative; box-sizing: content-box; border: 0.15em solid white; background: white; // layered shadows to look more realistic // https://tobiasahlin.com/blog/layered-smooth-box-shadows/ // https://shadows.brumm.af/ box-shadow: 0 0px 28.8px rgba(0, 0, 0, 0.042), 0 0px 34.1px rgba(0, 0, 0, 0.061), 0 0px 36.4px rgba(0, 0, 0, 0.075), 0 0px 38.4px rgba(0, 0, 0, 0.089), 0 0px 42.6px rgba(0, 0, 0, 0.108), 0 0px 61px rgba(0, 0, 0, 0.15); margin-bottom: 1rem; opacity: ${e?1:0}; `},me=r.iv` background: black; width: 100%; display: block; `,de=r.iv` position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgb(0 0 0 / 0.3); p { margin: 0; } `,pe={};const he={},fe=e=>{let{time:t,debug:n}=e;const{resourceUrl:r}=(0,z.A)(),{duration:i}=(0,a.dT)(),[o,s]=function(){const{videoId:e}=(0,z.A)(),[t,n]=(0,l.useState)(!!pe[e]);return(0,l.useEffect)((()=>{n(!!pe[e])}),[e]),[t,(0,l.useCallback)((t=>{pe[e]=t,n(t)}),[e])]}(),{secondsInSpriteSheet:c,imagesPerSheet:u}=(e=>{let{duration:t,idealImagesPerSheet:n,idealSheetCount:a,maxSecondsInSpriteSheet:r}=e;const l=t/a;if(l<=r)return{secondsInSpriteSheet:l,imagesPerSheet:n};const i=n*a,o=Math.ceil(t/r);return{secondsInSpriteSheet:r,imagesPerSheet:Math.ceil(i/o)}})({duration:i,idealImagesPerSheet:60,idealSheetCount:6,maxSecondsInSpriteSheet:600}),{spriteIndex:m,sheetIndex:d,imageIndex:p}=(e=>{let{secondsInSpriteSheet:t,imagesPerSheet:n,time:a,duration:r}=e;const l=t/n,i=Math.min(Math.ceil(a/l),Math.floor(r/l-1e-6));return{spriteIndex:i,sheetIndex:Math.floor(i/n),imageIndex:i%n}})({secondsInSpriteSheet:c,imagesPerSheet:u,time:t,duration:i}),h=ce.map((e=>ge({resourceUrl:r,height:e,imageCount:u,duration:c,time:d*c}))),[f,g]=(0,l.useState)(),v=f?he[f]:void 0;return(0,l.useEffect)((()=>{g([...h].reverse().find((e=>void 0!==he[e])))}),h),o?null:l.createElement("div",{className:ue(v)},l.createElement(ae,{transform:`translateY(-${100*p}%)`},l.createElement(se,{key:(void 0===he[h[0]]).toString(),className:me,sources:h,alt:`Preview of video at ${Math.round(t)} seconds}`,onError:()=>s(!0),onLoad:e=>{let{currentTarget:{naturalWidth:t,src:n}}=e;he[n]=t/ce[h.indexOf(n)],g(n)}})),n&&l.createElement("div",{className:de},l.createElement("p",null,"time: ",t.toFixed(2)),l.createElement("p",null,"spriteIndex: ",m),l.createElement("p",null,"sheet: ",d),l.createElement("p",null,"image: ",p)))},ge=e=>{let{resourceUrl:t,time:n,duration:a,height:r,imageCount:l}=e;return`${t}/thumbnails/thumbnail.jpg?${new URLSearchParams({time:`${n.toFixed(3)}s`,duration:`${a.toFixed(3)}s`,height:r.toString(),imageCount:l.toString()})}`};var ve=n(4964);function Ee(e){const t=Math.floor(e/60);return[t&&`${t} minutes`,`${Math.round(e%60)} seconds`].filter(Boolean).join(" and ")}function be(){return be=Object.assign?Object.assign.bind():function(e){for(var t=1;t div:first-child { transform: scaleY(1); } `,ke=r.iv` position: relative; width: 100%; height: 0.4em; background: rgba(255, 255, 255, 0.2); transform: scaleY(0.6); transition: transform 0.3s ease; outline-offset: 1px !important; /* the focus ring expands as the transform sled children move outside the container's box. Setting overflow: hidden prevents this. */ overflow: hidden; `,Ne=r.iv` position: absolute; top: 0; bottom: 0; background: #eee; left: 0; right: 0; width: 100%; transform-origin: left; transition: opacity 0.5s ease; `,Se=r.iv` z-index: 1; `,Te=r.iv` width: 3px; height: 100%; transform: translateX(-50%); background: #fff; opacity: 0.7; `,Le=r.iv` position: absolute; top: 0; height: 100%; left: 0; width: 100%; background: var(--primary-color, white); transform: scaleX(0); transform-origin: 0 0; `,Me=r.iv` position: absolute; z-index: 1; width: 1px; top: 0; height: 100%; background: rgba(0, 0, 0, 0.5); `,Ce=r.iv` transform: translateX(-50%); position: absolute; left: 0; bottom: 1.5em; display: flex; flex-direction: column; align-items: center; `,Pe=r.iv` // layered shadows to look more realistic // https://tobiasahlin.com/blog/layered-smooth-box-shadows/ // https://shadows.brumm.af/ text-shadow: 0 0.1px 2.4px rgba(0, 0, 0, 0.042), 0 0.3px 3.2px rgba(0, 0, 0, 0.061), 0 0.5px 3.6px rgba(0, 0, 0, 0.075), 0 0.9px 4px rgba(0, 0, 0, 0.089), 0 1.7px 4.7px rgba(0, 0, 0, 0.108), 0 4px 7px rgba(0, 0, 0, 0.15); font-variant-numeric: tabular-nums; `;function Ae(e,t,n){const a=n/2;return Math.min(Math.max(t*e,a),t)}function De(e,t){const{seek:n,duration:r}=(0,a.dT)();(0,ve.x6)({keyName:e.toString()},(()=>n(e/10*r)),{target:t})}const Oe=10;const Re=e=>{let{}=e;const{duration:t,seek:n,bufferedTimeRanges:i,paused:o,setPaused:s,videoRef:c}=(0,a.dT)();!function(){const{fullscreenContainerRef:e,duration:t,currentTime:n,seek:r}=(0,a.dT)(),l=(0,L.DY)(),i=(0,L.iu)(M);De(0,e),De(1,e),De(2,e),De(3,e),De(4,e),De(5,e),De(6,e),De(7,e),De(8,e),De(9,e);const o=()=>{r(Math.min(t,n+Oe));const e=i&&"skipForward"===i.type?Oe+i.skipSeconds:Oe;l({type:"skipForward",skipSeconds:e,timestamp:Date.now()})},s=()=>{r(Math.max(0,n-Oe));const e=i&&"skipBackward"===i.type?Oe+i.skipSeconds:Oe;l({type:"skipBackward",skipSeconds:e,timestamp:Date.now()})};(0,ve.x6)({keyName:"ArrowRight"},o,{target:e}),(0,ve.x6)({keyName:"l"},o,{target:e}),(0,ve.x6)({keyName:"ArrowLeft"},s,{target:e}),(0,ve.x6)({keyName:"j"},s,{target:e})}();const{flags:u}=(0,ee.OK)()??{},[m,d]=(0,l.useState)(0),p=function(e){const[t,n]=(0,l.useState)(e.current?.currentTime??0),a=(0,l.useRef)(-1);return(0,l.useEffect)((()=>(function t(){a.current=requestAnimationFrame((()=>{e.current&&n(e.current.currentTime),t()}))}(),()=>{cancelAnimationFrame(a.current)})),[e]),t}(c),h=function(){let{hideAfter:e=3e3}=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};const{showControls:t}=N(),[n,a]=(0,l.useState)(!1),r=(0,l.useCallback)((e=>{a(!0),t(),e.stopPropagation()}),[t]),i=(0,l.useCallback)((n=>{a(!1),t({hideAfter:e}),n.stopPropagation()}),[t]);return e=>({onMouseMove:(0,l.useCallback)((t=>{e.onMouseMove&&e.onMouseMove(t),n&&t.stopPropagation()}),[e.onMouseMove]),onMouseDown:(0,l.useCallback)((t=>{e.onMouseDown&&e.onMouseDown(t),r(t)}),[e.onMouseDown]),onMouseUp:(0,l.useCallback)((t=>{e.onMouseUp&&e.onMouseUp(t),i(t)}),[e.onMouseUp]),onTouchStart:(0,l.useCallback)((t=>{e.onTouchStart&&e.onTouchStart(t),r(t)}),[e.onTouchStart]),onTouchEnd:(0,l.useCallback)((t=>{e.onTouchEnd&&e.onTouchEnd(t),i(t)}),[e.onTouchEnd])})}(),f=(0,l.useRef)(null),g=(0,l.useRef)(null),v=(0,l.useRef)(null),E=(0,l.useCallback)((e=>{let{clientX:n,currentTarget:a}=e;const{left:r,right:l}=a.getBoundingClientRect(),i=(n-r)/(l-r);d(Math.min(t,Math.max(0,i*t)))}),[t]),b=function(e){const t=le(),[n,a]=(0,l.useState)(!1);return(0,l.useEffect)((()=>{const n=e.current;if("mouse"!==t||!n)return void a(!1);const r=()=>{a(!0)},l=()=>{a(!1)},i=()=>{a(!1)};return n.addEventListener("mouseenter",r),n.addEventListener("mouseleave",l),window.addEventListener("blur",i,!0),()=>{n.removeEventListener("mouseenter",r),n.removeEventListener("mouseleave",l),window.removeEventListener("blur",i,!0)}}),[t,n]),n}(g),y=function(e,t){const[n,a]=(0,l.useState)(!1),r=(0,l.useRef)(e);return(0,l.useLayoutEffect)((()=>{r.current=e}),[e]),(0,l.useEffect)((()=>{const e=t.current;if(!e)return;const n=()=>{a(!1),e.removeEventListener("pointermove",o),e.removeEventListener("pointerup",s),window.removeEventListener("selectstart",l,!0)},l=e=>{e.preventDefault()},i=t=>{a(!0),r.current(re(t.offsetX/e.offsetWidth)),e.addEventListener("pointermove",o),e.addEventListener("pointerup",s),e.setPointerCapture(t.pointerId),window.addEventListener("selectstart",l,!0)},o=t=>{let{offsetX:n}=t;r.current(re(n/e.offsetWidth))},s=t=>{n(),e.releasePointerCapture(t.pointerId)};return e.addEventListener("pointerdown",i),e.addEventListener("lostpointercapture",n),()=>{e.removeEventListener("pointerdown",i),e.removeEventListener("pointermove",o),e.removeEventListener("pointerup",s),e.removeEventListener("lostpointercapture",n),window.removeEventListener("selectstart",l,!0)}}),[t]),n}((e=>d(e*t)),g),x=function(e,t){return Math.floor(1e4*e/t)/100}(y?m:p,t),w=b||y,k=le();return l.createElement("div",{className:ye,ref:f},w&&t>0&&l.createElement(ae,{transform:v.current&&f.current?`translate3d(${Ae(m/t,f.current.offsetWidth,v.current.offsetWidth)}px, 0, 0)`:void 0},l.createElement("div",{className:Ce,ref:v},l.createElement(fe,{time:m}),l.createElement("span",{className:Pe},Q(m,H(t),q(t))))),l.createElement("div",{className:we},l.createElement("div",{className:ke,tabIndex:0,"aria-label":"seek slider",role:"slider","aria-valuemin":0,"aria-valuemax":t,"aria-valuetext":`${Ee(p)} of ${Ee(t)}`,"aria-valuenow":p},i.map((e=>{let{start:n,end:a}=e;return l.createElement("div",{key:n,className:Ne,style:{opacity:p<.1&&o?0:.35,transform:`translate3d(${n/t*100}%, 0, 0)\n scale3d(${(a-n)/t}, 1, 1)`}})})),w&&l.createElement(ae,{className:Se,transform:`translate3d(${100*m/t}%, 0, 0)`},l.createElement("div",{className:Te,"data-tick":!0,style:{background:m{s(!0)},onPointerUp:()=>{n(m),s(!1)}},h({onMouseMove:E})))));var S};var je=n(4314),Ie=n(8426);function Fe(){return Fe=Object.assign?Object.assign.bind():function(e){for(var t=1;tl.createElement(Ie.g7,{className:t},l.createElement(e,Fe({},n,{ref:a})))));return n.displayName=`styled(${e.displayName})`,n}function Be(){return Be=Object.assign?Object.assign.bind():function(e){for(var t=1;tl.createElement(Ie.g7,{className:Xe,"aria-label":"Close"},l.createElement(je.x8,Be({},e,{ref:t}),l.createElement(o.J,{type:"circleXMark"}))))),qe=(0,l.forwardRef)(((e,t)=>{let{children:n,...a}=e;return l.createElement(l.Fragment,null,l.createElement("div",{className:r.iv` position: fixed; inset: 0; `}),l.createElement(Ie.g7,{className:_e},l.createElement(je.VY,Be({},a,{ref:t}),l.createElement("div",{className:r.iv` position: absolute; inset: 0; pointer-events: all; z-index: -1; `}),n)))})),Qe=$e(je.Eh,Ke);var Ge=n(2859);const et=r.iv` display: inline-flex; align-items: center; justify-content: center; border-radius: 4px; padding: 0 0.5rem; font-size: 0.875rem; line-height: 1; height: 2rem; gap: 0.5rem; background-color: transparent; color: white; border: none; &:hover { background-color: hsl(0 0% 100% / 30%); } &:focus-visible { box-shadow: 0 0 0 2px white; } &[data-placeholder] { color: #ddd; } `,tt=r.iv` overflow: hidden; background-color: hsl(0 0% 0% /0.9); border-radius: 6px; box-shadow: 0px 10px 38px -10px rgba(22, 23, 24, 0.35), 0px 10px 20px -15px rgba(22, 23, 24, 0.2); max-height: var(--radix-select-content-available-height); `,nt=r.iv` padding: 5px; `,at=r.iv` font-size: 0.875rem; line-height: 1; color: white; border-radius: 0.125rem; display: flex; align-items: center; height: 1.5rem; padding: 0 2rem 0 1.5rem; position: relative; user-select: none; &[data-disabled] { color: hsl(0 0% 100% / 80%); pointer-events: none; } &[data-highlighted] { outline: none; background-color: hsl(0 0% 100% / 30%); } `,rt=r.iv` padding: 0 25px; font-size: 12px; line-height: 25px; color: white; `,lt=r.iv` height: 1px; background-color: hsl(0 0% 100% / 50%); margin: 5px; `,it=r.iv` position: absolute; left: 0.5rem; height: 0.75em; display: inline-flex; align-items: center; justify-content: center; `,ot=r.iv` display: flex; align-items: center; justify-content: center; height: 25px; background-color: transparent; color: white; cursor: default; `,st=Ge.fC,ct=($e(Ge.Z0,lt),$e(Ge.l_,nt)),ut=$e(Ge.u_,ot),mt=$e(Ge.$G,ot),dt=(Ge.ZA,$e(Ge.ck,at)),pt=$e(Ge.wU,it),ht=Ge.eT,ft=($e(Ge.__,rt),Ge.h_),gt=$e(Ge.VY,tt),vt=Ge.B4,Et=$e(Ge.xz,et),bt=Ge.xz,yt=Ge.Eh,xt=[.25,.5,.75,1,1.25,1.5,1.75,2],wt=r.iv` display: flex; align-items: center; gap: 1rem; justify-content: space-between; width: 100%; `,kt=()=>{const{playbackRate:e,setPlaybackRate:t}=(0,a.dT)();return l.createElement(st,{value:0===e?"1":e.toString(),onValueChange:e=>t(+e)},l.createElement(Et,{className:wt},l.createElement("span",null,"Speed:"),l.createElement(vt,null)),l.createElement(ft,null,l.createElement(gt,{position:"popper",side:"left"},l.createElement(ut,null,l.createElement("span",null,"▴")),l.createElement(ct,null,xt.map((e=>l.createElement(dt,{key:e,value:e.toString()},l.createElement(ht,null,e,"x"),l.createElement(pt,null,l.createElement(o.J,{type:"check"})))))),l.createElement(mt,null,l.createElement("span",null,"▾")))))},Nt=r.iv` display: flex; align-items: center; gap: 1rem; justify-content: space-between; width: 100%; `,St=()=>{const{selectedBitrate:e,bitrateOptions:t,setSelectedBitrate:n}=(0,a.dT)();return 0===t.length?null:l.createElement(st,{value:"auto"===e?"auto":e.constrainedDimension.toString(),onValueChange:e=>{if("auto"===e)n("auto");else{const a=t.find((t=>t.constrainedDimension.toString()===e));a&&n(a)}}},l.createElement(Et,{className:Nt},l.createElement("span",null,"Quality:"),l.createElement(vt,null)),l.createElement(ft,null,l.createElement(gt,{position:"popper",side:"left"},l.createElement(ut,null,l.createElement("span",null,"▴")),l.createElement(ct,null,[...t].sort(((e,t)=>t.constrainedDimension-e.constrainedDimension)).map((e=>{let{constrainedDimension:t}=e;return l.createElement(dt,{key:t,value:t.toString()},l.createElement(ht,null,t),l.createElement(pt,null,l.createElement(o.J,{type:"check"})))})),l.createElement(dt,{value:"auto"},l.createElement(ht,null,"auto"),l.createElement(pt,null,l.createElement(o.J,{type:"check"})))),l.createElement(mt,null,l.createElement("span",null,"▾")))))},Tt=()=>{const{showControls:e,controlsVisible:t}=N();return(0,l.useEffect)((()=>(e(),()=>{e({hideAfter:3e3})})),[t]),null},Lt=r.iv` display: flex; align-items: center; gap: 1rem; justify-content: space-between; width: 100%; `,Mt=()=>{const{selectedAudioTrack:e,setSelectedAudioTrack:t}=(0,a.dT)(),n=(0,ee.OK)();return null===n||n.audio.length<2?null:l.createElement(st,{value:e?.language,onValueChange:e=>{t({label:e,language:e})}},l.createElement(Et,{className:Lt},l.createElement("span",null,"Audio:"),l.createElement(vt,null)),l.createElement(ft,null,l.createElement(gt,{position:"popper",side:"left"},l.createElement(ut,null,l.createElement("span",null,"▴")),l.createElement(ct,null,n.audio.map((e=>{let{label:t}=e;return l.createElement(dt,{key:t,value:t},l.createElement(ht,null,t),l.createElement(pt,null,l.createElement(o.J,{type:"check"})))}))),l.createElement(mt,null,l.createElement("span",null,"▾")))))},Ct=r.iv` ${i.Q} padding: 0.85em; `,Pt=e=>{let{controlsRef:t}=e;const{isLive:n}=(0,a.dT)();return l.createElement(Ye,null,l.createElement(We,{asChild:!0},l.createElement(m.j,{className:Ct},l.createElement(c.T,null,"Settings"),l.createElement(o.J,{type:"gear"}))),l.createElement(Ze,null,l.createElement(qe,{sideOffset:5,onCloseAutoFocus:e=>{e.preventDefault(),t.current?.focus()}},l.createElement(He,null),!n&&l.createElement(kt,null),l.createElement(St,null),l.createElement(Mt,null),l.createElement(Qe,{className:"PopoverArrow"}),l.createElement(Tt,null))))};function At(){return At=Object.assign?Object.assign.bind():function(e){for(var t=1;t{let{className:t,link:n,children:a,...r}=e;return l.createElement(E,{className:(0,te.A)(Ot,(0,m.N)()),to:n},l.createElement("h1",At({className:(0,te.A)(Dt,t)},r),a))};var jt=n(6693),It=n(3038);var Ft=n(5941);function $t(){return $t=Object.assign?Object.assign.bind():function(e){for(var t=1;t{const e=(0,ee.OK)(),[t,n]=(0,Ft.q2)(),[a,r]=(0,l.useState)(!1);return null===e||e.tt.length<1?null:l.createElement(st,{value:t??"Off",onValueChange:e=>n("Off"===e?null:e),onOpenChange:r},l.createElement(bt,{asChild:!0},l.createElement(m.j,{className:Bt},l.createElement(c.T,null,"Captions:",l.createElement(vt,null)),l.createElement(o.J,{type:t?"captionsEnabled":"captionsDisabled"}))),l.createElement(ft,null,l.createElement(gt,{position:"popper"},l.createElement(yt,null),a&&l.createElement(Tt,null),l.createElement(ut,null,l.createElement("span",null,"▴")),l.createElement(ct,null,e.tt.map((t=>{let{label:n,textLanguage:a}=t;const r=e.textTrackLabels?.find((e=>e.language===a))?.label;return r?{value:a,label:r}:{value:a,label:n}})).map((e=>l.createElement(Ut,$t({},e,{key:e.value})))),l.createElement(Ut,{value:"Off",label:"Off"})),l.createElement(mt,null,l.createElement("span",null,"▾")))))};function Ut(e){let{value:t,label:n}=e;return l.createElement(dt,{value:t},l.createElement(ht,null,n),l.createElement(pt,null,l.createElement(o.J,{type:"check"})))}const Jt=(0,l.lazy)((()=>Promise.all([n.e(46),n.e(556)]).then(n.bind(n,8556)))),Vt=r.iv` padding-left: 1em; padding-right: 1em; padding-bottom: 0.5em; `,_t=r.iv` flex: auto; display: flex; align-items: center; justify-content: space-between; `,Kt=r.iv` flex: auto; height: 100%; display: flex; align-items: center; justify-content: center; color: white; user-select: none; `,Xt=r.iv` flex: auto; `,Yt=r.iv` justify-content: flex-end; `,Wt=r.iv` position: absolute; height: 100%; width: 100%; top: 0; right: 0; bottom: 0; left: 0; display: flex; flex-direction: column; justify-content: flex-end; z-index: 1; user-select: none; &:focus { outline: none; } `,Zt=r.iv` display: flex; align-items: center; gap: 1rem; margin-inline-start: auto; `,Ht=r.iv` transition: opacity 0.25s ease; `,qt=r.iv` opacity: 1; `,Qt=r.iv` opacity: 0; `,Gt=r.iv` * { cursor: none; } `;function en(){const{paused:e,setPaused:t}=(0,a.dT)(),n=(0,L.DY)();return()=>{t(!e),n({type:e?"play":"pause",timestamp:Date.now()})}}function tn(){const e=function(){const[e,t]=(0,l.useState)(!1),{videoRef:n}=(0,a.dT)();return(0,l.useEffect)((()=>{const e=(0,s.Z)(n.current),a=()=>{t(!0)},r=()=>{t(!1)};return e.addEventListener("ended",a),e.addEventListener("play",r),()=>{e.removeEventListener("ended",a),e.removeEventListener("play",r)}}),[n]),e}(),{showControls:t}=N();(0,l.useEffect)((()=>{e&&t({hideAfter:5e3})}),[e])}const nn=e=>{const t=xt.indexOf(e);return xt[Math.min(xt.length-1,t+1)]},an=e=>{const t=xt.indexOf(e);return xt[Math.max(0,t-1)]};const rn=e=>{let{details:t,dvrEnabled:n}=e;const{isLive:r,paused:i,fullscreenActive:o,playbackStarted:s,canPlay:c}=(0,a.dT)(),m=(0,l.useRef)(null),d=(0,l.useRef)(null),{title:p,logo:h,shareLink:f,channelLink:g}=t,{hideControls:E,showControls:b,controlsVisible:y}=N();tn();const w=(0,ee.OK)(),k=en(),{skipAheadRef:C,skipBackRef:P}=function(e){const{muted:t,setMuted:n,toggleFullscreen:r,volume:i,playbackRate:o,setPlaybackRate:s}=(0,a.dT)(),c=(0,ee.OK)();(0,ve.x6)({keyName:">",shiftKey:!0},(()=>{const e=nn(o);s(e),b({type:"fastForward",timestamp:Date.now(),playbackRate:e})}),{target:e}),(0,ve.x6)({keyName:"<",shiftKey:!0},(()=>{const e=an(o);s(e),b({type:"fastBackward",timestamp:Date.now(),playbackRate:e})}),{target:e});const[u,m]=(0,Ft.q2)(),[d,p]=(0,l.useState)(u);(0,ve.x6)({keyName:"C"},(()=>{null!==c&&0!==c.tt.length&&(null===u?m(d??c.tt[0].textLanguage):(p(u),m(null)))}),{target:e}),(0,ve.x6)({keyName:"M"},(()=>{n(!t),b(t?{type:"volumeUp",volume:i,timestamp:Date.now()}:{type:"muted",timestamp:Date.now()})}),{target:e}),(0,ve.x6)({keyName:"Enter",modKey:!0},r,{target:e}),(0,ve.x6)({keyName:"f"},r,{target:e});const h=en();(0,ve.x6)({keyName:"k"},h,{target:e}),(0,ve.x6)({keyName:" "},(e=>{e.target instanceof HTMLButtonElement||h()}),{target:e});const{seek:f,duration:g,currentTime:v,isLive:E}=(0,a.dT)(),b=(0,L.DY)(),y=(0,L.iu)(M),x=()=>{},w=E?x:()=>{f(Math.min(g,v+Oe));const e=y&&"skipForward"===y.type?Oe+y.skipSeconds:Oe;b({type:"skipForward",skipSeconds:e,timestamp:Date.now()})},k=E?x:()=>{f(Math.max(0,v-Oe));const e=y&&"skipBackward"===y.type?Oe+y.skipSeconds:Oe;b({type:"skipBackward",skipSeconds:e,timestamp:Date.now()})},N=(0,l.useRef)(null);(0,jt.dx)("touchstart",k,{target:N,delay:400});const S=(0,l.useRef)(null);return(0,jt.dx)("touchstart",w,{target:S,delay:400}),{skipAhead:w,skipAheadRef:S,skipBack:k,skipBackRef:N}}(m),A=(0,jt.D9)(o);(0,l.useEffect)((()=>{m.current&&A!==o&&m.current.focus()}),[o,A]);const D={[Ht]:!0,[Qt]:!y,[qt]:y},O=p||h||f||g||w?.publicDetails?.title||w?.publicDetails?.logo||w?.publicDetails?.channelLink||w?.publicDetails?.shareLink;return l.createElement(l.Fragment,null,l.createElement("div",{ref:m,className:(0,te.A)(Wt,{[Gt]:!y&&s}),onKeyDown:(0,ve.TU)([{keyName:"ArrowDown"},{keyName:"ArrowUp"},{keyName:"ArrowLeft"},{keyName:"ArrowRight"}],[e=>{let{target:t}=e;return t instanceof HTMLInputElement},e=>{let{target:t}=e;return t instanceof HTMLTextAreaElement},e=>{let{target:t}=e;return t instanceof HTMLSelectElement}]),onMouseMove:()=>{b({hideAfter:1500})},onFocus:()=>{b({hideAfter:3e3})},onMouseOut:e=>{m.current&&e.relatedTarget instanceof Node&&m.current.contains(e.relatedTarget)||E()},tabIndex:-1},O&&l.createElement("div",{className:(0,te.A)(It.cT,D)},(h||w?.publicDetails?.logo)&&l.createElement(x,{link:g||w?.publicDetails?.channelLink,src:h||w?.publicDetails?.logo||""}),(p||w?.publicDetails?.title)&&l.createElement(Rt,{link:g||w?.publicDetails?.channelLink},p||w?.publicDetails?.title),l.createElement("div",{className:Zt},(f||w?.publicDetails?.shareLink)&&l.createElement(Jt,{link:f||w?.publicDetails?.shareLink}))),l.createElement("div",{ref:d,className:(0,te.A)(_t,D),onTouchEnd:e=>{y?E():b({hideAfter:4e3}),e.preventDefault()},onClick:()=>{b({hideAfter:3e3}),i&&E(),k()}},l.createElement("div",{ref:P,className:Kt}),l.createElement("div",{ref:C,className:Kt})),l.createElement(v,{onClick:()=>{m.current&&m.current.focus()}}),l.createElement("div",{className:(0,te.A)(It.ec,D),onMouseMove:e=>{e.stopPropagation(),b({hideAfter:3e3})},onMouseOut:e=>{m.current&&e.relatedTarget instanceof Node&&!m.current.contains(e.relatedTarget)&&E()}},c&&l.createElement("div",{className:(0,te.A)(Vt,It.mb,Yt),style:{"--gap":"1em"}},(!r||n)&&l.createElement(Re,null),r?l.createElement(X,{dvrEnabled:n}):l.createElement(G,null)),l.createElement("div",{className:(0,te.A)(It.FI,It.mb)},l.createElement(W.I,null),l.createElement(T.ff,{controlsRef:m}),l.createElement("div",{className:Xt}),l.createElement(zt,null),l.createElement(Pt,{controlsRef:m}),l.createElement(u,null),l.createElement(Y,null),l.createElement(S,null)))),l.createElement(B,null))},ln=e=>l.createElement(L.UN,null,l.createElement(k,null,l.createElement(rn,e)))}}]);