* player.js: sync, seeking and buffering fixes

merge-requests/6/head
Dominique Liberda 2022-11-29 14:03:20 -05:00
parent b4e15bec4d
commit b7e8d58dc6
1 changed files with 44 additions and 24 deletions

View File

@ -116,12 +116,22 @@ window.addEventListener('DOMContentLoaded', (event) => {
if (video.ended) {
video.currentTime = 0;
audio.currentTime = 0;
playbackWait();
} else {
video.play();
if (audio.src) {
audio.play();
}
if(video.readyState == 4) {
if (audio.src) {
if (audio.readyState == 4) {
video.play();
audio.play();
audio.currentTime = video.currentTime;
} else {
playbackWait();
}
} else {
video.play();
}
} else {
playbackWait();
}
}
} else {
classList.remove('ytp-button-pause');
@ -129,13 +139,12 @@ window.addEventListener('DOMContentLoaded', (event) => {
clearTimeout(mouseMoveTimeout);
video.pause();
if (audio.src) {
audio.currentTime = video.currentTime; // sync audio to video on pause
//audio.currentTime = video.currentTime; // sync audio to video on pause
audio.pause();
}
if (video.currentTime == video.duration && loopInput.checked == true) {
video.currentTime = 0;
audio.currentTime = 0;
playbackWait();
}
}
} catch (e) {
@ -248,11 +257,18 @@ window.addEventListener('DOMContentLoaded', (event) => {
}
function seekAbsolute(t) {
let state = video.paused;
video.pause();
video.currentTime=t;
video.play();
if(audio) {
audio.pause();
audio.currentTime=t;
audio.pause();
}
if(state) {
video.pause();
} else {
playbackWait();
}
}
@ -260,8 +276,8 @@ window.addEventListener('DOMContentLoaded', (event) => {
video.pause();
video.currentTime=video.currentTime+t;
if(audio) {
audio.pause();
audio.currentTime=video.currentTime;
audio.pause();
}
if(play != false) {
playbackWait();
@ -298,13 +314,17 @@ window.addEventListener('DOMContentLoaded', (event) => {
if (speedInput.selectedIndex != 0) speedInput.selectedIndex -= 1;
changeSpeed();
} else if (e.key == ".") {
if (video.paused) {
seekRelative(1/fps, false);
if (!video.paused) {
video.pause()
if (audio.src) audio.pause()
}
seekRelative(1/fps, false);
} else if (e.key == ",") {
if (video.paused) {
seekRelative(-1/fps, false);
if (!video.paused) {
video.pause()
if (audio.src) audio.pause()
}
seekRelative(-1/fps, false);
}
}
}
@ -377,15 +397,15 @@ window.addEventListener('DOMContentLoaded', (event) => {
function playbackWait() {
const waiting = setInterval(()=> {
if (document.querySelector("video").readyState == 4) {
if (document.querySelector("video").readyState == 4 && document.getElementById('player_audio').readyState == 4) {
clearInterval(waiting);
setTimeout(() => {
toggleVideo(true);
},150); // let the video buffer a tiny bit more
},200); // let the video buffer a tiny bit more
} else {
console.log("waiting...")
}
},100);
},200);
}
// document.querySelector('.ytp-button-play').addEventListener('click', () => toggleVideo());
@ -398,26 +418,26 @@ window.addEventListener('DOMContentLoaded', (event) => {
let videoWaiting = false;
let audioWaiting = false;
video.addEventListener('waiting', () => {
toggleVideo(false);
// toggleVideo(false);
videoWaiting = true;
});
video.addEventListener('playing', () => {
videoWaiting = false;
// videoWaiting = false;
console.log(`videoWaiting ${videoWaiting}, audioWaiting ${audioWaiting}`);
if (!audioWaiting) {
//if (!audioWaiting) {
toggleVideo(true);
}
//}
});
audio.addEventListener('waiting', () => {
toggleVideo(false);
// toggleVideo(false);
audioWaiting = true;
});
audio.addEventListener('playing', () => {
audioWaiting = false;
console.log(`videoWaiting ${videoWaiting}, audioWaiting ${audioWaiting}`);
if (!videoWaiting) {
toggleVideo(true);
}
//if (!videoWaiting) {
// toggleVideo(true);
//}
});
video.addEventListener('timeupdate', () => updateTime());
video.addEventListener('ended', () => toggleVideo(false)); // just to change the classes