Revert "feat(webrtc): restored with iridium (#4188)" (#4206)

This reverts commit 8ca3a03.
Satellite-im · Aug 12, 2022 · be226ef · be226ef
1 parent cb065fd
commit be226ef
Show file tree

Hide file tree

Showing 96 changed files with 4,161 additions and 2,608 deletions.
diff --git a/components/ui/BackgroundCall/BackgroundCall.html b/components/ui/BackgroundCall/BackgroundCall.html
@@ -2,11 +2,4 @@
   {{$t('ui.background_call')}}&nbsp;
   <span v-if="caller" class="background-call-name">{{caller.name}}</span>&nbsp;
   <span v-if="elapsedTime">- {{elapsedTime}}</span>
-  <div v-if="!audio.deafened && audioStream" class="audio-stream-container">
-    <audio
-      :id="`audio-stream-${audioStream.id}`"
-      :src-object.prop="audioStream"
-      autoplay
-    />
-  </div>
 </div>
diff --git a/components/ui/BackgroundCall/BackgroundCall.vue b/components/ui/BackgroundCall/BackgroundCall.vue
@@ -3,88 +3,24 @@
 <script lang="ts">
 import Vue from 'vue'
 import { mapState } from 'vuex'
-import dayjs from 'dayjs'
+import { Friend } from '~/types/ui/friends'
 import { RootState } from '~/types/store/store'
-import iridium from '~/libraries/Iridium/IridiumManager'
-import { Call, CallPeerStreams } from '~/libraries/WebRTC/Call'
-import { $WebRTC } from '~/libraries/WebRTC/WebRTC'
 
 export default Vue.extend({
-  data() {
-    return {
-      caller: null,
-      webrtc: iridium.webRTC.state,
-      interval: null,
-      elapsedTime: '',
-    }
-  },
   computed: {
     ...mapState({
       friends: (state) => (state as RootState).friends.all,
-      audio: (state) => (state as RootState).audio,
+      elapsedTime: (state) => (state as RootState).webrtc.elapsedTime,
+      activeCall: (state) => (state as RootState).webrtc.activeCall,
     }),
-    activeCall() {
-      return this.webrtc.activeCall
-    },
-    createdAt() {
-      return this.webrtc.createdAt
-    },
-    audioMuted() {
-      return (
-        (iridium.connector?.id &&
-          this.webrtc.streamMuted[iridium.connector?.id]?.audio) ??
-        false
-      )
-    },
-    call() {
-      return (
-        iridium.connector?.id &&
-        this.webrtc.activeCall?.callId &&
-        $WebRTC.getCall(this.webrtc.activeCall.callId)
-      )
-    },
-    streams() {
-      return (
-        this.call &&
-        iridium.connector?.id &&
-        (this.call as Call).streams[iridium.connector?.id]
-      )
-    },
-    audioStream() {
-      return (
-        this.call &&
-        !this.audioMuted &&
-        (this.streams as CallPeerStreams)?.audio
+    caller(): Friend | undefined {
+      return this.friends.find(
+        (f: Friend) => f.peerId === this.activeCall?.peerId,
       )
     },
   },
-  watch: {
-    createdAt() {
-      this.startInterval()
-    },
-  },
-  beforeDestroy() {
-    if (this.interval) {
-      clearInterval(this.interval)
-    }
-  },
-  mounted() {
-    this.startInterval()
-
-    const id = this.activeCall?.callId
-
-    if (!id || !iridium.chat?.hasConversation(id)) {
-      return
-    }
-
-    const conversation = iridium.chat?.getConversation(id)
-
-    this.caller = conversation?.participants.find((participant) => {
-      return participant.did !== iridium.connector?.id
-    })
-  },
   methods: {
-    async navigateToActiveConversation() {
+    navigateToActiveConversation() {
       if (!this.caller) {
         return
       }
@@ -94,27 +30,14 @@ export default Vue.extend({
         this.$store.commit('ui/showSidebar', false)
       }
 
-      const id = await iridium.chat?.directConversationIdFromDid(
-        this.caller.did,
-      )
-
-      if (!id || !(await iridium.chat?.hasConversation(id))) {
-        return
-      }
+      this.$store.dispatch('conversation/setConversation', {
+        id: this.caller.peerId,
+        type: 'friend',
+        participants: [this.caller],
+        calling: false,
+      })
 
-      this.$router.push(`/chat/${id}`)
-    },
-    startInterval() {
-      if (!this.interval && this.createdAt && this.activeCall) {
-        this.interval = setInterval(this.updateElapsedTime, 1000)
-      }
-    },
-    updateElapsedTime() {
-      const duration = dayjs.duration(Date.now() - this.createdAt)
-      const hours = duration.hours()
-      this.elapsedTime = `${hours > 0 ? hours + ':' : ''}${duration.format(
-        'mm:ss',
-      )}`
+      this.$router.push(`/chat/direct/${this.caller.address}`)
     },
   },
 })

diff --git a/components/ui/Chat/TypingIndicator/TypingIndicator.vue b/components/ui/Chat/TypingIndicator/TypingIndicator.vue
@@ -2,27 +2,12 @@
 
 <script lang="ts">
 import Vue from 'vue'
-import { ConversationParticipant } from '~/libraries/Iridium/chat/types'
-import iridium from '~/libraries/Iridium/IridiumManager'
-
+import { mapGetters } from 'vuex'
+import { ConversationParticipant } from '~/store/conversation/types'
 export default Vue.extend({
-  data() {
-    return {
-      chat: iridium.chat,
-    }
-  },
   computed: {
-    typingParticipants() {
-      const conversationId = this.$route.params.id
-      if (!conversationId) {
-        return
-      }
-      return this.chat.getTypingParticipants(conversationId)
-    },
+    ...mapGetters('conversation', ['typingParticipants']),
     text(): string {
-      if (!this.typingParticipants.length) {
-        return ''
-      }
       return this.$tc('messaging.typing', this.typingParticipants.length, {
         user: this.typingParticipants
           .map((p: ConversationParticipant) => p.name)

diff --git a/components/ui/Global/Global.html b/components/ui/Global/Global.html
@@ -26,7 +26,7 @@
         :set-close-timeout="5000"
       />
     </UiModal> -->
-    <UiModal v-if="incomingCall">
+    <UiModal v-if="webrtc.incomingCall">
       <MediaIncomingCall :accept-call="acceptCall" :deny-call="denyCall" />
     </UiModal>
     <UiModal
@@ -82,7 +82,4 @@
     <InteractablesQuickProfile v-if="ui.quickProfile" :user="ui.quickProfile" />
   </transition>
   <UiBackgroundCall v-if="showBackgroundCall" />
-  <UiPip v-if="showBackgroundCall" v-slot="{ dragging }">
-    <PreviewCall :dragging="dragging" />
-  </UiPip>
 </div>
diff --git a/components/ui/Global/Global.vue b/components/ui/Global/Global.vue
@@ -1,11 +1,12 @@
 <template src="./Global.html"></template>
 <script lang="ts">
 import Vue from 'vue'
-import { mapState } from 'vuex'
+import { mapGetters, mapState } from 'vuex'
 import { TrackKind } from '~/libraries/WebRTC/types'
 import { ModalWindows } from '~/store/ui/types'
+import { $WebRTC } from '~/libraries/WebRTC/WebRTC'
+import { Friend } from '~/types/ui/friends'
 import iridium from '~/libraries/Iridium/IridiumManager'
-import PreviewCall from '~/components/views/media/previewCall/PreviewCall.vue'
 
 declare module 'vue/types/vue' {
   interface Vue {
@@ -15,28 +16,15 @@ declare module 'vue/types/vue' {
 
 export default Vue.extend({
   name: 'Global',
-  components: {
-    PreviewCall,
-  },
-  data() {
-    return {
-      webrtc: iridium.webRTC,
-    }
-  },
   computed: {
-    ...mapState(['ui', 'media', 'conversation', 'files']),
+    ...mapState(['ui', 'media', 'webrtc', 'conversation', 'files']),
+    ...mapGetters('webrtc', ['isBackgroundCall', 'isActiveCall']),
     ModalWindows: () => ModalWindows,
-    incomingCall() {
-      return this.webrtc.state.incomingCall
-    },
     showBackgroundCall(): boolean {
       if (!this.$device.isMobile) {
-        return this.webrtc.isBackgroundCall
+        return this.isBackgroundCall
       }
-      return (
-        this.webrtc.isBackgroundCall ||
-        (this.webrtc.isActiveCall && this.ui.showSidebar)
-      )
+      return this.isBackgroundCall || (this.isActiveCall && this.ui.showSidebar)
     },
   },
   mounted() {
@@ -88,22 +76,37 @@ export default Vue.extend({
      * @example
      */
     async acceptCall(kinds: TrackKind[]) {
+      this.$store.commit('webrtc/setStreamMuted', {
+        did: iridium.connector?.peerId,
+        audio: true,
+        video: true,
+        screen: true,
+      })
+      const { callId, peerId } = this.webrtc.incomingCall
+      const call = $WebRTC.getCall(callId)
+      if (!call) {
+        return
+      }
+
+      const redirectId =
+        this.webrtc.incomingCall.type === 'group'
+          ? `groups/${callId}`
+          : `direct/${
+              this.$store.state.friends.all.find(
+                (f: Friend) => f.peerId === peerId,
+              )?.address || 'error'
+            }`
+
       try {
-        await this.webrtc.acceptCall(kinds)
+        await call.createLocalTracks(kinds)
+        await call.answer(peerId)
       } catch (error) {
         if (error instanceof Error) {
           this.$toast.error(this.$t(error.message) as string)
         }
       }
 
-      const callId = this.webrtc.state.activeCall?.callId
-
-      if (!callId) {
-        return
-      }
-
-      const callingPath = `/chat/${callId}`
-
+      const callingPath = `/chat/${redirectId}`
       if (this.$route.path !== callingPath) {
         this.$router.push(callingPath)
       }
@@ -115,16 +118,17 @@ export default Vue.extend({
      */
     denyCall() {
       this.$store.commit('ui/fullscreen', false)
-      this.webrtc.denyCall()
+      this.$store.dispatch('webrtc/denyCall')
     },
     /**
      * @method hangUp
      * @description Hangs up active call
      * @example
      */
     hangUp() {
+      this.$store.commit('webrtc/setIncomingCall', undefined, { root: true })
       this.$store.commit('ui/fullscreen', false)
-      this.webrtc.hangUp()
+      this.$store.dispatch('webrtc/hangUp')
     },
   },
 })

diff --git a/components/ui/Loaders/ScaleLoader/ScaleLoader.vue b/components/ui/Loaders/ScaleLoader/ScaleLoader.vue