Merge pull request #24 from ant-media/fix/issue-6466

Fix cannot re use adaptor multiple times

Author: mustafaboleken

example/src/Conference.tsx

@@ -14,7 +14,7 @@ import Icon from 'react-native-vector-icons/Ionicons';
 import { DeviceEventEmitter } from 'react-native';
 import InCallManager from 'react-native-incall-manager';
 
-var publishStreamId:string;
+var publishStreamId: string;
 
 export default function Conference() {
   var defaultRoomName = 'room1';
@@ -28,7 +28,7 @@ export default function Conference() {
   const [remoteTracks, setremoteTracks] = useState<any>([]);
   const [isMuted, setIsMuted] = useState(false);
   const [isCameraOpen, setIsCameraOpen] = useState(true);
-
+  const [isWaitingWebsocketInit, setIsWaitingWebsocketInit] = useState(false);
 
   const adaptor = useAntMedia({
     url: webSocketUrl,
@@ -43,6 +43,9 @@ export default function Conference() {
     },
     callback(command: any, data: any) {
       switch (command) {
+        case 'initiated':
+          console.log('initiated');
+          break;
         case 'pong':
           break;
         case 'publish_started':
@@ -52,6 +55,19 @@ export default function Conference() {
           break;
         case 'publish_finished':
           setIsPublishing(false);
+          adaptor.closeWebSocket();
+          break;
+        case 'local_stream_updated':
+          console.log('local_stream_updated');
+          verify();
+          break;
+        case 'websocket_not_initialized':
+          setIsWaitingWebsocketInit(true);
+          adaptor.initialiseWebSocket();
+          break;
+        case 'websocket_closed':
+          console.log('websocket_closed');
+          adaptor.stopLocalStream();
           break;
         case 'play_finished':
           console.log('play_finished');
@@ -77,6 +93,10 @@ export default function Conference() {
             }
           }
           break;
+        case "data_received":
+          console.log('data_received', data);
+          handleNotificationEvent(data);
+          break;
         case "available_devices":
           console.log('available_devices', data);
           break;
@@ -92,16 +112,42 @@ export default function Conference() {
         console.error('callbackError', err, data);
       }
     },
-    peer_connection_config: {
-      iceServers: [
-        {
-          url: 'stun:stun.l.google.com:19302',
-        },
-      ],
-    },
     debug: true,
   });
 
+  const verify = () => {
+    console.log('in verify');
+    if (adaptor.localStream.current && adaptor.localStream.current.toURL()) {
+      console.log('in verify if adaptor local stream', adaptor.localStream);
+      if (isWaitingWebsocketInit) {
+        setIsWaitingWebsocketInit(false);
+        publishStreamId = generateRandomString(12);
+        adaptor.publish(publishStreamId, undefined, undefined, undefined, undefined, roomId, "");
+      }
+      return setLocalMedia(adaptor.localStream.current.toURL());
+    }
+    setTimeout(verify, 5000);
+  };
+
+  const handleNotificationEvent = (notificationEvent: any) => {
+    //var notificationEvent = JSON.parse(data);
+    if (notificationEvent != null && typeof notificationEvent == "object") {
+      var eventStreamId = notificationEvent.streamId;
+      var eventType = notificationEvent.eventType;
+
+      if (eventType == "VIDEO_TRACK_ASSIGNMENT_LIST") {
+        var videoTrackAssignmentList = notificationEvent.payload;
+        console.log("VIDEO_TRACK_ASSIGNMENT_LIST", videoTrackAssignmentList);
+      } else if (eventType == "AUDIO_TRACK_ASSIGNMENT") {
+        console.log("AUDIO_TRACK_ASSIGNMENT", notificationEvent.payload);
+      } else if (eventType == "TRACK_LIST_UPDATED") {
+        console.log("TRACK_LIST_UPDATED", notificationEvent.payload);
+        adaptor.requestVideoTrackAssignments(roomId);
+      }
+
+    }
+  };
+
   const handleMic = useCallback(() => {
     if (adaptor) {
       (isMuted) ? adaptor.unmuteLocalMic() : adaptor.muteLocalMic();
@@ -133,14 +179,14 @@ export default function Conference() {
     }
   }, [adaptor, roomId]);
 
-/*
-  const handleRemoteAudio = useCallback((streamId: string) => {
-    if (adaptor) {
-      adaptor?.muteRemoteAudio(streamId, roomId);
-      //adaptor?.unmuteRemoteAudio(streamId, roomId);
-    }
-  }, [adaptor]);
-*/
+  /*
+    const handleRemoteAudio = useCallback((streamId: string) => {
+      if (adaptor) {
+        adaptor?.muteRemoteAudio(streamId, roomId);
+        //adaptor?.unmuteRemoteAudio(streamId, roomId);
+      }
+    }, [adaptor]);
+  */
 
   const removeRemoteVideo = (streamId?: string) => {
     if (streamId != null || streamId != undefined) {
@@ -160,18 +206,6 @@ export default function Conference() {
     setremoteTracks([]);
   };
 
-  useEffect(() => {
-    const verify = () => {
-      if (adaptor.localStream.current && adaptor.localStream.current.toURL()) {
-        let videoTrack = adaptor.localStream.current.getVideoTracks()[0];
-        // @ts-ignore
-        return setLocalMedia(videoTrack);
-      }
-      setTimeout(verify, 5000);
-    };
-    verify();
-  }, [adaptor.localStream]);
-
   useEffect(() => {
     if (localMedia && remoteTracks) {
       InCallManager.start({ media: 'video' });
@@ -207,14 +241,14 @@ export default function Conference() {
           </>
         ) : (
           <>
-              <View style={{ flexDirection: 'row', justifyContent: 'center' }}>
-                <TouchableOpacity onPress={handleMic} style={styles.roundButton}>
-                  <Icon name={isMuted ? 'mic-off-outline' : 'mic-outline'} size={15} color="#000" />
-                </TouchableOpacity>
-                <TouchableOpacity onPress={handleCamera} style={styles.roundButton}>
-                  <Icon name={isCameraOpen ? 'videocam-outline' : 'videocam-off-outline'} size={15} color="#000" />
-                </TouchableOpacity>
-              </View>
+            <View style={{ flexDirection: 'row', justifyContent: 'center' }}>
+              <TouchableOpacity onPress={handleMic} style={styles.roundButton}>
+                <Icon name={isMuted ? 'mic-off-outline' : 'mic-outline'} size={15} color="#000" />
+              </TouchableOpacity>
+              <TouchableOpacity onPress={handleCamera} style={styles.roundButton}>
+                <Icon name={isCameraOpen ? 'videocam-outline' : 'videocam-off-outline'} size={15} color="#000" />
+              </TouchableOpacity>
+            </View>
             <Text style={styles.heading1}>Remote Streams</Text>
             {
               <ScrollView
@@ -236,7 +270,7 @@ export default function Conference() {
                       <View key={index} style={trackObj.track.kind === 'audio' ? { display: 'none' } : {}}>
                         <>{
                           // @ts-ignore
-                        rtc_view(trackObj.track, styles.players)
+                          rtc_view(trackObj.track, styles.players)
                         }</>
                         {/*
                         <View style={{ flexDirection: 'row', justifyContent: 'center' }}>
@@ -313,14 +347,14 @@ const styles = StyleSheet.create({
     marginTop: 20,
   },
   roundButton: {
-      alignItems: 'center',
-      justifyContent: 'center',
-      backgroundColor: '#DDDDDD',
-      padding: 5,
-      borderRadius: 25, // This will make the button round
-      width: 30, // Diameter of the button
-      height: 30, // Diameter of the button
-      marginTop: 10,
-      marginHorizontal: 10,
-    },
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: '#DDDDDD',
+    padding: 5,
+    borderRadius: 25, // This will make the button round
+    width: 30, // Diameter of the button
+    height: 30, // Diameter of the button
+    marginTop: 10,
+    marginHorizontal: 10,
+  },
 });

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antmedia/react-native-ant-media",
-  "version": "1.0.9",
+  "version": "1.10.0",
   "description": "Ant Media Server WebRTC React Native SDK and Reference Project",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",