{
  "version": 3,
  "sources": ["../../../Vettvangur.Frontend/src/scripts/components/heroVideo.ts"],
  "sourcesContent": ["interface INameExtention extends Window {\r\n\tmodalPlayer: any;\r\n\theroPlayer: any;\r\n}\r\n\r\ndeclare let window: INameExtention;\r\nimport Player from \"@vimeo/player\";\r\n\r\nlet timerId;\r\n\r\nconst HeroVideo = {\r\n\tel: {\r\n\t\theroVideo: document.querySelector<HTMLElement>(\".hero__video-container\"),\r\n\t\tmodal: document.querySelector<HTMLElement>(\".hero-video-modal\"),\r\n\t},\r\n\r\n\tinit() {\r\n\t\tif (this.el.heroVideo && this.el.modal) {\r\n\t\t\tconst heroVideo = this.el.heroVideo;\r\n\t\t\tconst videoOverlay = heroVideo.querySelector<HTMLElement>(\r\n\t\t\t\t\".hero__video-overlay\",\r\n\t\t\t);\r\n\t\t\tconst video = heroVideo.querySelector<HTMLVideoElement>(\".hero__video\");\r\n\r\n\t\t\t// elements for video modal\r\n\t\t\tconst modal = this.el.modal;\r\n\t\t\tconst modalVideo = modal.querySelector<HTMLIFrameElement>(\r\n\t\t\t\t\".hero-video-modal__video\",\r\n\t\t\t);\r\n\t\t\tconst modalClose = modal.querySelector<HTMLElement>(\r\n\t\t\t\t\".hero-video-modal__close\",\r\n\t\t\t);\r\n\r\n\t\t\t//set video modal src to video src\r\n\t\t\tmodalVideo.setAttribute(\"src\", video.dataset.url);\r\n\r\n\t\t\tconst heroPlayer = new Player(\r\n\t\t\t\tdocument.querySelector<HTMLElement>(\"#hero-player\"),\r\n\t\t\t);\r\n\t\t\tconst modalPlayer = new Player(\r\n\t\t\t\tdocument.querySelector<HTMLElement>(\"#modal-player\"),\r\n\t\t\t);\r\n\r\n\t\t\t// Expose player so it can be used from the console\r\n\t\t\twindow.heroPlayer = heroPlayer;\r\n\t\t\twindow.modalPlayer = modalPlayer;\r\n\r\n\t\t\twindow.heroPlayer.getColors().then(function (colors) {\r\n\t\t\t\tmodalClose.style.backgroundColor = `#${colors[0]}`;\r\n\t\t\t\tmodalClose.style.color = `#${colors[1]}`;\r\n\t\t\t});\r\n\r\n\t\t\tif (videoOverlay != null && modal != null) {\r\n\t\t\t\t// listening to clicks on document to toggle modal and buttons\r\n\t\t\t\tdocument.addEventListener(\"click\", (event) => {\r\n\t\t\t\t\tconst toggleModal =\r\n\t\t\t\t\t\tevent.composedPath().includes(modalClose) ||\r\n\t\t\t\t\t\tevent.composedPath().includes(videoOverlay);\r\n\r\n\t\t\t\t\t// toggle modal\r\n\t\t\t\t\tif (toggleModal) {\r\n\t\t\t\t\t\tthis.toggleVideoModal(modal);\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\r\n\t\t\t\tdocument.addEventListener(\"keyup\", (event) => {\r\n\t\t\t\t\tif (event.key === \"Enter\" || event.key === \" \") {\r\n\t\t\t\t\t\tconst toggleModal =\r\n\t\t\t\t\t\t\tevent.composedPath().includes(modalClose) ||\r\n\t\t\t\t\t\t\tevent.composedPath().includes(videoOverlay);\r\n\r\n\t\t\t\t\t\tif (toggleModal) {\r\n\t\t\t\t\t\t\tevent.preventDefault();\r\n\t\t\t\t\t\t\tthis.toggleVideoModal(modal);\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\r\n\t\t\t\t// start and stop trailer on mouseover and mouseout\r\n\t\t\t\tdocument.addEventListener(\"mouseover\", (event) => {\r\n\t\t\t\t\tconst playVideoTrailer = event.composedPath().includes(videoOverlay);\r\n\r\n\t\t\t\t\tif (playVideoTrailer) {\r\n\t\t\t\t\t\tthis.playVideoTrailer();\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\r\n\t\t\t\tdocument.addEventListener(\"mouseout\", (event) => {\r\n\t\t\t\t\tconst stopVideoTrailer = event.composedPath().includes(videoOverlay);\r\n\r\n\t\t\t\t\tif (stopVideoTrailer) {\r\n\t\t\t\t\t\tthis.stopVideoTrailer();\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\r\n\t\t\t\t// to enable keyboard controls\r\n\t\t\t\twindow.modalPlayer.on(\"play\", () => {\r\n\t\t\t\t\twindow.focus();\r\n\t\t\t\t});\r\n\r\n\t\t\t\t// when video ends unload it so it starts again\r\n\t\t\t\twindow.modalPlayer.on(\"ended\", () => {\r\n\t\t\t\t\twindow.modalPlayer.unload();\r\n\t\t\t\t});\r\n\t\t\t}\r\n\t\t}\r\n\t},\r\n\r\n\tplayVideoTrailer() {\r\n\t\tclearTimeout(timerId);\r\n\t\twindow.heroPlayer.play();\r\n\r\n\t\ttimerId = setTimeout(() => {\r\n\t\t\twindow.heroPlayer.pause();\r\n\t\t}, 5000);\r\n\t},\r\n\r\n\tplayVideo() {\r\n\t\tif (window.heroPlayer) {\r\n\t\t\twindow.heroPlayer.play().catch((error: any) => {\r\n\t\t\t\tconsole.error(\"Error playing video:\", error);\r\n\t\t\t});\r\n\t\t}\r\n\t},\r\n\r\n\tstopVideoTrailer() {\r\n\t\tclearTimeout(timerId);\r\n\t\twindow.heroPlayer.unload();\r\n\t},\r\n\r\n\ttoggleVideoModal(videoModal) {\r\n\t\tconst isOpen = videoModal.classList.contains(\"open\");\r\n\t\tconst iframe = videoModal.querySelector(\"iframe\") as HTMLIFrameElement;\r\n\r\n\t\tif (isOpen) {\r\n\t\t\tdocument.body.classList.remove(\"h-disable-scroll\");\r\n\t\t\tvideoModal.classList.remove(\"open\");\r\n\t\t\twindow.modalPlayer.unload();\r\n\t\t\tif (iframe) {\r\n\t\t\t\tiframe.blur();\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\tdocument.body.classList.add(\"h-disable-scroll\");\r\n\t\t\tvideoModal.classList.add(\"open\");\r\n\t\t\tif (iframe) {\r\n\t\t\t\tiframe.focus();\r\n\t\t\t}\r\n\t\t}\r\n\t},\r\n};\r\n\r\nexport default HeroVideo;\r\n"],
  "mappings": "4EAQA,IAAIA,EAEEC,EAAY,CACjB,GAAI,CACH,UAAW,SAAS,cAA2B,wBAAwB,EACvE,MAAO,SAAS,cAA2B,mBAAmB,CAC/D,EAEA,MAAO,CACN,GAAI,KAAK,GAAG,WAAa,KAAK,GAAG,MAAO,CACvC,IAAMC,EAAY,KAAK,GAAG,UACpBC,EAAeD,EAAU,cAC9B,sBACD,EACME,EAAQF,EAAU,cAAgC,cAAc,EAGhEG,EAAQ,KAAK,GAAG,MAChBC,EAAaD,EAAM,cACxB,0BACD,EACME,EAAaF,EAAM,cACxB,0BACD,EAGAC,EAAW,aAAa,MAAOF,EAAM,QAAQ,GAAG,EAEhD,IAAMI,EAAa,IAAIC,EACtB,SAAS,cAA2B,cAAc,CACnD,EACMC,EAAc,IAAID,EACvB,SAAS,cAA2B,eAAe,CACpD,EAGA,OAAO,WAAaD,EACpB,OAAO,YAAcE,EAErB,OAAO,WAAW,UAAU,EAAE,KAAK,SAAUC,EAAQ,CACpDJ,EAAW,MAAM,gBAAkB,IAAII,EAAO,CAAC,CAAC,GAChDJ,EAAW,MAAM,MAAQ,IAAII,EAAO,CAAC,CAAC,EACvC,CAAC,EAEGR,GAAgB,MAAQE,GAAS,OAEpC,SAAS,iBAAiB,QAAUO,GAAU,EAE5CA,EAAM,aAAa,EAAE,SAASL,CAAU,GACxCK,EAAM,aAAa,EAAE,SAAST,CAAY,IAI1C,KAAK,iBAAiBE,CAAK,CAE7B,CAAC,EAED,SAAS,iBAAiB,QAAUO,GAAU,EACzCA,EAAM,MAAQ,SAAWA,EAAM,MAAQ,OAEzCA,EAAM,aAAa,EAAE,SAASL,CAAU,GACxCK,EAAM,aAAa,EAAE,SAAST,CAAY,KAG1CS,EAAM,eAAe,EACrB,KAAK,iBAAiBP,CAAK,EAG9B,CAAC,EAGD,SAAS,iBAAiB,YAAcO,GAAU,CACxBA,EAAM,aAAa,EAAE,SAAST,CAAY,GAGlE,KAAK,iBAAiB,CAExB,CAAC,EAED,SAAS,iBAAiB,WAAaS,GAAU,CACvBA,EAAM,aAAa,EAAE,SAAST,CAAY,GAGlE,KAAK,iBAAiB,CAExB,CAAC,EAGD,OAAO,YAAY,GAAG,OAAQ,IAAM,CACnC,OAAO,MAAM,CACd,CAAC,EAGD,OAAO,YAAY,GAAG,QAAS,IAAM,CACpC,OAAO,YAAY,OAAO,CAC3B,CAAC,EAEH,CACD,EAEA,kBAAmB,CAClB,aAAaH,CAAO,EACpB,OAAO,WAAW,KAAK,EAEvBA,EAAU,WAAW,IAAM,CAC1B,OAAO,WAAW,MAAM,CACzB,EAAG,GAAI,CACR,EAEA,WAAY,CACP,OAAO,YACV,OAAO,WAAW,KAAK,EAAE,MAAOa,GAAe,CAC9C,QAAQ,MAAM,uBAAwBA,CAAK,CAC5C,CAAC,CAEH,EAEA,kBAAmB,CAClB,aAAab,CAAO,EACpB,OAAO,WAAW,OAAO,CAC1B,EAEA,iBAAiBc,EAAY,CAC5B,IAAMC,EAASD,EAAW,UAAU,SAAS,MAAM,EAC7CE,EAASF,EAAW,cAAc,QAAQ,EAE5CC,GACH,SAAS,KAAK,UAAU,OAAO,kBAAkB,EACjDD,EAAW,UAAU,OAAO,MAAM,EAClC,OAAO,YAAY,OAAO,EACtBE,GACHA,EAAO,KAAK,IAGb,SAAS,KAAK,UAAU,IAAI,kBAAkB,EAC9CF,EAAW,UAAU,IAAI,MAAM,EAC3BE,GACHA,EAAO,MAAM,EAGhB,CACD,EAEOC,EAAQhB",
  "names": ["timerId", "HeroVideo", "heroVideo", "videoOverlay", "video", "modal", "modalVideo", "modalClose", "heroPlayer", "player_es_default", "modalPlayer", "colors", "event", "error", "videoModal", "isOpen", "iframe", "heroVideo_default"]
}