From 6a559bc28ab7c2b2e004b885fa9f9023329fd6cc Mon Sep 17 00:00:00 2001
From: ed <s@ocv.me>
Date: Thu, 15 Jul 2021 00:22:26 +0200
Subject: [PATCH] gallery: dispose videos to stop buffering

---
 copyparty/web/baguettebox.js | 22 ++++++++++++++++++----
 copyparty/web/browser.js     |  2 +-
 copyparty/web/util.js        |  4 ++--
 3 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/copyparty/web/baguettebox.js b/copyparty/web/baguettebox.js
index d52d1acf..148ee332 100644
--- a/copyparty/web/baguettebox.js
+++ b/copyparty/web/baguettebox.js
@@ -470,13 +470,23 @@ window.baguetteBox = (function () {
             return;
         }
 
+        // maybe unloaded video
+        while (imageContainer.firstChild)
+            imageContainer.removeChild(imageContainer.firstChild);
+
         var imageElement = galleryItem.imageElement,
             imageSrc = imageElement.href,
+            is_vid = re_v.test(imageSrc),
             thumbnailElement = imageElement.querySelector('img, video'),
             imageCaption = typeof options.captions === 'function' ?
                 options.captions.call(currentGallery, imageElement) :
                 imageElement.getAttribute('data-caption') || imageElement.title;
 
+        imageSrc += imageSrc.indexOf('?') < 0 ? '?cache' : '&cache';
+
+        if (is_vid && index != currentIndex)
+            return;  // no preload
+
         var figure = mknod('figure');
         figure.id = 'bbox-figure-' + index;
         figure.innerHTML = '<div class="bbox-spinner">' +
@@ -492,9 +502,7 @@ window.baguetteBox = (function () {
         }
         imageContainer.appendChild(figure);
 
-        var is_vid = re_v.test(imageSrc),
-            image = mknod(is_vid ? 'video' : 'img');
-
+        var image = mknod(is_vid ? 'video' : 'img');
         clmod(imageContainer, 'vid', is_vid);
 
         image.addEventListener(is_vid ? 'loadedmetadata' : 'load', function () {
@@ -569,7 +577,13 @@ window.baguetteBox = (function () {
             return false;
         }
 
-        playvid(false);
+        var v = vid();
+        if (v) {
+            v.src = '';
+            v.load();
+            v.parentNode.removeChild(v);
+        }
+
         currentIndex = index;
         loadImage(currentIndex, function () {
             preloadNext(currentIndex);
diff --git a/copyparty/web/browser.js b/copyparty/web/browser.js
index 1f4148d4..de23d065 100644
--- a/copyparty/web/browser.js
+++ b/copyparty/web/browser.js
@@ -1756,7 +1756,7 @@ document.onkeydown = function (e) {
 	if (e.ctrlKey || e.altKey || e.metaKey || e.isComposing)
 		return;
 
-	if (QS('#baguetteBox-overlay.visible'))
+	if (QS('#bbox-overlay.visible'))
 		return;
 
 	var k = e.code + '', pos = -1, n;
diff --git a/copyparty/web/util.js b/copyparty/web/util.js
index 684d423c..efffe3a7 100644
--- a/copyparty/web/util.js
+++ b/copyparty/web/util.js
@@ -525,11 +525,11 @@ var tt = (function () {
 
         r.tt.innerHTML = msg.replace(/\$N/g, "<br />");
         clmod(r.tt, 'show', 1);
-    }
+    };
 
     r.hide = function () {
         clmod(r.tt, 'show');
-    }
+    };
 
     r.init = function () {
         var ttb = ebi('tooltips');