Korbs/poke
Korbs/poke
1
Fork 0
Code Activity

test commit 1

Browse source
This commit is contained in:
ashley 2024-08-27 22:43:57 +00:00
parent 1642b99e1b
commit 9e5dd4f5f1
1 changed files with 55 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

93
html/poketube.ejs
View file

@ -2105,70 +2105,83 @@ if (/[?&]autoplay=/.test(location.search)) {
<% if(!IsOldWindows) { %> <% if(!IsOldWindows) { %>
<script> <script>
const AMvideo = document.getElementById("video") const AMvideo = document.getElementById("video");
const oddCanvas = document.getElementById("ambient-canvas-1") const oddCanvas = document.getElementById("ambient-canvas-1");
const evenCanvas = document.getElementById("ambient-canvas-2") const evenCanvas = document.getElementById("ambient-canvas-2");
const oddCtx = oddCanvas.getContext("2d") const oddCtx = oddCanvas.getContext("2d");
const evenCtx = evenCanvas.getContext("2d") const evenCtx = evenCanvas.getContext("2d");
const frameIntervalMs = 998 const canvasOpacity = "0.4";
const canvasOpacity = "0.4"
let intervalId;
let oddFrame = true;
const setFrameInterval = () => {
const cores = navigator.hardwareConcurrency || 2
return Math.max(500 / cores, 33);
};
const adjustCanvasSize = () => {
const cores = navigator.hardwareConcurrency || 2;
oddCanvas.style.width = evenCanvas.style.width = `${Math.min(1000, 800 / cores)}px`;
oddCanvas.style.height = evenCanvas.style.height = `${Math.min(1000, 600 / cores)}px`;
};
let intervalId
let oddFrame = true
const drawFrame = () => { const drawFrame = () => {
if (oddFrame) { if (oddFrame) {
oddCtx.drawImage(AMvideo, 0, 0, oddCanvas.width, oddCanvas.height) oddCtx.drawImage(AMvideo, 0, 0, oddCanvas.width, oddCanvas.height);
transitionToOddCanvas() transitionToOddCanvas();
} else { } else {
evenCtx.drawImage(AMvideo, 0, 0, evenCanvas.width, evenCanvas.height) evenCtx.drawImage(AMvideo, 0, 0, evenCanvas.width, evenCanvas.height);
transitionToEvenCanvas() transitionToEvenCanvas();
} }
oddFrame = !oddFrame oddFrame = !oddFrame;
}; };
const transitionToOddCanvas = () => { const transitionToOddCanvas = () => {
oddCanvas.style.opacity = canvasOpacity oddCanvas.style.opacity = canvasOpacity;
evenCanvas.style.opacity = "0" evenCanvas.style.opacity = "0";
} };
const transitionToEvenCanvas = () => { const transitionToEvenCanvas = () => {
evenCanvas.style.opacity = canvasOpacity evenCanvas.style.opacity = canvasOpacity;
oddCanvas.style.opacity = "0" oddCanvas.style.opacity = "0";
} };
const drawStart = () => { const drawStart = () => {
intervalId = window.setInterval(drawFrame, frameIntervalMs) const frameIntervalMs = setFrameInterval(); // Get optimized frame interval
} intervalId = window.setInterval(drawFrame, frameIntervalMs);
};
const drawPause = () => { const drawPause = () => {
if (intervalId) window.clearInterval(intervalId) if (intervalId) window.clearInterval(intervalId);
} };
const init = () => { const init = () => {
// Fixes an issue where Firefox/Chromium fails to load the ambient mode
AMvideo.pause();
AMvideo.play();
//fixes a issue where firefox/chromium fails to load the ambinet mode and doesnt load it. - please dont remove this line lmao adjustCanvasSize(); // Adjust canvas size based on hardware
video.pause();video.play(); AMvideo.addEventListener("play", drawStart, false);
AMvideo.addEventListener("pause", drawPause, false);
AMvideo.addEventListener("ended", drawPause, false);
// DO NOT REMOVE oddCanvas.style.transition = evenCanvas.style.transition = `opacity ${setFrameInterval()}ms`;
};
AMvideo.addEventListener("play", drawStart, false)
AMvideo.addEventListener("pause", drawPause, false)
AMvideo.addEventListener("ended", drawPause, false)
oddCanvas.style.transition = evenCanvas.style.transition = `opacity ${frameIntervalMs}ms`
}
const cleanup = () => { const cleanup = () => {
AMvideo.removeEventListener("play", drawStart) AMvideo.removeEventListener("play", drawStart);
AMvideo.removeEventListener("pause", drawPause) AMvideo.removeEventListener("pause", drawPause);
AMvideo.removeEventListener("ended", drawPause) AMvideo.removeEventListener("ended", drawPause);
drawPause(); drawPause();
} };
window.addEventListener("load", init);
window.addEventListener("unload", cleanup);
window.addEventListener("load", init)
window.addEventListener("unload", cleanup)
</script> </script>
<style> <style>
.video-player-container, #video { .video-player-container, #video {