summary refs log tree commit diff
path: root/syweb/webclient
diff options
context:
space:
mode:
authorDavid Baker <dbkr@matrix.org>2014-11-13 14:34:03 +0000
committerDavid Baker <dbkr@matrix.org>2014-11-13 14:34:03 +0000
commitf842bca471ec19fb0fcf8e71536b113983896140 (patch)
tree566343999646fb997aa8fad2b05b8eb5410b943f /syweb/webclient
parentThis gives just enough space for the vertical scrollbar to be shown without a... (diff)
downloadsynapse-f842bca471ec19fb0fcf8e71536b113983896140.tar.xz
Kill ng-animate with fire because it's terrible (was causing the page to be very sluggish). Do the call icons in pure CSS3 and use one less image to boot (in some browsers the phone icon will be the wrong browser but they can deal).
Diffstat (limited to 'syweb/webclient')
-rw-r--r--syweb/webclient/app-controller.js8
-rwxr-xr-xsyweb/webclient/app.css9
-rw-r--r--syweb/webclient/app.js1
-rw-r--r--syweb/webclient/components/matrix/matrix-call.js2
-rw-r--r--syweb/webclient/img/red_phone.pngbin378 -> 0 bytes
-rw-r--r--syweb/webclient/index.html4
6 files changed, 15 insertions, 9 deletions
diff --git a/syweb/webclient/app-controller.js b/syweb/webclient/app-controller.js
index bbcf4ab5f6..4d89897b1d 100644
--- a/syweb/webclient/app-controller.js
+++ b/syweb/webclient/app-controller.js
@@ -21,8 +21,8 @@ limitations under the License.
 'use strict';
 
 angular.module('MatrixWebClientController', ['matrixService', 'mPresence', 'eventStreamService'])
-.controller('MatrixWebClientController', ['$scope', '$location', '$rootScope', '$timeout', '$animate', 'matrixService', 'mPresence', 'eventStreamService', 'eventHandlerService', 'matrixPhoneService', 'modelService',
-                               function($scope, $location, $rootScope, $timeout, $animate, matrixService, mPresence, eventStreamService, eventHandlerService, matrixPhoneService, modelService) {
+.controller('MatrixWebClientController', ['$scope', '$location', '$rootScope', '$timeout', 'matrixService', 'mPresence', 'eventStreamService', 'eventHandlerService', 'matrixPhoneService', 'modelService',
+                               function($scope, $location, $rootScope, $timeout, matrixService, mPresence, eventStreamService, eventHandlerService, matrixPhoneService, modelService) {
          
     // Check current URL to avoid to display the logout button on the login page
     $scope.location = $location.path();
@@ -30,8 +30,8 @@ angular.module('MatrixWebClientController', ['matrixService', 'mPresence', 'even
     // disable nganimate for the local and remote video elements because ngAnimate appears
     // to be buggy and leaves animation classes on the video elements causing them to show
     // when they should not (their animations are pure CSS3)
-    $animate.enabled(false, angular.element('#localVideo'));
-    $animate.enabled(false, angular.element('#remoteVideo'));
+    //$animate.enabled(false, angular.element('#localVideo'));
+    //$animate.enabled(false, angular.element('#remoteVideo'));
     
     // Update the location state when the ng location changed
     $rootScope.$on('$routeChangeSuccess', function (event, current, previous) {
diff --git a/syweb/webclient/app.css b/syweb/webclient/app.css
index 070e410647..76f3d13ac1 100755
--- a/syweb/webclient/app.css
+++ b/syweb/webclient/app.css
@@ -66,6 +66,15 @@ textarea, input {
     margin-left: 4px;
     margin-right: 4px;
     margin-top: 8px;
+    transition: transform linear 0.5s;
+    transition: -webkit-transform linear 0.5s;
+}
+
+.callIcon.ended {
+    transform: rotateZ(45deg);
+    -webkit-transform: rotateZ(45deg);
+    filter: hue-rotate(-90deg);
+    -webkit-filter: hue-rotate(-90deg);
 }
 
 #callEndedIcon {
diff --git a/syweb/webclient/app.js b/syweb/webclient/app.js
index 35190a71f4..1a1be4bd06 100644
--- a/syweb/webclient/app.js
+++ b/syweb/webclient/app.js
@@ -16,7 +16,6 @@ limitations under the License.
 
 var matrixWebClient = angular.module('matrixWebClient', [
     'ngRoute',
-    'ngAnimate',
     'MatrixWebClientController',
     'LoginController',
     'RegisterController',
diff --git a/syweb/webclient/components/matrix/matrix-call.js b/syweb/webclient/components/matrix/matrix-call.js
index a1c3aaa103..56431817d9 100644
--- a/syweb/webclient/components/matrix/matrix-call.js
+++ b/syweb/webclient/components/matrix/matrix-call.js
@@ -112,7 +112,7 @@ angular.module('MatrixCall', [])
         } else {
             var iceServers = [];
             // https://github.com/EricssonResearch/openwebrtc/issues/85
-            if (MatrixCall.turnServer /*&& !this.isOpenWebRTC()*/) {
+            if (MatrixCall.turnServer && !this.isOpenWebRTC()) {
                 if (MatrixCall.turnServer.uris) {
                     iceServers.push({
                         'urls': MatrixCall.turnServer.uris,
diff --git a/syweb/webclient/img/red_phone.png b/syweb/webclient/img/red_phone.png
deleted file mode 100644
index 11fc44940c..0000000000
--- a/syweb/webclient/img/red_phone.png
+++ /dev/null
Binary files differdiff --git a/syweb/webclient/index.html b/syweb/webclient/index.html
index 4bca320e77..22b6d50ca0 100644
--- a/syweb/webclient/index.html
+++ b/syweb/webclient/index.html
@@ -16,7 +16,6 @@
     <script src="js/angular.js"></script>
     <script src="js/angular-route.min.js"></script>
     <script src="js/angular-sanitize.min.js"></script>
-    <script src="js/angular-animate.min.js"></script>
     <script src="js/jquery.peity.min.js"></script>
     <script src="js/angular-peity.js"></script>
     <script type='text/javascript' src="js/ui-bootstrap-tpls-0.11.2.js"></script>
@@ -66,8 +65,7 @@
         <div id="headerContent" ng-hide="'/login' == location || '/register' == location">
             <div id="callBar" ng-show="currentCall">
                 <img id="callPeerImage" ng-show="currentCall.userProfile.avatar_url" ngSrc="{{ currentCall.userProfile.avatar_url }}" />
-                <img class="callIcon" src="img/green_phone.png" ng-show="currentCall.state != 'ended'" />
-                <img class="callIcon" id="callEndedIcon" src="img/red_phone.png" ng-show="currentCall.state == 'ended'" />
+                <img class="callIcon" src="img/green_phone.png" ng-show="!!currentCall" ng-class="currentCall.state" />
                 <div id="callPeerNameAndState">
                     <span id="callPeerName">{{ currentCall.userProfile.displayname }}</span>
                     <br />