Fix disabled Welcome page broken with the introduction of React

The React-based rewrite looks whether there's a room name (in the
window's location) in order to choose between WelcomePage and
Conference. But app.js expects Conference to be rendered before it
builds a room name if WelcomePage is disabled and there's no room name.
A quick and dirty workaround is to render Conference within WelcomePage
so that the rendered result closely resembles index.html before the
React-based rewrite.
This commit is contained in:
Lyubomir Marinov 2016-11-30 14:38:47 -06:00
parent 9f26270a98
commit bdc67201e2
2 changed files with 30 additions and 18 deletions

23
app.js
View File

@ -192,9 +192,18 @@ function init() {
APP.ConferenceUrl = new ConferenceUrl(window.location);
// Clean up the URL displayed by the browser
replaceHistoryState(APP.ConferenceUrl.getInviteUrl());
// TODO The execution of the mobile app starts from react/index.native.js.
// Similarly, the execution of the Web app should start from
// react/index.web.js for the sake of consistency and ease of understanding.
// Temporarily though because we are at the beginning of introducing React
// into the Web app, allow the execution of the Web app to start from app.js
// in order to reduce the complexity of the beginning step.
require('./react');
const isUIReady = APP.UI.start();
if (isUIReady) {
APP.conference.init({roomName: buildRoomName()}).then(function () {
APP.conference.init({roomName: buildRoomName()}).then(() => {
if (APP.logCollector) {
// Start the LogCollector's periodic "store logs" task only if
@ -227,13 +236,13 @@ function init() {
APP.UI.initConference();
APP.UI.addListener(UIEvents.LANG_CHANGED, function (language) {
APP.UI.addListener(UIEvents.LANG_CHANGED, language => {
APP.translation.setLanguage(language);
APP.settings.setLanguage(language);
});
APP.keyboardshortcut.init();
}).catch(function (err) {
}).catch(err => {
APP.UI.hideRingOverLay();
APP.API.notifyConferenceLeft(APP.conference.roomName);
logger.error(err);
@ -284,14 +293,6 @@ $(document).ready(function () {
URLProcessor.setConfigParametersFromUrl();
// TODO The execution of the mobile app starts from react/index.native.js.
// Similarly, the execution of the Web app should start from
// react/index.web.js for the sake of consistency and ease of understanding.
// Temporarily though because we are at the beginning of introducing React
// into the Web app, allow the execution of the Web app to start from app.js
// in order to reduce the complexity of the beginning step.
require('./react');
APP.init();
APP.translation.init(settings.getLanguage());

View File

@ -1,5 +1,7 @@
import React, { Component } from 'react';
import { Conference } from '../../conference';
/**
* The web container rendering the welcome page.
*/
@ -12,7 +14,14 @@ export default class WelcomePage extends Component {
* @returns {ReactElement|null}
*/
render() {
// FIXME The rendering of Conference bellow is a very quick and dirty
// temporary fix for the following issue: when the WelcomePage is
// disabled, app.js expects Conference to be rendered already and only
// then it builds a room name but the App component expects the room
// name to be built already (by looking at the window's location) in
// order to choose between WelcomePage and Conference.
return (
<div>
<div id = 'welcome_page'>
{
this._renderHeader()
@ -21,6 +30,8 @@ export default class WelcomePage extends Component {
this._renderMain()
}
</div>
<Conference />
</div>
);
}