{"version":3,"file":"5628.b754d6ea.js","mappings":"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","sources":["webpack://@bang/www/./assets/controllers/videopreview_controller.js"],"sourcesContent":["import {Controller} from '@hotwired/stimulus';\nimport {useHover, useIntersection} from 'stimulus-use';\n\n/* stimulusFetch: 'lazy' */\nexport default class extends Controller {\n    static targets = ['image', 'video', 'watchLater', 'channelIcon', 'gradient', 'watchFull', 'progressBar'];\n\n    static values = {\n        id: String,\n        duration: {\n            type: Number,\n            default: 0,\n        },\n        focus: {\n            type: Boolean,\n            default: false,\n        },\n        touch: {\n            type: Boolean,\n            default: false,\n        },\n        auto: {\n            type: Boolean,\n            default: false,\n        },\n        sources: {\n            type: Object,\n            default: {},\n        },\n    };\n\n    playPromise = undefined;\n\n    connect() {\n        this.addAttributes();\n        this.buildsources();\n        if (this.focusValue && window.isMobile) {\n            useIntersection(this, {\n                threshold: 0.8,\n                rootMargin: '-200px 0px -25% 0px',\n                eventPrefix: false,\n            });\n        } else if (this.touchValue && window.isMobile) {\n            this.boundTouchStart = this.touchStart.bind(this);\n\n            this.element.addEventListener('touchstart', this.boundTouchStart);\n        }\n\n        if (!this.autoValue) {\n            useHover(this, {element: this.element});\n        }\n    }\n\n    disconnect() {\n        if (this.boundTouchStart) {\n            this.element.removeEventListener('touchstart', this.boundTouchStart);\n        }\n\n        this.stop();\n    }\n\n    touchStart() {\n        this.dispatch('playing', {detail: {element: this.video}});\n        this.show();\n    }\n\n    progressBarTargetConnected(e) {\n        let currentTime = localStorage.getItem('vjs_resume-' + this.idValue);\n        if (currentTime != null && this.durationValue > 0) {\n            e.style.width = (currentTime / this.durationValue) * 100 + '%';\n        }\n    }\n\n    videoTargetConnected(e) {\n        e.addEventListener('playing', (e) => {\n            this.hideimg(e.target.parentElement.querySelector('.preview-img'));\n        });\n        e.addEventListener('pause', (e) => {\n            this.showimg(e.target.parentElement.querySelector('.preview-img'));\n        });\n\n        if (this.autoValue) {\n            this.show();\n        }\n    }\n\n    videoTargetDisonnected(e) {\n        e.removeEventListener('playing', (e) => {\n            this.hideimg(e.target.parentElement.querySelector('.preview-img'));\n        });\n        e.removeEventListener('pause', (e) => {\n            this.showimg(e.target.parentElement.querySelector('.preview-img'));\n        });\n\n        e.pause();\n    }\n\n    imageTargetDisconnected(e) {\n        this.showimg(e);\n    }\n\n    imageTargetConnected(e) {\n        this.showimg(e);\n    }\n\n    showimg(i) {\n        if (i && i.classList.contains('opacity-0')) {\n            i.classList.remove('opacity-0');\n        }\n    }\n\n    hideimg(i) {\n        if (i && !i.classList.contains('opacity-0')) {\n            i.classList.add('opacity-0');\n        }\n    }\n\n    mouseEnter() {\n        if (!window.isMobile) {\n            this.show();\n        }\n    }\n\n    mouseLeave() {\n        if (!window.isMobile) {\n            this.stop();\n        }\n    }\n\n    playing(e) {\n        if (e.detail.element !== this.video) {\n            this.stop();\n        }\n    }\n\n    appear() {\n        if (!window.isPreviewRendered()) {\n            this.show();\n        }\n    }\n\n    disappear() {\n        this.stop();\n    }\n\n    show() {\n        if (this.hasGradientTarget) {\n            this.gradientTarget.style.visibility = 'hidden';\n        }\n\n        if (this.hasWatchLaterTarget) {\n            this.watchLaterTarget.classList.remove('hidden');\n        }\n\n        if (this.hasWatchFullTarget) {\n            this.watchFullTarget.classList.remove('hidden');\n        }\n\n        this.play();\n    }\n\n    play() {\n        if (!this.video) {\n            return;\n        }\n\n        this.video.autoplay = true;\n        this.video.muted = true;\n\n        this.video\n            .play()\n            .then(() => {\n                this.playPromise = true;\n                this.video.classList.remove('opacity-0');\n            })\n            .catch((error) => {\n                // fail silently\n                console.error(error);\n            });\n    }\n\n    stop() {\n        if (this.hasGradientTarget) {\n            this.gradientTarget.classList.remove('hidden');\n        }\n\n        if (this.hasWatchLaterTarget) {\n            this.watchLaterTarget.classList.add('hidden');\n        }\n\n        if (this.hasWatchFullTarget) {\n            this.watchFullTarget.classList.add('hidden');\n        }\n\n        if (this.hasImageTarget) {\n            this.imageTarget.classList.remove('opacity-0');\n        }\n\n        if (this.video) {\n            this.video.autoplay = false;\n            this.video.muted = true;\n            this.video.classList.add('opacity-0');\n            this.video.pause();\n        }\n    }\n\n    addAttributes() {\n        if (!this.video) {\n            return;\n        }\n\n        this.video.setAttribute('preload', 'none');\n        this.video.setAttribute('playsinline', '');\n        this.video.setAttribute('disablepictureinpicture', '');\n        this.video.setAttribute('disableremoteplayback', '');\n        this.video.setAttribute('x-webkit-airplay', 'deny');\n    }\n\n    buildsources() {\n        if (!this.video) {\n            return;\n        }\n\n        const currentSources = this.video.querySelectorAll('source');\n        if (currentSources.length > 0 || Object.keys(this.sourcesValue).length === 0) {\n            return;\n        }\n\n        const mp4 = document.createElement('source');\n        mp4.setAttribute(\n            'src',\n            this.sourcesValue[window.isMobile || !this.sourcesValue.mp4_large ? 'mp4' : 'mp4_large']\n        );\n        mp4.setAttribute('type', 'video/mp4');\n        this.video.appendChild(mp4);\n    }\n\n    get video() {\n        return this.element.querySelector('video');\n    }\n}\n"],"names":["_class","Controller","constructor","arguments","_defineProperty","undefined","connect","this","addAttributes","buildsources","focusValue","window","isMobile","useIntersection","threshold","rootMargin","eventPrefix","touchValue","boundTouchStart","touchStart","bind","element","addEventListener","autoValue","useHover","disconnect","removeEventListener","stop","dispatch","detail","video","show","progressBarTargetConnected","e","currentTime","localStorage","getItem","idValue","durationValue","style","width","videoTargetConnected","hideimg","target","parentElement","querySelector","showimg","videoTargetDisonnected","pause","imageTargetDisconnected","imageTargetConnected","i","classList","contains","remove","add","mouseEnter","mouseLeave","playing","appear","isPreviewRendered","disappear","hasGradientTarget","gradientTarget","visibility","hasWatchLaterTarget","watchLaterTarget","hasWatchFullTarget","watchFullTarget","play","autoplay","muted","then","playPromise","catch","error","console","hasImageTarget","imageTarget","setAttribute","querySelectorAll","length","Object","keys","sourcesValue","mp4","document","createElement","mp4_large","appendChild","id","String","duration","type","Number","default","focus","Boolean","touch","auto","sources"],"sourceRoot":""}