{"version":3,"file":"js/video-block.1adc438464666ea1b5ce.js","mappings":"mBAgEA,SAASA,EAAuBC,GAC5B,GAAIA,aAAwBC,aAAiBC,OAAOC,QAChD,GAAKH,EAAaI,cAAc,UAM5BF,OAAOG,aAAaC,UAAUN,OANS,CACvCA,GAAcO,UAAUC,OAAO,2BAC/BR,EAAaO,UAAUE,IAAI,2BAC3B,MAAM,QAACC,EAAO,YAAEC,GAAeX,EAAaY,QAC5CV,OAAOG,aAAaQ,aAAaH,EAASC,EAAaG,E,CAKnE,CAEA,SAASC,IACLC,SAASC,iBAAiB,gBAAgBC,SAASC,IAC/C,IAAIC,EAAiBD,EAAMf,cAAc,sBAEzC,MAAMiB,EAAQF,EAAMf,cAAc,OAuB1C,IAAmBkB,KArBDD,EAsBP,IAAIE,SAAQ,CAACC,EAASC,KACzBH,EAAaI,OAAS,KAClBF,EAAQF,EAAa,EAGrBA,EAAaK,UACbH,EAAQF,GAGZA,EAAaM,QAAUH,CAAM,KA/BZI,MAAMC,IAEnBC,YAAW,KACP,GAAIZ,aAAiBlB,YAAa,CAC9B,IAAI+B,EAAYF,EAAYG,aAGxBC,EAAaf,EAAMf,cAAc,uBACjC8B,aAAsBjC,aAAiB+B,IACvCE,EAAWC,MAAMC,OAAS,GAAGJ,MAGzBZ,aAA0BnB,aAAiB+B,IAC3CZ,EAAee,MAAME,QAAU,K,IAI5C,IAAI,GACT,GAEV,CAeA,SAASvB,EAAoBwB,EAAYC,GACrC,IAAIvC,EAAegB,SAASZ,cAAc,IAAImC,MAAgBC,QAAQ,gBAEzD,SAATF,EACAtC,GAAcO,UAAUC,OAAO,2BACf,QAAT8B,IACPtC,GAAcO,UAAUC,OAAO,2BAC/BR,GAAcO,UAAUE,IAAI,2BAEpC,CA5EIO,SAASC,iBAAiB,uBAAuBC,SAAQlB,IACrDA,EAAayC,iBAAiB,SAAS,KACnC1C,EAAuBC,EAAa,IAGxCA,EAAayC,iBAAiB,YAAaC,IACzB,UAAVA,EAAEC,KACF5C,EAAuBC,E,GAE7B,IAyEVE,OAAOuC,iBAAiB,mBAAmB,KAClCvC,OAAOA,OAAO0C,8BAjInB7B,IACAb,OAAOuC,iBAAiB,SAAU1B,GAG7Bb,OAAO2C,WAAWC,SAASC,WAAc7C,OAAOC,UACjDY,IACAC,SAASC,iBAAiB,uBAAuBC,SAAQlB,IACrDA,EAAaO,UAAUE,IAAI,8BAE3BT,EAAayC,iBAAiB,SAAS,KACnCzC,EAAaO,UAAUE,IAAI,0BAA0B,IAGzDT,EAAayC,iBAAiB,YAAaC,IACzB,UAAVA,EAAEC,KACF3C,EAAaO,UAAUE,IAAI,0B,GAEjC,KAIVO,SAASyB,iBAAiB,4BAA4B,SAAUC,GACxDxC,OAAO2C,UAAUC,QAAQC,YAAc7C,OAAOC,UAC9Ca,SAASC,iBAAiB,uBAAuBC,SAAQlB,IACrDA,EAAaO,UAAUC,OAAO,8BAC9BR,EAAaO,UAAUC,OAAO,0BAA0B,IAG5DN,OAAOG,aAAa2C,aAE5B,IAGA9C,OAAOuC,iBAAiB,qBAAqB,SAAUC,GACnD1B,SAASiC,cAAc,IAAIC,YAAY,mCAC3C,IAGAlC,SAASiC,cAAc,IAAIC,YAAY,oCAEvChD,OAAO0C,6BAA8B,E","sources":["webpack:///./Features/Components/VideoBlock/_js/video-block.ts"],"sourcesContent":["interface Window {\r\n    VideoBlockScriptInitialized: Boolean\r\n}\r\n\r\nfunction createVideoBlock() {\r\n    setVideoHeight();\r\n    window.addEventListener(\"resize\", setVideoHeight);\r\n\r\n    // If marketing cookies are blocked by CookieBot\r\n    if (!window.Cookiebot?.consent?.marketing || !window.screen9) {\r\n        setVideoHeight();\r\n        document.querySelectorAll(\".video-block--video\").forEach(blockElement => {\r\n            blockElement.classList.add(\"video-block--prevent-video\");\r\n\r\n            blockElement.addEventListener(\"click\", () => {\r\n                blockElement.classList.add(\"video-block--show-video\")\r\n            });\r\n\r\n            blockElement.addEventListener(\"keypress\", (e: any) => {\r\n                if (e.key === 'Enter') {\r\n                    blockElement.classList.add(\"video-block--show-video\")\r\n                }\r\n            });\r\n        });\r\n    }\r\n\r\n    document.addEventListener('QuickChannelScriptLoaded', function (e) {\r\n        if (window.Cookiebot.consent.marketing && !window.screen9) {\r\n            document.querySelectorAll(\".video-block--video\").forEach(blockElement => {\r\n                blockElement.classList.remove(\"video-block--prevent-video\");\r\n                blockElement.classList.remove(\"video-block--show-video\");\r\n            });\r\n\r\n            window.QuickChannel.initialize();\r\n        }\r\n    });\r\n\r\n    // When CookieBot consents are changed\r\n    window.addEventListener('CookiebotOnAccept', function (e) {\r\n        document.dispatchEvent(new CustomEvent(\"QuickChannelRelatedScriptLoaded\"));\r\n    });\r\n\r\n    // Tell other modules that this script is loaded\r\n    document.dispatchEvent(new CustomEvent(\"QuickChannelRelatedScriptLoaded\"));\r\n\r\n    window.VideoBlockScriptInitialized = true;\r\n}\r\n\r\n\r\n// Add a video-player for every media block\r\nfunction initializeMediaBlocks() {\r\n    document.querySelectorAll(\".video-block--video\").forEach(blockElement => {\r\n        blockElement.addEventListener(\"click\", () => {\r\n            initializeVideoAndPlay(blockElement);\r\n        });\r\n\r\n        blockElement.addEventListener(\"keypress\", (e: any) => {\r\n            if (e.key === 'Enter') {\r\n                initializeVideoAndPlay(blockElement);\r\n            }\r\n        });\r\n    });\r\n}\r\n\r\nfunction initializeVideoAndPlay(blockElement: Element) {\r\n    if (blockElement instanceof HTMLElement && !!window.screen9) {\r\n        if (!blockElement.querySelector(\"iframe\")) {\r\n            blockElement?.classList.remove(\"video-block--show-video\");\r\n            blockElement.classList.add(\"video-block--load-video\");\r\n            const {mediaid, containerid} = blockElement.dataset;\r\n            window.QuickChannel.createPlayer(mediaid, containerid, onPlayerStateChange);\r\n        } else {\r\n            window.QuickChannel.playVideo(blockElement);\r\n        }\r\n    }\r\n}\r\n\r\nfunction setVideoHeight() {\r\n    document.querySelectorAll(\".video-block\").forEach((block : HTMLElement | any) => {\r\n        let blockMediaIcon = block.querySelector(\".video-block__icon\");\r\n\r\n        const image = block.querySelector(\"img\") as HTMLImageElement;\r\n\r\n        loadImage(image).then((loadedImage) => {\r\n            // Use timeout to let the layout transition finish first\r\n            setTimeout(() => {\r\n                if (block instanceof HTMLElement) {\r\n                    let imgHeight = loadedImage.offsetHeight;\r\n\r\n                    // Set video height, this will position the icon in the middle\r\n                    let blockVideo = block.querySelector(\".video-block__video\");\r\n                    if (blockVideo instanceof HTMLElement && !!imgHeight) {\r\n                        blockVideo.style.height = `${imgHeight}px`;\r\n\r\n                        // Show icon after video height is set\r\n                        if (blockMediaIcon instanceof HTMLElement && !!imgHeight) {\r\n                            blockMediaIcon.style.opacity = \"1\";\r\n                        }\r\n                    }\r\n                }\r\n            }, 100);\r\n        })\r\n    });\r\n}\r\nfunction loadImage(imageElement : HTMLImageElement) : Promise<HTMLImageElement> {\r\n    return new Promise((resolve, reject) => {\r\n        imageElement.onload = () => {\r\n            resolve(imageElement);\r\n        };\r\n\r\n        if (imageElement.complete){\r\n            resolve(imageElement);\r\n        }\r\n\r\n        imageElement.onerror = reject\r\n    });\r\n}\r\n\r\nfunction onPlayerStateChange(event: any, containerId: string | undefined) {\r\n    let blockElement = document.querySelector(`#${containerId}`)?.closest(\".video-block\");\r\n\r\n    if (event == \"pause\") {\r\n        blockElement?.classList.remove(\"video-block--show-video\");\r\n    } else if (event == \"play\") {\r\n        blockElement?.classList.remove(\"video-block--load-video\");\r\n        blockElement?.classList.add(\"video-block--show-video\");\r\n    }\r\n}\r\n\r\n\r\ninitializeMediaBlocks();\r\n\r\n\r\nwindow.addEventListener('CookiebotOnLoad', () => {\r\n    if (!window.window.VideoBlockScriptInitialized) {\r\n        createVideoBlock();\r\n    }\r\n});"],"names":["initializeVideoAndPlay","blockElement","HTMLElement","window","screen9","querySelector","QuickChannel","playVideo","classList","remove","add","mediaid","containerid","dataset","createPlayer","onPlayerStateChange","setVideoHeight","document","querySelectorAll","forEach","block","blockMediaIcon","image","imageElement","Promise","resolve","reject","onload","complete","onerror","then","loadedImage","setTimeout","imgHeight","offsetHeight","blockVideo","style","height","opacity","event","containerId","closest","addEventListener","e","key","VideoBlockScriptInitialized","Cookiebot","consent","marketing","initialize","dispatchEvent","CustomEvent"],"sourceRoot":""}