diff --git a/frontend/src/ChatVideo.vue b/frontend/src/ChatVideo.vue index 2954f462..cee8c5c4 100644 --- a/frontend/src/ChatVideo.vue +++ b/frontend/src/ChatVideo.vue @@ -93,6 +93,8 @@ export default { presenterVideoMute: false, presenterAudioMute: true, showControls: true, + localTrackDrawn: false, + localTrackCreatedAndPublished: false, } }, methods: { @@ -218,10 +220,15 @@ export default { return } finally { if (localVideoProperties) { - this.chatStore.initializingVideoCall = false; + this.localTrackDrawn = true; + this.updateInitializingVideoCall(); } } }, + updateInitializingVideoCall() { + // because of possibly 2 local tracks (audio + video) we wait for localTrackCreatedAndPublished too + this.chatStore.initializingVideoCall = !(this.localTrackDrawn && this.localTrackCreatedAndPublished); + }, getPresenterPriority(pub, isSpeaking) { if (!pub) { return -1 @@ -427,11 +434,14 @@ export default { } }, - async tryRestartVideoDevice() { - this.inRestarting = true; + async stopLocalTracks() { for (const publication of this.room.localParticipant.getTrackPublications().values()) { await this.room.localParticipant.unpublishTrack(publication.track, true); } + }, + async tryRestartVideoDevice() { + this.inRestarting = true; + await this.stopLocalTracks(); await this.createLocalMediaTracks(getStoredCallVideoDeviceId(), getStoredCallAudioDeviceId()); bus.emit(VIDEO_PARAMETERS_CHANGED); this.inRestarting = false; @@ -645,6 +655,9 @@ export default { } console.info("Published track sid=", track.sid, " kind=", track.kind); } + this.localTrackCreatedAndPublished = true; + this.updateInitializingVideoCall(); + return Promise.resolve(true); } catch (e) { this.setError(e, "Error during publishing local tracks"); this.chatStore.initializingVideoCall = false; @@ -975,7 +988,7 @@ export default { this.startRoom(enterResponse.data.token); }, - beforeUnmount() { + async beforeUnmount() { axios.put(`/api/video/${this.chatId}/dial/exit`, null, { params: { tokenId: this.chatStore.videoTokenId @@ -984,13 +997,15 @@ export default { this.detachPresenter(); - this.stopRoom().then(()=>{ - console.log("Cleaning videoContainerDiv"); - this.videoContainerDiv = null; - this.inRestarting = false; - }); + await this.stopLocalTracks(); + await this.stopRoom(); + console.log("Cleaning videoContainerDiv"); + this.videoContainerDiv = null; + this.inRestarting = false; this.chatStore.canShowMicrophoneButton = false; + this.localTrackDrawn = false; + this.localTrackCreatedAndPublished = false; if (!this.isMobile()) { this.chatStore.showDrawer = this.chatStore.showDrawerPrevious;