https://www.parcum.be/frontend/videoBackground.component-DCVsVhul.js

1import{_ as l}from"./site-B0IjnxmE.js";class m{constructor(){this.cssClasses={videoBGWrapper:"video-bg__wrapper relative isolate overflow-hidden",videoBGIframe:"video-bg__iframe absolute top-0 left-0 w-full h-full -z-1 pointer-events-none"};const t=document.querySelectorAll("[data-video-bg]");Array.from(t).forEach(s=>{this.initVideo(s)})}async initVideo(t){const s=window.matchMedia("(prefers-reduced-motion: reduce)").matches,a=document.getElementById(t.getAttribute("data-video-bg")),e=document.getElementById(t.getAttribute("data-video-controls"));if(Object.keys(t.dataset).forEach(r=>{this.cssClasses[r]&&(this.cssClasses[r]=t.dataset[r])}),!a||!t||!e){console.warn("Not all video elements are present");return}if(!(t.hasAttribute("data-vimeo-id")&&t.hasAttribute("aria-hidden"))){if(t.setAttribute("aria-hidden","true"),a.classList.add(...this.cssClasses.videoBGWrapper.split(" ")),t.hasAttribute("data-youtube-id")){const r=t.getAttribute("data-youtube-id");if(!document.getElementById("youtubeAPI")){const i=document.createElement("script");i.id="youtubeAPI",i.src="https://www.youtube.com/iframe_api";const o=document.getElementsByTagName("script")[0];o.parentNode.insertBefore(i,o)}window.onYouTubeIframeAPIReady=()=>{const i=new window.YT.Player(t,{videoId:r,playerVars:{autoplay:1,rel:0,showinfo:0,modestbranding:1,playsinline:1,controls:0,color:"white",loop:1,mute:1,playlist:r},events:{onReady:()=>{s?(i.pauseVideo(),e.setAttribute("data-paused","true"),e.removeAttribute("data-playing")):(i.playVideo(),e.setAttribute("data-playing","true"),e.removeAttribute("data-paused")),i.mute(),e.addEventListener("click",()=>{e.hasAttribute("data-playing")?(i.pauseVideo(),e.setAttribute("data-paused","true"),e.removeAttribute("data-playing")):(i.playVideo(),e.setAttribute("data-playing","true"),e.removeAttribute("data-paused"))})},onError:o=>{console.warn("YouTube API error",o)}}})};const n=a.querySelector("iframe");n&&n.classList.add(...this.cssClasses.videoBGIframe.split(" ")),this.initVideoRatio(t)}if(t.hasAttribute("data-vimeo-id")){t.getAttribute("data-vimeo-id");const d=(await l(()=>import("./player.es-CV0OFP1b.js"),[])).default,n={background:!0,autoplay:!0,loop:!0,muted:!0},i=new d(t,n);i.on("loaded",()=>{const o=a.querySelector("iframe");o&&o.classList.add(...this.cssClasses.videoBGIframe.split(" ")),this.initVideoRatio(t)}),!e.hasAttribute("data-playing")&&!e.hasAttribute("data-paused")&&e.addEventListener("click",()=>{e.hasAttribute("data-playing")?(i.pause(),e.setAttribute("data-paused","true"),e.removeAttribute("data-playing")):(i.play(),e.setAttribute("data-playing","true"),e.removeAttribute("data-paused"))}),s?(i.pause(),e.setAttribute("data-paused","true"),e.removeAttribute("data-playing")):(i.play(),e.setAttribute("data-playing","true"),e.removeAttribute("data-paused"))}}}initVideoRatio(t){this.onResize(t),window.addEventListener("resize",()=>{this.onResize(t)})}onResize(t){const s=document.getElementById(t.getAttribute("data-video-bg"));let a=t;t.tagName.toLowerCase()!=="iframe"&&(a=t.querySelector("iframe")),!(!s||!a)&&(a.style.height="",a.style.width="100%",a.style.transform="",a.clientWidth/16<a.clientHeight/9?(a.style.height="100%",a.style.width=`${Math.ceil(a.clientHeight/9*16)}px`,a.style.transform=`translateX(${(s.clientWidth-a.clientWidth)/2}px)`):(a.style.width="100%",a.style.height=`${Math.ceil(a.clientWidth/16*9)}px`,a.style.transform=`translateY(${(s.clientHeight-a.clientHeight)/2}px)`))}}export{m as default};