refactored the way status suspensibility works

src/components/gallery/gallery.js

@@ -27,8 +27,10 @@ const Gallery = {
     return {
       sizes: {},
       hidingLong: true,
+      playingMedia: new Set(),
     }
   },
+  emits: ['play', 'pause'],
   components: { Attachment },
   computed: {
     rows() {
@@ -115,11 +117,21 @@ const Gallery = {
         return this.attachmentsDimensionalScore > 1
       }
     },
+    hasPlayingMedia() {
+      return this.playingMedia.size > 0
+    },
   },
   methods: {
     onNaturalSizeLoad({ id, width, height }) {
       set(this.sizes, id, { width, height })
     },
+    onMediaStateChange(playing, id) {
+      if (playing) {
+        this.playingMedia.add(id)
+      } else {
+        this.playingMedia.delete(id)
+      }
+    },
     rowStyle(row) {
       if (row.audio) {
         return { 'padding-bottom': '25%' } // fixed reduced height for audio
@@ -146,6 +158,15 @@ const Gallery = {
       useMediaViewerStore().setMedia(this.attachments)
     },
   },
+  watch: {
+    hasPlayingMedia(newValue) {
+      if (newValue) {
+        this.$emit('play')
+      } else {
+        this.$emit('pause')
+      }
+    }
+  }
 }
 
 export default Gallery