{"version":3,"sources":["webpack:///./src/js/modules/Media.ts"],"names":["showCursorEvent","document","createEvent","hideCursorEvent","this","initEvent","video_containers","querySelectorAll","i","length","setupVideoContainer","element","video_element","querySelector","video","playing","timestamp_element","timestamp","addEventListener","event","handleVideoPlay","handleVideoPause","handleVideoStop","handleVideoContainerClick","handleVideoContainerMouseEnter","handleVideoContainerMouseLeave","play_element","handlePlayClicked","console","log","changeCursorLabelEvent","initCustomEvent","label","pause","play","window","dispatchEvent","preventDefault","container","classList","remove","add","currentTimeUpdate","setInterval","innerText","formatTime","currentTime","clearInterval","seconds","minutes","Math","floor"],"mappings":"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","file":"js/media.46ac1a532aeba6998dc3.js","sourcesContent":["import '../../css/modules/media.css';\n\ninterface MediaVideo {\n\n playing: boolean,\n timestamp?: HTMLElement,\n currentTimeUpdate?: any,\n video: HTMLVideoElement,\n\n};\n\nexport class Media {\n\n private showCursorEvent: CustomEvent = document.createEvent(\"CustomEvent\");\n private hideCursorEvent: CustomEvent = document.createEvent(\"CustomEvent\");\n private changeCursorLabelEvent: CustomEvent;\n\n constructor() {\n\n this.showCursorEvent.initEvent(\"showCursorEvent\", false, true);\n this.hideCursorEvent.initEvent(\"hideCursorEvent\", false, true);\n\n const video_containers: NodeListOf = document.querySelectorAll( '.c-media__video-container--manual-play' );\n for ( let i: number = 0; i < video_containers.length; i++ ) this.setupVideoContainer( video_containers[ i ] );\n\n }\n\n\n private setupVideoContainer( element: HTMLElement ) {\n\n const video_element: HTMLVideoElement = element.querySelector( '.c-media__video' );\n if ( video_element ) {\n\n const video: MediaVideo = { video: video_element, playing: false };\n const timestamp_element: HTMLElement = element.querySelector( '.c-media__video__timestamp' );\n if ( timestamp_element ) video.timestamp = timestamp_element;\n\n video_element.addEventListener( 'play', ( event: Event ) => this.handleVideoPlay( video, element ));\n video_element.addEventListener( 'pause', ( event: Event ) => this.handleVideoPause( video, element ));\n video_element.addEventListener( 'ended', ( event: Event ) => this.handleVideoStop( video, element ));\n\n element.addEventListener( 'click', () => this.handleVideoContainerClick( video ) );\n element.addEventListener( 'mouseenter', () => this.handleVideoContainerMouseEnter() );\n element.addEventListener( 'mouseleave', () => this.handleVideoContainerMouseLeave() );\n\n const play_element: HTMLElement = element.querySelector( '.c-media__video__play' );\n if ( play_element ) play_element.addEventListener( 'click', ( event: Event ) => this.handlePlayClicked( event, video ) );\n\n }\n\n }\n\n\n private handleVideoContainerClick( video: MediaVideo ) {\n\n console.log('handleVideoContainerClick');\n this.changeCursorLabelEvent = document.createEvent(\"CustomEvent\");\n\n if ( video.playing ) {\n\n this.changeCursorLabelEvent.initCustomEvent(\"changeCursorLabelEvent\", false, true, { label: 'play' });\n video.video.pause();\n\n } else {\n\n console.log('handleVideoContainerClick else');\n this.changeCursorLabelEvent.initCustomEvent(\"changeCursorLabelEvent\", false, true, { label: 'pause' });\n video.video.play();\n\n }\n\n video.playing = !video.playing;\n\n window.dispatchEvent(this.changeCursorLabelEvent);\n\n }\n\n private handleVideoContainerMouseEnter() {\n\n this.changeCursorLabelEvent = document.createEvent(\"CustomEvent\");\n this.changeCursorLabelEvent.initCustomEvent(\"changeCursorLabelEvent\", false, true, { label: 'play' });\n window.dispatchEvent(this.changeCursorLabelEvent);\n\n window.dispatchEvent(this.showCursorEvent);\n console.log('enter');\n\n }\n\n\n private handleVideoContainerMouseLeave() {\n \n window.dispatchEvent(this.hideCursorEvent);\n console.log('leave');\n \n }\n\n\n private handlePlayClicked( event: Event, video: MediaVideo ) {\n\n event.preventDefault();\n return false;\n\n }\n\n\n private handleVideoPlay( video: MediaVideo, container: HTMLElement ) {\n\n video.playing = true;\n\n container.classList.remove('s-stopped');\n container.classList.remove('s-paused');\n container.classList.add('s-playing');\n\n video.currentTimeUpdate = setInterval(() => {\n\n video.timestamp.innerText = `${this.formatTime( video.video.currentTime )}`;\n\n }, 250 );\n\n }\n\n\n private handleVideoPause( video: MediaVideo, container: HTMLElement ) {\n\n video.playing = false;\n \n container.classList.remove('s-stopped');\n container.classList.remove('s-playing');\n container.classList.add('s-paused');\n\n if ( video.currentTimeUpdate ) clearInterval( video.currentTimeUpdate );\n\n }\n\n\n private handleVideoStop( video: MediaVideo, container: HTMLElement ) {\n\n video.playing = false;\n \n container.classList.remove('s-paused');\n container.classList.remove('s-playing');\n container.classList.add('s-stopped');\n\n if ( video.currentTimeUpdate ) clearInterval( video.currentTimeUpdate );\n\n }\n\n\n private formatTime( seconds: any ) {\n\n let minutes: number|string = Math.floor( seconds / 60);\n minutes = ( minutes >= 10 ) ? minutes : \"0\" + minutes;\n seconds = Math.floor( seconds % 60);\n seconds = (seconds >= 10) ? seconds : \"0\" + seconds;\n return minutes + \":\" + seconds;\n\n }\n\n\n}"],"sourceRoot":""}