From f0b3592be62b998b42424bd32d7c0872a0bb1e2c Mon Sep 17 00:00:00 2001
From: Ashley <iamashley@duck.com>
Date: Sun, 26 Feb 2023 20:56:33 +0000
Subject: [PATCH] add lazy loading :^

---
 html/poketube.ejs | 29 +++++++++++++++++++++++++++++
 1 file changed, 29 insertions(+)

diff --git a/html/poketube.ejs b/html/poketube.ejs
index 8226e5e..6851d74 100644
--- a/html/poketube.ejs
+++ b/html/poketube.ejs
@@ -1267,6 +1267,35 @@ window.addEventListener("load", () => {
     progressContainer1.style.display = 'none';
   }, 500);
 });
+  
+  document.addEventListener('DOMContentLoaded', function() {
+  let bgs = document.querySelectorAll('[data-bg]');
+  let bgCount = bgs.length;
+  
+  function loadBg(index) {
+    let bg = bgs[index];
+    let bgUrl = bg.getAttribute('data-bg');
+    bg.style.backgroundImage = `url(${bgUrl})`;
+    bg.removeAttribute('data-bg');
+    bg.classList.add('loaded');
+  }
+
+  function lazyLoadBg() {
+    for (let i = 0; i < bgCount; i++) {
+      let bg = bgs[i];
+      let bgRect = bg.getBoundingClientRect();
+      if (bgRect.top < window.innerHeight && bgRect.bottom > 0) {
+        loadBg(i);
+      }
+    }
+  }
+  
+  lazyLoadBg();
+  
+  window.addEventListener('scroll', lazyLoadBg);
+  window.addEventListener('resize', lazyLoadBg);
+});
+
 </script>
    
  <% if (!optout) { %>