Merge pull request #876 from jitsi/ui-ringoverlay-stop

feat(ringoverlay): Stop ringing after 30s and change the message
This commit is contained in:
yanas 2016-09-14 21:44:59 -05:00 committed by GitHub
commit f37fd15fca
1 changed files with 20 additions and 7 deletions

View File

@ -27,12 +27,16 @@ class RingOverlay {
constructor(callee) { constructor(callee) {
this._containerId = 'ringOverlay'; this._containerId = 'ringOverlay';
this._audioContainerId = 'ringOverlayRinging'; this._audioContainerId = 'ringOverlayRinging';
this.isRinging = true;
this.callee = callee; this.callee = callee;
this.render(); this.render();
this.audio = document.getElementById(this._audioContainerId); this.audio = document.getElementById(this._audioContainerId);
this.audio.play(); this.audio.play();
this._setAudioTimeout(); this._setAudioTimeout();
this._timeout = setTimeout(() => {
this.destroy();
this.render();
}, 30000);
} }
/** /**
@ -54,13 +58,15 @@ class RingOverlay {
* Builds and appends the ring overlay to the html document * Builds and appends the ring overlay to the html document
*/ */
_getHtmlStr(callee) { _getHtmlStr(callee) {
let callingLabel = this.isRinging? "<p>Calling...</p>" : "";
let callerStateLabel = this.isRinging? "" : " isn't available";
return ` return `
<div id="${this._containerId}" class='ringing' > <div id="${this._containerId}" class='ringing' >
<div class='ringing__content'> <div class='ringing__content'>
<p>Calling...</p> ${callingLabel}
<img class='ringing__avatar' src="${callee.getAvatarUrl()}" /> <img class='ringing__avatar' src="${callee.getAvatarUrl()}" />
<div class="ringing__caller-info"> <div class="ringing__caller-info">
<p>${callee.getName()}</p> <p>${callee.getName()}${callerStateLabel}</p>
</div> </div>
</div> </div>
<audio id="${this._audioContainerId}" src="/sounds/ring.ogg" /> <audio id="${this._audioContainerId}" src="/sounds/ring.ogg" />
@ -80,10 +86,7 @@ class RingOverlay {
* related to the ring overlay. * related to the ring overlay.
*/ */
destroy() { destroy() {
if (this.interval) { this._stopAudio();
clearInterval(this.interval);
}
this._detach(); this._detach();
} }
@ -95,6 +98,16 @@ class RingOverlay {
$(`#${this._containerId}`).remove(); $(`#${this._containerId}`).remove();
} }
_stopAudio() {
this.isRinging = false;
if (this.interval) {
clearInterval(this.interval);
}
if(this._timeout) {
clearTimeout(this._timeout);
}
}
/** /**
* Sets the interval that is going to play the ringing sound. * Sets the interval that is going to play the ringing sound.
*/ */