feat: introduce ConferenceUrl module
We need to make sure that on the page reload all original parameters used to load the conference are preserved. New modules helps to manage different types of conference URLs like the one used for invites and the one for reloading the page.
This commit is contained in:
parent
210605d8f3
commit
f7bfe8d8bf
17
app.js
17
app.js
|
@ -19,6 +19,7 @@ import 'aui-experimental-css';
|
||||||
window.toastr = require("toastr");
|
window.toastr = require("toastr");
|
||||||
|
|
||||||
import URLProcessor from "./modules/config/URLProcessor";
|
import URLProcessor from "./modules/config/URLProcessor";
|
||||||
|
import ConferenceUrl from './modules/URL/ConferenceUrl';
|
||||||
import RoomnameGenerator from './modules/util/RoomnameGenerator';
|
import RoomnameGenerator from './modules/util/RoomnameGenerator';
|
||||||
|
|
||||||
import UI from "./modules/UI/UI";
|
import UI from "./modules/UI/UI";
|
||||||
|
@ -47,6 +48,18 @@ function pushHistoryState(roomName, URL) {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Replaces current history state(replaces the URL displayed by the browser).
|
||||||
|
* @param {string} newUrl the URL string which is to be displayed by the browser
|
||||||
|
* to the user.
|
||||||
|
*/
|
||||||
|
function replaceHistoryState (newUrl) {
|
||||||
|
if (window.history
|
||||||
|
&& typeof window.history.replaceState === 'function') {
|
||||||
|
window.history.replaceState({}, document.title, newUrl);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Builds and returns the room name.
|
* Builds and returns the room name.
|
||||||
*/
|
*/
|
||||||
|
@ -107,6 +120,10 @@ function setTokenData() {
|
||||||
|
|
||||||
function init() {
|
function init() {
|
||||||
setTokenData();
|
setTokenData();
|
||||||
|
// Initialize the conference URL handler
|
||||||
|
ConferenceUrl.init(window.location);
|
||||||
|
// Clean up the URL displayed by the browser
|
||||||
|
replaceHistoryState(ConferenceUrl.getInviteUrl());
|
||||||
var isUIReady = APP.UI.start();
|
var isUIReady = APP.UI.start();
|
||||||
if (isUIReady) {
|
if (isUIReady) {
|
||||||
APP.conference.init({roomName: buildRoomName()}).then(function () {
|
APP.conference.init({roomName: buildRoomName()}).then(function () {
|
||||||
|
|
|
@ -258,19 +258,6 @@ UI.setLocalRaisedHandStatus = (raisedHandStatus) => {
|
||||||
*/
|
*/
|
||||||
UI.initConference = function () {
|
UI.initConference = function () {
|
||||||
let id = APP.conference.getMyUserId();
|
let id = APP.conference.getMyUserId();
|
||||||
|
|
||||||
// Do not include query parameters in the invite URL
|
|
||||||
// "https:" + "//" + "example.com:8888" + "/SomeConference1245"
|
|
||||||
var inviteURL = window.location.protocol + "//" +
|
|
||||||
window.location.host + window.location.pathname;
|
|
||||||
|
|
||||||
this.emitEvent(UIEvents.INVITE_URL_INITIALISED, inviteURL);
|
|
||||||
|
|
||||||
// Clean up the URL displayed by the browser
|
|
||||||
if (window.history && typeof window.history.replaceState === 'function') {
|
|
||||||
window.history.replaceState({}, document.title, inviteURL);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Add myself to the contact list.
|
// Add myself to the contact list.
|
||||||
UI.ContactList.addContact(id, true);
|
UI.ContactList.addContact(id, true);
|
||||||
|
|
||||||
|
|
|
@ -3,6 +3,7 @@
|
||||||
import InviteDialogView from './InviteDialogView';
|
import InviteDialogView from './InviteDialogView';
|
||||||
import createRoomLocker from './RoomLocker';
|
import createRoomLocker from './RoomLocker';
|
||||||
import UIEvents from '../../../service/UI/UIEvents';
|
import UIEvents from '../../../service/UI/UIEvents';
|
||||||
|
import ConferenceUrl from '../../URL/ConferenceUrl';
|
||||||
|
|
||||||
const ConferenceEvents = JitsiMeetJS.events.conference;
|
const ConferenceEvents = JitsiMeetJS.events.conference;
|
||||||
|
|
||||||
|
@ -14,6 +15,7 @@ const ConferenceEvents = JitsiMeetJS.events.conference;
|
||||||
class Invite {
|
class Invite {
|
||||||
constructor(conference) {
|
constructor(conference) {
|
||||||
this.conference = conference;
|
this.conference = conference;
|
||||||
|
this.inviteUrl = ConferenceUrl.getInviteUrl();
|
||||||
this.createRoomLocker(conference);
|
this.createRoomLocker(conference);
|
||||||
this.registerListeners();
|
this.registerListeners();
|
||||||
}
|
}
|
||||||
|
@ -48,11 +50,6 @@ class Invite {
|
||||||
APP.UI.addListener( UIEvents.INVITE_CLICKED,
|
APP.UI.addListener( UIEvents.INVITE_CLICKED,
|
||||||
() => { this.openLinkDialog(); });
|
() => { this.openLinkDialog(); });
|
||||||
|
|
||||||
APP.UI.addListener( UIEvents.INVITE_URL_INITIALISED,
|
|
||||||
(inviteUrl) => {
|
|
||||||
this.updateInviteUrl(inviteUrl);
|
|
||||||
});
|
|
||||||
|
|
||||||
APP.UI.addListener( UIEvents.PASSWORD_REQUIRED,
|
APP.UI.addListener( UIEvents.PASSWORD_REQUIRED,
|
||||||
() => {
|
() => {
|
||||||
this.setLockedFromElsewhere(true);
|
this.setLockedFromElsewhere(true);
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
/* global $, APP, AJS */
|
/* global $, APP, AJS */
|
||||||
|
|
||||||
import { reload } from '../../util/helpers';
|
import ConferenceUrl from '../../URL/ConferenceUrl';
|
||||||
|
|
||||||
let $overlay;
|
let $overlay;
|
||||||
|
|
||||||
|
@ -78,9 +78,8 @@ function start(timeoutSeconds) {
|
||||||
updateDisplay();
|
updateDisplay();
|
||||||
|
|
||||||
if (timeLeft === 0) {
|
if (timeLeft === 0) {
|
||||||
console.info("Reloading!");
|
|
||||||
window.clearInterval(intervalId);
|
window.clearInterval(intervalId);
|
||||||
reload();
|
ConferenceUrl.reload();
|
||||||
}
|
}
|
||||||
}, 1000);
|
}, 1000);
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,73 @@
|
||||||
|
|
||||||
|
import { redirect } from '../util/helpers';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Stores the original conference room URL with all parameters.
|
||||||
|
* @type {string}
|
||||||
|
*/
|
||||||
|
let originalURL;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* A simplified version of the conference URL stripped out of the parameters
|
||||||
|
* which should be used for sending invites.
|
||||||
|
* @type {string}
|
||||||
|
*/
|
||||||
|
let inviteURL;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* The modules stores information about the URL used to start the conference and
|
||||||
|
* provides utility methods for dealing with conference URL and reloads.
|
||||||
|
*/
|
||||||
|
export default {
|
||||||
|
/**
|
||||||
|
* Initializes the module.
|
||||||
|
*
|
||||||
|
* @param location an object which stores provides the info about conference
|
||||||
|
* URL(would be 'window.location' for the Web app). The params below are
|
||||||
|
* described based on the following example URL:
|
||||||
|
*
|
||||||
|
* https://example.com:8888/SomeConference1245?opt=1#somehash
|
||||||
|
*
|
||||||
|
* @param location.href full URL with all parameters, would be the whole URL
|
||||||
|
* from the example string above.
|
||||||
|
*
|
||||||
|
* @param location.host the host part of the URL, 'example.com' from
|
||||||
|
* the sample URL above.
|
||||||
|
*
|
||||||
|
* @param location.pathname the path part of the URL, would be
|
||||||
|
* '/SomeConference1245' from the example above.
|
||||||
|
*
|
||||||
|
* @param location.protocol the protocol part of the URL, would be 'https:'
|
||||||
|
* from the sample URL.
|
||||||
|
*/
|
||||||
|
init(location) {
|
||||||
|
originalURL = location.href;
|
||||||
|
// "https:" + "//" + "example.com:8888" + "/SomeConference1245"
|
||||||
|
inviteURL
|
||||||
|
= location.protocol + "//" + location.host + location.pathname;
|
||||||
|
console.info("Stored original conference URL: " + originalURL);
|
||||||
|
console.info("Conference URL for invites: " + inviteURL);
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* Obtains the conference invite URL.
|
||||||
|
* @return {string} the URL pointing o the conference which is mean to be
|
||||||
|
* used to invite new participants.
|
||||||
|
*/
|
||||||
|
getInviteUrl() {
|
||||||
|
return inviteURL;
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* Obtains full conference URL with all original parameters.
|
||||||
|
* @return {string} the original URL used to open the current conference.
|
||||||
|
*/
|
||||||
|
getOriginalUrl() {
|
||||||
|
return originalURL;
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* Reloads the conference using original URL with all of the parameters.
|
||||||
|
*/
|
||||||
|
reload() {
|
||||||
|
console.info("Reloading the conference using URL: " + originalURL);
|
||||||
|
redirect(originalURL);
|
||||||
|
}
|
||||||
|
};
|
|
@ -20,6 +20,15 @@ export function reload () {
|
||||||
window.location.reload();
|
window.location.reload();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Redirects to new URL.
|
||||||
|
* @param {string} url the URL pointing to the location where the user should
|
||||||
|
* be redirected to.
|
||||||
|
*/
|
||||||
|
export function redirect (url) {
|
||||||
|
window.location.replace(url);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Prints the error and reports it to the global error handler.
|
* Prints the error and reports it to the global error handler.
|
||||||
* @param e {Error} the error
|
* @param e {Error} the error
|
||||||
|
|
|
@ -145,11 +145,6 @@ export default {
|
||||||
*/
|
*/
|
||||||
DISPLAY_NAME_CHANGED: "UI.display_name_changed",
|
DISPLAY_NAME_CHANGED: "UI.display_name_changed",
|
||||||
|
|
||||||
/**
|
|
||||||
* Indicates that the invite url has been initialised.
|
|
||||||
*/
|
|
||||||
INVITE_URL_INITIALISED: "UI.invite_url_initialised",
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Indicates that a password is required for the call.
|
* Indicates that a password is required for the call.
|
||||||
*/
|
*/
|
||||||
|
|
Loading…
Reference in New Issue