phantasma/app/static/js/film.js

57 lines
1.8 KiB
JavaScript
Raw Normal View History

2021-10-22 09:56:05 +00:00
var videoExtension
2021-10-22 08:21:43 +00:00
function setVideoSrc(video, src) {
var ext
if (!videoExtension) {
[
['video/mp4; codecs="avc1.42E01E, mp4a.40.2"', '.mp4'],
['video/webm; codecs="vp8, vorbis"', '.webm'],
].forEach(opt => {
if (videoExtension) { return }
if (video.canPlayType(opt[0]).replace('no', '')) {
videoExtension = opt[1]
}
})
}
video.src = src.replace('.webm', videoExtension)
}
2021-10-11 14:38:22 +00:00
document.querySelector('a#play-fullscreen').addEventListener('click', event => {
2021-10-22 09:56:05 +00:00
event.preventDefault()
event.stopPropagation()
2021-10-11 14:38:22 +00:00
var video = document.createElement('video')
video.classList.add('player')
2021-10-22 08:21:43 +00:00
setVideoSrc(video, 'https://pad.ma/' + film.id + '/480p.webm')
2021-10-22 09:56:05 +00:00
console.log(video.src)
2021-10-11 14:38:22 +00:00
video.controls = true
document.querySelector('main').appendChild(video)
video.style.display = 'none'
function enterFullscreen(event) {
video.requestFullscreen().catch(err => {
console.log(`Error attempting to enable full-screen mode: ${err.message} (${err.name})`);
});
video.removeEventListener('play', enterFullscreen);
setTimeout(() => {
video.style.display = 'block'
}, 150)
}
video.addEventListener('play', enterFullscreen);
video.addEventListener('fullscreenchange', event => {
if (!document.fullscreen) {
video.remove()
if (document.fullscreenElement) {
document.exitFullscreen();
}
}
});
video.addEventListener('pause', event => {
})
video.addEventListener('ended', event => {
video.remove()
if (document.fullscreenElement) {
document.exitFullscreen();
}
});
video.play()
})