Merge remote-tracking branch 'prlanzarin1/ghost-webcams' into html5-video-media-flow

Conflicts:
	bigbluebutton-html5/imports/ui/components/video-dock/component.jsx

bigbluebutton-html5/imports/ui/components/video-dock/component.jsx

@@ -33,6 +33,7 @@ export default class VideoDock extends Component {
 
     this.state = {
       videos: {},
+      sharedWebcam : false,
     };
 
     this.sendUserShareWebcam = props.sendUserShareWebcam.bind(this);
@@ -78,9 +79,10 @@ export default class VideoDock extends Component {
   componentDidMount() {
     const ws = this.ws;
     const { users } = this.props;
+    const id = users[0].userId;
 
     for (let i = 0; i < users.length; i++) {
-      if (users[i].has_stream) {
+      if (users[i].has_stream && users[i].userId !== id) {
         this.start(users[i].userId, false);
       }
     }
@@ -183,6 +185,7 @@ export default class VideoDock extends Component {
     console.log(`Starting video call for video: ${id} with ${shareWebcam}`);
 
     if (shareWebcam) {
+      this.setState({sharedWebcam: true});
       this.initWebRTC(id, true);
     } else {
       // initWebRTC with shareWebcam false will be called after react mounts the element
@@ -322,6 +325,10 @@ export default class VideoDock extends Component {
 
     delete videos[id];
     this.setState({videos: videos});
+
+    if (id == this.myId) {
+      this.setState({sharedWebcam: false});
+    }
   }
 
   destroyWebRTCPeer(id) {
@@ -358,7 +365,6 @@ export default class VideoDock extends Component {
     } else {
       log("error", "Not connected to media server BRA");
     }
-
   }
 
   unshareWebcam() {
@@ -445,6 +451,14 @@ export default class VideoDock extends Component {
   }
 
   render() {
+    let cssClass;
+    if (this.state.sharedWebcam) {
+      cssClass = styles.sharedWebcamVideoLocal;
+    }
+    else {
+      cssClass = styles.sharedWebcamVideo;
+    }
+
     return (
 
       <div className={styles.videoDock}>
@@ -452,8 +466,8 @@ export default class VideoDock extends Component {
           {Object.keys(this.state.videos).map((id) => {
             return (<VideoElement videoId={id} key={id} onMount={this.initWebRTC.bind(this)} />);
           })}
+          <video autoPlay={true} playsInline={true} muted={true} id="shareWebcamVideo" className={cssClass} ref="videoInput" />
         </div>
-        <video id="shareWebcamVideo" className={styles.sharedWebcamVideo} ref="videoInput" />
       </div>
     );
   }
@@ -461,6 +475,7 @@ export default class VideoDock extends Component {
   shouldComponentUpdate(nextProps, nextState) {
     const { users } = this.props;
     const nextUsers = nextProps.users;
+    const id = users[0].userId;
 
     if (users) {
       let suc = false;
@@ -472,7 +487,9 @@ export default class VideoDock extends Component {
             console.log(`User ${nextUsers[i].has_stream ? '' : 'un'}shared webcam ${users[i].userId}`);
 
             if (nextUsers[i].has_stream) {
-              this.start(users[i].userId, false);
+              if (id !== users[i].userId) {
+                this.start(users[i].userId, false);
+              }
             } else {
               this.stop(users[i].userId);
             }

bigbluebutton-html5/imports/ui/components/video-dock/styles.scss

@@ -16,3 +16,7 @@
 .sharedWebcamVideo {
   display: none;
 }
+
+.sharedWebcamVideoLocal {
+  display: normal;
+}

bigbluebutton-html5/private/config/development/public/kurento.yaml

@@ -1,6 +1,6 @@
 kurento:
-  wsUrl: 'HOST'
-  chromeExtensionKey: 'KEY'
-  chromeExtensionLink: 'LINK'
-  enableScreensharing: false
-  enableVideo: false
+  wsUrl: 'wss://kurento-desktopsharing.mconf.com/bbb-webrtc-sfu'
+  chromeExtensionKey: 'mbfngdphjegmlbfobcblikeefpidfncbINK'
+  chromeExtensionLink: 'https://chrome.google.com/webstore/detail/kurento-screenshare-test/mbfngdphjegmlbfobcblikeefpidfncbINK'
+  enableScreensharing: true
+  enableVideo: true

labs/bbb-webrtc-sfu/lib/video/VideoManager.js

@@ -164,10 +164,7 @@ let stopSession = async function(sessionId, role, cameraId) {
     if (role === 'share') {
       var sharedVideo = sessions[sessionId][cameraId+'shared'];
       await sharedVideo.stop();
-      var viewerVideo = sessions[sessionId][cameraId];
-      await viewerVideo.stop();
       delete sessions[sessionId][cameraId+'shared'];
-      delete sessions[sessionId][cameraId];
       console.log('  [VideoManager] Stopping sharer [', sessionId, '][', cameraId,'] with IDs' , videoIds);
     }
     else if (role === 'viewer') {