https://www.qafilah.com/dist/client/assets/AramcoStadium_Header-Bd7elrV7.js

1import{r,j as e}from"./vendor-f5S74Hzf.js";import{o as u,q as B,r as C,c0 as n,M as a,bZ as m,c8 as D}from"./common-CHQtHwBh.js";import{n as A,B as o}from"./@chakra-ui/react-gJ6NaqAj.js";import"./html-react-parser-xE6q2Esb.js";import"./style-to-js-B6NqiOWy.js";import"./react-markdown-Bs7M-Au_.js";import"./devlop-Cl3hj7Sz.js";import"./micromark-util-decode-numeric-character-reference-CNs1qBpV.js";import"./micromark-util-decode-string-strjl-tx.js";import"./decode-named-character-reference-C3-224fz.js";import"./micromark-util-normalize-identifier-C9ANKk3v.js";import"./micromark-util-subtokenize-BC4BSQ9J.js";import"./micromark-util-chunked-DrRIdSP-.js";import"./micromark-util-combine-extensions-Bka6Sc1c.js";import"./micromark-factory-space-DRnmu9Gw.js";import"./micromark-util-character-hRuAkC1j.js";import"./micromark-core-commonmark-DkU5eqHe.js";import"./micromark-util-classify-character-DzqK33dx.js";import"./micromark-util-resolve-all-PQCKh0dx.js";import"./micromark-factory-destination-Cii3Ukc3.js";import"./micromark-factory-label-pk4cmpdi.js";import"./micromark-factory-title-cwTJpkI9.js";import"./micromark-factory-whitespace-DbSIwM2c.js";import"./mdast-util-to-string-C_aolqmU.js";import"./micromark-util-sanitize-uri-CaPxsR5P.js";import"./unist-util-visit-8_a2MF5S.js";import"./unist-util-visit-parents-B1S0AetN.js";import"./unist-util-is-BPZGFiMU.js";import"./remark-gfm-DBMNSnBZ.js";import"./swiper-BojwEeCi.js";import"./polished-VDK7He2T.js";import"./@babel/runtime-Bt6Ne3b9.js";import"./tailwind-merge-CPcsbTWB.js";import"./react-calendar-DqgCvrlm.js";import"./hoist-non-react-statics-BjaAnAum.js";import"./use-sidecar-BuciW2qi.js";import"./tslib-De9GV7Vy.js";import"./use-callback-ref-DBc0-MCP.js";import"./react-remove-scroll-BxC6qjtr.js";import"./react-remove-scroll-bar-DSTyrTd8.js";import"./react-style-singleton-76azCXWd.js";import"./aria-hidden-DQ5UC2Eg.js";const O=t=>{var x,g,y,b,j,v,w,E,T,H;const[I]=A(`(min-width: ${u.md})`),[c]=B(),[M,l]=r.useState(!1),[s,p]=r.useState(!0),[d,P]=r.useState(!0),{sitecoreContext:L}=C(),[f]=r.useState(!0),i=r.useRef(null),h=r.useMemo(()=>({logo:{duration:.5,delay:0,ease:"easeOut"},controls:{duration:.5,delay:1,ease:n},background:{duration:.5,delay:4.5,ease:n},video:{duration:.8,delay:0,ease:n}}),[I]),S=()=>{i.current&&i.current.play()};r.useEffect(()=>{const V=()=>{(globalThis==null?void 0:globalThis.scrollY)>(globalThis==null?void 0:globalThis.innerHeight)&&s&&p(!1),(globalThis==null?void 0:globalThis.scrollY)<(globalThis==null?void 0:globalThis.innerHeight)+100&&!s&&p(!0)};return globalThis==null||globalThis.addEventListener("scroll",V),()=>{globalThis==null||globalThis.removeEventListener("scroll",V)}},[s]),r.useEffect(()=>{i.current&&i.current.readyState>=HTMLMediaElement.HAVE_ENOUGH_DATA&&l(!0)},[]);const k=()=>{i.current&&P(i.current.paused)},z=()=>{l(!0)};return r.useEffect(()=>{l(!0)},[]),r.useEffect(()=>{i.current&&(d?i.current.play():i.current.pause())},[d]),r.useEffect(()=>{i.current&&(i.current.muted=f)},[f]),typeof globalThis>"u"?null:e.jsxs(a,{position:"relative",visibility:s?"visible":"hidden",overflow:"hidden",color:"primary.white",height:"100svh",children:[e.jsx(a,{initial:{opacity:0}

1,animate:{opacity:1},transition:h.logo,py:"2.5rem",width:"100%",position:"fixed",display:"flex",justifyContent:"center",children:e.jsx(o,{as:"img",src:(g=(x=L.custom.projectData.settings)==null?void 0:x.logoHeader.value)==null?void 0:g.src,alt:"Logo",filter:"brightness(0) invert(1)"})}),e.jsxs(o,{position:"fixed",top:"0",left:"0",right:"0",bottom:"0",display:"flex",flexDir:"column",justifyContent:"end",maxW:"120rem",mx:"auto",px:["1.25rem",null,"2.5rem"],py:["7.625rem",null,"5rem"],children:[e.jsx(m,{size:["h2",null,"h1"],field:t.headingOne}),e.jsx(m,{size:["h2",null,"h1"],field:t.headingTwo}),e.jsx(m,{size:["h2",null,"h1"],field:t.headingThree})]}),e.jsx(a,{mx:"auto",width:"100%",height:"100%",position:"fixed",bottom:"0",right:"0",left:"0",top:"0",display:"flex",justifyContent:"end",alignItems:"end",pe:"2rem",pb:["7rem",null,"5rem"],initial:{opacity:0},animate:M?{opacity:1}:{},transition:{delay:0,duration:.5,ease:n},children:e.jsx(D,{variant:"ghostWhite",onClick:k,w:"5rem",children:c(d?"video.pause":"video.play")})}),e.jsx(o,{bg:"primary.institutionalStadiumDarkBlue",position:"fixed",top:0,bottom:0,left:0,right:0,zIndex:-1,display:"flex",flexDir:"column",justifyContent:"start",alignItems:"center",transition:"opacity 0.3s",children:e.jsx(o,{position:"relative",w:"100%",h:"100%",overflow:"hidden",display:"flex",justifyContent:"center",alignItems:"start",margin:"0 auto",children:e.jsxs(o,{position:"absolute",left:0,bottom:0,top:0,right:0,width:"100%",height:["100%",null,"auto"],children:[e.jsx(a,{position:"absolute",width:"100%",height:"100%",top:"0",left:"0",bg:"primary.institutionalStadiumDarkBlue",zIndex:1,initial:{opacity:1},animate:{opacity:0},onAnimationComplete:S,transition:h.video}),e.jsxs(o,{ref:i,as:"video",autoPlay:!1,loop:!0,muted:!0,playsInline:!0,objectFit:"cover",width:"100%",height:"100%",zIndex:-1,onLoadedData:z,children:[e.jsx("source",{src:(b=(y=t.webmVideoPortrait)==null?void 0:y.value)==null?void 0:b.src,media:`(max-width: ${u.md})`,type:"video/webm"}),e.jsx("source",{src:(v=(j=t.webmVideoLandscape)==null?void 0:j.value)==null?void 0:v.src,type:"video/webm"}),e.jsx("source",{src:(E=(w=t.mp4VideoPortrait)==null?void 0:w.value)==null?void 0:E.src,media:`(max-width: ${u.md})`,type:"video/mp4"}),e.jsx("source",{src:(H=(T=t.mp4VideoLandscape)==null?void 0:T.value)==null?void 0:H.src,type:"video/mp4"}),e.jsx("p",{children:"Your browser does not support AV1 or MP4 playback."})]}),e.jsx(o,{position:"absolute",top:"0",left:"0",right:"0",bottom:"0",width:"100%",height:"100%",bg:"linear-gradient(0deg, rgba(0, 0, 0, 0.10) 0%, rgba(0, 0, 0, 0.10) 100%)",zIndex:2,pointerEvents:"none"})]})})})]})},Ie=()=>{const{sitecoreContext:{route:t}}=C();return t!=null&&t.fields?e.jsx("section",{"data-rendering":"Header",children:e.jsx(O,{...t.fields})}):null};export{Ie as default};