Fixes some issues pointed out from hristoterezov
This commit is contained in:
parent
c9488d5ee9
commit
642fa8d6f8
|
@ -17,7 +17,7 @@ import Recording from "./recording/Recording";
|
|||
import GumPermissionsOverlay
|
||||
from './gum_overlay/UserMediaPermissionsGuidanceOverlay';
|
||||
|
||||
import PageReloadOverlay from './reload_overlay/PageReloadOverlay';
|
||||
import * as PageReloadOverlay from './reload_overlay/PageReloadOverlay';
|
||||
import SuspendedOverlay from './suspended_overlay/SuspendedOverlay';
|
||||
import VideoLayout from "./videolayout/VideoLayout";
|
||||
import FilmStrip from "./videolayout/FilmStrip";
|
||||
|
|
|
@ -15,13 +15,20 @@ export default class Overlay{
|
|||
* @type {jQuery}
|
||||
*/
|
||||
this.$overlay = null;
|
||||
|
||||
/**
|
||||
* Indicates if this overlay should use the light look & feel or the
|
||||
* standard one.
|
||||
* @type {boolean}
|
||||
*/
|
||||
this.isLightOverlay = false;
|
||||
}
|
||||
/**
|
||||
* Template method which should be used by subclasses to provide the overlay
|
||||
* content. The contents provided by this method are later subject to
|
||||
* the translation using {@link APP.translation.translateElement}.
|
||||
* @return {string} HTML representation of the overlay dialog contents.
|
||||
* @private
|
||||
* @protected
|
||||
*/
|
||||
_buildOverlayContent() {
|
||||
return '';
|
||||
|
@ -31,8 +38,9 @@ export default class Overlay{
|
|||
*
|
||||
* @param isLightOverlay indicates that this will be a light overlay look
|
||||
* and feel.
|
||||
* @private
|
||||
*/
|
||||
buildOverlayHtml(isLightOverlay) {
|
||||
_buildOverlayHtml(isLightOverlay) {
|
||||
|
||||
let overlayContent = this._buildOverlayContent();
|
||||
|
||||
|
@ -59,21 +67,18 @@ export default class Overlay{
|
|||
/**
|
||||
* Template method called just after the overlay is displayed for the first
|
||||
* time.
|
||||
* @private
|
||||
* @protected
|
||||
*/
|
||||
_onShow() {
|
||||
// To be overridden by subclasses.
|
||||
}
|
||||
/**
|
||||
* Shows the overlay dialog adn attaches the underlying HTML representation
|
||||
* Shows the overlay dialog and attaches the underlying HTML representation
|
||||
* to the DOM.
|
||||
*
|
||||
* @param isLightOverlay indicates that this will be a light overlay look
|
||||
* and feel.
|
||||
*/
|
||||
show(isLightOverlay) {
|
||||
show() {
|
||||
|
||||
!this.$overlay && this.buildOverlayHtml(isLightOverlay);
|
||||
!this.$overlay && this._buildOverlayHtml(this.isLightOverlay);
|
||||
|
||||
if (!this.isVisible()) {
|
||||
this.$overlay.appendTo('body');
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
/* global $, APP, AJS */
|
||||
const logger = require("jitsi-meet-logger").getLogger(__filename);
|
||||
|
||||
import Overlay from '../overlay/Overlay';
|
||||
import Overlay from "../overlay/Overlay";
|
||||
|
||||
/**
|
||||
* An overlay dialog which is shown before the conference is reloaded. Shows
|
||||
|
@ -12,13 +12,14 @@ class PageReloadOverlayImpl extends Overlay{
|
|||
* Creates new <tt>PageReloadOverlayImpl</tt>
|
||||
* @param {number} timeoutSeconds how long the overlay dialog will be
|
||||
* displayed, before the conference will be reloaded.
|
||||
* @param {boolean} isDisconnect indicates if this reload screen is created
|
||||
* to indicate a disconnect
|
||||
* @param {boolean} isNetworkFailure <tt>true</tt> indicates that it's
|
||||
* caused by network related failure or <tt>false</tt> when it's
|
||||
* the infrastructure.
|
||||
* @param {string} title the title of the overlay message
|
||||
* @param {string} message the message of the overlay
|
||||
* @param {string} buttonHtml the button html or an empty string if there's
|
||||
* no button
|
||||
* @param {boolean} isLightOverlay indicates if the overlay should be a
|
||||
* light overlay or a standard one
|
||||
*/
|
||||
constructor(timeoutSeconds, isNetworkFailure) {
|
||||
constructor(timeoutSeconds, title, message, buttonHtml, isLightOverlay) {
|
||||
super();
|
||||
/**
|
||||
* Conference reload counter in seconds.
|
||||
|
@ -31,12 +32,10 @@ class PageReloadOverlayImpl extends Overlay{
|
|||
*/
|
||||
this.timeout = timeoutSeconds;
|
||||
|
||||
/**
|
||||
* Indicates that a network related failure is the reason for the
|
||||
* reload.
|
||||
* @type {boolean}
|
||||
*/
|
||||
this.isNetworkFailure = isNetworkFailure;
|
||||
this.title = title;
|
||||
this.message = message;
|
||||
this.buttonHtml = buttonHtml;
|
||||
this.isLightOverlay = isLightOverlay;
|
||||
}
|
||||
/**
|
||||
* Constructs overlay body with the warning message and count down towards
|
||||
|
@ -44,27 +43,10 @@ class PageReloadOverlayImpl extends Overlay{
|
|||
* @override
|
||||
*/
|
||||
_buildOverlayContent() {
|
||||
let title = (this.isNetworkFailure)
|
||||
? "dialog.conferenceDisconnectTitle"
|
||||
: "dialog.conferenceReloadTitle";
|
||||
let message = (this.isNetworkFailure)
|
||||
? "dialog.conferenceDisconnectMsg"
|
||||
: "dialog.conferenceReloadMsg";
|
||||
|
||||
let button = (this.isNetworkFailure)
|
||||
? `<button id="reconnectNow" data-i18n="dialog.reconnectNow"
|
||||
class="button-control button-control_primary
|
||||
button-control_center"></button>`
|
||||
: "";
|
||||
|
||||
$(document).on('click', '#reconnectNow', () => {
|
||||
APP.ConferenceUrl.reload();
|
||||
});
|
||||
|
||||
return `<div class="inlay">
|
||||
<span data-i18n=${title}
|
||||
<span data-i18n=${this.title}
|
||||
class='reload_overlay_title'></span>
|
||||
<span data-i18n=${message}
|
||||
<span data-i18n=${this.message}
|
||||
class='reload_overlay_msg'></span>
|
||||
<div>
|
||||
<div id='reloadProgressBar'
|
||||
|
@ -76,7 +58,7 @@ class PageReloadOverlayImpl extends Overlay{
|
|||
class='reload_overlay_msg'>
|
||||
</span>
|
||||
</div>
|
||||
${button}
|
||||
${this.buttonHtml}
|
||||
</div>`;
|
||||
}
|
||||
|
||||
|
@ -97,6 +79,9 @@ class PageReloadOverlayImpl extends Overlay{
|
|||
* @override
|
||||
*/
|
||||
_onShow() {
|
||||
$("#reconnectNow").click(() => {
|
||||
APP.ConferenceUrl.reload();
|
||||
});
|
||||
|
||||
// Initialize displays
|
||||
this.updateDisplay();
|
||||
|
@ -128,42 +113,63 @@ class PageReloadOverlayImpl extends Overlay{
|
|||
*/
|
||||
let overlay;
|
||||
|
||||
export default {
|
||||
/**
|
||||
* Checks whether the page reload overlay has been displayed.
|
||||
* @return {boolean} <tt>true</tt> if the page reload overlay is currently
|
||||
* visible or <tt>false</tt> otherwise.
|
||||
*/
|
||||
isVisible() {
|
||||
/**
|
||||
* Checks whether the page reload overlay has been displayed.
|
||||
* @return {boolean} <tt>true</tt> if the page reload overlay is currently
|
||||
* visible or <tt>false</tt> otherwise.
|
||||
*/
|
||||
export function isVisible() {
|
||||
return overlay && overlay.isVisible();
|
||||
},
|
||||
/**
|
||||
* Shows the page reload overlay which will do the conference reload after
|
||||
* the given amount of time.
|
||||
*
|
||||
* @param {number} timeoutSeconds how many seconds before the conference
|
||||
* reload will happen.
|
||||
* @param {boolean} isNetworkFailure <tt>true</tt> indicates that it's
|
||||
* caused by network related failure or <tt>false</tt> when it's
|
||||
* the infrastructure.
|
||||
* @param {string} reason a label string identifying the reason for the page
|
||||
* reload which will be included in details of the log event
|
||||
*/
|
||||
show(timeoutSeconds, isNetworkFailure, reason) {
|
||||
}
|
||||
|
||||
if (!overlay) {
|
||||
overlay
|
||||
= new PageReloadOverlayImpl(timeoutSeconds, isNetworkFailure);
|
||||
}
|
||||
// Log the page reload event
|
||||
if (!this.isVisible()) {
|
||||
// FIXME (CallStats - issue) this event will not make it to
|
||||
// the CallStats, because the log queue is not flushed, before
|
||||
// "fabric terminated" is sent to the backed
|
||||
APP.conference.logEvent(
|
||||
'page.reload', undefined /* value */, reason /* label */);
|
||||
}
|
||||
// If it's a network failure we enable the light overlay.
|
||||
overlay.show(isNetworkFailure);
|
||||
/**
|
||||
* Shows the page reload overlay which will do the conference reload after
|
||||
* the given amount of time.
|
||||
*
|
||||
* @param {number} timeoutSeconds how many seconds before the conference
|
||||
* reload will happen.
|
||||
* @param {boolean} isNetworkFailure <tt>true</tt> indicates that it's
|
||||
* caused by network related failure or <tt>false</tt> when it's
|
||||
* the infrastructure.
|
||||
* @param {string} reason a label string identifying the reason for the page
|
||||
* reload which will be included in details of the log event
|
||||
*/
|
||||
export function show(timeoutSeconds, isNetworkFailure, reason) {
|
||||
let title;
|
||||
let message;
|
||||
let buttonHtml;
|
||||
let isLightOverlay;
|
||||
|
||||
if (isNetworkFailure) {
|
||||
title = "dialog.conferenceDisconnectTitle";
|
||||
message = "dialog.conferenceDisconnectMsg";
|
||||
buttonHtml
|
||||
= `<button id="reconnectNow" data-i18n="dialog.reconnectNow"
|
||||
class="button-control button-control_primary
|
||||
button-control_center"></button>`;
|
||||
isLightOverlay = true;
|
||||
}
|
||||
};
|
||||
else {
|
||||
title = "dialog.conferenceReloadTitle";
|
||||
message = "dialog.conferenceReloadMsg";
|
||||
buttonHtml = "";
|
||||
isLightOverlay = false;
|
||||
}
|
||||
|
||||
if (!overlay) {
|
||||
overlay = new PageReloadOverlayImpl(timeoutSeconds,
|
||||
title,
|
||||
message,
|
||||
buttonHtml,
|
||||
isLightOverlay);
|
||||
}
|
||||
// Log the page reload event
|
||||
if (!this.isVisible()) {
|
||||
// FIXME (CallStats - issue) this event will not make it to
|
||||
// the CallStats, because the log queue is not flushed, before
|
||||
// "fabric terminated" is sent to the backed
|
||||
APP.conference.logEvent(
|
||||
'page.reload', undefined /* value */, reason /* label */);
|
||||
}
|
||||
overlay.show();
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue