58 lines
2 KiB
JavaScript
58 lines
2 KiB
JavaScript
// Deshabilita scroll con la tecla de espacio
|
||
// Esto es para que en 'player' quede habilitado para reproducción
|
||
window.addEventListener('keydown', (e) => {
|
||
if (e.keyCode === 32) {
|
||
if (e.target === document.body) {
|
||
e.preventDefault();
|
||
}
|
||
// Por alguna razón la tecla rápida 'espacio' no funciona en toggle como
|
||
// la tecla rápida 'k', así que se fuerza para el mismo comportamiento
|
||
window.dispatchEvent(new KeyboardEvent('keydown', {
|
||
'key': 'k'
|
||
}));
|
||
}
|
||
});
|
||
|
||
// Añade un aviso
|
||
function add_notice () {
|
||
const divs = document.querySelectorAll('.plyr');
|
||
// Ejecuta de nuevo hasta que esté implementado el reproductor
|
||
if (divs.length == 0) {
|
||
setTimeout(add_notice, 500);
|
||
} else {
|
||
let hero_sec = document.createElement('section'),
|
||
hero_div = document.createElement('div'),
|
||
hero_tit = document.createElement('p'),
|
||
hero_btn = document.createElement('a');
|
||
hero_sec.id = 'notice';
|
||
hero_sec.classList.add('hero', 'is-small', 'is-warning', 'has-text-centered');
|
||
hero_div.classList.add('hero-body');
|
||
hero_btn.classList.add('button', 'is-small', 'is-success');
|
||
hero_btn.addEventListener('click', remove_notice);
|
||
hero_tit.innerText = 'Mauflix funciona con pocos recursos. Para un uso más eficiente y ecológico te recomendamos descargar la película.';
|
||
hero_btn.innerText = '¡Entendido!';
|
||
hero_tit.appendChild(hero_btn);
|
||
hero_div.appendChild(hero_tit);
|
||
hero_sec.appendChild(hero_div);
|
||
divs[0].appendChild(hero_sec);
|
||
}
|
||
}
|
||
|
||
// Elimina aviso
|
||
function remove_notice () {
|
||
let notice = document.querySelector('#notice');
|
||
console.log('notice', notice)
|
||
if (notice !== null) {
|
||
notice.parentNode.removeChild(notice);
|
||
}
|
||
}
|
||
|
||
// Implementa el reproductor
|
||
const player = new Plyr('#player', {
|
||
keyboard: { focused: true, global: true },
|
||
controls: ['play-large', 'play', 'progress', 'current-time', 'mute',
|
||
'volume', 'pip', 'airplay', 'captions', 'settings', 'download',
|
||
'fullscreen'],
|
||
listeners: { seek: add_notice() },
|
||
});
|