Refactor view/controller logic between files, fix syntax & silly bugs.

This commit is contained in:
David Baker 2015-07-16 12:44:04 +01:00
parent e2757b3587
commit df790c1b54
5 changed files with 121 additions and 70 deletions

View file

@ -25,10 +25,37 @@ var Loader = require("react-loader");
var LoginController = require("../../../../src/controllers/templates/Login");
var ServerConfig = ComponentBroker.get("molecules/ServerConfig");
module.exports = React.createClass({
displayName: 'Login',
mixins: [LoginController],
componentForStep: function(step) {
switch (step) {
case 'choose_hs':
return (
<div>
<form onSubmit={this.onHSChosen}>
<ServerConfig ref="serverConfig" />
<input type="submit" value="Continue" />
</form>
</div>
);
// XXX: clearly these should be separate organisms
case 'stage_m.login.password':
return (
<div>
<form onSubmit={this.onUserPassEntered}>
<input ref="user" type="text" placeholder="username" /><br />
<input ref="pass" type="password" placeholder="password" /><br />
<input type="submit" value="Log in" />
</form>
</div>
);
}
},
loginContent: function() {
if (this.state.busy) {
return (

View file

@ -24,10 +24,61 @@ var Loader = require("react-loader");
var RegisterController = require("../../../../src/controllers/templates/Register");
var ServerConfig = ComponentBroker.get("molecules/ServerConfig");
module.exports = React.createClass({
displayName: 'Register',
mixins: [RegisterController],
getRegFormVals: function() {
return {
email: this.refs.email.getDOMNode().value,
username: this.refs.username.getDOMNode().value,
password: this.refs.password.getDOMNode().value,
confirmPassword: this.refs.confirmPassword.getDOMNode().value
};
},
getHsUrl: function() {
return this.refs.serverConfig.getHsUrl();
},
getIsUrl: function() {
return this.refs.serverConfig.getIsUrl();
},
componentForStep: function(step) {
switch (step) {
case 'initial':
return (
<div>
<form onSubmit={this.onInitialStageSubmit}>
Email: <input type="text" ref="email" /><br />
Username: <input type="text" ref="username" /><br />
Password: <input type="password" ref="password" /><br />
Confirm Password: <input type="password" ref="confirmPassword" /><br />
<ServerConfig ref="serverConfig" />
<input type="submit" value="Continue" />
</form>
</div>
);
// XXX: clearly these should be separate organisms
case 'stage_m.login.email.identity':
return (
<div>
Please check your email to continue registration.
</div>
);
case 'stage_m.login.recaptcha':
return (
<div ref="recaptchaContainer">
This Home Server would like to make sure you're not a robot
<div id="mx_recaptcha"></div>
</div>
);
}
},
registerContent: function() {
if (this.state.busy) {
return (
@ -45,6 +96,22 @@ module.exports = React.createClass({
}
},
onBadFields: function(bad) {
var keys = Object.keys(bad);
var strings = [];
for (var i = 0; i < keys.length; ++i) {
switch (bad[keys[i]]) {
case this.FieldErrors.PasswordMismatch:
strings.push("Passwords don't match");
break;
}
}
var errtxt = strings.join(', ');
this.setState({
errorText: errtxt
});
},
render: function() {
return (
<div className="mx_Register">

View file

@ -179,7 +179,7 @@ module.exports = {
dis.dispatch({action: 'focus_composer'});
},
showScreen(screen, params) {
showScreen: function(screen, params) {
if (screen == 'register') {
dis.dispatch({
action: 'start_registration',

View file

@ -24,8 +24,6 @@ var dis = require("../../dispatcher");
var ComponentBroker = require("../../ComponentBroker");
var ServerConfig = ComponentBroker.get("molecules/ServerConfig");
module.exports = {
getInitialState: function() {
return {
@ -100,31 +98,6 @@ module.exports = {
});
},
componentForStep: function(step) {
switch (step) {
case 'choose_hs':
return (
<div>
<form onSubmit={this.onHSChosen}>
<ServerConfig ref="serverConfig" />
<input type="submit" value="Continue" />
</form>
</div>
);
// XXX: clearly these should be separate organisms
case 'stage_m.login.password':
return (
<div>
<form onSubmit={this.onUserPassEntered}>
<input ref="user" type="text" placeholder="username" /><br />
<input ref="pass" type="password" placeholder="password" /><br />
<input type="submit" value="Log in" />
</form>
</div>
);
}
},
showRegister: function(ev) {
ev.preventDefault();
dis.dispatch({

View file

@ -24,9 +24,12 @@ var dis = require("../../dispatcher");
var ComponentBroker = require("../../ComponentBroker");
var ServerConfig = ComponentBroker.get("molecules/ServerConfig");
module.exports = {
FieldErrors: {
PasswordMismatch: 'PasswordMismatch',
PasswordLength: 'PasswordLength'
},
getInitialState: function() {
return {
step: 'initial',
@ -126,7 +129,7 @@ module.exports = {
if (
this.savedParams.email != '' ||
this.completedStages.indexOf('m.login.email.identity' > -1)
this.completedStages.indexOf('m.login.email.identity') > -1
) {
return emailFlow;
} else {
@ -156,22 +159,34 @@ module.exports = {
onInitialStageSubmit: function(ev) {
ev.preventDefault();
var formVals = this.getRegFormVals();
var badFields = {};
if (formVals.password != formVals.confirmPassword) {
badFields.confirmPassword = this.FieldErrors.PasswordMismatch;
}
if (formVals.password.length < 6) {
badFields.password = this.FieldErrors.PasswordLength;
}
this.onBadFields(badFields);
MatrixClientPeg.replaceUsingUrls(
this.refs.serverConfig.getHsUrl(),
this.refs.serverConfig.getIsUrl()
this.getHsUrl(),
this.getIsUrl()
);
this.setState({
hs_url: this.refs.serverConfig.getHsUrl(),
is_url: this.refs.serverConfig.getIsUrl()
hs_url: this.getHsUrl(),
is_url: this.getIsUrl()
});
var cli = MatrixClientPeg.get();
this.setState({busy: true});
var self = this;
this.savedParams = {
email: this.refs.email.getDOMNode().value,
username: this.refs.username.getDOMNode().value,
password: this.refs.password.getDOMNode().value
email: formVals.email,
username: formVals.username,
password: formVals.password
};
this.tryRegister();
@ -246,37 +261,6 @@ module.exports = {
}
},
componentForStep: function(step) {
switch (step) {
case 'initial':
return (
<div>
<form onSubmit={this.onInitialStageSubmit}>
Email: <input type="text" ref="email" /><br />
Username: <input type="text" ref="username" /><br />
Password: <input type="password" ref="password" /><br />
<ServerConfig ref="serverConfig" />
<input type="submit" value="Continue" />
</form>
</div>
);
// XXX: clearly these should be separate organisms
case 'stage_m.login.email.identity':
return (
<div>
Please check your email to continue registration.
</div>
);
case 'stage_m.login.recaptcha':
return (
<div ref="recaptchaContainer">
This Home Server would like to make sure you're not a robot
<div id="mx_recaptcha"></div>
</div>
);
}
},
onCaptchaLoaded: function() {
if (this.refs.recaptchaContainer) {
var sitekey = this.authParams['m.login.recaptcha'].public_key;
@ -308,7 +292,7 @@ module.exports = {
self.authParams = error.data.params;
self.authSessionId = error.data.session;
self.completedStages = error.data.completed;
self.completedStages = error.data.completed || [];
var flow = self.chooseFlow(error.data.flows);