Merge pull request #201 from maraoz/bug/turn-off-camera

Turn off video camera on logout

index.html

@@ -19,9 +19,9 @@
             </div>
             <div class="right text-right" ng-show="$root.wallet">
               <div class="connection-info">
-                <span ng-if="!$root.wallet.name && $root.wallet.id">Wallet ID: {{$root.wallet.id}}</span>
+                <span ng-if="!$root.wallet.name && $root.wallet.id">{{$root.wallet.id}}</span>
                 <span ng-if="$root.wallet.name">Wallet: {{$root.wallet.name}} &lt;{{$root.wallet.id}}&gt;</span> 
-                [{{$root.wallet.requiredCopayers}}/{{$root.wallet.totalCopayers}}]
+                ({{$root.wallet.requiredCopayers}}-of-{{$root.wallet.totalCopayers}}) 
                 <a href="#" ng-click="signout()"><i class="fi-power"></i></a>
               </div>
               <div class="balance-info">
@@ -198,7 +198,7 @@
             </div>
             <div class="large-6 large-centered columns m30v">
               <h6>Wallet name (optional)</h6>
-                <input ng-model="walletName" placeholder="wallet name" class="size-24" style="width:100%">
+                <input ng-model="walletName" placeholder="My multisig wallet" class="size-24" style="width:100%">
             </div>
  
             <div class="large-6 large-centered columns m30v">

js/services/controllerUtils.js

@@ -17,6 +17,8 @@ angular.module('copay.controllerUtils')
       $rootScope.wallet = null;
       delete $rootScope['wallet'];
       $rootScope.totalBalance = 0;
+      video.close();
+      $rootScope.videoSrc = {};
       $location.path('signin');
     };
 
@@ -38,6 +40,7 @@ angular.module('copay.controllerUtils')
     root.startNetwork = function(w) {
       var handlePeerVideo = function(err, peerID, url) {
         if (err) {
+          delete $rootScope.videoSrc[peerID];
           return;
         }
         $rootScope.videoSrc[peerID] = encodeURI(url);

js/services/video.js

@@ -6,12 +6,12 @@ var Video = function() {
     navigator.mozGetUserMedia;
 
   this.mediaConnections = {};
+  this.localStream = null;
 };
 
 Video.prototype.setOwnPeer = function(peer, wallet, cb) {
   var self = this;
 
-
   navigator.getUserMedia({
     audio: true,
     video: true
@@ -21,7 +21,6 @@ Video.prototype.setOwnPeer = function(peer, wallet, cb) {
     var online = wallet.getOnlinePeerIDs();
     for (var i = 0; i < online.length; i++) {
       var o = online[i];
-      var mc = self.mediaConnections[o];
       if (o !== peer.id) {
         self.callPeer(o, cb);
       }
@@ -38,7 +37,6 @@ Video.prototype.setOwnPeer = function(peer, wallet, cb) {
     } else {
       mediaConnection.answer();
     }
-    self.mediaConnections[mediaConnection.peer] = mediaConnection;
     self._addCall(mediaConnection, cb);
   });
   this.peer = peer;
@@ -60,9 +58,26 @@ Video.prototype._addCall = function(mediaConnection, cb) {
   });
 
   mediaConnection.on('close', function() {
+    console.log('Media connection closed with ' + peerID);
+    cb(true, peerID, null); // ask to stop video streaming in UI
   });
-  mediaConnection.on('error', function() {
+  mediaConnection.on('error', function(e) {
+    console.log('Media connection error with ' + peerID);
+    cb(e, peerID, null);
   });
+  this.mediaConnections[peerID] = mediaConnection;
 }
 
+Video.prototype.close = function() {
+  this.localStream.stop();
+  this.localStream.mozSrcObject = null;
+  this.localStream.src = "";
+  this.localStream.src = null;
+  this.localStream = null;
+  for (var i = 0; this.mediaConnections.length; i++) {
+    this.mediaConnections[i].close();
+  }
+  this.mediaConnections = {};
+};
+
 angular.module('copay.video').value('video', new Video());