add sounds to the calling interface

pull/10/head
David Baker 2014-09-08 16:10:36 +01:00
parent 1dc4ad1efa
commit 972f664b6b
11 changed files with 75 additions and 14 deletions

View File

@ -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);
}
}]);

View File

@ -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() {

View File

@ -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;

BIN
webclient/media/busy.mp3 Normal file

Binary file not shown.

BIN
webclient/media/busy.ogg Normal file

Binary file not shown.

BIN
webclient/media/callend.mp3 Normal file

Binary file not shown.

BIN
webclient/media/callend.ogg Normal file

Binary file not shown.

BIN
webclient/media/ring.mp3 Normal file

Binary file not shown.

BIN
webclient/media/ring.ogg Normal file

Binary file not shown.

Binary file not shown.

Binary file not shown.