mirror of
https://codeberg.org/ashley/poke.git
synced 2024-11-29 16:48:51 +01:00
Update html/poketube.ejs
This commit is contained in:
parent
18785ff8c7
commit
db151c1ec2
1 changed files with 94 additions and 77 deletions
|
@ -619,88 +619,103 @@ background-color: #0000;
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
const video = videojs('video', {
|
const video = videojs('video', {
|
||||||
controls: true,
|
controls: true,
|
||||||
autoplay: false,
|
autoplay: false,
|
||||||
preload: 'auto',
|
preload: 'auto',
|
||||||
|
});
|
||||||
});
|
|
||||||
|
|
||||||
const qua = new URLSearchParams(window.location.search).get("quality") || "";
|
const qua = new URLSearchParams(window.location.search).get("quality") || "";
|
||||||
localStorage.setItem(`progress-${new URLSearchParams(window.location.search).get('v')}`, 0);
|
localStorage.setItem(`progress-${new URLSearchParams(window.location.search).get('v')}`, 0);
|
||||||
|
|
||||||
if (qua !== "medium") {
|
if (qua !== "medium") {
|
||||||
const audio = document.getElementById('aud');
|
const audio = document.getElementById('aud');
|
||||||
|
|
||||||
// Sync volume between audio and video
|
// Sync volume between audio and video
|
||||||
const syncVolume = () => {
|
const syncVolume = () => {
|
||||||
audio.volume = video.volume();
|
audio.volume = video.volume();
|
||||||
};
|
};
|
||||||
|
|
||||||
const syncVolumeWithVideo = () => {
|
const syncVolumeWithVideo = () => {
|
||||||
video.volume(audio.volume);
|
video.volume(audio.volume);
|
||||||
};
|
};
|
||||||
|
|
||||||
const checkAudioBuffer = () => {
|
const checkAudioBuffer = () => {
|
||||||
const buffered = audio.buffered;
|
const buffered = audio.buffered;
|
||||||
const bufferedEnd = buffered.length > 0 ? buffered.end(buffered.length - 1) : 0;
|
const bufferedEnd = buffered.length > 0 ? buffered.end(buffered.length - 1) : 0;
|
||||||
return audio.currentTime <= bufferedEnd;
|
return audio.currentTime <= bufferedEnd;
|
||||||
};
|
};
|
||||||
|
|
||||||
const isVideoBuffered = () => {
|
const isVideoBuffered = () => {
|
||||||
// Check if video has enough buffered data
|
// Check if video has enough buffered data
|
||||||
const buffered = video.buffered();
|
const buffered = video.buffered();
|
||||||
return buffered.length > 0 && buffered.end(buffered.length - 1) >= video.currentTime();
|
return buffered.length > 0 && buffered.end(buffered.length - 1) >= video.currentTime();
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleSeek = () => {
|
|
||||||
// Pause video and audio when seeking
|
|
||||||
video.pause();
|
|
||||||
audio.pause();
|
|
||||||
|
|
||||||
// Sync audio with video during seeking
|
|
||||||
if (Math.abs(video.currentTime() - audio.currentTime) > 0.3) {
|
|
||||||
audio.currentTime = video.currentTime();
|
|
||||||
}
|
|
||||||
|
|
||||||
// Wait for audio to be buffered sufficiently
|
|
||||||
if (!checkAudioBuffer()) {
|
|
||||||
audio.addEventListener('canplay', () => {
|
|
||||||
if (video.paused && isVideoBuffered()) {
|
|
||||||
video.play();
|
|
||||||
audio.play();
|
|
||||||
}
|
|
||||||
}, { once: true });
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
video.on('play', () => {
|
|
||||||
if (isVideoBuffered()) {
|
|
||||||
audio.play();
|
|
||||||
} else {
|
|
||||||
video.pause();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
video.on('pause', () => {
|
|
||||||
audio.pause();
|
|
||||||
});
|
|
||||||
|
|
||||||
|
const handleSeek = () => {
|
||||||
|
// Pause video and audio when seeking
|
||||||
|
video.pause();
|
||||||
|
audio.pause();
|
||||||
|
|
||||||
|
// Sync audio with video during seeking
|
||||||
|
if (Math.abs(video.currentTime() - audio.currentTime) > 0.3) {
|
||||||
|
audio.currentTime = video.currentTime();
|
||||||
|
}
|
||||||
|
|
||||||
video.on('seeking', handleSeek);
|
// Wait for audio to be buffered sufficiently
|
||||||
|
if (!checkAudioBuffer()) {
|
||||||
video.on('seeked', () => {
|
audio.addEventListener('canplay', () => {
|
||||||
if (isVideoBuffered()) {
|
if (video.paused && isVideoBuffered()) {
|
||||||
video.play();
|
video.play();
|
||||||
|
audio.play();
|
||||||
}
|
}
|
||||||
audio.play(); // Ensure audio is playing after seek
|
}, { once: true });
|
||||||
});
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
video.on('play', () => {
|
||||||
|
// Sync audio with video before playing
|
||||||
|
if (Math.abs(video.currentTime() - audio.currentTime) > 0.3) {
|
||||||
|
audio.currentTime = video.currentTime();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Wait for both video and audio to be buffered sufficiently
|
||||||
|
if (isVideoBuffered() && checkAudioBuffer()) {
|
||||||
|
video.play();
|
||||||
|
audio.play();
|
||||||
|
} else {
|
||||||
|
video.pause();
|
||||||
|
audio.pause();
|
||||||
|
|
||||||
|
const bufferListener = () => {
|
||||||
|
if (isVideoBuffered() && checkAudioBuffer()) {
|
||||||
|
video.play();
|
||||||
|
audio.play();
|
||||||
|
audio.removeEventListener('canplay', bufferListener);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
audio.addEventListener('canplay', bufferListener);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
video.on('pause', () => {
|
||||||
|
audio.pause();
|
||||||
|
});
|
||||||
|
|
||||||
|
video.on('seeking', handleSeek);
|
||||||
|
|
||||||
|
video.on('seeked', () => {
|
||||||
|
if (isVideoBuffered()) {
|
||||||
|
video.play();
|
||||||
|
}
|
||||||
|
audio.play(); // Ensure audio is playing after seek
|
||||||
|
});
|
||||||
|
|
||||||
|
video.on('volumechange', syncVolume);
|
||||||
|
audio.addEventListener('volumechange', syncVolumeWithVideo);
|
||||||
|
|
||||||
video.on('volumechange', syncVolume);
|
|
||||||
audio.addEventListener('volumechange', syncVolumeWithVideo);
|
|
||||||
|
|
||||||
// Listen for media control events
|
// Listen for media control events
|
||||||
document.addEventListener('play', () => {
|
document.addEventListener('play', () => {
|
||||||
video.play();
|
video.play();
|
||||||
|
@ -710,15 +725,17 @@ background-color: #0000;
|
||||||
document.addEventListener('pause', () => {
|
document.addEventListener('pause', () => {
|
||||||
video.pause();
|
video.pause();
|
||||||
audio.pause();
|
audio.pause();
|
||||||
});
|
});
|
||||||
document.addEventListener('fullscreenchange', () => {
|
|
||||||
if (!document.fullscreenElement) {
|
document.addEventListener('fullscreenchange', () => {
|
||||||
video.pause();
|
if (!document.fullscreenElement) {
|
||||||
audio.pause();
|
video.pause();
|
||||||
}
|
audio.pause();
|
||||||
});
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue