update

client/app/composables/use-audio-context.ts

@@ -4,13 +4,12 @@ export default function useAudioContext(audioTrack: Ref<MediaStreamTrack | undef
   const ctx = new (window.AudioContext || window.webkitAudioContext)()
 
   const stream = new MediaStream()
+  const audioEl = new Audio()
 
   const sourceNode = shallowRef<MediaStreamAudioSourceNode>()
   const gainNode = ctx.createGain()
 
-  let hackExecuted = false
-
-  watch(audioTrack, (track, prevTrack) => {
+  watch(audioTrack, async (track, prevTrack) => {
     if (prevTrack)
       stream.removeTrack(prevTrack)
 
@@ -19,16 +18,14 @@ export default function useAudioContext(audioTrack: Ref<MediaStreamTrack | undef
 
     stream.addTrack(track)
 
-    if (!hackExecuted) {
-      const audioEl = new Audio()
+    if (!audioEl.srcObject) {
       audioEl.srcObject = stream
       audioEl.muted = true
-      hackExecuted = true
     }
 
     sourceNode.value = ctx.createMediaStreamSource(stream)
 
-    connect()
+    await connect()
   }, { immediate: true })
 
   useEventListener(document, 'click', async () => {
@@ -36,10 +33,16 @@ export default function useAudioContext(audioTrack: Ref<MediaStreamTrack | undef
       await ctx.resume()
     }
 
-    connect()
+    await connect()
   }, { once: true })
 
-  function connect() {
+  onScopeDispose(() => {
+    audioEl.pause()
+    audioEl.srcObject = null
+    ctx.close()
+  })
+
+  async function connect() {
     if (!sourceNode.value || ctx.state === 'suspended')
       return
 

client/app/composables/use-mediasoup.ts

@@ -165,8 +165,6 @@ export const useMediasoup = createSharedComposable(() => {
         if (producerPaused)
           consumer.pause()
 
-        console.log('newConsumer', consumer.paused)
-
         consumer.on('transportclose', () => {
           if (consumers.value.delete(consumer.id))
             triggerRef(consumers)
@@ -248,12 +246,13 @@ export const useMediasoup = createSharedComposable(() => {
 
     const stream = await navigator.mediaDevices.getUserMedia({
       audio: {
-        autoGainControl: false,
-        noiseSuppression: true,
-        echoCancellation: false,
-        channelCount: 2,
+        deviceId: { exact: preferences.inputDeviceId.value },
+        autoGainControl: { exact: preferences.autoGainControl.value },
+        echoCancellation: { exact: preferences.echoCancellation.value },
+        noiseSuppression: { exact: preferences.noiseSuppression.value },
       },
     })
+
     const track = stream.getAudioTracks()[0]
 
     if (!track)
@@ -270,6 +269,7 @@ export const useMediasoup = createSharedComposable(() => {
 
     producers.value.set(micProducer.value.id, micProducer.value)
     triggerRef(producers)
+    triggerRef(micProducer)
 
     micProducer.value.on('transportclose', () => {
       micProducer.value = undefined
@@ -297,6 +297,7 @@ export const useMediasoup = createSharedComposable(() => {
     }
     finally {
       triggerRef(producers)
+      triggerRef(micProducer)
     }
 
     micProducer.value = undefined
@@ -370,6 +371,32 @@ export const useMediasoup = createSharedComposable(() => {
     }
   }
 
+  watch(
+    preferences.inputDeviceId,
+    async (inputDeviceId) => {
+      await disableMic()
+
+      if (!inputDeviceId)
+        return
+
+      await enableMic()
+    },
+  )
+
+  watch([
+    preferences.inputDeviceId,
+    preferences.echoCancellation,
+    preferences.autoGainControl,
+    preferences.noiseSuppression,
+  ], async ([inputDeviceId]) => {
+    await disableMic()
+
+    if (!inputDeviceId)
+      return
+
+    await enableMic()
+  })
+
   return {
     init,
     consumers,

client/app/composables/use-preferences.ts

@@ -16,14 +16,24 @@ export const usePreferences = createGlobalState(() => {
     audioOutputs,
   } = useDevicesList()
 
+  const inputDeviceExist = computed(() => {
+    return audioInputs.value.some(device => device.deviceId === inputDeviceId.value)
+  })
+
+  const outputDeviceExist = computed(() => {
+    return audioOutputs.value.some(device => device.deviceId === outputDeviceId.value)
+  })
+
   return {
     inputDeviceId,
     outputDeviceId,
     autoGainControl,
     noiseSuppression,
     echoCancellation,
-    videoInputs,
-    audioInputs,
-    audioOutputs,
+    inputDeviceExist,
+    outputDeviceExist,
+    videoInputs: computed(() => JSON.parse(JSON.stringify(videoInputs.value))),
+    audioInputs: computed(() => JSON.parse(JSON.stringify(audioInputs.value))),
+    audioOutputs: computed(() => JSON.parse(JSON.stringify(audioOutputs.value))),
   }
 })