From 3f599fd9796b46db036cccfa57f53216052815f8 Mon Sep 17 00:00:00 2001
From: Sergiu Toma <sergiu.toma@safemobile.com>
Date: Mon, 22 Feb 2021 20:58:55 +0200
Subject: [PATCH] Update client

---
 src/App.js | 92 ++++++++++++++++++++++++++----------------------------
 1 file changed, 45 insertions(+), 47 deletions(-)

diff --git a/src/App.js b/src/App.js
index 288e227..3e35e75 100644
--- a/src/App.js
+++ b/src/App.js
@@ -135,16 +135,17 @@ class App extends Component {
     // setTimeout(() => {
     //   windowObjectReference = window.open("http://www.cnn.com/", "CNN_WindowName", windowFeatures);
     // }, 500)
-    pc = new RTCPeerConnection(config)
     stream = await navigator.mediaDevices.getUserMedia({video:true, audio:false})
     localStream = stream
     localVideo.srcObject = stream
-    pc.ontrack = this.onAddStream;
-    // pc.addTrack(localStream.getTracks()[0], localStream);
-    pc.addTrack(localStream.getTracks()[0], localStream)
-    // pc.addTrack(localStream.getTracks()[1], localStream)
-    pc.oniceconnectionstatechange = this.onIceConnectionStateChange;
-    pc.onsignalingstatechange = this.onSignalingStateChange;
+
+    // pc = new RTCPeerConnection(config)
+    // pc.ontrack = this.onAddStream;
+    // // pc.addTrack(localStream.getTracks()[0], localStream);
+    // pc.addTrack(localStream.getTracks()[0], localStream)
+    // // pc.addTrack(localStream.getTracks()[1], localStream)
+    // pc.oniceconnectionstatechange = this.onIceConnectionStateChange;
+    // pc.onsignalingstatechange = this.onSignalingStateChange;
     // pc.onicecandidate = ({candidate}) => {
     //   console.log('IIIIIIIIIIIIIIIIIIIIIIIII2', this.state.callId);
     //   this.state.socket.emit('video', JSON.stringify({
@@ -223,47 +224,37 @@ class App extends Component {
           console.log('[VIDEO]', parseData);
 
           if(parseData.type === 'notify-request') {
-            console.log('NOTIFY-REQUEST');
-            if(!this.state.callId) {
-              await pc.setLocalDescription(await pc.createOffer())
-              this.state.socket.emit('video', JSON.stringify({
-                origin_asset_id: this.state.user.asset.id,
-                dest_asset_id: parseInt(parseData.origin_asset_id),
-                type: 'notify-answer',
-                origin_asset_priority: this.state.user.asset.priority,
-                origin_asset_type_name: this.state.user.user_role.name,
-                origin_asset_name: this.state.user.asset.name,
-                video_call_id: parseInt(parseData.video_call_id),
-                answer: 'accepted', // answer: 'rejected'
-                sdp: pc.localDescription
-              }));
-              this.setState({ callId: parseInt(parseData.video_call_id), dest_asset_id: parseInt(parseData.origin_asset_id) })
-            } 
-            // else {
-            //   console.log('!!!!!!!!!!!!!!!!!', {
-            //     origin_asset_id: this.state.user.asset.id,
-            //     dest_asset_id: parseInt(this.state.dest_asset_id),
-            //     type: 'offer',
-            //     origin_asset_priority: this.state.user.asset.priority,
-            //     origin_asset_type_name: this.state.user.user_role.name,
-            //     origin_asset_name: this.state.user.asset.name,
-            //     video_call_id: this.state.callId,
-            //     sdp: pc.localDescription
-            //   });
-            //   socket.emit('video', JSON.stringify({
-            //     origin_asset_id: this.state.user.asset.id,
-            //     dest_asset_id: parseInt(this.state.dest_asset_id),
-            //     type: 'offer',
-            //     origin_asset_priority: this.state.user.asset.priority,
-            //     origin_asset_type_name: this.state.user.user_role.name,
-            //     origin_asset_name: this.state.user.asset.name,
-            //     video_call_id: this.state.callId,
-            //     sdp: pc.localDescription
-            //   }));
-            // }
+                pc = new RTCPeerConnection(config)
+    pc.ontrack = this.onAddStream;
+    // pc.addTrack(localStream.getTracks()[0], localStream);
+    pc.addTrack(localStream.getTracks()[0], localStream)
+    // pc.addTrack(localStream.getTracks()[1], localStream)
+    pc.oniceconnectionstatechange = this.onIceConnectionStateChange;
+    pc.onsignalingstatechange = this.onSignalingStateChange;
+          console.log('NOTIFY-REQUEST');
+            await pc.setLocalDescription(await pc.createOffer())
+            this.state.socket.emit('video', JSON.stringify({
+              origin_asset_id: this.state.user.asset.id,
+              dest_asset_id: parseInt(parseData.origin_asset_id),
+              type: 'notify-answer',
+              origin_asset_priority: this.state.user.asset.priority,
+              origin_asset_type_name: this.state.user.user_role.name,
+              origin_asset_name: this.state.user.asset.name,
+              video_call_id: parseInt(parseData.video_call_id),
+              answer: 'accepted', // answer: 'rejected'
+              sdp: pc.localDescription
+            }));
+            this.setState({ callId: parseInt(parseData.video_call_id), dest_asset_id: parseInt(parseData.origin_asset_id) })
           }
           
           if(parseData.type === 'notify-answer') {
+                pc = new RTCPeerConnection(config)
+    pc.ontrack = this.onAddStream;
+    // pc.addTrack(localStream.getTracks()[0], localStream);
+    pc.addTrack(localStream.getTracks()[0], localStream)
+    // pc.addTrack(localStream.getTracks()[1], localStream)
+    pc.oniceconnectionstatechange = this.onIceConnectionStateChange;
+    pc.onsignalingstatechange = this.onSignalingStateChange;
             console.log('NOTIFY-ANSWER');
             this.setState({ callId: parseInt(parseData.video_call_id) })
             this.offerReceived(parseData)
@@ -320,7 +311,7 @@ class App extends Component {
           } else if (parseData.type === 'notify-end') {
             this.cleanVideoStreams();
           }
-          
+
 
         });
 
@@ -432,6 +423,13 @@ class App extends Component {
     this.cleanVideoStreams();
   }
 
+  cleanVideoStreams = () => {
+    this.setState({ dest_asset_id: '', callId: null });
+    pc.close();
+    // localVideo.srcObject = null;
+    // remoteVideo.srcObject = null;
+  }
+
   render() {
     const { login, password, user, hubStatus, arsSent, dest_asset_id, isCaller, callId, stunUrl, turnUrl, turnUsername, turnCredential } = { ...this.state };
     return (
@@ -516,7 +514,7 @@ class App extends Component {
 
         <h4>status: {(hubStatus === 0 ? 'uninitialized' : hubStatus === 1 ? 'connecting' : hubStatus === 2 ? 'connected' : 'connection error' )}</h4>
         <h4>ARS Sent: {arsSent === true ? 'TRUE' : 'FALSE'}</h4>
-        <h4>Call id: {callId}</h4>
+        <h4>Call id: {callId && callId}</h4>
 
         <br></br>