From f397b2264c705a8284ca08890857782353f3b648 Mon Sep 17 00:00:00 2001
From: Kegan Dougal <kegan@matrix.org>
Date: Sat, 6 Sep 2014 09:47:30 -0700
Subject: https when loading recaptcha js

---
 webclient/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'webclient/index.html')

diff --git a/webclient/index.html b/webclient/index.html
index baaaa8cef8..81c7c7d06c 100644
--- a/webclient/index.html
+++ b/webclient/index.html
@@ -11,7 +11,7 @@
     <meta name="viewport" content="width=device-width">
    
     <script type='text/javascript' src='js/jquery-1.8.3.min.js'></script>
-    <script type="text/javascript" src="http://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script> 
+    <script type="text/javascript" src="https://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script> 
     <script src="js/angular.min.js"></script>
     <script src="js/angular-route.min.js"></script>
     <script src="js/angular-sanitize.min.js"></script>
-- 
cgit 1.5.1


From 972f664b6b38029cda46a6ba709b7fc8b6b6bdae Mon Sep 17 00:00:00 2001
From: David Baker <dbkr@matrix.org>
Date: Mon, 8 Sep 2014 16:10:36 +0100
Subject: add sounds to the calling interface

---
 webclient/app-controller.js                |  27 +++++++++++++++--
 webclient/components/matrix/matrix-call.js |  46 +++++++++++++++++++++--------
 webclient/index.html                       |  16 ++++++++++
 webclient/media/busy.mp3                   | Bin 0 -> 24834 bytes
 webclient/media/busy.ogg                   | Bin 0 -> 13960 bytes
 webclient/media/callend.mp3                | Bin 0 -> 12971 bytes
 webclient/media/callend.ogg                | Bin 0 -> 13932 bytes
 webclient/media/ring.mp3                   | Bin 0 -> 19662 bytes
 webclient/media/ring.ogg                   | Bin 0 -> 20636 bytes
 webclient/media/ringback.mp3               | Bin 0 -> 18398 bytes
 webclient/media/ringback.ogg               | Bin 0 -> 8352 bytes
 11 files changed, 75 insertions(+), 14 deletions(-)
 create mode 100644 webclient/media/busy.mp3
 create mode 100644 webclient/media/busy.ogg
 create mode 100644 webclient/media/callend.mp3
 create mode 100644 webclient/media/callend.ogg
 create mode 100644 webclient/media/ring.mp3
 create mode 100644 webclient/media/ring.ogg
 create mode 100644 webclient/media/ringback.mp3
 create mode 100644 webclient/media/ringback.ogg

(limited to 'webclient/index.html')

diff --git a/webclient/app-controller.js b/webclient/app-controller.js
index 064bde3ab2..20b5076727 100644
--- a/webclient/app-controller.js
+++ b/webclient/app-controller.js
@@ -105,6 +105,29 @@ angular.module('MatrixWebClientController', ['matrixService', 'mPresence', 'even
             }
         );
     });
+    $rootScope.$watch('currentCall.state', function(newVal, oldVal) {
+        if (newVal == 'ringing') {
+            angular.element('#ringbackAudio')[0].pause();
+            angular.element('#ringAudio')[0].load();
+            angular.element('#ringAudio')[0].play();
+        } else if (newVal == 'invite_sent') {
+            angular.element('#ringAudio')[0].pause();
+            angular.element('#ringbackAudio')[0].load();
+            angular.element('#ringbackAudio')[0].play();
+        } else if (newVal == 'ended' && oldVal == 'connected') {
+            angular.element('#ringAudio')[0].pause();
+            angular.element('#ringbackAudio')[0].pause();
+            angular.element('#callendAudio')[0].play();
+        } else if (newVal == 'ended' && oldVal == 'invite_sent') {
+            angular.element('#ringAudio')[0].pause();
+            angular.element('#ringbackAudio')[0].pause();
+            angular.element('#busyAudio')[0].play();
+        } else if (oldVal == 'invite_sent') {
+            angular.element('#ringbackAudio')[0].pause();
+        } else if (oldVal == 'ringing') {
+            angular.element('#ringAudio')[0].pause();
+        }
+    });
 
     $rootScope.$on(matrixPhoneService.INCOMING_CALL_EVENT, function(ngEvent, call) {
         console.trace("incoming call");
@@ -125,7 +148,7 @@ angular.module('MatrixWebClientController', ['matrixService', 'mPresence', 'even
             $animate.addClass(icon, 'callIconRotate');
             $timeout(function(){
                 $rootScope.currentCall = undefined;
-            }, 2000);
+            }, 4070);
         }, 100);
     };
     
@@ -139,7 +162,7 @@ angular.module('MatrixWebClientController', ['matrixService', 'mPresence', 'even
             $animate.addClass(icon, 'callIconRotate');
             $timeout(function(){
                 $rootScope.currentCall = undefined;
-            }, 2000);
+            }, 4070);
         }, 100);
     }
 }]);
diff --git a/webclient/components/matrix/matrix-call.js b/webclient/components/matrix/matrix-call.js
index 3cb5e8b693..4eaed89bcf 100644
--- a/webclient/components/matrix/matrix-call.js
+++ b/webclient/components/matrix/matrix-call.js
@@ -120,7 +120,9 @@ angular.module('MatrixCall', [])
         }, function(e) {
             self.getLocalOfferFailed(e);
         });
-        this.state = 'create_offer';
+        $rootScope.$apply(function() {
+            self.state = 'create_offer';
+        });
     };
 
     MatrixCall.prototype.gotUserMediaForAnswer = function(stream) {
@@ -138,7 +140,9 @@ angular.module('MatrixCall', [])
             },
         };
         this.peerConn.createAnswer(function(d) { self.createdAnswer(d); }, function(e) {}, constraints);
-        this.state = 'create_answer';
+        $rootScope.$apply(function() {
+            self.state = 'create_answer';
+        });
     };
 
     MatrixCall.prototype.gotLocalIceCandidate = function(event) {
@@ -177,7 +181,11 @@ angular.module('MatrixCall', [])
             offer: description
         };
         matrixService.sendEvent(this.room_id, 'm.call.invite', undefined, content).then(this.messageSent, this.messageSendFailed);
-        this.state = 'invite_sent';
+
+        self = this;
+        $rootScope.$apply(function() {
+            self.state = 'invite_sent';
+        });
     };
 
     MatrixCall.prototype.createdAnswer = function(description) {
@@ -189,7 +197,10 @@ angular.module('MatrixCall', [])
             answer: description
         };
         matrixService.sendEvent(this.room_id, 'm.call.answer', undefined, content).then(this.messageSent, this.messageSendFailed);
-        this.state = 'connecting';
+        self = this;
+        $rootScope.$apply(function() {
+            self.state = 'connecting';
+        });
     };
 
     MatrixCall.prototype.messageSent = function() {
@@ -211,9 +222,11 @@ angular.module('MatrixCall', [])
         console.trace("Ice connection state changed to: "+this.peerConn.iceConnectionState);
         // ideally we'd consider the call to be connected when we get media but chrome doesn't implement nay of the 'onstarted' events yet
         if (this.peerConn.iceConnectionState == 'completed' || this.peerConn.iceConnectionState == 'connected') {
-            this.state = 'connected';
-            this.didConnect = true;
-            $rootScope.$apply();
+            self = this;
+            $rootScope.$apply(function() {
+                self.state = 'connected';
+                self.didConnect = true;
+            });
         }
     };
 
@@ -251,17 +264,26 @@ angular.module('MatrixCall', [])
     };
 
     MatrixCall.prototype.onRemoteStreamStarted = function(event) {
-        this.state = 'connected';
+        self = this;
+        $rootScope.$apply(function() {
+            self.state = 'connected';
+        });
     };
 
     MatrixCall.prototype.onRemoteStreamEnded = function(event) {
-        this.state = 'ended';
-        this.stopAllMedia();
-        this.onHangup();
+        self = this;
+        $rootScope.$apply(function() {
+            self.state = 'ended';
+            self.stopAllMedia();
+            self.onHangup();
+        });
     };
 
     MatrixCall.prototype.onRemoteStreamTrackStarted = function(event) {
-        this.state = 'connected';
+        self = this;
+        $rootScope.$apply(function() {
+            self.state = 'connected';
+        });
     };
 
     MatrixCall.prototype.onHangupReceived = function() {
diff --git a/webclient/index.html b/webclient/index.html
index 81c7c7d06c..53ac1cb10e 100644
--- a/webclient/index.html
+++ b/webclient/index.html
@@ -70,6 +70,22 @@
                     <button ng-click="hangupCall()">Reject</button>
                 </span>
                 <button ng-click="hangupCall()" ng-show="currentCall && currentCall.state != 'ringing' && currentCall.state != 'ended' && currentCall.state != 'fledgling'">Hang up</button>
+                <audio id="ringAudio" loop>
+                    <source src="media/ring.ogg" type="audio/ogg" />
+                    <source src="media/ring.mp3" type="audio/mpeg" />
+                </audio>
+                <audio id="ringbackAudio" loop>
+                    <source src="media/ringback.ogg" type="audio/ogg" />
+                    <source src="media/ringback.mp3" type="audio/mpeg" />
+                </audio>
+                <audio id="callendAudio">
+                    <source src="media/callend.ogg" type="audio/ogg" />
+                    <source src="media/callend.mp3" type="audio/mpeg" />
+                </audio>
+                <audio id="busyAudio">
+                    <source src="media/busy.ogg" type="audio/ogg" />
+                    <source src="media/busy.mp3" type="audio/mpeg" />
+                </audio>
             </div>
             <a href id="headerUserId" ng-click='goToUserPage(user_id)'>{{ user_id }}</a>
             &nbsp;
diff --git a/webclient/media/busy.mp3 b/webclient/media/busy.mp3
new file mode 100644
index 0000000000..fec27ba4c5
Binary files /dev/null and b/webclient/media/busy.mp3 differ
diff --git a/webclient/media/busy.ogg b/webclient/media/busy.ogg
new file mode 100644
index 0000000000..5d64a7d0d9
Binary files /dev/null and b/webclient/media/busy.ogg differ
diff --git a/webclient/media/callend.mp3 b/webclient/media/callend.mp3
new file mode 100644
index 0000000000..50c34e5640
Binary files /dev/null and b/webclient/media/callend.mp3 differ
diff --git a/webclient/media/callend.ogg b/webclient/media/callend.ogg
new file mode 100644
index 0000000000..927ce1f634
Binary files /dev/null and b/webclient/media/callend.ogg differ
diff --git a/webclient/media/ring.mp3 b/webclient/media/ring.mp3
new file mode 100644
index 0000000000..3c3cdde3f9
Binary files /dev/null and b/webclient/media/ring.mp3 differ
diff --git a/webclient/media/ring.ogg b/webclient/media/ring.ogg
new file mode 100644
index 0000000000..de49b8ae6f
Binary files /dev/null and b/webclient/media/ring.ogg differ
diff --git a/webclient/media/ringback.mp3 b/webclient/media/ringback.mp3
new file mode 100644
index 0000000000..6ee34bf395
Binary files /dev/null and b/webclient/media/ringback.mp3 differ
diff --git a/webclient/media/ringback.ogg b/webclient/media/ringback.ogg
new file mode 100644
index 0000000000..7dbfdcd017
Binary files /dev/null and b/webclient/media/ringback.ogg differ
-- 
cgit 1.5.1


From 25e96f82db21fe0216f748e53aadb8d9dac3da72 Mon Sep 17 00:00:00 2001
From: David Baker <dbkr@matrix.org>
Date: Tue, 9 Sep 2014 17:52:01 +0100
Subject: Don't break if you press the hangup button before allowing media
 permission.

---
 webclient/components/matrix/matrix-call.js | 2 +-
 webclient/index.html                       | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

(limited to 'webclient/index.html')

diff --git a/webclient/components/matrix/matrix-call.js b/webclient/components/matrix/matrix-call.js
index aae00a3f77..ef35717da6 100644
--- a/webclient/components/matrix/matrix-call.js
+++ b/webclient/components/matrix/matrix-call.js
@@ -104,7 +104,7 @@ angular.module('MatrixCall', [])
         console.trace("Ending call "+this.call_id);
 
         this.stopAllMedia();
-        this.peerConn.close();
+        if (this.peerConn) this.peerConn.close();
 
         this.hangupParty = 'local';
 
diff --git a/webclient/index.html b/webclient/index.html
index 53ac1cb10e..3b531027e1 100644
--- a/webclient/index.html
+++ b/webclient/index.html
@@ -58,7 +58,8 @@
                         <span ng-show="currentCall.state == 'invite_sent'">Calling...</span>
                         <span ng-show="currentCall.state == 'connecting'">Call Connecting...</span>
                         <span ng-show="currentCall.state == 'connected'">Call Connected</span>
-                        <span ng-show="currentCall.state == 'ended' && !currentCall.didConnect && currentCall.direction == 'outbound'">Call Rejected</span>
+                        <span ng-show="currentCall.state == 'ended' && !currentCall.didConnect && currentCall.direction == 'outbound' && currentCall.hangupParty == 'remote'">Call Rejected</span>
+                        <span ng-show="currentCall.state == 'ended' && !currentCall.didConnect && currentCall.direction == 'outbound' && currentCall.hangupParty == 'local'">Call Canceled</span>
                         <span ng-show="currentCall.state == 'ended' && currentCall.didConnect && currentCall.direction == 'outbound'">Call Ended</span>
                         <span ng-show="currentCall.state == 'ended' && !currentCall.didConnect && currentCall.direction == 'inbound'">Call Canceled</span>
                         <span ng-show="currentCall.state == 'ended' && currentCall.didConnect && currentCall.direction == 'inbound'">Call Ended</span>
-- 
cgit 1.5.1


From 80b54706638df76b90ca9e6edc65db4f74fdfc7e Mon Sep 17 00:00:00 2001
From: David Baker <dbkr@matrix.org>
Date: Wed, 10 Sep 2014 11:35:14 +0100
Subject: Add text for incoming calls

---
 webclient/index.html | 1 +
 1 file changed, 1 insertion(+)

(limited to 'webclient/index.html')

diff --git a/webclient/index.html b/webclient/index.html
index 3b531027e1..150b7c4407 100644
--- a/webclient/index.html
+++ b/webclient/index.html
@@ -56,6 +56,7 @@
                     <br />
                     <span id="callState">
                         <span ng-show="currentCall.state == 'invite_sent'">Calling...</span>
+                        <span ng-show="currentCall.state == 'ringing'">Incoming Call</span>
                         <span ng-show="currentCall.state == 'connecting'">Call Connecting...</span>
                         <span ng-show="currentCall.state == 'connected'">Call Connected</span>
                         <span ng-show="currentCall.state == 'ended' && !currentCall.didConnect && currentCall.direction == 'outbound' && currentCall.hangupParty == 'remote'">Call Rejected</span>
-- 
cgit 1.5.1


From e2d2d63bcde7354c2e73b368e7c68d1f2b369562 Mon Sep 17 00:00:00 2001
From: David Baker <dbkr@matrix.org>
Date: Wed, 10 Sep 2014 15:45:09 +0100
Subject: Animation on call end icon.

---
 webclient/app-controller.js | 10 +++-------
 webclient/app.css           | 18 +++++++++---------
 webclient/app.js            |  1 +
 webclient/index.html        |  1 +
 4 files changed, 14 insertions(+), 16 deletions(-)

(limited to 'webclient/index.html')

diff --git a/webclient/app-controller.js b/webclient/app-controller.js
index feda0f6b57..8383533cfb 100644
--- a/webclient/app-controller.js
+++ b/webclient/app-controller.js
@@ -160,13 +160,9 @@ angular.module('MatrixWebClientController', ['matrixService', 'mPresence', 'even
 
     $rootScope.onCallHangup = function(call) {
         if (call == $rootScope.currentCall) {
-            $timeout(function() {
-                var icon = angular.element('#callEndedIcon');
-                $animate.addClass(icon, 'callIconRotate');
-                $timeout(function(){
-                    $rootScope.currentCall = undefined;
-                }, 4070);
-            }, 100);
+            $timeout(function(){
+                $rootScope.currentCall = undefined;
+            }, 4070);
         }
     }
 }]);
diff --git a/webclient/app.css b/webclient/app.css
index 634fa6bcc1..2564ce3286 100755
--- a/webclient/app.css
+++ b/webclient/app.css
@@ -55,20 +55,20 @@ a:active  { color: #000; }
     margin-left: 4px;
     margin-right: 4px;
     margin-top: 8px;
-    -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
-    -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
-    -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
-    transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
 }
 
-.callIconRotate {
-    -webkit-transform: rotateZ(45deg);
-    -moz-transform: rotateZ(45deg);
-    -ms-transform: rotateZ(45deg);
-    -o-transform: rotateZ(45deg);
+#callEndedIcon {
+    transition:all linear 0.5s;
+}
+
+#callEndedIcon {
     transform: rotateZ(45deg);
 }
 
+#callEndedIcon.ng-hide {
+    transform: rotateZ(0deg);
+}
+
 #callPeerImage {
     width: 32px;
     height: 32px;
diff --git a/webclient/app.js b/webclient/app.js
index d25e2a6234..9370f773b3 100644
--- a/webclient/app.js
+++ b/webclient/app.js
@@ -16,6 +16,7 @@ limitations under the License.
 
 var matrixWebClient = angular.module('matrixWebClient', [
     'ngRoute',
+    'ngAnimate',
     'MatrixWebClientController',
     'LoginController',
     'RegisterController',
diff --git a/webclient/index.html b/webclient/index.html
index 150b7c4407..dd2393722c 100644
--- a/webclient/index.html
+++ b/webclient/index.html
@@ -15,6 +15,7 @@
     <script src="js/angular.min.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 type='text/javascript' src='js/ng-infinite-scroll-matrix.js'></script>
     <script src="app.js"></script>
     <script src="config.js"></script>
-- 
cgit 1.5.1


From aa347b52bace5cfe1ff528ad16973e02ae1b5dc1 Mon Sep 17 00:00:00 2001
From: Emmanuel ROHEE <erohee@amdocs.com>
Date: Thu, 11 Sep 2014 15:07:44 +0200
Subject: Use autofill-event.js to workaround browsers issue: Form model
 doesn't update on autocomplete
 https://github.com/angular/angular.js/issues/1460

---
 webclient/index.html           |   1 +
 webclient/js/autofill-event.js | 117 +++++++++++++++++++++++++++++++++++++++++
 2 files changed, 118 insertions(+)
 create mode 100755 webclient/js/autofill-event.js

(limited to 'webclient/index.html')

diff --git a/webclient/index.html b/webclient/index.html
index dd2393722c..9eea08215c 100644
--- a/webclient/index.html
+++ b/webclient/index.html
@@ -17,6 +17,7 @@
     <script src="js/angular-sanitize.min.js"></script>
     <script src="js/angular-animate.min.js"></script>
     <script type='text/javascript' src='js/ng-infinite-scroll-matrix.js'></script>
+    <script type='text/javascript' src='js/autofill-event.js'></script>
     <script src="app.js"></script>
     <script src="config.js"></script>
     <script src="app-controller.js"></script>
diff --git a/webclient/js/autofill-event.js b/webclient/js/autofill-event.js
new file mode 100755
index 0000000000..006f83e1be
--- /dev/null
+++ b/webclient/js/autofill-event.js
@@ -0,0 +1,117 @@
+/**
+ * Autofill event polyfill ##version:1.0.0##
+ * (c) 2014 Google, Inc.
+ * License: MIT
+ */
+(function(window) {
+  var $ = window.jQuery || window.angular.element;
+  var rootElement = window.document.documentElement,
+    $rootElement = $(rootElement);
+
+  addGlobalEventListener('change', markValue);
+  addValueChangeByJsListener(markValue);
+
+  $.prototype.checkAndTriggerAutoFillEvent = jqCheckAndTriggerAutoFillEvent;
+
+  // Need to use blur and not change event
+  // as Chrome does not fire change events in all cases an input is changed
+  // (e.g. when starting to type and then finish the input by auto filling a username)
+  addGlobalEventListener('blur', function(target) {
+    // setTimeout needed for Chrome as it fills other
+    // form fields a little later...
+    window.setTimeout(function() {
+      findParentForm(target).find('input').checkAndTriggerAutoFillEvent();
+    }, 20);
+  });
+
+  window.document.addEventListener('DOMContentLoaded', function() {
+    // The timeout is needed for Chrome as it auto fills
+    // login forms some time after DOMContentLoaded!
+    window.setTimeout(function() {
+      $rootElement.find('input').checkAndTriggerAutoFillEvent();
+    }, 200);
+  }, false);
+
+  return;
+
+  // ----------
+
+  function jqCheckAndTriggerAutoFillEvent() {
+    var i, el;
+    for (i=0; i<this.length; i++) {
+      el = this[i];
+      if (!valueMarked(el)) {
+        markValue(el);
+        triggerChangeEvent(el);
+      }
+    }
+  }
+
+  function valueMarked(el) {
+    var val = el.value,
+         $$currentValue = el.$$currentValue;
+    if (!val && !$$currentValue) {
+      return true;
+    }
+    return val === $$currentValue;
+  }
+
+  function markValue(el) {
+    el.$$currentValue = el.value;
+  }
+
+  function addValueChangeByJsListener(listener) {
+    var jq = window.jQuery || window.angular.element,
+        jqProto = jq.prototype;
+    var _val = jqProto.val;
+    jqProto.val = function(newValue) {
+      var res = _val.apply(this, arguments);
+      if (arguments.length > 0) {
+        forEach(this, function(el) {
+          listener(el, newValue);
+        });
+      }
+      return res;
+    }
+  }
+
+  function addGlobalEventListener(eventName, listener) {
+    // Use a capturing event listener so that
+    // we also get the event when it's stopped!
+    // Also, the blur event does not bubble.
+    rootElement.addEventListener(eventName, onEvent, true);
+
+    function onEvent(event) {
+      var target = event.target;
+      listener(target);
+    }
+  }
+
+  function findParentForm(el) {
+    while (el) {
+      if (el.nodeName === 'FORM') {
+        return $(el);
+      }
+      el = el.parentNode;
+    }
+    return $();
+  }
+
+  function forEach(arr, listener) {
+    if (arr.forEach) {
+      return arr.forEach(listener);
+    }
+    var i;
+    for (i=0; i<arr.length; i++) {
+      listener(arr[i]);
+    }
+  }
+
+  function triggerChangeEvent(element) {
+    var doc = window.document;
+    var event = doc.createEvent("HTMLEvents");
+    event.initEvent("change", true, true);
+    element.dispatchEvent(event);
+  }
+
+})(window);
-- 
cgit 1.5.1