Merge branch 'master' into fix/audio_device_id

traPtitech · Jan 27, 2025 · 5aff456 · 5aff456
2 parents 6a36fc0 + 2a6d41f
commit 5aff456
Show file tree

Hide file tree

Showing 3 changed files with 56 additions and 14 deletions.
diff --git a/src/components/Main/MainView/QallView/UserList.vue b/src/components/Main/MainView/QallView/UserList.vue
@@ -4,6 +4,7 @@ import VideoComponent from '/@/components/Main/MainView/QallView/VideoComponent.
 import { onMounted, onUnmounted, ref, useTemplateRef, watchEffect } from 'vue'
 import ScreenShareComponent from './ScreenShareComponent.vue'
 import UserCard from './UserCard.vue'
+import UserSurplusCard from './UserSurplusCard.vue'
 
 const { tracksMap, screenShareTrackSidMap, screenShareTracks, selectedTrack } =
   useQall()
@@ -131,15 +132,14 @@ onUnmounted(() => {
           </div>
         </template>
         <div v-if="tracksMap.size > 5" :class="$style.card">
-          <button
-            @click="
+          <UserSurplusCard
+            :number="tracksMap.size - 5"
+            @switch="
               () => {
                 selectedTrack = undefined
               }
             "
-          >
-            +{{ tracksMap.size - 5 }}
-          </button>
+          />
         </div>
       </div>
     </div>

diff --git a/src/components/Main/MainView/QallView/UserSurplusCard.vue b/src/components/Main/MainView/QallView/UserSurplusCard.vue
@@ -0,0 +1,47 @@
+<script setup lang="ts">
+const { number } = defineProps<{
+  number: number
+}>()
+
+const emit = defineEmits<{
+  (e: 'switch'): void
+}>()
+
+const handleSwitch = () => {
+  emit('switch')
+}
+</script>
+
+<template>
+  <div :class="$style.UserCard" @click="handleSwitch">
+    <div :class="$style.NumberDisplay">+{{ number }}</div>
+  </div>
+</template>
+
+<style lang="scss" module>
+.UserCard {
+  height: 100%;
+  width: 100%;
+  position: relative;
+  overflow: hidden;
+  border-radius: 12px;
+  background-color: $theme-ui-primary-default;
+  pointer-events: auto;
+  user-select: none;
+  cursor: pointer;
+}
+
+.NumberDisplay {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  background-color: black;
+  color: white;
+  padding: 8px 16px;
+  border-radius: 8px;
+  font-size: 1.5rem;
+  font-weight: bold;
+  text-align: center;
+}
+</style>
diff --git a/src/composables/qall/useLiveKitSDK.ts b/src/composables/qall/useLiveKitSDK.ts
@@ -251,6 +251,9 @@ async function leaveRoom() {
   await room.value?.disconnect()
   await mixer.value?.playFileSource('qall_end')
 
+  await audioContext?.value?.close()
+  audioContext.value = undefined
+
   // Empty all variables
   room.value = undefined
   tracksMap.value.clear()
@@ -324,7 +327,7 @@ const addMicTrack = async () => {
 
     // Publish the processed stream
     await room.value.localParticipant.publishTrack(livekitAudioTrack, {
-      audioPreset: AudioPresets.musicHighQualityStereo,
+      audioPreset: AudioPresets.speech,
       forceStereo: true,
       red: false,
       dtx: false
@@ -351,10 +354,6 @@ const removeMicTrack = async () => {
     for (const [trackSid, trackInfo] of tracksMap.value) {
       if (trackInfo.isRemote) continue
       if (trackInfo.trackPublication?.track?.id === audioTrackId.value) {
-        if (audioContext.value) {
-          await audioContext.value.close()
-          audioContext.value = undefined
-        }
         await trackInfo.trackPublication?.track?.mute()
       }
     }
@@ -381,10 +380,6 @@ const toggleMicTrack = async () => {
     for (const [trackSid, trackInfo] of tracksMap.value) {
       if (trackInfo.isRemote) continue
       if (trackInfo.trackPublication?.track?.id === audioTrackId.value) {
-        if (audioContext.value) {
-          await audioContext.value.close()
-          audioContext.value = undefined
-        }
         await trackInfo.trackPublication?.track?.unmute()
       }
     }