From 28b0229c760e9ec1fe8f3040602b8f53851b7469 Mon Sep 17 00:00:00 2001 From: kharhamel Date: Fri, 27 Nov 2020 14:51:50 +0100 Subject: [PATCH] FIX: disabled pingCameraStatus and reduced the amount of errors thrown in console --- front/src/WebRtc/MediaManager.ts | 13 ++++++------ front/src/WebRtc/SimplePeer.ts | 26 +++++++++++------------- front/src/WebRtc/VideoPeer.ts | 34 +++++++++++--------------------- 3 files changed, 29 insertions(+), 44 deletions(-) diff --git a/front/src/WebRtc/MediaManager.ts b/front/src/WebRtc/MediaManager.ts index 943e13c2..33be1c6a 100644 --- a/front/src/WebRtc/MediaManager.ts +++ b/front/src/WebRtc/MediaManager.ts @@ -109,7 +109,7 @@ export class MediaManager { this.previousConstraint = JSON.parse(JSON.stringify(this.constraintsMedia)); this.pingCameraStatus(); - this.checkActiveUser(); + this.checkActiveUser(); //todo: desactivated in case of bug this.discussionManager = new DiscussionManager(this,''); } @@ -486,7 +486,7 @@ export class MediaManager { if(!element){ return; } - element.classList.add('active') + element.classList.add('active') //todo: why does a method 'disable' add a class 'active'? } enabledMicrophoneByUserId(userId: number){ @@ -494,7 +494,7 @@ export class MediaManager { if(!element){ return; } - element.classList.remove('active') + element.classList.remove('active') //todo: why does a method 'enable' remove a class 'active'? } disabledVideoByUserId(userId: number) { @@ -519,7 +519,7 @@ export class MediaManager { } } - addStreamRemoteVideo(userId: string, stream : MediaStream){ + addStreamRemoteVideo(userId: string, stream : MediaStream): void { const remoteVideo = this.remoteVideo.get(userId); if (remoteVideo === undefined) { throw `Unable to find video for ${userId}`; @@ -686,11 +686,10 @@ export class MediaManager { * Here, every 30 seconds, we are "reseting" the streams and sending again the constraints to the other peers via the data channel again (see SimplePeer::pushVideoToRemoteUser) **/ private pingCameraStatus(){ - setTimeout(() => { + /*setInterval(() => { console.log('ping camera status'); this.triggerUpdatedLocalStreamCallbacks(this.localStream); - this.pingCameraStatus(); - }, 30000); + }, 30000);*/ } public addNewMessage(name: string, message: string, isMe: boolean = false){ diff --git a/front/src/WebRtc/SimplePeer.ts b/front/src/WebRtc/SimplePeer.ts index 195b57b3..1d81b704 100644 --- a/front/src/WebRtc/SimplePeer.ts +++ b/front/src/WebRtc/SimplePeer.ts @@ -1,7 +1,6 @@ import { WebRtcDisconnectMessageInterface, WebRtcSignalReceivedMessageInterface, - WebRtcStartMessageInterface } from "../Connexion/ConnexionModels"; import { mediaManager, @@ -29,7 +28,7 @@ export interface PeerConnectionListener { * This class manages connections to all the peers in the same group as me. */ export class SimplePeer { - private Users: Array = new Array(); + private Users: Array = new Array(); //todo: this array should be fusionned with PeerConnectionArray private PeerScreenSharingConnectionArray: Map = new Map(); private PeerConnectionArray: Map = new Map(); @@ -95,12 +94,9 @@ export class SimplePeer { this.Users.push(user); // Note: the clients array contain the list of all clients (even the ones we are already connected to in case a user joints a group) // So we can receive a request we already had before. (which will abort at the first line of createPeerConnection) - // TODO: refactor this to only send a message to connect to one user (rather than several users). => DONE // This would be symmetrical to the way we handle disconnection. - //console.log('Start message', data); - + //start connection - //this.startWebRtc(); console.log('receiveWebrtcStart. Initiator: ', user.initiator) if(!user.initiator){ return; @@ -204,8 +200,6 @@ export class SimplePeer { /** * This is triggered twice. Once by the server, and once by a remote client disconnecting - * - * @param userId */ private closeConnection(userId : number) { try { @@ -226,6 +220,12 @@ export class SimplePeer { for (const peerConnectionListener of this.peerConnectionListeners) { peerConnectionListener.onDisconnect(userId); } + const userIndex = this.Users.findIndex(user => user.userId === userId); + if(userIndex < 0){ + throw 'Couln\'t delete user'; + } else { + this.Users.splice(userIndex, 1); + } } catch (err) { console.error("closeConnection", err) } @@ -233,8 +233,6 @@ export class SimplePeer { /** * This is triggered twice. Once by the server, and once by a remote client disconnecting - * - * @param userId */ private closeScreenSharingConnection(userId : number) { try { @@ -246,7 +244,6 @@ export class SimplePeer { } // FIXME: I don't understand why "Closing connection with" message is displayed TWICE before "Nb users in peerConnectionArray" // I do understand the method closeConnection is called twice, but I don't understand how they manage to run in parallel. - //console.log('Closing connection with '+userId); peer.destroy(); if(!this.PeerScreenSharingConnectionArray.delete(userId)){ throw 'Couln\'t delete peer screen sharing connexion'; @@ -313,10 +310,6 @@ export class SimplePeer { } } - /** - * - * @param userId - */ private pushVideoToRemoteUser(userId : number) { try { const PeerConnection = this.PeerConnectionArray.get(userId); @@ -331,6 +324,9 @@ export class SimplePeer { } for (const track of localStream.getTracks()) { + //todo: this is a ugly hack to reduce the amount of error in console. Find a better way. + if ((track as any).added !== undefined) continue; // eslint-disable-line @typescript-eslint/no-explicit-any + (track as any).added = true; // eslint-disable-line @typescript-eslint/no-explicit-any PeerConnection.addTrack(track, localStream); } }catch (e) { diff --git a/front/src/WebRtc/VideoPeer.ts b/front/src/WebRtc/VideoPeer.ts index f8bfa3f9..877f4e64 100644 --- a/front/src/WebRtc/VideoPeer.ts +++ b/front/src/WebRtc/VideoPeer.ts @@ -84,22 +84,18 @@ export class VideoPeer extends Peer { console.log("data", message); if(message.type === MESSAGE_TYPE_CONSTRAINT) { - const constraint = message; - if (constraint.audio) { + if (message.audio) { mediaManager.enabledMicrophoneByUserId(this.userId); } else { mediaManager.disabledMicrophoneByUserId(this.userId); } - if (constraint.video || constraint.screen) { + if (message.video || message.screen) { mediaManager.enabledVideoByUserId(this.userId); } else { - this.stream(undefined); mediaManager.disabledVideoByUserId(this.userId); } - } - - if(message.type === 'message') { + } else if(message.type === 'message') { mediaManager.addNewMessage(message.name, message.message); } }); @@ -122,21 +118,15 @@ export class VideoPeer extends Peer { /** * Sends received stream to screen. */ - private stream(stream?: MediaStream) { - //console.log(`VideoPeer::stream => ${this.userId}`, stream); - if(!stream){ - mediaManager.disabledVideoByUserId(this.userId); - mediaManager.disabledMicrophoneByUserId(this.userId); - } else { - try { - mediaManager.addStreamRemoteVideo("" + this.userId, stream); - }catch (err){ - console.error(err); - //Force add streem video - setTimeout(() => { - this.stream(stream); - }, 500); - } + private stream(stream: MediaStream) { + try { + mediaManager.addStreamRemoteVideo("" + this.userId, stream); + }catch (err){ + console.error(err); + //Force add streem video + /*setTimeout(() => { + this.stream(stream); + }, 500);*/ //todo: find a way to prevent infinite regression. } }