another commit

cindoum · Jul 17, 2014 · 92a6776 · 92a6776
1 parent fd881b6
commit 92a6776
Show file tree

Hide file tree

Showing 11 changed files with 163 additions and 11 deletions.
diff --git a/client/css/style.css b/client/css/style.css
@@ -1,3 +1,22 @@
 .chat_timespan {
     color: #848484;   
+}
+
+#selfVideo {
+    height:225px;
+    width:300px;
+    float:left;
+    border:1px solid gray;
+    margin-left:10px;
+}
+
+#callerVideo {
+    height:225px;
+    width:300px;
+    border:1px solid gray;
+    margin-left:10px;
+}
+
+.easyrtc_closeButton {
+    display: none;
 }
diff --git a/client/index.html b/client/index.html
@@ -16,6 +16,7 @@
         <script src="/js/app.js"></script>
         <script src="/js/pages/simplemessaging/simplemessaging_ctrl.js"></script>
         <script src="/js/pages/channelmessaging/channelmessaging_ctrl.js"></script>
+        <script src="/js/pages/audiovideosimple/audiovideosimple_ctrl.js"></script>
     </head>
     <body>
         <div ng-include="'nav.html'"></div>

diff --git a/client/js/app.js b/client/js/app.js
@@ -9,6 +9,14 @@ angular.module('cam', ['ngRoute', 'ngSanitize'])
                 templateUrl: 'js/pages/channelmessaging/channelmessaging.html',
                 controller: 'channelMessagingCtrl'
             })
+            .when('/audiovideosimple', {
+                templateUrl: 'js/pages/audiovideosimple/audiovideosimple.html',
+                controller: 'audioVideoSimpleCtrl'
+            })
+            .when('/multiparty', {
+                templateUrl: 'js/pages/multiparty/multiparty.html',
+                controller: 'multipartyCtrl'
+            })
     }])
     .run(function ($rootScope, $location) { //Insert in the function definition the dependencies you need.
     $rootScope.$on("$locationChangeStart",function(event, next, current){

diff --git a/client/js/pages/audiovideosimple/audiovideosimple.html b/client/js/pages/audiovideosimple/audiovideosimple.html
@@ -0,0 +1,22 @@
+<h1>Audio video simple</h1>
+<h2>I am <small><span ng-bind="user.easyRtcId"></span></small></h2>
+<div class="well">
+    <div class="row">
+        <h4>List of users</h4>
+        <div ng-repeat="user in users">
+            <span ng-bind="user.name"></span>
+            <button class="btn btn-link" ng-show="user.isConnected!=true" ng-click="call(user.easyRtcId)">Connect</button>
+            <button class="btn btn-link" ng-show="user.isConnected==true" ng-click="hangup(user.easyRtcId)">Disconnect</button>
+        </div>
+    </div>
+</div>
+<div class="well">
+    <div class="row">
+        <div class="col-md-5">
+            <video autoplay="autoplay" class="easyrtcMirror" id="selfVideo" muted="muted" volume="0" ></video>
+        </div>
+        <div class="col-md-5 col-md-offset-2">
+            <video autoplay="autoplay" id="callerVideo" class="pull-right"></video>
+        </div>
+    </div>
+</div>
diff --git a/client/js/pages/audiovideosimple/audiovideosimple_ctrl.js b/client/js/pages/audiovideosimple/audiovideosimple_ctrl.js
@@ -0,0 +1,103 @@
+angular.module('cam').controller('audioVideoSimpleCtrl', ['$scope', function ($scope) {
+    var _init = function () {
+        $scope.user = {};
+        $scope.users = [];
+        $scope.chat = {allMsgs: '', msg: ''};
+
+        easyrtc.setPeerListener(_peerListener);
+        easyrtc.setRoomOccupantListener(_convertListToButtons);
+        easyrtc.easyApp("easyrtc.audioVideo", "selfVideo", ["callerVideo"], _loginSuccess, _loginFailure);
+    };
+
+    $scope.call = function (to) {
+        _hangupAllClients();
+        easyrtc.call(to, _callSuccess, _callFailed, _callAccepted);
+        easyrtc.sendDataWS(to, "chat:videoconnected",  null);
+    };
+
+    $scope.hangup = function (to) {
+        _hangupAllClients();
+        easyrtc.sendDataWS(to, "chat:videodisconnected",  null);
+    };
+
+    var _peerListener = function (who, msgType, content) {
+        if (msgType === 'chat:videoconnected') {
+            _findUserByEasyRtcId(who).isConnected = true;
+        }
+        else if (msgType === 'chat:videodisconnected') {
+             _findUserByEasyRtcId(who).isConnected = false;
+        }
+
+        $scope.$apply();
+    };
+
+    var _callSuccess = function (to) { 
+        _findUserByEasyRtcId(to).isConnected = true; 
+        $scope.$apply();
+    };
+
+    var _callFailed = function (errCode, errMsg) { };
+
+    var _callAccepted = function (accepted, from) { };
+
+    var _hangupAllClients = function () {
+        easyrtc.hangupAll();
+
+        if ($scope.users) {
+            for (var i = 0; i < $scope.users.length; i++) {
+                $scope.users[i].isConnected = false;
+            }
+        }  
+    };
+
+    var _loginSuccess = function (easyrtcid) {
+        $scope.user.easyRtcId = easyrtcid;
+        $scope.$apply();
+    };
+
+    var _loginFailure = function (errorCode, message) {
+        easyrtc.showError(errorCode, message);
+        $scope.$apply();
+    };
+
+    var _convertListToButtons = function (roomName, occupants, isPrimary) {
+        var oldUsers = angular.copy($scope.users);
+        $scope.users = [];
+
+        for (easyRtc in occupants) {
+            $scope.users.push({
+                easyRtcId: easyRtc,
+                name: easyRtc,
+                isConnected: _findOldUser(oldUsers, easyRtc)
+            });
+        }
+
+        $scope.$apply();
+    };
+
+    var _findOldUser = function (oldUsers, easyRtc) {
+        if (oldUsers) {
+            for (var i = 0; i < oldUsers.length; i++) {
+                if (oldUsers[i].easyRtcId === easyRtc) {
+                    return oldUsers.isConnected;
+                }
+            }  
+        }
+
+        return false;
+    };
+
+    var _findUserByEasyRtcId = function (id) {
+        if (id) {
+            for (var i = 0; i < $scope.users.length; i++) {
+                if ($scope.users[i].easyRtcId === id) {
+                    return $scope.users[i];
+                }
+            }
+        }  
+
+        return null;
+    };
+
+    _init();
+}]);
diff --git a/client/js/pages/multiparty/multiparty.html b/client/js/pages/multiparty/multiparty.html
diff --git a/client/js/pages/multiparty/multiparty_ctrl.js b/client/js/pages/multiparty/multiparty_ctrl.js
diff --git a/client/js/pages/simplemessaging/simplemessaging_ctrl.js b/client/js/pages/simplemessaging/simplemessaging_ctrl.js
@@ -7,13 +7,10 @@ angular.module('cam').controller('simpleMessagingCtrl', ['$scope', '$filter', fu
         easyrtc.setPeerListener(_addToConversation);
         easyrtc.setRoomOccupantListener(_convertListToButtons);
         easyrtc.connect("easyrtc.instantMessaging", _loginSuccess, _loginFailure);  
-        easyrtc.webSocket.on('test', function (resp) {
-            _addToConversation(resp.from + " (TO ALL)", "message", resp.msg);
-        });
     };
 
     $scope.sendAll = function () {
-        easyrtc.webSocket.emit('test', { msg: $scope.chat.msg, from: $scope.user.easyRtcId });
+        easyrtc.sendDataWS({ targetRoom: 'default' }, "message", { msg: $scope.chat.msg, from: $scope.user.easyRtcId });
         _addToConversation("Me (TO ALL)", "message", $scope.chat.msg);
         $scope.chat.msg = ''; 
     };
@@ -37,6 +34,11 @@ angular.module('cam').controller('simpleMessagingCtrl', ['$scope', '$filter', fu
     var _addToConversation = function (who, msgType, content) {
         setTimeout(function() {
             $scope.$apply(function () {
+                if (angular.isObject(content)) {
+                    who = content.from;
+                    content = content.msg;
+                }
+
                 $scope.chat.allMsgs += "<b>" + who + " </b> <span class=\"chat_timespan\">[<i>" + $filter('date')(new Date(), 'H:mm ss') + "</i>]</span> : &nbsp;" + content + "<br />"; 
             }, 0);            
         });

diff --git a/client/nav.html b/client/nav.html
@@ -18,6 +18,9 @@
       <ul class="nav navbar-nav">
         <li><a href="#/channelmessaging">Channel messaging</a></li>
       </ul>
+      <ul class="nav navbar-nav">
+        <li><a href="#/audiovideosimple">Audio video simple</a></li>
+      </ul>
     </div><!-- /.navbar-collapse -->
   </div><!-- /.container-fluid -->
 </nav>
diff --git a/node_modules/easyrtc/api/easyrtc.js b/node_modules/easyrtc/api/easyrtc.js
diff --git a/server.js b/server.js
@@ -9,12 +9,6 @@ var server = http.createServer(app);
 var socketServer = socketio.listen(server, {"log level":1});
 var rtcServer = easyrtc.listen(app, socketServer);
 
-socketServer.on('connection', function (socket) {
-    socket.on('test', function (data) {
-        socket.broadcast.emit('test', data); 
-    });
-});
-
 app.use(express.static(path.resolve(__dirname, 'client')));
 app.use('/bower_components',  express.static(__dirname + '/bower_components'));