* player.js: sync, seeking and buffering fixes
parent
b4e15bec4d
commit
b7e8d58dc6
|
@ -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
|
||||
|
|
Loading…
Reference in New Issue