Autoplay only on app start

owncloud · Nov 28, 2022 · c2bde9b · c2bde9b
1 parent 46b44ca
commit c2bde9b
Showing 1 changed file with 12 additions and 7 deletions.
diff --git a/packages/web-app-preview/src/App.vue b/packages/web-app-preview/src/App.vue
@@ -50,7 +50,7 @@
           :key="`media-video-${activeMediaFileCached.id}`"
           controls
           preload
-          autoplay
+          :autoplay="isAutoPlayEnabled"
         >
           <source :src="activeMediaFileCached.url" :type="activeMediaFileCached.mimeType" />
         </video>
@@ -59,7 +59,7 @@
           :key="`media-audio-${activeMediaFileCached.id}`"
           controls
           preload
-          autoplay
+          :autoplay="isAutoPlayEnabled"
         >
           <source :src="activeMediaFileCached.url" :type="activeMediaFileCached.mimeType" />
         </audio>
@@ -96,7 +96,7 @@
   </main>
 </template>
 <script lang="ts">
-import { defineComponent } from 'vue'
+import { defineComponent, unref } from 'vue'
 import { mapGetters } from 'vuex'
 import {
   useAccessToken,
@@ -108,7 +108,6 @@ import Preview from './index'
 import AppTopBar from 'web-pkg/src/components/AppTopBar.vue'
 import { loadPreview } from 'web-pkg/src/helpers'
 import { configurationManager } from 'web-pkg/src/configuration'
-import { unref } from 'vue'
 import { createFileRouteOptions, mergeFileRouteOptions } from 'web-pkg/src/helpers/router'
 
 export default defineComponent({
@@ -135,7 +134,9 @@ export default defineComponent({
       activeIndex: null,
       direction: 'rtl',
 
-      cachedFiles: []
+      cachedFiles: [],
+
+      isAutoPlayEnabled: true
     }
   },
 
@@ -207,10 +208,14 @@ export default defineComponent({
   },
 
   watch: {
-    activeIndex(o, n) {
-      if (o !== n) {
+    activeIndex(newValue, oldValue) {
+      if (newValue !== oldValue) {
         this.loadMedium()
       }
+
+      if (oldValue !== null) {
+        this.isAutoPlayEnabled = false
+      }
     }
   },