From 78ab05ec73f8211cee2183bc69af61d14b7e28cb Mon Sep 17 00:00:00 2001
From: heqnx <root@heqnx.com>
Date: Sat, 5 Jul 2025 22:55:25 +0300
Subject: some styling changes

---
 templates/var/www/html/video-background.js | 25 ++++++++++++++++++++++++-
 1 file changed, 24 insertions(+), 1 deletion(-)

(limited to 'templates/var/www/html/video-background.js')

diff --git a/templates/var/www/html/video-background.js b/templates/var/www/html/video-background.js
index 15ccd3e..8f95a00 100644
--- a/templates/var/www/html/video-background.js
+++ b/templates/var/www/html/video-background.js
@@ -1,6 +1,7 @@
 (async () => {
   const video = document.getElementById('background');
   const fadeOverlay = document.getElementById('fadeOverlay');
+  const toggleBgBtn = document.getElementById('toggleBg');
   const FADE_DURATION = 1000;
 
   const resp = await fetch('/videos/videos.json');
@@ -11,6 +12,8 @@
   const videos = await resp.json();
 
   let lastVideo = null;
+  let bgEnabled = true;
+  let loopCanceled = false;
 
   function pickRandomVideo() {
     if (videos.length === 1) return videos[0];
@@ -23,7 +26,7 @@
   }
 
   async function playVideoLoop() {
-    while (true) {
+    while (!loopCanceled) {
       const nextVideo = pickRandomVideo();
       video.src = `/videos/${nextVideo}`;
       video.style.opacity = '0';
@@ -36,6 +39,8 @@
         video.onloadedmetadata = () => resolve();
       });
 
+      if (loopCanceled) break;
+
       video.currentTime = 0;
       video.play().catch(console.error);
 
@@ -51,5 +56,23 @@
     }
   }
 
+  toggleBgBtn.addEventListener('click', (e) => {
+    e.preventDefault();
+    bgEnabled = !bgEnabled;
+    loopCanceled = !bgEnabled;
+
+    if (!bgEnabled) {
+      video.pause();
+      video.style.display = 'none';
+      fadeOverlay.style.display = 'none';
+      toggleBgBtn.textContent = 'background (off)';
+    } else {
+      video.style.display = '';
+      fadeOverlay.style.display = '';
+      toggleBgBtn.textContent = 'background (on)';
+      playVideoLoop();
+    }
+  });
+
   playVideoLoop();
 })();
-- 
cgit v1.2.3