{"version":3,"file":"modalVideoModule-C_CBAadY.js","sources":["../../src/scripts/modules/modalVideoModule.ts"],"sourcesContent":["import VideoModule from './videoModule';\r\nimport { debounce } from '../helpers';\r\nimport Player from '@vimeo/player';\r\n\r\ntype YouTubePlayer = {\r\n  on: (event: string, callback: () => void) => void;\r\n  playVideo: () => void;\r\n  pauseVideo: () => void;\r\n  mute: () => void;\r\n};\r\n\r\nclass ModalVideoModule extends VideoModule {\r\n  modal?: HTMLDivElement;\r\n  modalOverlay?: HTMLDivElement;\r\n  setupReady: boolean = false;\r\n  overlayListenerAdded: boolean = false;\r\n  modalOpen: boolean = false;\r\n\r\n  constructor(el: HTMLElement) {\r\n    super(el);\r\n    this.setupModal();\r\n    this.addListeners();\r\n  }\r\n\r\n  setupDefaults(): void {\r\n    super.setupDefaults();\r\n\r\n    this.dom.noModalParent = (this.dom.videoPlaceholder as HTMLElement)\r\n      ?.parentElement as HTMLDivElement;\r\n  }\r\n\r\n  addListeners(): void {\r\n    super.addListeners();\r\n    window.addEventListener('resize', debounce(this.handleResize.bind(this), 250));\r\n    document.addEventListener('keydown', e => {\r\n      this.handleKeyPress(e);\r\n    });\r\n  }\r\n\r\n  handleKeyPress(e: KeyboardEvent): void {\r\n    if (e.key === 'Escape' && this.modalOpen) {\r\n      this.closeModal();\r\n    }\r\n  }\r\n\r\n  handleResize() {\r\n    const mediaQuery = window.matchMedia('(min-width: 1200px)');\r\n\r\n    this.setupModal();\r\n\r\n    if (this.setupReady && !mediaQuery.matches) {\r\n      if (this.dom.videoPlaceholder && this.dom.noModalParent) {\r\n        // Move the existing videoPlaceholder to the noModalParent\r\n        const videoPlaceholder = this.modal?.querySelector('.video-placeholder') as HTMLElement;\r\n        const noModalParent = this.dom.noModalParent as HTMLElement;\r\n\r\n        // Check if videoPlaceholder already has a parent and remove it from there\r\n        if (videoPlaceholder.parentElement) {\r\n          videoPlaceholder.parentElement.removeChild(videoPlaceholder);\r\n        }\r\n\r\n        // Append to the new parent\r\n        noModalParent.appendChild(videoPlaceholder);\r\n\r\n        this.dom.videoPlaceholder = videoPlaceholder;\r\n      }\r\n\r\n      this.closeModal();\r\n      this.setupReady = false;\r\n    }\r\n  }\r\n\r\n  setupModal() {\r\n    const mediaQuery = window.matchMedia('(min-width: 1200px)');\r\n    const videoPlaceholder = this.el.querySelector('.video-placeholder') as HTMLElement;\r\n\r\n    if (this.setupReady || !mediaQuery.matches) return;\r\n\r\n    if (!this.modal || !this.modalOverlay) {\r\n      this.modal = document.createElement('div');\r\n      this.modal.className = 'video-modal';\r\n      this.modalOverlay = document.createElement('div');\r\n      this.modalOverlay.className = 'video-modal-overlay';\r\n\r\n      document.body.appendChild(this.modalOverlay);\r\n      document.body.appendChild(this.modal);\r\n    }\r\n\r\n    if (videoPlaceholder.parentElement) {\r\n      videoPlaceholder.parentElement.removeChild(videoPlaceholder);\r\n    }\r\n\r\n    this.modal.appendChild(videoPlaceholder);\r\n    this.dom.videoPlaceholder = videoPlaceholder;\r\n\r\n    this.setupReady = true;\r\n\r\n    if (this.isPlaying) this.showModal();\r\n\r\n    if (this.overlayListenerAdded) return;\r\n    this.modalOverlay.addEventListener('click', () => this.closeModal());\r\n    this.overlayListenerAdded = true;\r\n  }\r\n\r\n  closeModal() {\r\n    if (this.isPlaying) {\r\n      this.handlePlayButtonClick();\r\n    }\r\n\r\n    if (this.provider === 'vimeo') {\r\n      (this.player as Player).pause();\r\n    } else if (this.provider === 'youtube') {\r\n      (this.player as YouTubePlayer).pauseVideo();\r\n    } else if (this.dom.localVideo) {\r\n      (this.dom.localVideo as HTMLVideoElement).pause();\r\n    }\r\n    this.isPlaying = false;\r\n\r\n    if (this.modal) this.modal.style.display = 'none';\r\n    if (this.modalOverlay) this.modalOverlay.style.display = 'none';\r\n\r\n    if (this.dom.backgroundImage)\r\n      (this.dom.backgroundImage as HTMLImageElement).style.display = 'block';\r\n    if (this.dom.playButton) (this.dom.playButton as HTMLElement).style.display = 'flex';\r\n\r\n    document.body.classList.remove('no-scroll');\r\n    this.modalOpen = false;\r\n  }\r\n\r\n  showModal() {\r\n    if (this.modal) this.modal.style.display = 'flex';\r\n    if (this.modalOverlay) this.modalOverlay.style.display = 'block';\r\n\r\n    document.body.classList.add('no-scroll');\r\n    this.modalOpen = true;\r\n  }\r\n\r\n  handlePlayButtonClick() {\r\n    if (!this.videoReady) return;\r\n\r\n    const mediaQuery = window.matchMedia('(min-width: 1200px)');\r\n\r\n    if (mediaQuery.matches) this.showModal();\r\n\r\n    if (this.provider === 'youtube') {\r\n      super.handlePlayButtonClick();\r\n      setTimeout(() => {\r\n        (this.player as YouTubePlayer).playVideo();\r\n      }, 500);\r\n    } else {\r\n      super.handlePlayButtonClick();\r\n    }\r\n  }\r\n}\r\n\r\nexport default ModalVideoModule;\r\n"],"names":["ModalVideoModule","VideoModule","el","__publicField","_a","debounce","mediaQuery","videoPlaceholder","noModalParent"],"mappings":"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"}