From cb674313232c8442a64a31d1d00963e5eb4af431 Mon Sep 17 00:00:00 2001
From: ashley <iamashley@duck.com>
Date: Tue, 27 Aug 2024 22:55:15 +0000
Subject: [PATCH] test 3

---
 html/poketube.ejs | 52 +++++++++++++++++++++++------------------------
 1 file changed, 26 insertions(+), 26 deletions(-)

diff --git a/html/poketube.ejs b/html/poketube.ejs
index 75a779c..d853bab 100644
--- a/html/poketube.ejs
+++ b/html/poketube.ejs
@@ -2112,59 +2112,60 @@ const oddCtx = oddCanvas.getContext("2d");
 const evenCtx = evenCanvas.getContext("2d");
 
 const canvasOpacity = "0.4";
+const baseFrameIntervalMs = 500;
 let intervalId;
 let oddFrame = true;
 
-const getFrameInterval = () => {
-  const cores = navigator.hardwareConcurrency || 2;
-  return Math.max(500 / cores, 33);
+const getCoreCount = () => navigator.hardwareConcurrency || 2;
+
+const getOptimizedInterval = () => {
+  const coreCount = getCoreCount();
+  return Math.max(baseFrameIntervalMs / coreCount, 33);
 };
 
-const adjustCanvasSize = () => {
-  const cores = navigator.hardwareConcurrency || 2;
-  const size = Math.min(1000, 800 / cores);
+const updateCanvasSize = () => {
+  const coreCount = getCoreCount();
+  const size = Math.min(1000, 800 / coreCount);
   oddCanvas.style.width = evenCanvas.style.width = `${size}px`;
   oddCanvas.style.height = evenCanvas.style.height = `${size * 0.75}px`;
 };
 
 const drawFrame = () => {
+  const ctx = oddFrame ? oddCtx : evenCtx;
+  const canvas = oddFrame ? oddCanvas : evenCanvas;
+  
+  ctx.drawImage(AMvideo, 0, 0, canvas.width, canvas.height);
+  
   if (oddFrame) {
-    oddCtx.drawImage(AMvideo, 0, 0, oddCanvas.width, oddCanvas.height);
-    transitionToOddCanvas();
+    oddCanvas.style.opacity = canvasOpacity;
+    evenCanvas.style.opacity = "0";
   } else {
-    evenCtx.drawImage(AMvideo, 0, 0, evenCanvas.width, evenCanvas.height);
-    transitionToEvenCanvas();
+    evenCanvas.style.opacity = canvasOpacity;
+    oddCanvas.style.opacity = "0";
   }
+  
   oddFrame = !oddFrame;
 };
 
-const transitionToOddCanvas = () => {
-  oddCanvas.style.opacity = canvasOpacity;
-  evenCanvas.style.opacity = "0";
-};
-
-const transitionToEvenCanvas = () => {
-  evenCanvas.style.opacity = canvasOpacity;
-  oddCanvas.style.opacity = "0";
-};
-
 const drawStart = () => {
-  const frameIntervalMs = getFrameInterval();
-  intervalId = window.setInterval(drawFrame, frameIntervalMs);
+  const frameIntervalMs = getOptimizedInterval();
+  intervalId = setInterval(drawFrame, frameIntervalMs);
 };
 
 const drawPause = () => {
-  if (intervalId) window.clearInterval(intervalId);
+  if (intervalId) clearInterval(intervalId);
 };
 
 const init = () => {
   AMvideo.pause();
   AMvideo.play();
-  adjustCanvasSize();
+  updateCanvasSize();
   AMvideo.addEventListener("play", drawStart, false);
   AMvideo.addEventListener("pause", drawPause, false);
   AMvideo.addEventListener("ended", drawPause, false);
-  oddCanvas.style.transition = evenCanvas.style.transition = `opacity ${getFrameInterval()}ms`;
+  
+  const frameIntervalMs = getOptimizedInterval();
+  oddCanvas.style.transition = evenCanvas.style.transition = `opacity ${frameIntervalMs}ms`;
 };
 
 const cleanup = () => {
@@ -2177,7 +2178,6 @@ const cleanup = () => {
 window.addEventListener("load", init);
 window.addEventListener("unload", cleanup);
 
-
 </script>
 <style>
 .video-player-container, #video {