haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(ringoverlay): Stop ringing after 30s and change the message

This commit is contained in:
hristoterezov 2016-09-14 17:55:43 -05:00
parent e1fa5ecb34
commit ad5fa13339
1 changed files with 20 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
modules/UI/ring_overlay/RingOverlay.js
View File

@ -11,25 +11,31 @@ 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);
} }
/** /**
* 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" />
@ -49,10 +55,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();
} }
@ -64,6 +67,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.
*/ */