From a76e01d2b78a785f3665a8b3532c7cc566bfabce Mon Sep 17 00:00:00 2001
From: Ramires Viana <59319979+ramiresviana@users.noreply.github.com>
Date: Fri, 26 Mar 2021 17:31:27 +0000
Subject: [PATCH] feat: dynamic autoplay on previewer

---
 frontend/src/views/files/Preview.vue | 27 +++++++++++++++++++++++++--
 1 file changed, 25 insertions(+), 2 deletions(-)

diff --git a/frontend/src/views/files/Preview.vue b/frontend/src/views/files/Preview.vue
index 30dcef5a..26521153 100644
--- a/frontend/src/views/files/Preview.vue
+++ b/frontend/src/views/files/Preview.vue
@@ -57,8 +57,22 @@
     <template v-if="!loading">
       <div class="preview">
         <ExtendedImage v-if="req.type == 'image'" :src="raw"></ExtendedImage>
-        <audio v-else-if="req.type == 'audio'" :src="raw" controls></audio>
-        <video v-else-if="req.type == 'video'" :src="raw" controls>
+        <audio
+          v-else-if="req.type == 'audio'"
+          ref="player"
+          :src="raw"
+          controls
+          :autoplay="autoPlay"
+          @play="autoPlay = true"
+        ></audio>
+        <video
+          v-else-if="req.type == 'video'"
+          ref="player"
+          :src="raw"
+          controls
+          :autoplay="autoPlay"
+          @play="autoPlay = true"
+        >
           <track
             kind="captions"
             v-for="(sub, index) in subtitles"
@@ -139,6 +153,7 @@ export default {
       showNav: true,
       navTimeout: null,
       hoverNav: false,
+      autoPlay: false,
     };
   },
   computed: {
@@ -233,6 +248,14 @@ export default {
       }
     },
     async updatePreview() {
+      if (
+        this.$refs.player &&
+        this.$refs.player.paused &&
+        !this.$refs.player.ended
+      ) {
+        this.autoPlay = false;
+      }
+
       if (this.req.subtitles) {
         this.subtitles = this.req.subtitles.map(
           (sub) => `${baseURL}/api/raw${sub}?auth=${this.jwt}&inline=true`