brings back the functionality in login/register/screens that got lost in @kegsay's refactor. specifically:
1) custom HS/IS urls are now persisted in HTML5 local storage. As a result, all the login components now distinguish between default HS/IS URLs and custom specified ones again. ( 2) custom HS/IS urls are synchronised between the instances of ServerConfig found in the Login, Registration and Forgot Password screens. 3) username are persisted over changing homeserver (but not password, to stop accidentally leaking passwords to the wrong server) 4) correctly interpret a blank URL field as meaning the placeholder text 5) when toggling custom URLs on and off, remember what the custom values were, and use the default URLs if custom mode is not engaged also, guest access now upholds custom HS/IS URLs found in local storage rather than being limited to the server config () also adds assorted comments and improved console debug and a few minor cosmetic changes to the login components. this commit sponsored by VS27...
This commit is contained in:
parent
b66ca74ede
commit
0bb58dd60c
8 changed files with 177 additions and 75 deletions
|
@ -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'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">
|
||||
|
|
|
@ -23,13 +23,24 @@ 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() {},
|
||||
};
|
||||
},
|
||||
|
||||
getInitialState: function() {
|
||||
return {
|
||||
username: "",
|
||||
password: ""
|
||||
username: this.props.initialUsername,
|
||||
password: this.props.initialPassword,
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -40,10 +51,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() {
|
||||
|
|
|
@ -29,8 +29,10 @@ module.exports = React.createClass({
|
|||
propTypes: {
|
||||
onHsUrlChanged: React.PropTypes.func,
|
||||
onIsUrlChanged: React.PropTypes.func,
|
||||
defaultHsUrl: React.PropTypes.string,
|
||||
defaultIsUrl: React.PropTypes.string,
|
||||
initialHsUrl: React.PropTypes.string, // whatever the current value is when we create the component
|
||||
initialIsUrl: React.PropTypes.string, // whatever the current value is when we create the component
|
||||
defaultHsUrl: React.PropTypes.string, // e.g. https://matrix.org
|
||||
defaultIsUrl: React.PropTypes.string, // e.g. https://vector.im
|
||||
withToggleButton: React.PropTypes.bool,
|
||||
delayTimeMs: React.PropTypes.number // time to wait before invoking onChanged
|
||||
},
|
||||
|
@ -46,19 +48,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.initialHsUrl,
|
||||
is_url: this.props.initialIsUrl,
|
||||
// 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.initialHsUrl !== this.props.defaultHsUrl) ||
|
||||
(this.props.initialIsUrl !== 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 +70,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 +84,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) {
|
||||
this.setState({
|
||||
configVisible: ev.target.checked
|
||||
});
|
||||
if (!ev.target.checked) {
|
||||
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() {
|
||||
|
@ -124,14 +130,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}>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue