From cb1407b70bb91e9e5d29041987ec8077689728fc Mon Sep 17 00:00:00 2001
From: nokhnaton <sage_of_forest@icloud.com>
Date: Fri, 24 Jan 2025 14:58:40 +0900
Subject: [PATCH 1/5] =?UTF-8?q?Qall=E4=B8=AD=E3=83=81=E3=83=A3=E3=83=B3?=
 =?UTF-8?q?=E3=83=8D=E3=83=AB=E3=81=AE=E8=A1=A8=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../NavigationContent/HomeTab.vue             | 16 +++++--
 src/composables/qall/useLiveKitSDK.ts         | 22 ++++------
 src/composables/qall/useQall.ts               | 42 +++++++++++++++++++
 3 files changed, 63 insertions(+), 17 deletions(-)

diff --git a/src/components/Main/NavigationBar/NavigationContent/HomeTab.vue b/src/components/Main/NavigationBar/NavigationContent/HomeTab.vue
index 8cce33b66..622a61737 100644
--- a/src/components/Main/NavigationBar/NavigationContent/HomeTab.vue
+++ b/src/components/Main/NavigationBar/NavigationContent/HomeTab.vue
@@ -41,17 +41,19 @@ import ChannelList from '/@/components/Main/NavigationBar/ChannelList/ChannelLis
 import ChannelTree from '/@/components/Main/NavigationBar/ChannelList/ChannelTree.vue'
 import NavigationContentContainer from '/@/components/Main/NavigationBar/NavigationContentContainer.vue'
 import DMChannelList from '/@/components/Main/NavigationBar/DMChannelList/DMChannelList.vue'
-import { computed, toRaw } from 'vue'
+import { computed, toRaw, watchEffect } from 'vue'
 import { constructTreeFromIds } from '/@/lib/channelTree'
 import { useChannelTree } from '/@/store/domain/channelTree'
 import { useMeStore } from '/@/store/domain/me'
 import { useChannelsStore } from '/@/store/entities/channels'
 import useChannelsWithNotification from '/@/composables/subscription/useChannelsWithNotification'
 import { filterTrees } from '/@/lib/basic/tree'
+import { useQall } from '/@/composables/qall/useQall'
 
 const { homeChannelTree } = useChannelTree()
 const { detail } = useMeStore()
 const { channelsMap } = useChannelsStore()
+const { roomWithParticipants } = useQall()
 
 const homeChannelWithTree = computed(() => {
   if (!detail.value?.homeChannel) return []
@@ -70,8 +72,16 @@ const topLevelChannels = computed(() =>
   // filterTreesは重いのと内部ではreactiveである必要がないのでtoRawする
   filterTrees(toRaw(homeChannelTree.value.children), node => !node.archived)
 )
-// TODO: Qall
-const qallingChannels = []
+
+const qallingChannels = computed(() =>
+  roomWithParticipants.value
+    .map(room => channelsMap.value.get(room.roomId))
+    .flatMap(channel => (channel?.archived === false ? [channel] : []))
+)
+
+watchEffect(() => {
+  console.log('qalling', qallingChannels.value)
+})
 </script>
 
 <style lang="scss" module>
diff --git a/src/composables/qall/useLiveKitSDK.ts b/src/composables/qall/useLiveKitSDK.ts
index 21f818935..7d1ba9d76 100644
--- a/src/composables/qall/useLiveKitSDK.ts
+++ b/src/composables/qall/useLiveKitSDK.ts
@@ -210,8 +210,6 @@ async function leaveRoom() {
   window.removeEventListener('beforeunload', leaveRoom)
 }
 
-const Attributes = ref<{ [key: string]: string }>({})
-
 const addCameraTrack = async (
   videoInputDevice?: MediaDeviceInfo,
   backgroundType?: 'original' | 'blur' | 'file' | 'screen',
@@ -362,15 +360,12 @@ const addScreenShareTrack = async () => {
     const videoSid = localTracks.find(t => t.kind === Track.Kind.Video)?.sid
     const audioSid = localTracks.find(t => t.kind === Track.Kind.Audio)?.sid
     if (audioSid && videoSid) {
-      Attributes.value = {
-        ...Attributes.value,
-        [videoSid]: audioSid
-      }
       screenShareTrackSidMap.value.set(videoSid, audioSid)
-      // await room.value.localParticipant.setAttributes({
-      //   ...room.value.localParticipant.attributes,
-      //   [videoSid]: audioSid
-      // })
+      await room.value.localParticipant.setAttributes({
+        ...room.value.localParticipant.attributes,
+        [videoSid]: audioSid
+      })
+      console.log(room.value.localParticipant.attributes)
     }
   } catch {
     // TODO:シェアをキャンセルした時も失敗しましたメッセージがでるのはちょっと違和感があるかも
@@ -398,14 +393,13 @@ const removeVideoTrack = async (localpublication: LocalTrackPublication) => {
     }
 
     const { [localpublication.trackSid]: audioSid, ...newAttributes } =
-      Attributes.value
-    //room.value.localParticipant.attributes
+      room.value.localParticipant.attributes
     await room.value.localParticipant.unpublishTrack(
       localpublication.track,
       true
     )
-    room.value.localParticipant.setAttributes(newAttributes)
-    Attributes.value = newAttributes
+    await room.value.localParticipant.setAttributes(newAttributes)
+    console.log(room.value.localParticipant.attributes)
     if (!audioSid) {
       return
     }
diff --git a/src/composables/qall/useQall.ts b/src/composables/qall/useQall.ts
index 34ab261b3..d3ac87c1d 100644
--- a/src/composables/qall/useQall.ts
+++ b/src/composables/qall/useQall.ts
@@ -3,7 +3,14 @@ import { useLiveKitSDK } from '/@/composables/qall/useLiveKitSDK'
 import { useMeStore } from '/@/store/domain/me'
 import { useToastStore } from '/@/store/ui/toast'
 import type { LocalAudioTrack, LocalVideoTrack } from 'livekit-client'
+import AutoReconnectWebSocket from '/@/lib/websocket/AutoReconnectWebSocket'
 
+type RoomWithParticipants = {
+  roomId: string
+  participants: { identity: string; joinedAt: string }[]
+}[]
+
+const roomWithParticipants = ref<RoomWithParticipants>([])
 const callingChannel = ref('')
 
 const {
@@ -21,6 +28,40 @@ const {
 const { myId } = useMeStore()
 const { addErrorToast } = useToastStore()
 
+const ws = new AutoReconnectWebSocket(
+  'wss://qall-microservice-for-livekit.trap.show/api/ws',
+  undefined,
+  {
+    maxReconnectionDelay: 3000,
+    minReconnectionDelay: 1000
+  }
+)
+ws.connect()
+ws.addEventListener('message', event => {
+  try {
+    const data: RoomWithParticipants = JSON.parse(event.detail as string)
+    roomWithParticipants.value = data
+    console.log(data)
+  } catch (e) {
+    // eslint-disable-next-line no-console
+    console.warn('[WebSocket] Failed to parse: ', e)
+  }
+})
+
+fetch('https://qall-microservice-for-livekit.trap.show/api/rooms').then(res => {
+  res
+    .json()
+    .then(data => {
+      console.log(data)
+      if (!data) return
+      roomWithParticipants.value = data
+    })
+    .catch(e => {
+      // eslint-disable-next-line no-console
+      console.warn('Failed to parse: ', e)
+    })
+})
+
 const setSpeakerMute = (track: LocalAudioTrack, muted: boolean) => {
   setLocalTrackMute(track, muted)
 }
@@ -48,6 +89,7 @@ export const useQall = () => {
   }
   return {
     callingChannel,
+    roomWithParticipants,
     joinQall,
     leaveQall,
     addScreenShareTrack,

From b1a89f80f24ca2fe09d1c2788e2d1a9eacb55988 Mon Sep 17 00:00:00 2001
From: nokhnaton <sage_of_forest@icloud.com>
Date: Fri, 24 Jan 2025 17:07:11 +0900
Subject: [PATCH 2/5] =?UTF-8?q?=E6=AF=8E=E5=9B=9E=E7=A2=BA=E8=AA=8D?=
 =?UTF-8?q?=E3=83=A1=E3=83=83=E3=82=BB=E3=83=BC=E3=82=B8=E3=81=8C=E5=87=BA?=
 =?UTF-8?q?=E3=81=A6=E7=85=A9=E3=82=8F=E3=81=97=E3=81=84=E3=81=AE=E3=81=A7?=
 =?UTF-8?q?=E4=B8=80=E6=97=A6=E7=84=A1=E5=8A=B9=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/App.vue b/src/App.vue
index 743c4eba2..ce16092de 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -25,7 +25,7 @@ const useQallConfirmer = () => {
   window.addEventListener('beforeunload', event => {
     // TODO: Qall
     // ここは適切な変数を置く
-    const isCurrentDevice = computed(() => true)
+    const isCurrentDevice = computed(() => false)
     if (isCurrentDevice.value) {
       const unloadMessage = 'Qall中ですが本当に終了しますか？'
       event.preventDefault()

From 1131ea994227024d502ff1579982d19cc111a970 Mon Sep 17 00:00:00 2001
From: nokhnaton <sage_of_forest@icloud.com>
Date: Fri, 24 Jan 2025 21:35:34 +0900
Subject: [PATCH 3/5] =?UTF-8?q?MasterAudioVolume=E3=81=A8TTS=E3=81=A8Qall?=
 =?UTF-8?q?=E4=B8=AD=E3=83=81=E3=83=A3=E3=83=B3=E3=83=8D=E3=83=AB=E3=81=AE?=
 =?UTF-8?q?=E8=A1=A8=E7=A4=BA=E3=81=AE=E5=AE=9F=E8=A3=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ChannelSidebar/ChannelSidebarContent.vue  | 13 +++-
 .../Main/MainView/QallView/AudioTrack.vue     |  9 ++-
 .../EphemeralNavigationContent.vue            |  8 +-
 .../QallController/QallDetailsPanel.vue       |  1 -
 .../NavigationContent/HomeTab.vue             | 12 +--
 .../composables/useNavigationSelectorEntry.ts |  6 +-
 src/composables/qall/useQall.ts               | 77 ++++++++++++++++---
 src/store/app/tts.ts                          | 28 +------
 8 files changed, 95 insertions(+), 59 deletions(-)

diff --git a/src/components/Main/MainView/ChannelView/ChannelSidebar/ChannelSidebarContent.vue b/src/components/Main/MainView/ChannelView/ChannelSidebar/ChannelSidebarContent.vue
index cef25a348..08fea5d80 100644
--- a/src/components/Main/MainView/ChannelView/ChannelSidebar/ChannelSidebarContent.vue
+++ b/src/components/Main/MainView/ChannelView/ChannelSidebar/ChannelSidebarContent.vue
@@ -5,8 +5,6 @@
       :viewer-ids="viewerIds"
       :class="$style.sidebarItem"
     />
-    <!-- TODO: Qall -->
-    <!-- デザインが確定したら消すか消さないか決める -->
     <channel-sidebar-qall
       v-if="qallUserIds.length > 0"
       :qall-user-ids="qallUserIds"
@@ -52,6 +50,8 @@ import ChannelSidebarQall from './ChannelSidebarQall.vue'
 import ChannelSidebarBots from './ChannelSidebarBots.vue'
 import type { UserId, ChannelId } from '/@/types/entity-ids'
 import { useModelSyncer } from '/@/composables/useModelSyncer'
+import { useQall } from '/@/composables/qall/useQall'
+import { computed } from 'vue'
 
 const props = withDefaults(
   defineProps<{
@@ -71,7 +71,14 @@ const emit = defineEmits<{
   (e: 'update:isViewersDetailOpen', value: boolean): void
 }>()
 
-const qallUserIds: UserId[] = []
+const { rooms: roomWithParticipants } = useQall()
+
+const qallUserIds = computed(
+  () =>
+    roomWithParticipants.value
+      .find(room => room.channel.id === props.channelId)
+      ?.participants?.map(participant => participant.user.id) ?? []
+)
 
 const isViewersDetailOpen = useModelSyncer(props, emit, 'isViewersDetailOpen')
 </script>
diff --git a/src/components/Main/MainView/QallView/AudioTrack.vue b/src/components/Main/MainView/QallView/AudioTrack.vue
index 70d3c8777..7c015a3d0 100644
--- a/src/components/Main/MainView/QallView/AudioTrack.vue
+++ b/src/components/Main/MainView/QallView/AudioTrack.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { onMounted, onUnmounted, useTemplateRef, watchEffect } from 'vue'
 import type { TrackInfo } from '/@/composables/qall/useLiveKitSDK'
+import { useRtcSettings } from '/@/store/app/rtcSettings'
 const { trackInfo, volume } = defineProps<{
   trackInfo: TrackInfo
   volume: number
@@ -8,10 +9,14 @@ const { trackInfo, volume } = defineProps<{
 const audioElement = useTemplateRef<HTMLMediaElement>('audioElement')
 const audioContext = new AudioContext()
 const gainNode = audioContext.createGain()
-gainNode.gain.value = 1
+const { masterVolume } = useRtcSettings()
+gainNode.gain.value = volume * masterVolume.value
 
 watchEffect(() => {
-  gainNode.gain.value = volume
+  gainNode.gain.exponentialRampToValueAtTime(
+    Math.max(volume * masterVolume.value, 1e-44),
+    audioContext.currentTime + 0.2
+  )
 })
 
 onMounted(() => {
diff --git a/src/components/Main/NavigationBar/EphemeralNavigationContent/EphemeralNavigationContent.vue b/src/components/Main/NavigationBar/EphemeralNavigationContent/EphemeralNavigationContent.vue
index 2dfbfda9e..099f2e3a6 100644
--- a/src/components/Main/NavigationBar/EphemeralNavigationContent/EphemeralNavigationContent.vue
+++ b/src/components/Main/NavigationBar/EphemeralNavigationContent/EphemeralNavigationContent.vue
@@ -1,10 +1,8 @@
 <template>
   <ephemeral-navigation-content-container :transparent="transparent">
     <transition name="fade-bottom" mode="out-in">
-      <qall-controller v-if="currentEphemeralNavigation === 'qallController'" />
-      <SubQallView v-else-if="currentEphemeralNavigation === 'draftList'" />
-
-      <!-- <draft-list v-else-if="currentEphemeralNavigation === 'draftList'" /> -->
+      <SubQallView v-if="currentEphemeralNavigation === 'qallController'" />
+      <DraftList v-else-if="currentEphemeralNavigation === 'draftList'" />
       <audio-controller
         v-else-if="currentEphemeralNavigation === 'audioController'"
       />
@@ -14,10 +12,10 @@
 
 <script lang="ts" setup>
 import EphemeralNavigationContentContainer from './EphemeralNavigationContentContainer.vue'
-import QallController from './QallController/QallController.vue'
 import AudioController from './AudioController/AudioController.vue'
 import type { EphemeralNavigationItemType } from '/@/components/Main/NavigationBar/composables/useNavigationConstructor'
 import SubQallView from '../../MainView/QallView/SubQallView.vue'
+import DraftList from './DraftList/DraftList.vue'
 
 withDefaults(
   defineProps<{
diff --git a/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanel.vue b/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanel.vue
index 0bbc20bbf..e26781e05 100644
--- a/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanel.vue
+++ b/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanel.vue
@@ -34,7 +34,6 @@ import useToggle from '/@/composables/utils/useToggle'
 
 const { myId } = useMeStore()
 
-
 const hasId = computed(() => false)
 
 const {
diff --git a/src/components/Main/NavigationBar/NavigationContent/HomeTab.vue b/src/components/Main/NavigationBar/NavigationContent/HomeTab.vue
index 622a61737..477c1c48b 100644
--- a/src/components/Main/NavigationBar/NavigationContent/HomeTab.vue
+++ b/src/components/Main/NavigationBar/NavigationContent/HomeTab.vue
@@ -41,7 +41,7 @@ import ChannelList from '/@/components/Main/NavigationBar/ChannelList/ChannelLis
 import ChannelTree from '/@/components/Main/NavigationBar/ChannelList/ChannelTree.vue'
 import NavigationContentContainer from '/@/components/Main/NavigationBar/NavigationContentContainer.vue'
 import DMChannelList from '/@/components/Main/NavigationBar/DMChannelList/DMChannelList.vue'
-import { computed, toRaw, watchEffect } from 'vue'
+import { computed, toRaw } from 'vue'
 import { constructTreeFromIds } from '/@/lib/channelTree'
 import { useChannelTree } from '/@/store/domain/channelTree'
 import { useMeStore } from '/@/store/domain/me'
@@ -53,7 +53,7 @@ import { useQall } from '/@/composables/qall/useQall'
 const { homeChannelTree } = useChannelTree()
 const { detail } = useMeStore()
 const { channelsMap } = useChannelsStore()
-const { roomWithParticipants } = useQall()
+const { rooms: roomWithParticipants } = useQall()
 
 const homeChannelWithTree = computed(() => {
   if (!detail.value?.homeChannel) return []
@@ -74,14 +74,8 @@ const topLevelChannels = computed(() =>
 )
 
 const qallingChannels = computed(() =>
-  roomWithParticipants.value
-    .map(room => channelsMap.value.get(room.roomId))
-    .flatMap(channel => (channel?.archived === false ? [channel] : []))
+  roomWithParticipants.value.map(room => room.channel)
 )
-
-watchEffect(() => {
-  console.log('qalling', qallingChannels.value)
-})
 </script>
 
 <style lang="scss" module>
diff --git a/src/components/Main/NavigationBar/composables/useNavigationSelectorEntry.ts b/src/components/Main/NavigationBar/composables/useNavigationSelectorEntry.ts
index 36f757276..13d6f0e3e 100644
--- a/src/components/Main/NavigationBar/composables/useNavigationSelectorEntry.ts
+++ b/src/components/Main/NavigationBar/composables/useNavigationSelectorEntry.ts
@@ -9,6 +9,7 @@ import { useMessageInputStateStore } from '/@/store/ui/messageInputStateStore'
 import { useAudioController } from '/@/store/ui/audioController'
 import { useChannelsStore } from '/@/store/entities/channels'
 import { useSubscriptionStore } from '/@/store/domain/subscription'
+import { useQall } from '/@/composables/qall/useQall'
 
 export type NavigationSelectorEntry = {
   type: NavigationItemType
@@ -82,6 +83,7 @@ const useNavigationSelectorEntry = () => {
   const { channelsMap, dmChannelsMap } = useChannelsStore()
   const { hasInputChannel } = useMessageInputStateStore()
   const { fileId } = useAudioController()
+  const { callingChannel } = useQall()
 
   const unreadChannels = computed(() => [...unreadChannelsMap.value.values()])
   const notificationState = reactive({
@@ -94,11 +96,9 @@ const useNavigationSelectorEntry = () => {
   })
   const entries = computed(() => createItems(notificationState))
 
-  const hasActiveQallSession = computed(() => false) // TODO: Qall
+  const hasActiveQallSession = computed(() => !!callingChannel.value)
   const ephemeralEntries = computed(() =>
     [
-      // TODO: Qall
-      // 適切な変数を置く
       hasActiveQallSession.value ? ephemeralItems.qallController : undefined,
       hasInputChannel.value ? ephemeralItems.draftList : undefined,
       fileId.value ? ephemeralItems.audioController : undefined
diff --git a/src/composables/qall/useQall.ts b/src/composables/qall/useQall.ts
index d3ac87c1d..d91a414f7 100644
--- a/src/composables/qall/useQall.ts
+++ b/src/composables/qall/useQall.ts
@@ -4,13 +4,28 @@ import { useMeStore } from '/@/store/domain/me'
 import { useToastStore } from '/@/store/ui/toast'
 import type { LocalAudioTrack, LocalVideoTrack } from 'livekit-client'
 import AutoReconnectWebSocket from '/@/lib/websocket/AutoReconnectWebSocket'
+import type { Channel, User } from '@traptitech/traq'
+import { useChannelsStore } from '/@/store/entities/channels'
+import { useUsersStore } from '/@/store/entities/users'
+import { messageMitt } from '/@/store/entities/messages'
+import { useTts } from '/@/store/app/tts'
+import { useRtcSettings } from '/@/store/app/rtcSettings'
 
-type RoomWithParticipants = {
-  roomId: string
-  participants: { identity: string; joinedAt: string }[]
-}[]
+type RoomsWithParticipants =
+  | {
+      roomId: string
+      participants: { identity: string; joinedAt: string }[] | null
+    }[]
+  | null
 
-const roomWithParticipants = ref<RoomWithParticipants>([])
+type Participant = { user: User; joinedAt: string }
+type Room = {
+  channel: Channel
+  participants: Participant[]
+}
+type Rooms = Room[]
+
+const rooms = ref<Rooms>([])
 const callingChannel = ref('')
 
 const {
@@ -27,7 +42,34 @@ const {
 } = useLiveKitSDK()
 const { myId } = useMeStore()
 const { addErrorToast } = useToastStore()
+const { channelsMap } = useChannelsStore()
+const { findUserByName, usersMap } = useUsersStore()
+const { addQueue } = useTts()
+
+const meStore = useMeStore()
+const rtcSettings = useRtcSettings()
 
+const purifyRoomData = (data: RoomsWithParticipants): Rooms => {
+  if (!data) return []
+  return data
+    .filter(room => room.participants)
+    .map(room => {
+      return {
+        channel: channelsMap.value.get(room.roomId),
+        participants:
+          room.participants
+            ?.map(p => ({
+              joinedAt: p.joinedAt,
+              user: findUserByName(p.identity.slice(0, -37))
+            }))
+            .filter((p): p is Participant => !!p.user) ?? []
+      }
+    })
+    .filter((room): room is Room => {
+      if (!room.channel) return false
+      return !room.channel.archived
+    })
+}
 const ws = new AutoReconnectWebSocket(
   'wss://qall-microservice-for-livekit.trap.show/api/ws',
   undefined,
@@ -39,9 +81,8 @@ const ws = new AutoReconnectWebSocket(
 ws.connect()
 ws.addEventListener('message', event => {
   try {
-    const data: RoomWithParticipants = JSON.parse(event.detail as string)
-    roomWithParticipants.value = data
-    console.log(data)
+    const data: RoomsWithParticipants = JSON.parse(event.detail as string)
+    rooms.value = purifyRoomData(data)
   } catch (e) {
     // eslint-disable-next-line no-console
     console.warn('[WebSocket] Failed to parse: ', e)
@@ -52,9 +93,8 @@ fetch('https://qall-microservice-for-livekit.trap.show/api/rooms').then(res => {
   res
     .json()
     .then(data => {
-      console.log(data)
       if (!data) return
-      roomWithParticipants.value = data
+      rooms.value = purifyRoomData(data)
     })
     .catch(e => {
       // eslint-disable-next-line no-console
@@ -70,6 +110,20 @@ const setVideoMute = (track: LocalVideoTrack, muted: boolean) => {
   setLocalTrackMute(track, muted)
 }
 
+messageMitt.on('addMessage', ({ message }) => {
+  if (!rtcSettings.isTtsEnabled.value) return
+  if (callingChannel.value !== message.channelId) return
+  if (meStore.myId.value === message.userId) return
+
+  const userDisplayName =
+    usersMap.value.get(message.userId)?.displayName ?? 'はてな'
+  addQueue({
+    channelId: message.channelId,
+    userDisplayName,
+    text: message.content
+  })
+})
+
 export const useQall = () => {
   const joinQall = (channelName: string) => {
     if (callingChannel.value) {
@@ -89,13 +143,14 @@ export const useQall = () => {
   }
   return {
     callingChannel,
-    roomWithParticipants,
+    rooms,
     joinQall,
     leaveQall,
     addScreenShareTrack,
     addCameraTrack,
     removeVideoTrack,
     publishData,
+    setSpeakerMute,
     tracksMap,
     screenShareTrackSidMap,
     qallMitt
diff --git a/src/store/app/tts.ts b/src/store/app/tts.ts
index e33556095..414a8cfc3 100644
--- a/src/store/app/tts.ts
+++ b/src/store/app/tts.ts
@@ -23,9 +23,6 @@ const MAX_CHAR_COUNT = 140
 
 const useTtsPinia = defineStore('ui/tts', () => {
   const rtcSettings = useRtcSettings()
-  const meStore = useMeStore()
-  const usersStore = useUsersStore()
-
   let lastSpeachPromise = Promise.resolve()
   const queue: Speach[] = []
 
@@ -37,18 +34,6 @@ const useTtsPinia = defineStore('ui/tts', () => {
     })
   }
 
-  messageMitt.on('addMessage', ({ message }) => {
-    if (meStore.myId.value === message.userId) return
-
-    const userDisplayName =
-      usersStore.usersMap.value.get(message.userId)?.displayName ?? 'はてな'
-    addQueue({
-      channelId: message.channelId,
-      userDisplayName,
-      text: message.content
-    })
-  })
-
   // タブ閉じたときには止める
   window.addEventListener('pagehide', () => {
     stop()
@@ -71,12 +56,6 @@ const useTtsPinia = defineStore('ui/tts', () => {
     return defaultRate * Math.min(Math.max(ratio, 1), MAX_SPEED_RATIO)
   }
 
-  const isNeeded = (channelId: ChannelId): boolean => {
-    // TODO: Qall
-    if (!rtcSettings.isTtsEnabled.value) return false
-    return true
-  }
-
   const createUtter = (text: string): SpeechSynthesisUtterance => {
     const utter = new SpeechSynthesisUtterance(text)
     const voice = speechSynthesis
@@ -92,9 +71,8 @@ const useTtsPinia = defineStore('ui/tts', () => {
     return utter
   }
 
-  const speak = async ({ channelId, userDisplayName, text }: Speach) => {
-    if (!isNeeded(channelId)) return
-
+  const speak = async ({ userDisplayName, text }: Speach) => {
+    console.log('speak', text)
     const tokens = await parse(text)
     let formatedText = format(tokens, embeddingOrigin)
 
@@ -128,7 +106,7 @@ const useTtsPinia = defineStore('ui/tts', () => {
     }
   })
 
-  return {}
+  return { addQueue }
 })
 
 export const useTts = convertToRefsStore(useTtsPinia)

From a647bcad97d39afc7edb00cb6218136fdc72eb82 Mon Sep 17 00:00:00 2001
From: nokhnaton <sage_of_forest@icloud.com>
Date: Fri, 24 Jan 2025 22:26:17 +0900
Subject: [PATCH 4/5] =?UTF-8?q?Qall=E3=82=92=E5=A7=8B=E3=82=81=E3=82=8B?=
 =?UTF-8?q?=E3=83=9C=E3=82=BF=E3=83=B3=E3=81=AE=E5=AE=9F=E8=A3=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ChannelHeader/ChannelHeaderToolsList.vue       | 14 +++++++-------
 .../ChannelHeader/ChannelHeaderToolsMenu.vue       | 12 ++++++------
 .../ChannelList/ChannelElementName.vue             |  7 ++++++-
 3 files changed, 19 insertions(+), 14 deletions(-)

diff --git a/src/components/Main/MainView/ChannelView/ChannelHeader/ChannelHeaderToolsList.vue b/src/components/Main/MainView/ChannelView/ChannelHeader/ChannelHeaderToolsList.vue
index 11b18206e..e7fe77bc3 100644
--- a/src/components/Main/MainView/ChannelView/ChannelHeader/ChannelHeaderToolsList.vue
+++ b/src/components/Main/MainView/ChannelView/ChannelHeader/ChannelHeaderToolsList.vue
@@ -1,16 +1,14 @@
 <template>
   <div :class="$style.container">
     <template v-if="!isMobile">
-      <!-- TODO:Qall -->
-      <!-- 元々はデフォルト値ではなくUseQallの関数で計算していた -->
       <header-tools-item
         v-if="true"
         icon-mdi
-        :icon-name="'phone'"
+        :icon-name="isCallingHere ? 'phone' : 'phone-outline'"
         :class="$style.qallIcon"
-        :disabled="false"
-        :data-is-active="$boolAttr(true)"
-        :data-is-joined="$boolAttr(true)"
+        :disabled="disabled"
+        :data-is-active="$boolAttr(isCallingHere)"
+        :data-is-joined="$boolAttr(isCallingHere)"
         :tooltip="'Qallボタン'"
         @click="joinQall(props.channelId)"
       />
@@ -80,7 +78,9 @@ const emit = defineEmits<{
 
 const { isMobile } = useResponsiveStore()
 
-const { joinQall } = useQall()
+const { joinQall, callingChannel } = useQall()
+const isCallingHere = computed(() => callingChannel.value === props.channelId)
+const disabled = computed(() => !!callingChannel.value && !isCallingHere.value)
 
 const { changeToNextSubscriptionLevel, currentChannelSubscription } =
   useChannelSubscriptionState(toRef(props, 'channelId'))
diff --git a/src/components/Main/MainView/ChannelView/ChannelHeader/ChannelHeaderToolsMenu.vue b/src/components/Main/MainView/ChannelView/ChannelHeader/ChannelHeaderToolsMenu.vue
index d84a3c7d5..6a6fde705 100644
--- a/src/components/Main/MainView/ChannelView/ChannelHeader/ChannelHeaderToolsMenu.vue
+++ b/src/components/Main/MainView/ChannelView/ChannelHeader/ChannelHeaderToolsMenu.vue
@@ -1,15 +1,13 @@
 <template>
   <primary-view-header-popup-frame>
-    <!-- TODO:Qall -->
-    <!-- 元々はデフォルト値ではなくUseQallの関数で計算していた -->
     <header-tools-menu-item
       v-if="isMobile"
-      :icon-name="'phone'"
+      :icon-name="isCallingHere ? 'phone' : 'phone-outline'"
       icon-mdi
       :class="$style.qallIcon"
       :label="'Qallを開始'"
-      :disabled="false"
-      :data-is-active="$boolAttr(true)"
+      :disabled="disabled"
+      :data-is-active="$boolAttr(isCallingHere)"
       @click="joinQall(props.channelId)"
       @click-item="emit('clickItem')"
     />
@@ -86,7 +84,9 @@ const props = withDefaults(
 
 const { isMobile } = useResponsiveStore()
 
-const { joinQall } = useQall()
+const { joinQall, callingChannel } = useQall()
+const isCallingHere = computed(() => callingChannel.value === props.channelId)
+const disabled = computed(() => !!callingChannel.value && !isCallingHere.value)
 
 const { isChildChannelCreatable, openChannelCreateModal } =
   useChannelCreateModal(props)
diff --git a/src/components/Main/NavigationBar/ChannelList/ChannelElementName.vue b/src/components/Main/NavigationBar/ChannelList/ChannelElementName.vue
index 092b43314..cb6af01a3 100644
--- a/src/components/Main/NavigationBar/ChannelList/ChannelElementName.vue
+++ b/src/components/Main/NavigationBar/ChannelList/ChannelElementName.vue
@@ -28,6 +28,7 @@ import type { TypedProps } from './composables/usePath'
 import { usePath } from './composables/usePath'
 import AIcon from '/@/components/UI/AIcon.vue'
 import UserIconEllipsisList from '/@/components/UI/UserIconEllipsisList.vue'
+import { useQall } from '/@/composables/qall/useQall'
 
 const props = withDefaults(
   defineProps<{
@@ -43,7 +44,11 @@ const props = withDefaults(
 const typedProps = props as TypedProps
 
 const { pathToShow, pathTooltip } = usePath(typedProps)
-const qallUserIds: string[] = []
+const { rooms } = useQall()
+const qallUserIds: string[] =
+  rooms.value
+    .find(room => room.channel.id === props.channel.id)
+    ?.participants.map(participant => participant.user.id) ?? []
 </script>
 
 <style lang="scss" module>

From 93c69b768bd4842e8c4bfe38d72958009fab881d Mon Sep 17 00:00:00 2001
From: nokhnaton <sage_of_forest@icloud.com>
Date: Fri, 24 Jan 2025 22:32:01 +0900
Subject: [PATCH 5/5] delete Qall Controller

---
 .../QallController/QallControlPanel.vue       | 115 ---------------
 .../QallController/QallController.vue         |  39 -----
 .../QallController/QallDetailsPanel.vue       |  60 --------
 .../QallController/QallDetailsPanelUser.vue   | 138 ------------------
 4 files changed, 352 deletions(-)
 delete mode 100644 src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallControlPanel.vue
 delete mode 100644 src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallController.vue
 delete mode 100644 src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanel.vue
 delete mode 100644 src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanelUser.vue

diff --git a/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallControlPanel.vue b/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallControlPanel.vue
deleted file mode 100644
index 4966b8a23..000000000
--- a/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallControlPanel.vue
+++ /dev/null
@@ -1,115 +0,0 @@
-<template>
-  <div :class="$style.container">
-    <button :class="$style.top" @click="emit('topToggleClick')">
-      <a-icon name="phone" mdi />
-    </button>
-    <div :class="$style.info">
-      <div :class="$style.status">
-        {{ status }}
-      </div>
-      <router-link :to="channelLink" :class="$style.channelName">
-        #{{ channelName }}
-      </router-link>
-    </div>
-    <button
-      :class="$style.mic"
-      :data-is-mute="$boolAttr(isMicMuted)"
-      @click="emit('micClick')"
-    >
-      <a-icon :name="micIconName" mdi />
-    </button>
-    <button :class="$style.end" @click="emit('endQallClick')">
-      <a-icon name="phone-hangup" mdi />
-    </button>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import AIcon from '/@/components/UI/AIcon.vue'
-import { computed } from 'vue'
-import useChannelPath from '/@/composables/useChannelPath'
-
-const props = withDefaults(
-  defineProps<{
-    status?: string
-    channelId: string
-    isMicMuted?: boolean
-  }>(),
-  {
-    status: '',
-    isMicMuted: false
-  }
-)
-
-const emit = defineEmits<{
-  (e: 'topToggleClick'): void
-  (e: 'micClick'): void
-  (e: 'endQallClick'): void
-}>()
-
-const { channelIdToShortPathString, channelIdToLink } = useChannelPath()
-const channelName = computed(() => channelIdToShortPathString(props.channelId))
-const channelLink = computed(() => channelIdToLink(props.channelId))
-
-const micIconName = computed(() =>
-  props.isMicMuted ? 'microphone-off' : 'microphone'
-)
-</script>
-
-<style lang="scss" module>
-.container {
-  @include color-ui-secondary;
-  display: grid;
-  grid-template:
-    'top info mic end' 1fr
-    / 24px 1fr 24px 24px;
-  column-gap: 12px;
-  width: 100%;
-  padding: 12px;
-  align-items: center;
-  border-top: {
-    style: solid;
-    width: 2px;
-    color: $theme-background-secondary-border;
-  }
-}
-.top,
-.mic,
-.end {
-  color: inherit;
-  cursor: pointer;
-}
-.top {
-  grid-area: top;
-}
-.info {
-  grid-area: info;
-  display: flex;
-  flex-direction: column;
-  min-width: 0;
-}
-.mic {
-  @include color-ui-secondary;
-  grid-area: mic;
-  &[data-is-mute] {
-    color: $common-ui-muted;
-  }
-}
-.end {
-  grid-area: end;
-}
-.status {
-  font: {
-    size: 0.875rem;
-    weight: bold;
-  }
-  user-select: none;
-}
-.channelName {
-  @include size-caption;
-  width: 100%;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-</style>
diff --git a/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallController.vue b/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallController.vue
deleted file mode 100644
index 9da2db7e3..000000000
--- a/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallController.vue
+++ /dev/null
@@ -1,39 +0,0 @@
-<template>
-  <div v-if="currentChannel">
-    <qall-details-panel />
-    <qall-control-panel
-      :status="status"
-      :channel-id="currentChannel"
-      :is-mic-muted="isMicMuted"
-      @end-qall-click="leaveQall"
-      @mic-click="onMicClick"
-    />
-  </div>
-</template>
-
-<script lang="ts" setup>
-import QallControlPanel from './QallControlPanel.vue'
-import QallDetailsPanel from './QallDetailsPanel.vue'
-import { computed, ref } from 'vue'
-import { useQall } from '/@/composables/qall/useQall'
-
-const { leaveQall } = useQall()
-
-// TODO: Qall
-const currentChannel = ref(undefined)
-const isMicMuted = ref(false)
-const unmute = () => {
-  isMicMuted.value = false
-}
-const mute = () => {
-  isMicMuted.value = true
-}
-const onMicClick = () => {
-  if (isMicMuted.value) {
-    unmute()
-  } else {
-    mute()
-  }
-}
-const status = computed(() => '通話中')
-</script>
diff --git a/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanel.vue b/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanel.vue
deleted file mode 100644
index e26781e05..000000000
--- a/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanel.vue
+++ /dev/null
@@ -1,60 +0,0 @@
-<template>
-  <collapse-content>
-    <!-- TODO: Qall -->
-    <!-- hasIdの部分など -->
-    <qall-details-panel-user
-      v-if="myId"
-      :key="myId"
-      :class="$style.slider"
-      :user-id="myId"
-      :mic-muted="hasId"
-      :show-tune-button="!isVolumeTuneShown"
-      :show-tune-done-button="isVolumeTuneShown"
-      disabled
-      @tune="showVolumeTune"
-      @tune-done="hideVolumeTune"
-    />
-    <qall-details-panel-user
-      v-for="id in users"
-      :key="id"
-      :class="$style.slider"
-      :user-id="id"
-      :mic-muted="hasId"
-      :show-volume-control="isVolumeTuneShown"
-    />
-  </collapse-content>
-</template>
-
-<script lang="ts" setup>
-import QallDetailsPanelUser from './QallDetailsPanelUser.vue'
-import CollapseContent from '../CollapseContent.vue'
-import { computed } from 'vue'
-import { useMeStore } from '/@/store/domain/me'
-import useToggle from '/@/composables/utils/useToggle'
-
-const { myId } = useMeStore()
-
-const hasId = computed(() => false)
-
-const {
-  value: isVolumeTuneShown,
-  open: showVolumeTune,
-  close: hideVolumeTune
-} = useToggle()
-
-// TODO: Qall
-
-const users = []
-</script>
-
-<style lang="scss" module>
-.slider {
-  margin: 12px 0;
-  &:first-child {
-    margin-top: 0;
-  }
-  &:last-child {
-    margin-bottom: 0;
-  }
-}
-</style>
diff --git a/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanelUser.vue b/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanelUser.vue
deleted file mode 100644
index adf5578aa..000000000
--- a/src/components/Main/NavigationBar/EphemeralNavigationContent/QallController/QallDetailsPanelUser.vue
+++ /dev/null
@@ -1,138 +0,0 @@
-<template>
-  <div :class="$style.container">
-    <div :class="$style.userIcon" :data-talking-level="talkingLevel">
-      <user-icon :user-id="userId" :size="24" />
-    </div>
-    <div :class="$style.userDesc">
-      <a-slider
-        v-if="showVolumeControl"
-        v-model="volume"
-        :min="0"
-        :max="200"
-        tooltip-formatter="{value}%"
-        :disabled="disabled || volume === undefined"
-        :tooltip="disabled ? 'none' : 'active'"
-      />
-      <span v-else :class="$style.userName">{{ userName }}</span>
-    </div>
-    <button v-if="showTuneButton" :class="$style.button" @click="emit('tune')">
-      <a-icon mdi name="tune" :size="16" />
-    </button>
-    <button
-      v-else-if="showTuneDoneButton"
-      :class="[$style.button, $style.tuneDone]"
-      @click="emit('tuneDone')"
-    >
-      <a-icon mdi name="check" :size="16" />
-    </button>
-    <div v-else-if="micMuted" :class="$style.icon">
-      <a-icon mdi name="microphone-off" :size="16" />
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-// TODO: Qall
-import { computed } from 'vue'
-import type { UserId } from '/@/types/entity-ids'
-import { useUsersStore } from '/@/store/entities/users'
-import ASlider from '/@/components/UI/ASlider.vue'
-import UserIcon from '/@/components/UI/UserIcon.vue'
-import AIcon from '/@/components/UI/AIcon.vue'
-
-const props = withDefaults(
-  defineProps<{
-    userId: UserId
-    showVolumeControl?: boolean
-    disabled?: boolean
-    showTuneButton?: boolean
-    showTuneDoneButton?: boolean
-    micMuted?: boolean
-  }>(),
-  {
-    showVolumeControl: false,
-    disabled: false,
-    showTuneButton: false,
-    showTuneDoneButton: false,
-    micMuted: false
-  }
-)
-
-const emit = defineEmits<{
-  (e: 'tune'): void
-  (e: 'tuneDone'): void
-}>()
-
-const maxVolumeValue = 200
-
-const { usersMap } = useUsersStore()
-// TODO: Qall
-const volume = 0
-
-const userName = computed(
-  () => usersMap.value.get(props.userId)?.displayName ?? ''
-)
-const talkingLevel = 0
-</script>
-
-<style lang="scss" module>
-.container {
-  display: grid;
-  grid-template-columns: min-content 1fr 16px;
-  column-gap: 12px;
-  align-items: center;
-}
-.userIcon {
-  margin: 4px;
-  border: {
-    style: solid;
-    color: $common-ui-qall;
-    width: 0;
-    radius: 50%;
-  }
-  &[data-talking-level='1'] {
-    margin: 3px;
-    border-width: 1px;
-  }
-  &[data-talking-level='2'] {
-    margin: 2px;
-    border-width: 2px;
-  }
-  &[data-talking-level='3'] {
-    margin: 1px;
-    border-width: 3px;
-  }
-  &[data-talking-level='4'] {
-    margin: 0;
-    border-width: 4px;
-  }
-}
-.icon {
-  @include color-ui-secondary-inactive;
-  height: 20px;
-}
-.button {
-  @include color-ui-secondary-inactive;
-  height: 20px;
-  cursor: pointer;
-  &:hover {
-    @include color-ui-secondary;
-  }
-}
-.tuneDone {
-  @include color-accent-primary;
-}
-.userDesc {
-  min-width: 0;
-}
-.userName {
-  @include color-ui-secondary;
-  @include size-body2;
-  display: inline-block;
-  width: 100%;
-  vertical-align: middle;
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-}
-</style>