1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-23 01:39:36 +01:00

Merge remote-tracking branch 'remotes/origin/AD-565-add-landing-page-for-sluice' into AD-419-decouple-piece-registration-from-

This commit is contained in:
diminator 2015-07-13 21:05:41 +02:00
commit e13b782cbe
10 changed files with 126 additions and 22 deletions

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,7 +20,10 @@ 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
},
@ -28,6 +32,8 @@ let LoginForm = React.createClass({
getDefaultProps() {
return {
headerMessage: 'Enter ascribe',
submitMessage: 'Log in',
redirectOnLoggedIn: true,
redirectOnLoginSuccess: true
};
@ -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={
<span 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" />
</span>
}>
<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>
);
}

View File

@ -17,6 +17,12 @@ import { getLangText } from '../../utils/lang_utils';
let RegisterPieceForm = React.createClass({
propTypes: {
handleSuccess: React.PropTypes.func,
isFineUploaderEditable: React.PropTypes.bool,
children: React.PropTypes.element
},
getInitialState(){
return {
digitalWorkKey: null,
@ -162,4 +168,4 @@ let FileUploader = React.createClass({
}
});
export default RegisterPieceForm;
export default RegisterPieceForm;

View File

@ -21,11 +21,21 @@ import apiUrls from '../../constants/api_urls';
let SignupForm = React.createClass({
propTypes: {
handleSuccess: React.PropTypes.func
headerMessage: React.PropTypes.string,
submitMessage: React.PropTypes.string,
handleSuccess: React.PropTypes.func,
children: React.PropTypes.element
},
mixins: [Router.Navigation],
getDefaultProps() {
return {
headerMessage: 'Welcome to ascribe',
submitMessage: 'Sign up'
};
},
getInitialState() {
return UserStore.getState();
},
@ -72,7 +82,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={
<span className="btn ascribe-btn ascribe-btn-login ascribe-btn-login-spinner">
@ -80,7 +90,7 @@ let SignupForm = React.createClass({
</span>
}>
<FormPropertyHeader>
<h3>{getLangText('Welcome to ascribe')}</h3>
<h3>{getLangText(this.props.headerMessage)}</h3>
</FormPropertyHeader>
<Property
name='email'
@ -111,13 +121,7 @@ let SignupForm = React.createClass({
autoComplete="on"
required/>
</Property>
<Property
name='promo_code'
label={getLangText('Promocode')}>
<input
type="text"
placeholder={getLangText('Enter a promocode here (Optional)')}/>
</Property>
{this.props.children}
<Property
name="terms"
className="ascribe-settings-property-collapsible-toggle"
@ -129,4 +133,5 @@ let SignupForm = React.createClass({
}
});
export default SignupForm;

View File

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

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;

View File

@ -27,7 +27,6 @@ import SlidesContainer from './ascribe_slides_container/slides_container';
import { mergeOptions } from '../utils/general_utils';
import { getCookie } from '../utils/fetch_api_utils';
import { getLangText } from '../utils/lang_utils';
let RegisterPiece = React.createClass( {

View File

@ -2,8 +2,10 @@
import React from 'react';
import SignupForm from './ascribe_forms/form_signup';
import Property from './ascribe_forms/property';
import { getLangText } from '../utils/lang_utils';
// import { getLangText } from '../utils/lang_utils';
let SignupContainer = React.createClass({
getInitialState() {
@ -33,8 +35,15 @@ let SignupContainer = React.createClass({
}
return (
<div className="ascribe-login-wrapper">
<br/>
<SignupForm handleSuccess={this.handleSuccess}/>
<SignupForm>
<Property
name='promo_code'
label={getLangText('Promocode')}>
<input
type="text"
placeholder={getLangText('Enter a promocode here (Optional)')}/>
</Property>
</SignupForm>
</div>
);
}

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;

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;

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,10 @@ 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 name="register_piece" path="register_piece" handler={RegisterPiece} />
</Route>
);
}