2015-07-13 16:59:12 +02:00
|
|
|
'use strict';
|
|
|
|
|
|
|
|
import React from 'react';
|
2015-10-01 11:16:38 +02:00
|
|
|
import { History } from 'react-router';
|
2015-07-13 16:59:12 +02:00
|
|
|
|
|
|
|
import GlobalNotificationModel from '../../models/global_notification_model';
|
|
|
|
import GlobalNotificationActions from '../../actions/global_notification_actions';
|
|
|
|
|
|
|
|
import UserActions from '../../actions/user_actions';
|
|
|
|
|
|
|
|
import Form from './form';
|
|
|
|
import Property from './property';
|
|
|
|
|
2015-08-07 15:08:02 +02:00
|
|
|
import ApiUrls from '../../constants/api_urls';
|
2015-07-13 16:59:12 +02:00
|
|
|
import AppConstants from '../../constants/application_constants';
|
2015-10-12 17:55:02 +02:00
|
|
|
import AscribeSpinner from '../ascribe_spinner';
|
2015-07-13 16:59:12 +02:00
|
|
|
|
|
|
|
import { getLangText } from '../../utils/lang_utils';
|
|
|
|
|
|
|
|
|
|
|
|
let LoginForm = React.createClass({
|
|
|
|
propTypes: {
|
2015-07-13 19:53:16 +02:00
|
|
|
headerMessage: React.PropTypes.string,
|
|
|
|
submitMessage: React.PropTypes.string,
|
2016-03-07 14:04:34 +01:00
|
|
|
location: React.PropTypes.object,
|
|
|
|
whitelabelName: React.PropTypes.string
|
2015-07-13 16:59:12 +02:00
|
|
|
},
|
|
|
|
|
2015-10-01 11:16:38 +02:00
|
|
|
mixins: [History],
|
2015-07-13 19:53:16 +02:00
|
|
|
|
2015-07-13 16:59:12 +02:00
|
|
|
getDefaultProps() {
|
|
|
|
return {
|
2016-01-11 18:07:52 +01:00
|
|
|
headerMessage: getLangText('Enter') + ' ascribe',
|
|
|
|
submitMessage: getLangText('Log in')
|
2015-07-13 16:59:12 +02:00
|
|
|
};
|
|
|
|
},
|
|
|
|
|
2016-01-11 18:07:52 +01:00
|
|
|
handleSuccess({ success }) {
|
2016-01-18 17:31:56 +01:00
|
|
|
const notification = new GlobalNotificationModel(getLangText('Login successful'), 'success', 10000);
|
2015-07-13 16:59:12 +02:00
|
|
|
GlobalNotificationActions.appendGlobalNotification(notification);
|
|
|
|
|
2016-01-11 18:07:52 +01:00
|
|
|
if (success) {
|
2015-11-02 15:38:37 +01:00
|
|
|
UserActions.fetchCurrentUser(true);
|
2015-10-06 18:28:15 +02:00
|
|
|
}
|
2015-07-13 16:59:12 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
render() {
|
2016-02-08 14:08:54 +01:00
|
|
|
const { headerMessage,
|
|
|
|
location: { query: { email: emailQuery } },
|
2016-03-07 14:04:34 +01:00
|
|
|
submitMessage,
|
|
|
|
whitelabelName } = this.props;
|
2016-01-11 18:07:52 +01:00
|
|
|
|
2015-07-13 16:59:12 +02:00
|
|
|
return (
|
|
|
|
<Form
|
2015-07-13 19:53:16 +02:00
|
|
|
className="ascribe-form-bordered"
|
2015-07-13 16:59:12 +02:00
|
|
|
ref="loginForm"
|
2015-08-07 15:08:02 +02:00
|
|
|
url={ApiUrls.users_login}
|
2015-07-13 16:59:12 +02:00
|
|
|
handleSuccess={this.handleSuccess}
|
2015-08-26 15:41:59 +02:00
|
|
|
autoComplete="on"
|
2015-07-13 16:59:12 +02:00
|
|
|
buttons={
|
|
|
|
<button
|
|
|
|
type="submit"
|
2015-10-12 17:55:02 +02:00
|
|
|
className="btn btn-default btn-wide">
|
2016-01-11 18:07:52 +01:00
|
|
|
{submitMessage}
|
2015-07-13 16:59:12 +02:00
|
|
|
</button>}
|
|
|
|
spinner={
|
2015-10-12 17:55:02 +02:00
|
|
|
<span className="btn btn-default btn-wide btn-spinner">
|
|
|
|
<AscribeSpinner color="dark-blue" size="md" />
|
2015-07-13 18:13:47 +02:00
|
|
|
</span>
|
2015-07-13 16:59:12 +02:00
|
|
|
}>
|
2015-08-06 10:23:01 +02:00
|
|
|
<div className="ascribe-form-header">
|
2016-03-07 14:04:34 +01:00
|
|
|
<h3>{whitelabelName ? `Welcome to ${whitelabelName}` : headerMessage}</h3>
|
2015-08-06 10:23:01 +02:00
|
|
|
</div>
|
2015-07-13 16:59:12 +02:00
|
|
|
<Property
|
|
|
|
name='email'
|
|
|
|
label={getLangText('Email')}>
|
|
|
|
<input
|
|
|
|
type="email"
|
|
|
|
placeholder={getLangText('Enter your email')}
|
2016-01-11 18:07:52 +01:00
|
|
|
defaultValue={emailQuery}
|
2015-07-13 16:59:12 +02:00
|
|
|
required/>
|
|
|
|
</Property>
|
|
|
|
<Property
|
|
|
|
name='password'
|
|
|
|
label={getLangText('Password')}>
|
|
|
|
<input
|
|
|
|
type="password"
|
|
|
|
placeholder={getLangText('Enter your password')}
|
|
|
|
required/>
|
|
|
|
</Property>
|
|
|
|
</Form>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
export default LoginForm;
|