[U] refresh video src on next/prev

public/app.js

@@ -5,7 +5,8 @@ new Vue({
     index: 0,
     interval: null,
     carouselTimeout: 20000,
-    carouselActive: true
+    carouselActive: true,
+    videoSrc: null,
   },
   methods: {
     next: function () {
@@ -14,6 +15,13 @@ new Vue({
       } else {
         this.index = 0;
       }
+      // force video src reload
+      this.videoSrc = null;
+      setTimeout(() => {
+        if (this.files[this.index].mime.includes('video')) {
+          this.videoSrc = '/files/'+this.files[this.index].basename;
+        }
+      }, 100)
     },
     nextClick: function () {
       this.next();
@@ -25,6 +33,12 @@ new Vue({
       } else {
         this.index = this.files.length - 1;
       }
+      // force video src reload
+      setTimeout(() => {
+        if (this.files[this.index].mime.includes('video')) {
+          this.videoSrc = '/files/'+this.files[this.index].basename;
+        }
+      }, 100)
     },
     prevClick: function () {
       this.next();

public/index.html

@@ -23,8 +23,8 @@
                 <svg v-if="carouselActive" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M11 7H8V17H11V7Z" fill="currentColor"/> <path d="M13 17H16V7H13V17Z" fill="currentColor"/></svg>
             </div>
             <img v-if="files[index].mime.includes('image')" v-bind:src="'/files/'+files[index].basename" alt="">
-            <video v-if="files[index].mime.includes('video')" autoplay muted loop>
+            <video v-if="videoSrc" autoplay muted loop>
-                <source v-bind:src="'/files/'+files[index].basename" v-bind:type="files[index].mime">
+                <source v-bind:src="videoSrc" v-bind:type="files[index].mime">
             </video>
         </div>
         <div v-else class="empty">