{"version":3,"file":"789.297f4c3137e8c7fc6764.js","mappings":"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","sources":["webpack://core-webapp/./src/modules/gif/utils.ts","webpack://core-webapp/./src/modules/gif/gif.ts","webpack://core-webapp/./src/modules/gif/index.ts","webpack://core-webapp/./src/stores/app/index.ts","webpack://core-webapp/./src/stores/app/app_store.ts","webpack://core-webapp/./src/utils/timing.ts"],"sourcesContent":["import { Video } from '@/modules/gif/types';\n\nexport const WIDTHS = [320, 640, 960, 1280, 1600];\n\nconst getGifItemWidth = (width: number): keyof Video => {\n for (let i = 0; i < WIDTHS.length; i++) {\n if (width <= WIDTHS[i]) {\n return `${WIDTHS[i]}` as keyof Video;\n }\n }\n return `${WIDTHS[WIDTHS.length - 1]}` as keyof Video; // 1600\n};\n\nexport { getGifItemWidth };\n","import { getGifItemWidth } from '@/modules/gif/utils';\nimport { debounce } from '@/utils/timing';\nimport { GifPageData, ImageResolutions, VideoResolutions, GifGaClickEvents } from '@/modules/gif/types';\nimport { Layout } from '@/stores/layout_switcher/types';\n\nexport class GifPage {\n private store: GifPageData;\n private readonly debouncedPlay: () => void;\n private readonly debouncedResize: () => void;\n private intersectingIds: Set;\n private loadedThumbnailIds: Set;\n private videos: NodeListOf;\n $el: HTMLElement;\n\n constructor(store: GifPageData) {\n this.store = store;\n this.intersectingIds = new Set();\n this.loadedThumbnailIds = new Set();\n this.debouncedPlay = debounce(() => this.handlePlay(), 250);\n this.debouncedResize = debounce(() => this.handleResizeEvent(), 500);\n this.addEventListeners();\n this.videos = document.querySelectorAll('.js-gif-video');\n }\n\n init() {\n this.debouncedPlay();\n }\n\n handleIntersect(id: string, isIntersecting: boolean): void {\n if (isIntersecting) {\n this.intersectingIds.add(id);\n } else {\n this.intersectingIds.delete(id);\n }\n }\n\n handleMainGifBehavior(id: string): void {\n const mainVideo = document.getElementById(id).querySelector('video') as HTMLVideoElement;\n const mainVideoImg = document.getElementById(id).querySelector('img') as HTMLImageElement;\n const width = getGifItemWidth(mainVideo.offsetWidth);\n\n const gifData = this.store.gifs[id.split('-')[0] as VideoResolutions];\n\n if (mainVideoImg && gifData?.jpg[width]) {\n mainVideoImg.src = gifData.jpg[width];\n }\n\n if (mainVideo && gifData?.mp4[width]) {\n (mainVideo.firstElementChild as HTMLSourceElement).src = gifData.mp4[width];\n mainVideo.load();\n mainVideo.play();\n }\n }\n\n preloadImage(id: string) {\n if (this.loadedThumbnailIds.has(id)) {\n return;\n }\n\n const imgElement = document.querySelector(`.js-gif-img-${id}`) as HTMLImageElement;\n const width = getGifItemWidth(imgElement.offsetWidth);\n imgElement.src = this.store.gifs[id.split('-')[0] as ImageResolutions].jpg[width];\n\n this.loadedThumbnailIds.add(id);\n }\n\n handleResizeEvent(): void {\n this.handleResize();\n this.handlePlay();\n }\n\n addEventListeners() {\n window.addEventListener('mediaListLayoutChanged', this.debouncedResize);\n window.addEventListener('resize', this.debouncedResize);\n window.addEventListener('scroll', this.debouncedPlay);\n }\n\n removeEventListeners() {\n window.removeEventListener('mediaListLayoutChanged', this.debouncedResize);\n window.removeEventListener('resize', this.debouncedResize);\n window.removeEventListener('scroll', this.debouncedPlay);\n }\n\n handleGifSource(videoElement: HTMLVideoElement): boolean {\n const width = getGifItemWidth(videoElement.offsetWidth);\n\n if (videoElement.getAttribute('data-width') === width) {\n return false;\n }\n\n videoElement.setAttribute('data-width', width);\n\n const mp4Video = videoElement.querySelector('.js-mp4-video') as HTMLVideoElement;\n const webmVideo = videoElement.querySelector('.js-webm-video') as HTMLVideoElement;\n const gifData = this.store.gifs[videoElement.id.split('-')[0] as VideoResolutions];\n\n if (mp4Video && gifData?.mp4[width]) {\n mp4Video.src = gifData.mp4[width];\n }\n\n if (webmVideo && gifData?.webm[width]) {\n webmVideo.src = gifData.webm[width];\n }\n\n return true;\n }\n\n videoWasLoadedPreviously(video: HTMLVideoElement): boolean {\n const sourceElement = video.firstElementChild as HTMLSourceElement;\n return sourceElement.src !== '';\n }\n\n handleResize(): void {\n this.videos.forEach((video: HTMLVideoElement) => {\n /*\n We need to check if the video was loaded previously\n because we do not want to load other videos that was not in the viewport yet\n */\n if (this.videoWasLoadedPreviously(video)) {\n /*\n Update the video source when the window is resized\n This ensures the video displays correctly based on its updated size\n */\n const hasToLoad = this.handleGifSource(video);\n if (hasToLoad) {\n video.load();\n }\n }\n });\n }\n\n handlePlay(): void {\n this.videos.forEach((video: HTMLVideoElement) => {\n if (this.intersectingIds.has(video.id as string)) {\n if (!this.videoWasLoadedPreviously(video)) {\n // If the video is in view and hasn't been loaded yet, set the correct src and load it\n const hasToLoad = this.handleGifSource(video);\n if (hasToLoad) {\n video.load();\n }\n }\n video.play();\n } else {\n video.pause();\n }\n });\n }\n\n pushToDataLayer(eventName: string): void {\n window.dataLayer.push({\n event: 'GA4 - Generic Event',\n event_name: eventName,\n });\n }\n\n sendGaClickEvent(event: Event, eventName: GifGaClickEvents): void {\n const destinationUrl = (event.currentTarget as HTMLAnchorElement)?.href;\n\n if (destinationUrl) {\n if (eventName === 'gif_join_now_click') {\n event.preventDefault();\n window.open(destinationUrl, '_blank');\n }\n }\n\n this.pushToDataLayer(eventName);\n }\n\n destroy() {\n this.removeEventListeners();\n }\n\n handleLayoutChange(newLayout: Layout): void {\n if (this.$el.dataset.hideLastItem !== undefined) {\n const gifItems = this.$el.querySelectorAll(':has(> .js-gif-item)');\n const lastGifItem = gifItems[gifItems.length - 1];\n\n if (newLayout === 'four-col') {\n lastGifItem.classList.add('1-5xl:hidden');\n lastGifItem.classList.remove('4xl:hidden');\n }\n else if (newLayout === 'six-col') {\n lastGifItem.classList.add('4xl:hidden');\n lastGifItem.classList.remove('1-5xl:hidden');\n }\n else {\n lastGifItem.classList.remove('1-5xl:hidden');\n lastGifItem.classList.remove('4xl:hidden');\n }\n }\n }\n}\n","import Alpine from 'alpinejs';\nimport { GifPage } from './gif';\nimport { appStore } from '@/stores/app';\n\nAlpine.data('gifPage', () => new GifPage(appStore.getPageData()));\n","import Alpine from 'alpinejs';\nimport { AppStore } from './app_store';\n\nAlpine.store('appStore', new AppStore());\n\nexport const appStore = Alpine.store('appStore') as AppStore;\n","import { GlobalAppData } from '@/types';\n\nexport class AppStore {\n private globalData: Window['siteData']['global'];\n private pageData: Record = {};\n\n constructor() {\n this.setGlobalData();\n this.setPageData();\n }\n\n setGlobalData() {\n const globalData = window.siteData?.global;\n\n if (!globalData) {\n throw new Error(`Couldn't read global siteData.`);\n }\n\n this.globalData = window.siteData?.global as GlobalAppData;\n }\n\n setPageData() {\n const pageData = window.siteData?.page;\n\n if (!pageData) {\n throw new Error(`Couldn't read page siteData.`);\n }\n\n this.pageData = window.siteData?.page;\n }\n\n getGlobalData() {\n return this.globalData;\n }\n\n getPageData(): T {\n return this.pageData as T;\n }\n}\n","function debounce(func: Function, milliseconds = 100) {\n let timer: number;\n\n return function (...args: any[]) {\n if (timer) clearTimeout(timer);\n\n timer = setTimeout(func, milliseconds, ...args);\n };\n}\n\nexport { debounce };\n"],"names":["WIDTHS","getGifItemWidth","width","i","length","GifPage","init","this","debouncedPlay","handleIntersect","id","isIntersecting","intersectingIds","add","delete","handleMainGifBehavior","mainVideo","document","getElementById","querySelector","mainVideoImg","offsetWidth","gifData","store","gifs","split","jpg","src","mp4","firstElementChild","load","play","preloadImage","loadedThumbnailIds","has","imgElement","handleResizeEvent","handleResize","handlePlay","addEventListeners","window","addEventListener","debouncedResize","removeEventListeners","removeEventListener","handleGifSource","videoElement","getAttribute","setAttribute","mp4Video","webmVideo","webm","videoWasLoadedPreviously","video","videos","forEach","pause","pushToDataLayer","eventName","dataLayer","push","event","event_name","sendGaClickEvent","destinationUrl","currentTarget","href","preventDefault","open","destroy","handleLayoutChange","newLayout","undefined","$el","dataset","hideLastItem","gifItems","querySelectorAll","lastGifItem","classList","remove","constructor","Set","debounce","Alpine","data","appStore","getPageData","setGlobalData","globalData","siteData","global","Error","setPageData","pageData","page","getGlobalData","func","milliseconds","timer","args","clearTimeout","setTimeout"],"sourceRoot":""}