imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #200 from matrix-org/matthew/loginfixes

Browse source 
Bring back lost functionality on login/register/password-reset screens
This commit is contained in:
Matthew Hodgson 2016-03-15 15:21:32 +00:00
commit 672a5cb89c
8 changed files with 206 additions and 86 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/components/views/login/CustomServerDialog.js
View file

@ -31,12 +31,11 @@ module.exports = React.createClass({
servers by specifying a different Home server URL.
<br/>
This allows you to use this app with an existing Matrix account on
a different Home server.
a different home server.
<br/>
<br/>
You can also set a custom Identity server but this will affect
people&#39;s ability to find you if you use a server in a group other
than the main Matrix.org group.
You can also set a custom identity server but this will typically prevent
interaction with users based on email address.
</span>
</div>
<div className="mx_Dialog_buttons">

21
src/components/views/login/PasswordLogin.js
View file

@ -23,13 +23,26 @@ var ReactDOM = require('react-dom');
module.exports = React.createClass({displayName: 'PasswordLogin',
propTypes: {
onSubmit: React.PropTypes.func.isRequired, // fn(username, password)
onForgotPasswordClick: React.PropTypes.func // fn()
onForgotPasswordClick: React.PropTypes.func, // fn()
initialUsername: React.PropTypes.string,
initialPassword: React.PropTypes.string,
onUsernameChanged: React.PropTypes.func,
onPasswordChanged: React.PropTypes.func,
},
getDefaultProps: function() {
return {
onUsernameChanged: function() {},
onPasswordChanged: function() {},
initialUsername: "",
initialPassword: "",
};
},
getInitialState: function() {
return {
username: "",
password: ""
username: this.props.initialUsername,
password: this.props.initialPassword,
};
},
@ -40,10 +53,12 @@ module.exports = React.createClass({displayName: 'PasswordLogin',
onUsernameChanged: function(ev) {
this.setState({username: ev.target.value});
this.props.onUsernameChanged(ev.target.value);
},
onPasswordChanged: function(ev) {
this.setState({password: ev.target.value});
this.props.onPasswordChanged(ev.target.value);
},
render: function() {

78
src/components/views/login/ServerConfig.js
View file

@ -29,8 +29,21 @@ module.exports = React.createClass({
propTypes: {
onHsUrlChanged: React.PropTypes.func,
onIsUrlChanged: React.PropTypes.func,
defaultHsUrl: React.PropTypes.string,
defaultIsUrl: React.PropTypes.string,
// default URLs are defined in config.json (or the hardcoded defaults)
// they are used if the user has not overridden them with a custom URL.
// In other words, if the custom URL is blank, the default is used.
defaultHsUrl: React.PropTypes.string, // e.g. https://matrix.org
defaultIsUrl: React.PropTypes.string, // e.g. https://vector.im
// custom URLs are explicitly provided by the user and override the
// default URLs. The user enters them via the component's input fields,
// which is reflected on these properties whenever on..UrlChanged fires.
// They are persisted in localStorage by MatrixClientPeg, and so can
// override the default URLs when the component initially loads.
customHsUrl: React.PropTypes.string,
customIsUrl: React.PropTypes.string,
withToggleButton: React.PropTypes.bool,
delayTimeMs: React.PropTypes.number // time to wait before invoking onChanged
},
@ -39,6 +52,8 @@ module.exports = React.createClass({
return {
onHsUrlChanged: function() {},
onIsUrlChanged: function() {},
customHsUrl: "",
customIsUrl: "",
withToggleButton: false,
delayTimeMs: 0
};
@ -46,19 +61,21 @@ module.exports = React.createClass({
getInitialState: function() {
return {
hs_url: this.props.defaultHsUrl,
is_url: this.props.defaultIsUrl,
original_hs_url: this.props.defaultHsUrl,
original_is_url: this.props.defaultIsUrl,
// no toggle button = show, toggle button = hide
configVisible: !this.props.withToggleButton
hs_url: this.props.customHsUrl,
is_url: this.props.customIsUrl,
// if withToggleButton is false, then show the config all the time given we have no way otherwise of making it visible
configVisible: !this.props.withToggleButton ||
(this.props.customHsUrl !== this.props.defaultHsUrl) ||
(this.props.customIsUrl !== this.props.defaultIsUrl)
}
},
onHomeserverChanged: function(ev) {
this.setState({hs_url: ev.target.value}, function() {
this._hsTimeoutId = this._waitThenInvoke(this._hsTimeoutId, function() {
this.props.onHsUrlChanged(this.state.hs_url.replace(/\/$/, ""));
var hsUrl = this.state.hs_url.trim().replace(/\/$/, "");
if (hsUrl === "") hsUrl = this.props.defaultHsUrl;
this.props.onHsUrlChanged(hsUrl);
});
});
},
@ -66,7 +83,9 @@ module.exports = React.createClass({
onIdentityServerChanged: function(ev) {
this.setState({is_url: ev.target.value}, function() {
this._isTimeoutId = this._waitThenInvoke(this._isTimeoutId, function() {
this.props.onIsUrlChanged(this.state.is_url.replace(/\/$/, ""));
var isUrl = this.state.is_url.trim().replace(/\/$/, "");
if (isUrl === "") isUrl = this.props.defaultIsUrl;
this.props.onIsUrlChanged(isUrl);
});
});
},
@ -78,18 +97,18 @@ module.exports = React.createClass({
return setTimeout(fn.bind(this), this.props.delayTimeMs);
},
getHsUrl: function() {
return this.state.hs_url;
},
getIsUrl: function() {
return this.state.is_url;
},
onServerConfigVisibleChange: function(ev) {
onServerConfigVisibleChange: function(visible, ev) {
this.setState({
configVisible: ev.target.checked
configVisible: visible
});
if (!visible) {
this.props.onHsUrlChanged(this.props.defaultHsUrl);
this.props.onIsUrlChanged(this.props.defaultIsUrl);
}
else {
this.props.onHsUrlChanged(this.state.hs_url);
this.props.onIsUrlChanged(this.state.is_url);
}
},
showHelpPopup: function() {
@ -104,12 +123,19 @@ module.exports = React.createClass({
var toggleButton;
if (this.props.withToggleButton) {
toggleButton = (
<div>
<input className="mx_Login_checkbox" id="advanced" type="checkbox"
<div style={{ textAlign: 'center' }}>
<input className="mx_Login_radio" id="basic" name="configVisible" type="radio"
checked={!this.state.configVisible}
onChange={this.onServerConfigVisibleChange.bind(this, false)} />
<label className="mx_Login_label" htmlFor="basic">
Default server
</label>
&nbsp;&nbsp;
<input className="mx_Login_radio" id="advanced" name="configVisible" type="radio"
checked={this.state.configVisible}
onChange={this.onServerConfigVisibleChange} />
onChange={this.onServerConfigVisibleChange.bind(this, true)} />
<label className="mx_Login_label" htmlFor="advanced">
Use custom server options (advanced)
Custom server
</label>
</div>
);
@ -124,14 +150,14 @@ module.exports = React.createClass({
Home server URL
</label>
<input className="mx_Login_field" id="hsurl" type="text"
placeholder={this.state.original_hs_url}
placeholder={this.props.defaultHsUrl}
value={this.state.hs_url}
onChange={this.onHomeserverChanged} />
<label className="mx_Login_label mx_ServerConfig_islabel" htmlFor="isurl">
Identity server URL
</label>
<input className="mx_Login_field" id="isurl" type="text"
placeholder={this.state.original_is_url}
placeholder={this.props.defaultIsUrl}
value={this.state.is_url}
onChange={this.onIdentityServerChanged} />
<a className="mx_ServerConfig_help" href="#" onClick={this.showHelpPopup}>