login progress
This commit is contained in:
Edin Dazdarevic
@@ -1,41 +1,117 @@
|
||||
var React = require("react");
|
||||
var NavigationActions = require('../../actions/navigationActions');
|
||||
var UserActions = require('../../actions/userActions');
|
||||
var Router = require('react-router');
|
||||
var Link = Router.Link;
|
||||
var Login = React.createClass({
|
||||
|
||||
var RibicaValidationMixin = require('../../components/shared/mixins/ribicaValidationMixin');
|
||||
var ValidationUtils = require('../../utils/validation.js');
|
||||
var LoginModel = require('../../models/login');
|
||||
var UserStore = require('../../stores/userStore');
|
||||
|
||||
var Login = React.createClass({
|
||||
mixins: [RibicaValidationMixin],
|
||||
componentDidMount:function() {
|
||||
UserStore.addChangeListener(this.onUserStoreChange);
|
||||
},
|
||||
componentWillUnmount: function() {
|
||||
UserStore.removeChangeListener(this.onUserStoreChange);
|
||||
},
|
||||
onUserStoreChange: function() {
|
||||
var loginState = UserStore.getLoginState();
|
||||
|
||||
if (loginState.loggedIn) {
|
||||
NavigationActions.goToHome();
|
||||
} else {
|
||||
|
||||
this.setState({login: loginState});
|
||||
}
|
||||
},
|
||||
getInitialState: function() {
|
||||
return {
|
||||
email: '',
|
||||
password: '',
|
||||
errors: {},
|
||||
login: UserStore.getLoginState()
|
||||
};
|
||||
},
|
||||
validations: {
|
||||
email:function(value) {
|
||||
|
||||
if(!ValidationUtils.isValidEmail(value)) {
|
||||
return ['Neispravna email adresa.'];
|
||||
}
|
||||
return [];
|
||||
},
|
||||
password: function(value) {
|
||||
if(!ValidationUtils.isValidRequired(value)) {
|
||||
return ["Šifra je obavezna."];
|
||||
}
|
||||
return [];
|
||||
}
|
||||
},
|
||||
renderErrorMessage: function(message){
|
||||
return (<div className='error-message'>{message}</div>)
|
||||
},
|
||||
doLogin: function(e) {
|
||||
|
||||
if(this.validate()) {
|
||||
var loginInfo = new LoginModel({
|
||||
email: this.state.email,
|
||||
password: this.state.password
|
||||
});
|
||||
|
||||
UserActions.userLogin(loginInfo);
|
||||
|
||||
}
|
||||
|
||||
e.preventDefault();
|
||||
},
|
||||
renderLoginFailure: function() {
|
||||
|
||||
var loginState = this.state.login;
|
||||
if(!loginState.loggedIn) {
|
||||
return (<div>{loginState.error}</div>)
|
||||
}
|
||||
|
||||
return (<div></div>)
|
||||
},
|
||||
render : function() {
|
||||
return (<div>
|
||||
<div className="col-md-6">
|
||||
|
||||
<span className="h3">Prijava </span>
|
||||
<div className="center" >
|
||||
<form className="form-horizontal">
|
||||
<div className="col-md-6">
|
||||
|
||||
<span className="h3">Prijava </span>
|
||||
{this.renderLoginFailure()}
|
||||
<div className="center" >
|
||||
<form className="form-horizontal">
|
||||
|
||||
<div className="form-group">
|
||||
<label for="email">Email adresa</label>
|
||||
<input type="email" className="form-control" id="email" placeholder="Unesite email"></input>
|
||||
</div>
|
||||
<div className="form-group">
|
||||
<label for="password">Sifra</label>
|
||||
<input type="password" className="form-control" id="password" placeholder="Sifra"></input>
|
||||
</div>
|
||||
<button type="submit" className="btn btn-default">Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
<label for="email">Email adresa</label>
|
||||
<input type="email" onChange={this.handleChange('email')} className="form-control" id="email" placeholder="Unesite email"></input>
|
||||
|
||||
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<Link to="registracija">
|
||||
{this.getValidationMessages('email').map(this.renderErrorMessage)}
|
||||
</div>
|
||||
<div className="form-group">
|
||||
<label for="password">Šifra</label>
|
||||
<input type="password" onChange={this.handleChange('password')} className="form-control" id="password" placeholder="Šifra"></input>
|
||||
|
||||
Niste registrovani? Kliknite ovdje da se registrujete!
|
||||
</Link>
|
||||
{this.getValidationMessages('password').map(this.renderErrorMessage)}
|
||||
</div>
|
||||
<button type="button" onClick={this.doLogin} className="btn btn-default">Prijava</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>);
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<Link to="registracija">
|
||||
|
||||
Niste registrovani? Kliknite ovdje da se registrujete!
|
||||
</Link>
|
||||
|
||||
|
||||
</div>
|
||||
</div>);
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
module.exports = Login;
|
||||
|
||||
@@ -3,7 +3,8 @@ var React = require("react/addons"),
|
||||
RibicaValidationMixin = require('../../components/shared/mixins/ribicaValidationMixin'),
|
||||
UserStore = require('../../stores/userStore'),
|
||||
NavigationActions = require('../../actions/navigationActions'),
|
||||
UserActions = require('../../actions/userActions');
|
||||
UserActions = require('../../actions/userActions'),
|
||||
ValidationUtils = require('../../utils/validation');
|
||||
|
||||
|
||||
|
||||
@@ -18,7 +19,7 @@ var Register = React.createClass({
|
||||
password: '',
|
||||
passwordConfirmation: '',
|
||||
errors: {},
|
||||
registrationState: UserStore.getRegistrationState()
|
||||
registration: UserStore.getRegistrationState()
|
||||
};
|
||||
},
|
||||
myBabyChange: function() {
|
||||
@@ -96,12 +97,12 @@ var Register = React.createClass({
|
||||
},
|
||||
validations: {
|
||||
firstName: function(value) {
|
||||
if (!value || value === '') {
|
||||
if (!ValidationUtils.isValidRequired(value)) {
|
||||
return ["Ime je obavezno."];
|
||||
}
|
||||
},
|
||||
password: function(value, callback) {
|
||||
if(value === undefined || value === "") {
|
||||
if(!ValidationUtils.isValidRequired(value)) {
|
||||
return ["Šifra je obavezna."];
|
||||
}
|
||||
|
||||
@@ -119,16 +120,14 @@ var Register = React.createClass({
|
||||
}
|
||||
},
|
||||
lastName : function(value) {
|
||||
if (!value || value === '') {
|
||||
if (!ValidationUtils.isValidRequired(value)) {
|
||||
return ["Prezime je obavezno."];
|
||||
}
|
||||
},
|
||||
_emailRe: /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/,
|
||||
_emailTimeoutId: null,
|
||||
email: function(value, callback) {
|
||||
var validEmail = this._emailRe.test(value);
|
||||
|
||||
if (validEmail) {
|
||||
if (ValidationUtils.isValidEmail(value)) {
|
||||
//clearTimeout(this._emailTimeoutId);
|
||||
//this._emailTimeoutId = setTimeout(function(){
|
||||
|
||||
@@ -162,11 +161,10 @@ var Register = React.createClass({
|
||||
},
|
||||
onUserStoreChange: function() {
|
||||
this.setState({
|
||||
registrationState: UserStore.getRegistrationState()
|
||||
registration: UserStore.getRegistrationState()
|
||||
});
|
||||
},
|
||||
register: function(e) {
|
||||
// TODO: move this to the UserRegistrationStore
|
||||
if(this.validate()) {
|
||||
var user = new UserRegistration({
|
||||
first_name: this.state.firstName,
|
||||
@@ -186,24 +184,24 @@ var Register = React.createClass({
|
||||
e.preventDefault();
|
||||
},
|
||||
renderRegistrationState: function() {
|
||||
var rs = this.state.registrationState;
|
||||
var rs = this.state.registration;
|
||||
if (!rs.performed) {
|
||||
|
||||
return (<div></div>)
|
||||
} else if(rs.performed && !rs.success){
|
||||
return (<div>
|
||||
Desila se pogreska pri registraciji. Detalji greske su:
|
||||
Desila se pogreška pri registraciji. Detalji greške su:
|
||||
{rs.error.responseJSON}
|
||||
</div>)
|
||||
} else if (rs.performed && rs.success) {
|
||||
return (<div>
|
||||
Uspjesno ste se registrovali na Ribicu. Kliknite <a onClick={this.successContinue}>ovdje</a> za nastavak.
|
||||
Uspješno ste se registrovali na Ribicu. Kliknite <a onClick={this.successContinue}>ovdje</a> za nastavak.
|
||||
</div>)
|
||||
}
|
||||
},
|
||||
render : function() {
|
||||
var cx = React.addons.classSet;
|
||||
var regSuccess = this.state.registrationState.performed && this.state.registrationState.success;
|
||||
var regSuccess = this.state.registration.performed && this.state.registration.success;
|
||||
var classes = cx({
|
||||
'hide': regSuccess
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user