[web] Fix audio not stopping

web-src/src/components/ControlStreamVolume.vue

@@ -44,9 +44,6 @@ export default {
       volume: 10
     }
   },
-  mounted() {
-    this.setupAudio()
-  },
   unmounted() {
     this.closeAudio()
   },
@@ -57,17 +54,14 @@ export default {
     closeAudio() {
       audio.stop()
       this.playing = false
+      this.loading = false
     },
     playChannel() {
-      if (this.playing) {
-        return
-      }
       this.loading = true
       audio.play('/stream.mp3')
-      audio.setVolume(this.volume / 100)
+      this.changeVolume()
-    },
+      const a = audio.audio
-    setupAudio() {
+      if (a) {
-      const a = audio.setup()
         a.addEventListener('waiting', () => {
           this.playing = false
           this.loading = true
@@ -82,23 +76,16 @@ export default {
         })
         a.addEventListener('error', () => {
           this.closeAudio()
-        this.notificationsStore.add({
-          text: this.$t('navigation.stream-error'),
-          type: 'danger'
-        })
-        this.playing = false
-        this.loading = false
         })
+      }
     },
     togglePlay() {
-      if (this.loading) {
+      if (this.playing || this.loading) {
-        return
-      }
-      if (this.playing) {
         this.closeAudio()
-      }
+      } else {
         this.playChannel()
       }
     }
   }
+}
 </script>

web-src/src/lib/Audio.js

@@ -1,59 +1,31 @@
-/**
- * Audio handler object
- * Inspired by https://github.com/rainner/soma-fm-player
- * (released under MIT licence)
- */
 export default {
-  audio: new Audio(),
+  audio: null,
   context: null,
-
+  source: null,
-  // Play audio source url
+  play(url) {
-  play(source) {
     this.stop()
-    this.context.resume().then(() => {
+    this.audio = new Audio(`${String(url || '')}?x=${Date.now()}`)
-      this.audio.src = `${String(source || '')}?x=${Date.now()}`
     this.audio.crossOrigin = 'anonymous'
-      this.audio.load()
+    this.context = new (window.AudioContext || window.webkitAudioContext)()
+    this.source = this.context.createMediaElementSource(this.audio)
+    this.source.connect(this.context.destination)
+    this.audio.addEventListener('canplay', () => {
+      this.context.resume().then(() => {
+        this.audio.play()
       })
+    })
+    this.audio.load()
   },
-
-  // Set audio volume
   setVolume(volume) {
     if (this.audio) {
-      this.audio.volume = Math.min(1, Math.max(0, parseFloat(volume) || 0.0))
+      this.audio.volume = Math.max(0, Math.min(1, Number(volume) || 0))
     }
   },
-
-  // Setup audio routing
-  setup() {
-    this.context = new (window.AudioContext || window.webkitAudioContext)()
-    const source = this.context.createMediaElementSource(this.audio)
-    source.connect(this.context.destination)
-    this.audio.addEventListener('canplaythrough', () => {
-      this.audio.play()
-    })
-    this.audio.addEventListener('canplay', () => {
-      this.audio.play()
-    })
-    return this.audio
-  },
-
-  // Stop playing audio
   stop() {
     try {
-      this.audio.pause()
+      this.audio?.pause()
     } catch (error) {
-      // Continue regardless of error
+      // Do nothing
-    }
-    try {
-      this.audio.stop()
-    } catch (error) {
-      // Continue regardless of error
-    }
-    try {
-      this.audio.close()
-    } catch (error) {
-      // Continue regardless of error
     }
   }
 }