Add separate welcome view

This commit is contained in:
J. Ryan Stinnett 2019-02-07 16:25:09 +00:00
parent 73de56d72d
commit 843f86fc1c
4 changed files with 87 additions and 14 deletions

View file

@ -33,6 +33,8 @@ export default class EmbeddedPage extends React.PureComponent {
url: PropTypes.string, url: PropTypes.string,
// Class name prefix to apply for a given instance // Class name prefix to apply for a given instance
className: PropTypes.string, className: PropTypes.string,
// Whether to wrap the page in a scrollbar
scrollbar: PropTypes.bool,
}; };
static contextTypes = { static contextTypes = {
@ -83,19 +85,28 @@ export default class EmbeddedPage extends React.PureComponent {
} }
render() { render() {
const isGuest = this.context.matrixClient.isGuest(); const client = this.context.matrixClient;
const isGuest = client ? client.isGuest() : true;
const className = this.props.className; const className = this.props.className;
const classes = classnames({ const classes = classnames({
[className]: true, [className]: true,
[`${className}_guest`]: isGuest, [`${className}_guest`]: isGuest,
}); });
const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper"); const content = <div className={`${className}_body`}
return <GeminiScrollbarWrapper autoshow={true} className={classes}> dangerouslySetInnerHTML={{ __html: this.state.page }}
<div className={`${className}_body`} >
dangerouslySetInnerHTML={{ __html: this.state.page }} </div>;
>
</div> if (this.props.scrollbar) {
</GeminiScrollbarWrapper>; const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper");
return <GeminiScrollbarWrapper autoshow={true} className={classes}>
{content}
</GeminiScrollbarWrapper>;
} else {
return <div className={classes}>
{content}
</div>;
}
} }
} }

View file

@ -461,6 +461,7 @@ const LoggedInView = React.createClass({
{ {
pageElement = <EmbeddedPage className="mx_HomePage" pageElement = <EmbeddedPage className="mx_HomePage"
url={this.props.config.welcomePageUrl || 'home.html'} url={this.props.config.welcomePageUrl || 'home.html'}
scrollbar={true}
/>; />;
} }
break; break;

View file

@ -60,27 +60,30 @@ const VIEWS = {
// trying to re-animate a matrix client or register as a guest. // trying to re-animate a matrix client or register as a guest.
LOADING: 0, LOADING: 0,
// we are showing the welcome view
WELCOME: 1,
// we are showing the login view // we are showing the login view
LOGIN: 1, LOGIN: 2,
// we are showing the registration view // we are showing the registration view
REGISTER: 2, REGISTER: 3,
// completeing the registration flow // completeing the registration flow
POST_REGISTRATION: 3, POST_REGISTRATION: 4,
// showing the 'forgot password' view // showing the 'forgot password' view
FORGOT_PASSWORD: 4, FORGOT_PASSWORD: 5,
// we have valid matrix credentials (either via an explicit login, via the // we have valid matrix credentials (either via an explicit login, via the
// initial re-animation/guest registration, or via a registration), and are // initial re-animation/guest registration, or via a registration), and are
// now setting up a matrixclient to talk to it. This isn't an instant // now setting up a matrixclient to talk to it. This isn't an instant
// process because we need to clear out indexeddb. While it is going on we // process because we need to clear out indexeddb. While it is going on we
// show a big spinner. // show a big spinner.
LOGGING_IN: 5, LOGGING_IN: 6,
// we are logged in with an active matrix client. // we are logged in with an active matrix client.
LOGGED_IN: 6, LOGGED_IN: 7,
}; };
// Actions that are redirected through the onboarding process prior to being // Actions that are redirected through the onboarding process prior to being
@ -606,6 +609,9 @@ export default React.createClass({
case 'view_group': case 'view_group':
this._viewGroup(payload); this._viewGroup(payload);
break; break;
case 'view_welcome_page':
this._viewWelcome();
break;
case 'view_home_page': case 'view_home_page':
this._viewHome(); this._viewHome();
break; break;
@ -881,6 +887,13 @@ export default React.createClass({
this.notifyNewScreen('group/' + groupId); this.notifyNewScreen('group/' + groupId);
}, },
_viewWelcome() {
this.setStateForNewView({
view: VIEWS.WELCOME,
});
this.notifyNewScreen('welcome');
},
_viewHome: function() { _viewHome: function() {
// The home page requires the "logged in" view, so we'll set that. // The home page requires the "logged in" view, so we'll set that.
this.setStateForNewView({ this.setStateForNewView({
@ -1466,6 +1479,10 @@ export default React.createClass({
dis.dispatch({ dis.dispatch({
action: 'view_user_settings', action: 'view_user_settings',
}); });
} else if (screen == 'welcome') {
dis.dispatch({
action: 'view_welcome_page',
});
} else if (screen == 'home') { } else if (screen == 'home') {
dis.dispatch({ dis.dispatch({
action: 'view_home_page', action: 'view_home_page',
@ -1849,6 +1866,11 @@ export default React.createClass({
} }
} }
if (this.state.view === VIEWS.WELCOME) {
const Welcome = sdk.getComponent('auth.Welcome');
return <Welcome />;
}
if (this.state.view === VIEWS.REGISTER) { if (this.state.view === VIEWS.REGISTER) {
const Registration = sdk.getComponent('structures.auth.Registration'); const Registration = sdk.getComponent('structures.auth.Registration');
return ( return (

View file

@ -0,0 +1,39 @@
/*
Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import React from 'react';
import sdk from '../../../index';
import SdkConfig from '../../../SdkConfig';
export default class Welcome extends React.PureComponent {
render() {
const AuthPage = sdk.getComponent("auth.AuthPage");
const AuthHeader = sdk.getComponent("auth.AuthHeader");
const AuthBody = sdk.getComponent("auth.AuthBody");
const EmbeddedPage = sdk.getComponent('structures.EmbeddedPage');
return (
<AuthPage>
<AuthHeader />
<AuthBody>
<EmbeddedPage className="mx_WelcomePage"
url={SdkConfig.get().welcomePageUrl || 'home.html'}
/>
</AuthBody>
</AuthPage>
);
}
}