ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-12-31 17:17:48 +01:00
Code Issues Releases Wiki Activity

Work on signup/login

Browse Source
This commit is contained in:
vrde 2015-07-13 19:53:16 +02:00
parent b4f1d3d6cc
commit 4af174dffb
7 changed files with 104 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
js/components/ascribe_forms/form_login.js
View File

@ -11,6 +11,7 @@ import UserActions from '../../actions/user_actions';
import Form from './form';
import Property from './property';
import FormPropertyHeader from './form_property_header';
import apiUrls from '../../constants/api_urls';
import AppConstants from '../../constants/application_constants';
@ -19,20 +20,25 @@ import { getLangText } from '../../utils/lang_utils';
let LoginForm = React.createClass({
propTypes: {
headerMessage: React.PropTypes.string,
submitMessage: React.PropTypes.string,
redirectOnLoggedIn: React.PropTypes.bool,
redirectOnLoginSuccess: React.PropTypes.bool
},
mixins: [Router.Navigation],
getDefaultProps() {
return {
headerMessage: 'Enter ascribe',
submitMessage: 'Log in',
redirectOnLoggedIn: true,
redirectOnLoginSuccess: true
};
},
mixins: [Router.Navigation],
getInitialState() {
return UserStore.getState();
},
@ -80,6 +86,7 @@ let LoginForm = React.createClass({
render() {
return (
<Form
className="ascribe-form-bordered"
ref="loginForm"
url={apiUrls.users_login}
handleSuccess={this.handleSuccess}
@ -87,13 +94,16 @@ let LoginForm = React.createClass({
<button
type="submit"
className="btn ascribe-btn ascribe-btn-login">
{getLangText('Enter')} ascribe
{getLangText(this.props.submitMessage)}
</button>}
spinner={
<button className="btn ascribe-btn ascribe-btn-login ascribe-btn-login-spinner">
<img src="https://s3-us-west-2.amazonaws.com/ascribe0/media/thumbnails/ascribe_animated_medium.gif" />
</button>
}>
<FormPropertyHeader>
<h3>{getLangText(this.props.headerMessage)}</h3>
</FormPropertyHeader>
<Property
name='email'
label={getLangText('Email')}>
@ -114,7 +124,6 @@ let LoginForm = React.createClass({
name="password"
required/>
</Property>
<hr />
</Form>
);
}

13
js/components/ascribe_forms/form_signup.js
View File

@ -21,11 +21,20 @@ import apiUrls from '../../constants/api_urls';
let SignupForm = React.createClass({
propTypes: {
headerMessage: React.PropTypes.string,
submitMessage: React.PropTypes.string,
handleSuccess: React.PropTypes.func
},
mixins: [Router.Navigation],
getDefaultProps() {
return {
headerMessage: 'Welcome to ascribe',
submitMessage: 'Sign up'
};
},
getInitialState() {
return UserStore.getState();
},
@ -72,7 +81,7 @@ let SignupForm = React.createClass({
getFormData={this.getFormData}
buttons={
<button type="submit" className="btn ascribe-btn ascribe-btn-login">
{getLangText('Sign up to ascribe')}
{getLangText(this.props.submitMessage)}
</button>}
spinner={
<button className="btn ascribe-btn ascribe-btn-login ascribe-btn-login-spinner">
@ -80,7 +89,7 @@ let SignupForm = React.createClass({
</button>
}>
<FormPropertyHeader>
<h3>{getLangText('Welcome to ascribe')}</h3>
<h3>{getLangText(this.props.headerMessage)}</h3>
</FormPropertyHeader>
<Property
name='email'

1
js/components/login_container.js
View File

@ -24,7 +24,6 @@ let LoginContainer = React.createClass({
render() {
return (
<div className="ascribe-login-wrapper">
<br/>
<LoginForm
message={this.props.message} />
<div className="ascribe-login-text">

4
js/components/password_reset_container.js
View File

@ -39,7 +39,7 @@ let PasswordResetContainer = React.createClass({
return (
<div>
<div className="ascribe-login-text ascribe-login-header">
{getLangText('Reset your ascribe password')}
{getLangText('Reset your password')}
</div>
<PasswordRequestResetForm
handleRequestSuccess={this.handleRequestSuccess}/>
@ -157,4 +157,4 @@ let PasswordResetForm = React.createClass({
}
});
export default PasswordResetContainer;
export default PasswordResetContainer;

27
js/components/whitelabel/prize/components/login_container.js Normal file
View File

@ -0,0 +1,27 @@
'use strict';
import React from 'react';
import Router from 'react-router';
import LoginForm from '../../../ascribe_forms/form_login';
let Link = Router.Link;
let LoginContainer = React.createClass({
render() {
return (
<div className="ascribe-login-wrapper">
<LoginForm headerMessage="Log in" />
<div className="ascribe-login-text">
I'm not a user <Link to="signup">Sign up...</Link><br/>
I forgot my password <Link to="password_reset">Rescue me...</Link>
</div>
</div>
);
}
});
export default LoginContainer;

45
js/components/whitelabel/prize/components/signup_container.js Normal file
View File

@ -0,0 +1,45 @@
'use strict';
import React from 'react';
import SignupForm from '../../../ascribe_forms/form_signup';
let SignupContainer = React.createClass({
getInitialState() {
return {
submitted: false,
message: null
};
},
handleSuccess(message){
this.setState({
submitted: true,
message: message
});
},
render() {
if (this.state.submitted){
return (
<div className="ascribe-login-wrapper">
<br/>
<div className="ascribe-login-text ascribe-login-header">
{this.state.message}
</div>
</div>
);
}
return (
<div className="ascribe-login-wrapper">
<SignupForm
headerMessage="Sign up to the prize"
submitMessage="Sign up"
handleSuccess={this.handleSuccess}/>
</div>
);
}
});
export default SignupContainer;

8
js/components/whitelabel/prize/routes.js
View File

@ -4,6 +4,9 @@ import React from 'react';
import Router from 'react-router';
import Landing from './components/landing';
import LoginContainer from './components/login_container';
import SignupContainer from './components/signup_container';
import PasswordResetContainer from '../../../components/password_reset_container';
import App from './app';
import AppConstants from '../../../constants/application_constants';
@ -16,8 +19,9 @@ function getRoutes(commonRoutes) {
return (
<Route name="app" path={baseUrl} handler={App}>
<Route name="landing" path="/" handler={Landing} />
{commonRoutes}
<Route name="login" path="login" handler={LoginContainer} />
<Route name="signup" path="signup" handler={SignupContainer} />
<Route name="password_reset" path="password_reset" handler={PasswordResetContainer} />
</Route>
);
}