=Timeline block fixes. Next up: adding article schema classes

Jake Vanderwerf

9 days ago 47e77f9fac1155c536b2b87fec552c7fcce66fa6

 src/video/view.js

New file
@@ -0,0 +1,47 @@
/** view.js **/
document.addEventListener("DOMContentLoaded", function () {
   const lazyVideos = [].slice.call(
      document.querySelectorAll(".video-container video")
   );

   // Build a helper to actually set sources + load
   function loadVideo(video) {
      const sources = video.querySelectorAll("source[data-src]");
      sources.forEach(source => {
         source.src = source.dataset.src;
      });
      video.load();
   }

   // --- 1. IntersectionObserver (best case) ---
   if ("IntersectionObserver" in window) {
      const lazyVideoObserver = new IntersectionObserver(
         function (entries, observer) {
            entries.forEach(entry => {
               if (entry.isIntersecting) {
                  loadVideo(entry.target);
                  observer.unobserve(entry.target);
               }
            });
         },
         {
            rootMargin: "200px 0px",
            threshold: 0.1,
         }
      );

      lazyVideos.forEach(video => lazyVideoObserver.observe(video));
      return;
   }

   // --- 2. Fallback: requestIdleCallback ---
   if ("requestIdleCallback" in window) {
      requestIdleCallback(() => {
         lazyVideos.forEach(video => loadVideo(video));
      });
      return;
   }

   // --- 3. Final fallback: load immediately ---
   lazyVideos.forEach(video => loadVideo(video));
});