Merge pull request #1092 from thecodingmachine/cleaning_mediamanager

MediaManager cleanup

front/src/WebRtc/MediaManager.ts

@@ -8,33 +8,11 @@ import {SoundMeter} from "../Phaser/Components/SoundMeter";
 import {DISABLE_NOTIFICATIONS} from "../Enum/EnvironmentVariable";
 import {
     gameOverlayVisibilityStore, localStreamStore,
-    mediaStreamConstraintsStore,
-    requestedCameraState,
-    requestedMicrophoneState
 } from "../Stores/MediaStore";
 import {
-    requestedScreenSharingState,
-    screenSharingAvailableStore,
     screenSharingLocalStreamStore
 } from "../Stores/ScreenSharingStore";
 
-declare const navigator:any; // eslint-disable-line @typescript-eslint/no-explicit-any
-
-const videoConstraint: boolean|MediaTrackConstraints = {
-    width: { min: 640, ideal: 1280, max: 1920 },
-    height: { min: 400, ideal: 720 },
-    frameRate: { ideal: localUserStore.getVideoQualityValue() },
-    facingMode: "user",
-    resizeMode: 'crop-and-scale',
-    aspectRatio: 1.777777778
-};
-const audioConstraint: boolean|MediaTrackConstraints = {
-    //TODO: make these values configurable in the game settings menu and store them in localstorage
-    autoGainControl: false,
-    echoCancellation: true,
-    noiseSuppression: true
-};
-
 export type UpdatedLocalStreamCallback = (media: MediaStream|null) => void;
 export type StartScreenSharingCallback = (media: MediaStream) => void;
 export type StopScreenSharingCallback = (media: MediaStream) => void;
@@ -43,7 +21,6 @@ export type ShowReportCallBack = (userId: string, userName: string|undefined) =>
 export type HelpCameraSettingsCallBack = () => void;
 
 export class MediaManager {
-    localStream: MediaStream|null = null;
     private remoteVideo: Map<string, HTMLVideoElement> = new Map<string, HTMLVideoElement>();
     webrtcInAudio: HTMLAudioElement;
     //FIX ME SOUNDMETER: check stalability of sound meter calculation
@@ -91,24 +68,8 @@ export class MediaManager {
                 }, this.userInputManager);
                 return;
             }
-
-            /*if (result.constraints.video !== false) {
-                HtmlUtils.getElementByIdOrFail('div-myCamVideo').classList.remove('hide');
-            } else {
-                HtmlUtils.getElementByIdOrFail('div-myCamVideo').classList.add('hide');
-            }
-            if (result.constraints.audio !== false) {
-                this.enableMicrophoneStyle();
-            } else {
-                this.disableMicrophoneStyle();
-            }*/
-
-            this.localStream = result.stream;
-            //this.myCamVideo.srcObject = this.localStream;
-
         });
 
-        //let screenSharingStream : MediaStream|null;
         screenSharingLocalStreamStore.subscribe((result) => {
             if (result.type === 'error') {
                 console.error(result.error);
@@ -119,14 +80,10 @@ export class MediaManager {
             }
 
             if (result.stream !== null) {
-                //screenSharingStream = result.stream;
-
                 this.addScreenSharingActiveVideo('me', DivImportance.Normal);
                 HtmlUtils.getElementByIdOrFail<HTMLVideoElement>('screen-sharing-me').srcObject = result.stream;
             } else {
                 this.removeActiveScreenSharingVideo('me');
-
-                //screenSharingStream = null;
             }
 
         });

front/src/WebRtc/SimplePeer.ts

@@ -128,13 +128,19 @@ export class SimplePeer {
         if(!user.initiator){
             return;
         }
-        this.createPeerConnection(user);
+        const streamResult = get(localStreamStore);
+        let stream : MediaStream | null = null;
+        if (streamResult.type === 'success' && streamResult.stream) {
+            stream = streamResult.stream;
+        }
+
+        this.createPeerConnection(user, stream);
     }
 
     /**
      * create peer connection to bind users
      */
-    private createPeerConnection(user : UserSimplePeerInterface) : VideoPeer | null {
+    private createPeerConnection(user : UserSimplePeerInterface, localStream: MediaStream | null) : VideoPeer | null {
         const peerConnection = this.PeerConnectionArray.get(user.userId)
         if (peerConnection) {
             if (peerConnection.destroyed) {
@@ -144,11 +150,11 @@ export class SimplePeer {
                 if (!peerConnexionDeleted) {
                     throw 'Error to delete peer connection';
                 }
-                this.createPeerConnection(user);
+                //return this.createPeerConnection(user, localStream);
             } else {
                 peerConnection.toClose = false;
+                return null;
             }
-            return null;
         }
 
         let name = user.name;
@@ -166,7 +172,7 @@ export class SimplePeer {
         this.lastWebrtcUserName = user.webRtcUser;
         this.lastWebrtcPassword = user.webRtcPassword;
 
-        const peer = new VideoPeer(user, user.initiator ? user.initiator : false, this.Connection);
+        const peer = new VideoPeer(user, user.initiator ? user.initiator : false, this.Connection, localStream);
 
         //permit to send message
         mediaManager.addSendMessageCallback(user.userId,(message: string) => {
@@ -208,7 +214,7 @@ export class SimplePeer {
                 if(!peerConnexionDeleted){
                     throw 'Error to delete peer connection';
                 }
-                this.createPeerConnection(user);
+                this.createPeerConnection(user, stream);
             }else {
                 peerConnection.toClose = false;
             }
@@ -327,7 +333,13 @@ export class SimplePeer {
         try {
             //if offer type, create peer connection
             if(data.signal.type === "offer"){
-                this.createPeerConnection(data);
+                const streamResult = get(localStreamStore);
+                let stream : MediaStream | null = null;
+                if (streamResult.type === 'success' && streamResult.stream) {
+                    stream = streamResult.stream;
+                }
+
+                this.createPeerConnection(data, stream);
             }
             const peer = this.PeerConnectionArray.get(data.userId);
             if (peer !== undefined) {

front/src/WebRtc/VideoPeer.ts

@@ -27,7 +27,7 @@ export class VideoPeer extends Peer {
     private onBlockSubscribe: Subscription;
     private onUnBlockSubscribe: Subscription;
 
-    constructor(public user: UserSimplePeerInterface, initiator: boolean, private connection: RoomConnection) {
+    constructor(public user: UserSimplePeerInterface, initiator: boolean, private connection: RoomConnection, localStream: MediaStream | null) {
         super({
             initiator: initiator ? initiator : false,
             //reconnectTimer: 10000,
@@ -107,7 +107,7 @@ export class VideoPeer extends Peer {
             this._onFinish();
         });
 
-        this.pushVideoToRemoteUser();
+        this.pushVideoToRemoteUser(localStream);
         this.onBlockSubscribe = blackListManager.onBlockStream.subscribe((userId) => {
             if (userId === this.userId) {
                 this.toggleRemoteStream(false);
@@ -190,9 +190,8 @@ export class VideoPeer extends Peer {
         }
     }
 
-    private pushVideoToRemoteUser() {
+    private pushVideoToRemoteUser(localStream: MediaStream | null) {
         try {
-            const localStream: MediaStream | null = mediaManager.localStream;
             this.write(new Buffer(JSON.stringify({type: MESSAGE_TYPE_CONSTRAINT, ...get(obtainedMediaConstraintStore)})));
 
             if(!localStream){