From 1edea2a62cb23052bcc5714762c72a2402c70c3a Mon Sep 17 00:00:00 2001 From: Kegan Dougal Date: Fri, 20 Nov 2015 12:02:23 +0000 Subject: [PATCH 1/4] Add a PostRegistration component; hook it up to MatrixChat. --- src/components/login/Registration.js | 21 +------------------- src/skins/vector/views/pages/MatrixChat.js | 23 ++++++++++++++++++++-- 2 files changed, 22 insertions(+), 22 deletions(-) diff --git a/src/components/login/Registration.js b/src/components/login/Registration.js index 8fda406d4..b06f9ffef 100644 --- a/src/components/login/Registration.js +++ b/src/components/login/Registration.js @@ -173,31 +173,12 @@ module.exports = React.createClass({ }); }, - // TODO: - // This should really be a different component which MatrixChat then - // instantiates rather than having it pollute registration logic. There is - // no reason to wedge them together here. This function is currently NOT CALLED. - _getPostRegisterJsx: function() { - var ChangeDisplayName = sdk.getComponent('molecules.ChangeDisplayName'); - var ChangeAvatar = sdk.getComponent('molecules.ChangeAvatar'); - return ( -
- Set a display name: - - Upload an avatar: - - -
- ); - }, - _getRegisterContentJsx: function() { var currStep = this.registerLogic.getStep(); var registerStep; switch (currStep) { case "Register.COMPLETE": - return; // this._getPostRegisterJsx(); + break; // NOP case "Register.START": case "Register.STEP_m.login.dummy": registerStep = ( diff --git a/src/skins/vector/views/pages/MatrixChat.js b/src/skins/vector/views/pages/MatrixChat.js index 81268d5ad..9690533f5 100644 --- a/src/skins/vector/views/pages/MatrixChat.js +++ b/src/skins/vector/views/pages/MatrixChat.js @@ -27,6 +27,7 @@ var Matrix = require("matrix-js-sdk"); var ContextualMenu = require("../../../../ContextualMenu"); var Login = require("../../../../components/login/Login"); var Registration = require("../../../../components/login/Registration"); +var PostRegistration = require("../../../../components/login/PostRegistration"); var config = require("../../../../../config.json"); module.exports = React.createClass({ @@ -109,6 +110,17 @@ module.exports = React.createClass({ this.showScreen("login"); }, + onRegistered: function(credentials) { + this.onLoggedIn(credentials); + // do post-registration stuff + this.showScreen("post_registration"); + }, + + onFinishPostRegistration: function() { + console.log("onFinishPostRegistration"); + this.showScreen("settings"); + }, + render: function() { var LeftPanel = sdk.getComponent('organisms.LeftPanel'); var RoomView = sdk.getComponent('organisms.RoomView'); @@ -119,7 +131,14 @@ module.exports = React.createClass({ var MatrixToolbar = sdk.getComponent('molecules.MatrixToolbar'); var Notifier = sdk.getComponent('organisms.Notifier'); - if (this.state.logged_in && this.state.ready) { + // needs to be before normal PageTypes as you are logged in technically + if (this.state.screen == 'post_registration') { + return ( + + ); + } + else if (this.state.logged_in && this.state.ready) { var page_element; var right_panel = ""; @@ -185,7 +204,7 @@ module.exports = React.createClass({ hsUrl={config.default_hs_url} isUrl={config.default_is_url} registrationUrl={this.props.registrationUrl} - onLoggedIn={this.onLoggedIn} + onLoggedIn={this.onRegistered} onLoginClick={this.onLoginClick} /> ); } else { From 37254e624376bb9dbbdab8d8e50f4a2004229501 Mon Sep 17 00:00:00 2001 From: Kegan Dougal Date: Fri, 20 Nov 2015 12:02:37 +0000 Subject: [PATCH 2/4] Add PostRegistration component --- src/components/login/PostRegistration.js | 85 ++++++++++++++++++++++++ 1 file changed, 85 insertions(+) create mode 100644 src/components/login/PostRegistration.js diff --git a/src/components/login/PostRegistration.js b/src/components/login/PostRegistration.js new file mode 100644 index 000000000..28e825eee --- /dev/null +++ b/src/components/login/PostRegistration.js @@ -0,0 +1,85 @@ +/* +Copyright 2015 OpenMarket 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. +*/ + +'use strict'; + +var React = require('react'); + +var sdk = require('matrix-react-sdk'); +var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg'); + +module.exports = React.createClass({ + displayName: 'PostRegistration', + + propTypes: { + onComplete: React.PropTypes.func.isRequired + }, + + getInitialState: function() { + return { + avatarUrl: null, + errorString: null, + busy: false + }; + }, + + componentWillMount: function() { + // There is some assymetry between ChangeDisplayName and ChangeAvatar, + // as ChangeDisplayName will auto-get the name but ChangeAvatar expects + // the URL to be passed to you (because it's also used for room avatars). + var cli = MatrixClientPeg.get(); + this.setState({busy: true}); + var self = this; + cli.getProfileInfo(cli.credentials.userId).done(function(result) { + console.log("Avatar: %s", MatrixClientPeg.get().mxcUrlToHttp(result.avatar_url)); + self.setState({ + avatarUrl: MatrixClientPeg.get().mxcUrlToHttp(result.avatar_url), + busy: false + }); + }, function(error) { + self.setState({ + errorString: "Failed to fetch avatar URL", + busy: false + }); + }); + }, + + onProfileContinueClicked: function() { + console.log("onProfileContinueClicked"); + }, + + render: function() { + var ChangeDisplayName = sdk.getComponent('molecules.ChangeDisplayName'); + var ChangeAvatar = sdk.getComponent('molecules.ChangeAvatar'); + return ( +
+
+
+ vector +
+
+ Set a display name: + + Upload an avatar: + + +
+
+
+ ); + } +}); From 2e376b1eb9a08f34867df66d19149bb7c1a6b7dd Mon Sep 17 00:00:00 2001 From: Kegan Dougal Date: Fri, 20 Nov 2015 14:27:39 +0000 Subject: [PATCH 3/4] Clear the 'screen' to load the main left/middle/right panels, then show the settings after post-reg is done --- src/components/login/PostRegistration.js | 8 ++------ src/skins/vector/views/pages/MatrixChat.js | 4 ++++ 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/login/PostRegistration.js b/src/components/login/PostRegistration.js index 28e825eee..20a58f114 100644 --- a/src/components/login/PostRegistration.js +++ b/src/components/login/PostRegistration.js @@ -44,7 +44,6 @@ module.exports = React.createClass({ this.setState({busy: true}); var self = this; cli.getProfileInfo(cli.credentials.userId).done(function(result) { - console.log("Avatar: %s", MatrixClientPeg.get().mxcUrlToHttp(result.avatar_url)); self.setState({ avatarUrl: MatrixClientPeg.get().mxcUrlToHttp(result.avatar_url), busy: false @@ -57,10 +56,6 @@ module.exports = React.createClass({ }); }, - onProfileContinueClicked: function() { - console.log("onProfileContinueClicked"); - }, - render: function() { var ChangeDisplayName = sdk.getComponent('molecules.ChangeDisplayName'); var ChangeAvatar = sdk.getComponent('molecules.ChangeAvatar'); @@ -76,7 +71,8 @@ module.exports = React.createClass({ Upload an avatar: - + + {this.state.errorString} diff --git a/src/skins/vector/views/pages/MatrixChat.js b/src/skins/vector/views/pages/MatrixChat.js index 9690533f5..7a583495f 100644 --- a/src/skins/vector/views/pages/MatrixChat.js +++ b/src/skins/vector/views/pages/MatrixChat.js @@ -118,6 +118,10 @@ module.exports = React.createClass({ onFinishPostRegistration: function() { console.log("onFinishPostRegistration"); + // Don't confuse this with "PageType" which is the middle window to show + this.setState({ + screen: undefined + }); this.showScreen("settings"); }, From 29ee7d2b13fe40ae89975ab31cfb470edfa121c4 Mon Sep 17 00:00:00 2001 From: Kegan Dougal Date: Fri, 20 Nov 2015 14:34:26 +0000 Subject: [PATCH 4/4] Remove useless logging --- src/skins/vector/views/pages/MatrixChat.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/skins/vector/views/pages/MatrixChat.js b/src/skins/vector/views/pages/MatrixChat.js index 7a583495f..2783a77f7 100644 --- a/src/skins/vector/views/pages/MatrixChat.js +++ b/src/skins/vector/views/pages/MatrixChat.js @@ -117,7 +117,6 @@ module.exports = React.createClass({ }, onFinishPostRegistration: function() { - console.log("onFinishPostRegistration"); // Don't confuse this with "PageType" which is the middle window to show this.setState({ screen: undefined