2015-11-30 21:11:04 +03:00
|
|
|
/*
|
2016-01-07 07:06:39 +03:00
|
|
|
Copyright 2015, 2016 OpenMarket Ltd
|
2017-02-24 14:41:23 +03:00
|
|
|
Copyright 2017 Vector Creations Ltd
|
2018-09-04 20:26:09 +03:00
|
|
|
Copyright 2018 New Vector Ltd
|
2015-11-30 21:11:04 +03:00
|
|
|
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
|
|
you may not use this file except in compliance with the License.
|
|
|
|
You may obtain a copy of the License at
|
|
|
|
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
|
|
See the License for the specific language governing permissions and
|
|
|
|
limitations under the License.
|
|
|
|
*/
|
|
|
|
|
2017-02-24 14:41:23 +03:00
|
|
|
import React from 'react';
|
2017-12-26 04:03:18 +03:00
|
|
|
import PropTypes from 'prop-types';
|
2017-02-24 14:41:23 +03:00
|
|
|
import { field_input_incorrect } from '../../../UiEffects';
|
|
|
|
import sdk from '../../../index';
|
|
|
|
import Email from '../../../email';
|
2017-03-14 14:50:13 +03:00
|
|
|
import { looksValid as phoneNumberLooksValid } from '../../../phonenumber';
|
2017-02-24 14:41:23 +03:00
|
|
|
import Modal from '../../../Modal';
|
2017-05-30 17:09:57 +03:00
|
|
|
import { _t } from '../../../languageHandler';
|
2017-11-12 02:46:43 +03:00
|
|
|
import SdkConfig from '../../../SdkConfig';
|
2017-11-13 23:14:00 +03:00
|
|
|
import SettingsStore from "../../../settings/SettingsStore";
|
2015-11-30 21:11:04 +03:00
|
|
|
|
2017-02-24 14:41:23 +03:00
|
|
|
const FIELD_EMAIL = 'field_email';
|
2017-03-14 14:50:13 +03:00
|
|
|
const FIELD_PHONE_COUNTRY = 'field_phone_country';
|
|
|
|
const FIELD_PHONE_NUMBER = 'field_phone_number';
|
2017-02-24 14:41:23 +03:00
|
|
|
const FIELD_USERNAME = 'field_username';
|
|
|
|
const FIELD_PASSWORD = 'field_password';
|
|
|
|
const FIELD_PASSWORD_CONFIRM = 'field_password_confirm';
|
2016-01-15 16:31:41 +03:00
|
|
|
|
2015-11-30 21:11:04 +03:00
|
|
|
/**
|
|
|
|
* A pure UI component which displays a registration form.
|
|
|
|
*/
|
|
|
|
module.exports = React.createClass({
|
|
|
|
displayName: 'RegistrationForm',
|
|
|
|
|
|
|
|
propTypes: {
|
2016-07-07 13:23:08 +03:00
|
|
|
// Values pre-filled in the input boxes when the component loads
|
2017-12-26 04:03:18 +03:00
|
|
|
defaultEmail: PropTypes.string,
|
|
|
|
defaultPhoneCountry: PropTypes.string,
|
|
|
|
defaultPhoneNumber: PropTypes.string,
|
|
|
|
defaultUsername: PropTypes.string,
|
|
|
|
defaultPassword: PropTypes.string,
|
|
|
|
teamsConfig: PropTypes.shape({
|
2017-01-18 14:48:28 +03:00
|
|
|
// Email address to request new teams
|
2017-12-26 04:03:18 +03:00
|
|
|
supportEmail: PropTypes.string,
|
2018-09-04 20:26:09 +03:00
|
|
|
teams: PropTypes.arrayOf(PropTypes.shape({
|
2017-01-18 14:48:28 +03:00
|
|
|
// The displayed name of the team
|
2017-12-26 04:03:18 +03:00
|
|
|
"name": PropTypes.string,
|
2017-01-27 19:31:36 +03:00
|
|
|
// The domain of team email addresses
|
2017-12-26 04:03:18 +03:00
|
|
|
"domain": PropTypes.string,
|
2017-01-18 14:48:28 +03:00
|
|
|
})).required,
|
|
|
|
}),
|
2016-07-07 13:23:08 +03:00
|
|
|
|
2017-12-26 04:03:18 +03:00
|
|
|
minPasswordLength: PropTypes.number,
|
|
|
|
onError: PropTypes.func,
|
|
|
|
onRegisterClick: PropTypes.func.isRequired, // onRegisterClick(Object) => ?Promise
|
2018-09-04 20:50:18 +03:00
|
|
|
flows: PropTypes.arrayOf(PropTypes.object).isRequired,
|
2015-11-30 21:11:04 +03:00
|
|
|
},
|
|
|
|
|
|
|
|
getDefaultProps: function() {
|
|
|
|
return {
|
|
|
|
minPasswordLength: 6,
|
|
|
|
onError: function(e) {
|
|
|
|
console.error(e);
|
2017-10-11 19:56:17 +03:00
|
|
|
},
|
2015-11-30 21:11:04 +03:00
|
|
|
};
|
|
|
|
},
|
|
|
|
|
|
|
|
getInitialState: function() {
|
|
|
|
return {
|
2017-01-18 14:48:28 +03:00
|
|
|
fieldValid: {},
|
|
|
|
selectedTeam: null,
|
2017-03-14 14:50:13 +03:00
|
|
|
// The ISO2 country code selected in the phone number entry
|
|
|
|
phoneCountry: this.props.defaultPhoneCountry,
|
2015-11-30 21:11:04 +03:00
|
|
|
};
|
|
|
|
},
|
|
|
|
|
|
|
|
onSubmit: function(ev) {
|
|
|
|
ev.preventDefault();
|
|
|
|
|
2016-01-15 19:17:27 +03:00
|
|
|
// validate everything, in reverse order so
|
|
|
|
// the error that ends up being displayed
|
|
|
|
// is the one from the first invalid field.
|
|
|
|
// It's not super ideal that this just calls
|
|
|
|
// onError once for each invalid field.
|
|
|
|
this.validateField(FIELD_PASSWORD_CONFIRM);
|
|
|
|
this.validateField(FIELD_PASSWORD);
|
|
|
|
this.validateField(FIELD_USERNAME);
|
2017-03-14 14:50:13 +03:00
|
|
|
this.validateField(FIELD_PHONE_NUMBER);
|
2016-01-15 19:17:27 +03:00
|
|
|
this.validateField(FIELD_EMAIL);
|
|
|
|
|
2017-10-11 19:56:17 +03:00
|
|
|
const self = this;
|
2016-01-15 19:17:27 +03:00
|
|
|
if (this.allFieldsValid()) {
|
2016-03-21 04:15:11 +03:00
|
|
|
if (this.refs.email.value == '') {
|
2017-10-11 19:56:17 +03:00
|
|
|
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
|
2017-07-27 19:19:18 +03:00
|
|
|
Modal.createTrackedDialog('If you don\'t specify an email address...', '', QuestionDialog, {
|
2017-06-08 14:33:29 +03:00
|
|
|
title: _t("Warning!"),
|
2016-03-21 04:15:11 +03:00
|
|
|
description:
|
|
|
|
<div>
|
2017-10-11 19:56:17 +03:00
|
|
|
{ _t("If you don't specify an email address, you won't be able to reset your password. " +
|
|
|
|
"Are you sure?") }
|
2016-03-21 04:15:11 +03:00
|
|
|
</div>,
|
2017-05-30 17:09:57 +03:00
|
|
|
button: _t("Continue"),
|
2016-03-21 04:15:11 +03:00
|
|
|
onFinished: function(confirmed) {
|
|
|
|
if (confirmed) {
|
2017-06-03 17:51:20 +03:00
|
|
|
self._doSubmit(ev);
|
2016-03-21 04:15:11 +03:00
|
|
|
}
|
|
|
|
},
|
2016-01-15 19:17:27 +03:00
|
|
|
});
|
2017-06-03 17:51:20 +03:00
|
|
|
} else {
|
|
|
|
self._doSubmit(ev);
|
2016-03-21 04:15:11 +03:00
|
|
|
}
|
2015-11-30 21:11:04 +03:00
|
|
|
}
|
|
|
|
},
|
|
|
|
|
2017-06-02 23:34:18 +03:00
|
|
|
_doSubmit: function(ev) {
|
2017-10-11 19:56:17 +03:00
|
|
|
const email = this.refs.email.value.trim();
|
|
|
|
const promise = this.props.onRegisterClick({
|
2017-06-08 22:57:05 +03:00
|
|
|
username: this.refs.username.value.trim(),
|
2016-03-21 04:15:11 +03:00
|
|
|
password: this.refs.password.value.trim(),
|
2017-01-19 12:51:40 +03:00
|
|
|
email: email,
|
2017-03-14 14:50:13 +03:00
|
|
|
phoneCountry: this.state.phoneCountry,
|
2017-10-26 19:22:17 +03:00
|
|
|
phoneNumber: this.refs.phoneNumber ? this.refs.phoneNumber.value.trim() : '',
|
2016-03-21 04:15:11 +03:00
|
|
|
});
|
|
|
|
|
|
|
|
if (promise) {
|
|
|
|
ev.target.disabled = true;
|
|
|
|
promise.finally(function() {
|
|
|
|
ev.target.disabled = false;
|
|
|
|
});
|
2016-08-03 17:59:17 +03:00
|
|
|
}
|
2016-03-21 04:15:11 +03:00
|
|
|
},
|
|
|
|
|
2016-01-15 19:17:27 +03:00
|
|
|
/**
|
|
|
|
* Returns true if all fields were valid last time
|
|
|
|
* they were validated.
|
|
|
|
*/
|
|
|
|
allFieldsValid: function() {
|
2017-10-11 19:56:17 +03:00
|
|
|
const keys = Object.keys(this.state.fieldValid);
|
|
|
|
for (let i = 0; i < keys.length; ++i) {
|
2016-01-15 19:17:27 +03:00
|
|
|
if (this.state.fieldValid[keys[i]] == false) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return true;
|
|
|
|
},
|
|
|
|
|
2017-01-27 19:31:36 +03:00
|
|
|
_isUniEmail: function(email) {
|
2017-02-09 12:29:55 +03:00
|
|
|
return email.endsWith('.ac.uk') || email.endsWith('.edu') || email.endsWith('matrix.org');
|
2017-01-27 19:31:36 +03:00
|
|
|
},
|
|
|
|
|
2016-01-15 16:31:41 +03:00
|
|
|
validateField: function(field_id) {
|
2017-10-11 19:56:17 +03:00
|
|
|
const pwd1 = this.refs.password.value.trim();
|
|
|
|
const pwd2 = this.refs.passwordConfirm.value.trim();
|
2016-01-15 16:31:41 +03:00
|
|
|
|
|
|
|
switch (field_id) {
|
|
|
|
case FIELD_EMAIL:
|
2017-01-27 19:31:36 +03:00
|
|
|
const email = this.refs.email.value;
|
|
|
|
if (this.props.teamsConfig && this._isUniEmail(email)) {
|
|
|
|
const matchingTeam = this.props.teamsConfig.teams.find(
|
|
|
|
(team) => {
|
|
|
|
return email.split('@').pop() === team.domain;
|
2017-10-11 19:56:17 +03:00
|
|
|
},
|
2017-01-27 19:31:36 +03:00
|
|
|
) || null;
|
|
|
|
this.setState({
|
|
|
|
selectedTeam: matchingTeam,
|
|
|
|
showSupportEmail: !matchingTeam,
|
|
|
|
});
|
|
|
|
this.props.onTeamSelected(matchingTeam);
|
|
|
|
} else {
|
|
|
|
this.props.onTeamSelected(null);
|
|
|
|
this.setState({
|
|
|
|
selectedTeam: null,
|
|
|
|
showSupportEmail: false,
|
|
|
|
});
|
2017-01-18 14:48:28 +03:00
|
|
|
}
|
2017-02-24 14:41:23 +03:00
|
|
|
const emailValid = email === '' || Email.looksValid(email);
|
|
|
|
this.markFieldValid(field_id, emailValid, "RegistrationForm.ERR_EMAIL_INVALID");
|
2016-01-15 16:31:41 +03:00
|
|
|
break;
|
2017-03-14 14:50:13 +03:00
|
|
|
case FIELD_PHONE_NUMBER:
|
2017-10-26 19:22:17 +03:00
|
|
|
const phoneNumber = this.refs.phoneNumber ? this.refs.phoneNumber.value : '';
|
2017-03-14 14:50:13 +03:00
|
|
|
const phoneNumberValid = phoneNumber === '' || phoneNumberLooksValid(phoneNumber);
|
|
|
|
this.markFieldValid(field_id, phoneNumberValid, "RegistrationForm.ERR_PHONE_NUMBER_INVALID");
|
|
|
|
break;
|
2016-01-15 16:31:41 +03:00
|
|
|
case FIELD_USERNAME:
|
|
|
|
// XXX: SPEC-1
|
2017-06-08 22:57:05 +03:00
|
|
|
var username = this.refs.username.value.trim();
|
2016-03-15 21:35:09 +03:00
|
|
|
if (encodeURIComponent(username) != username) {
|
2016-01-15 16:31:41 +03:00
|
|
|
this.markFieldValid(
|
|
|
|
field_id,
|
|
|
|
false,
|
2017-10-11 19:56:17 +03:00
|
|
|
"RegistrationForm.ERR_USERNAME_INVALID",
|
2016-01-15 16:31:41 +03:00
|
|
|
);
|
2016-03-15 21:35:09 +03:00
|
|
|
} else if (username == '') {
|
2016-01-15 16:31:41 +03:00
|
|
|
this.markFieldValid(
|
|
|
|
field_id,
|
|
|
|
false,
|
2017-10-11 19:56:17 +03:00
|
|
|
"RegistrationForm.ERR_USERNAME_BLANK",
|
2016-01-15 16:31:41 +03:00
|
|
|
);
|
|
|
|
} else {
|
|
|
|
this.markFieldValid(field_id, true);
|
|
|
|
}
|
|
|
|
break;
|
|
|
|
case FIELD_PASSWORD:
|
|
|
|
if (pwd1 == '') {
|
|
|
|
this.markFieldValid(
|
|
|
|
field_id,
|
|
|
|
false,
|
2017-10-11 19:56:17 +03:00
|
|
|
"RegistrationForm.ERR_PASSWORD_MISSING",
|
2016-01-15 16:31:41 +03:00
|
|
|
);
|
|
|
|
} else if (pwd1.length < this.props.minPasswordLength) {
|
|
|
|
this.markFieldValid(
|
|
|
|
field_id,
|
|
|
|
false,
|
2017-10-11 19:56:17 +03:00
|
|
|
"RegistrationForm.ERR_PASSWORD_LENGTH",
|
2016-01-15 16:31:41 +03:00
|
|
|
);
|
|
|
|
} else {
|
|
|
|
this.markFieldValid(field_id, true);
|
|
|
|
}
|
|
|
|
break;
|
2016-01-15 19:17:27 +03:00
|
|
|
case FIELD_PASSWORD_CONFIRM:
|
|
|
|
this.markFieldValid(
|
|
|
|
field_id, pwd1 == pwd2,
|
2017-10-11 19:56:17 +03:00
|
|
|
"RegistrationForm.ERR_PASSWORD_MISMATCH",
|
2016-01-15 19:17:27 +03:00
|
|
|
);
|
|
|
|
break;
|
2016-01-15 16:31:41 +03:00
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
markFieldValid: function(field_id, val, error_code) {
|
2017-10-11 19:56:17 +03:00
|
|
|
const fieldValid = this.state.fieldValid;
|
2016-01-15 16:31:41 +03:00
|
|
|
fieldValid[field_id] = val;
|
|
|
|
this.setState({fieldValid: fieldValid});
|
|
|
|
if (!val) {
|
2017-02-24 14:41:23 +03:00
|
|
|
field_input_incorrect(this.fieldElementById(field_id));
|
2016-01-15 16:31:41 +03:00
|
|
|
this.props.onError(error_code);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
fieldElementById(field_id) {
|
|
|
|
switch (field_id) {
|
|
|
|
case FIELD_EMAIL:
|
|
|
|
return this.refs.email;
|
2017-03-14 14:50:13 +03:00
|
|
|
case FIELD_PHONE_NUMBER:
|
|
|
|
return this.refs.phoneNumber;
|
2016-01-15 16:31:41 +03:00
|
|
|
case FIELD_USERNAME:
|
|
|
|
return this.refs.username;
|
|
|
|
case FIELD_PASSWORD:
|
|
|
|
return this.refs.password;
|
|
|
|
case FIELD_PASSWORD_CONFIRM:
|
|
|
|
return this.refs.passwordConfirm;
|
|
|
|
}
|
|
|
|
},
|
|
|
|
|
2017-02-24 14:41:23 +03:00
|
|
|
_classForField: function(field_id, ...baseClasses) {
|
|
|
|
let cls = baseClasses.join(' ');
|
2016-01-15 16:31:41 +03:00
|
|
|
if (this.state.fieldValid[field_id] === false) {
|
2016-08-03 17:59:17 +03:00
|
|
|
if (cls) cls += ' ';
|
|
|
|
cls += 'error';
|
2016-01-15 16:31:41 +03:00
|
|
|
}
|
2016-08-03 17:59:17 +03:00
|
|
|
return cls;
|
2016-01-15 16:31:41 +03:00
|
|
|
},
|
|
|
|
|
2017-03-14 14:50:13 +03:00
|
|
|
_onPhoneCountryChange(newVal) {
|
|
|
|
this.setState({
|
2017-04-25 13:21:47 +03:00
|
|
|
phoneCountry: newVal.iso2,
|
|
|
|
phonePrefix: newVal.prefix,
|
2017-03-14 14:50:13 +03:00
|
|
|
});
|
|
|
|
},
|
|
|
|
|
2018-09-04 20:26:09 +03:00
|
|
|
_authStepIsRequired(step) {
|
|
|
|
// A step is required if no flow exists which does not include that step
|
|
|
|
// (Notwithstanding setups like either email or msisdn being required)
|
|
|
|
return !this.props.flows.some((flow) => {
|
|
|
|
return !flow.stages.includes(step);
|
|
|
|
});
|
|
|
|
},
|
|
|
|
|
2015-11-30 21:11:04 +03:00
|
|
|
render: function() {
|
2017-10-11 19:56:17 +03:00
|
|
|
const self = this;
|
2017-02-24 14:41:23 +03:00
|
|
|
|
2018-09-04 20:26:09 +03:00
|
|
|
const emailPlaceholder = this._authStepIsRequired('m.login.email.identity') ? _t("Email address") : _t("Email address (optional)");
|
2017-10-27 03:03:04 +03:00
|
|
|
|
2017-02-24 14:41:23 +03:00
|
|
|
const emailSection = (
|
|
|
|
<div>
|
2017-01-27 19:31:36 +03:00
|
|
|
<input type="text" ref="email"
|
2017-11-16 16:19:36 +03:00
|
|
|
autoFocus={true} placeholder={emailPlaceholder}
|
2017-01-27 19:31:36 +03:00
|
|
|
defaultValue={this.props.defaultEmail}
|
|
|
|
className={this._classForField(FIELD_EMAIL, 'mx_Login_field')}
|
|
|
|
onBlur={function() {self.validateField(FIELD_EMAIL);}}
|
2017-10-11 19:56:17 +03:00
|
|
|
value={self.state.email} />
|
2017-02-24 14:41:23 +03:00
|
|
|
</div>
|
|
|
|
);
|
|
|
|
let belowEmailSection;
|
|
|
|
if (this.props.teamsConfig) {
|
|
|
|
if (this.props.teamsConfig.supportEmail && this.state.showSupportEmail) {
|
|
|
|
belowEmailSection = (
|
|
|
|
<p className="mx_Login_support">
|
|
|
|
Sorry, but your university is not registered with us just yet.
|
|
|
|
Email us on
|
|
|
|
<a href={"mailto:" + this.props.teamsConfig.supportEmail}>
|
2017-10-11 19:56:17 +03:00
|
|
|
{ this.props.teamsConfig.supportEmail }
|
2017-02-24 14:41:23 +03:00
|
|
|
</a>
|
|
|
|
to get your university signed up. Or continue to register with Riot to enjoy our open source platform.
|
|
|
|
</p>
|
|
|
|
);
|
|
|
|
} else if (this.state.selectedTeam) {
|
|
|
|
belowEmailSection = (
|
|
|
|
<p className="mx_Login_support">
|
2017-10-11 19:56:17 +03:00
|
|
|
{ _t("You are registering with %(SelectedTeamName)s", {SelectedTeamName: this.state.selectedTeam.name}) }
|
2017-02-24 14:41:23 +03:00
|
|
|
</p>
|
|
|
|
);
|
2017-01-18 14:48:28 +03:00
|
|
|
}
|
2015-11-30 21:11:04 +03:00
|
|
|
}
|
|
|
|
|
2017-03-14 14:50:13 +03:00
|
|
|
const CountryDropdown = sdk.getComponent('views.login.CountryDropdown');
|
2017-10-25 04:04:02 +03:00
|
|
|
let phoneSection;
|
2017-11-12 02:46:43 +03:00
|
|
|
if (!SdkConfig.get().disable_3pid_login) {
|
2018-09-04 20:26:09 +03:00
|
|
|
const phonePlaceholder = this._authStepIsRequired('m.login.msisdn') ? _t("Mobile phone number") : _t("Mobile phone number (optional)");
|
2017-10-25 04:04:02 +03:00
|
|
|
phoneSection = (
|
|
|
|
<div className="mx_Login_phoneSection">
|
|
|
|
<CountryDropdown ref="phone_country" onOptionChange={this._onPhoneCountryChange}
|
|
|
|
className="mx_Login_phoneCountry mx_Login_field_prefix"
|
|
|
|
value={this.state.phoneCountry}
|
|
|
|
isSmall={true}
|
|
|
|
showPrefix={true}
|
|
|
|
/>
|
|
|
|
<input type="text" ref="phoneNumber"
|
2018-09-04 20:26:09 +03:00
|
|
|
placeholder={phonePlaceholder}
|
2017-10-25 04:04:02 +03:00
|
|
|
defaultValue={this.props.defaultPhoneNumber}
|
|
|
|
className={this._classForField(
|
|
|
|
FIELD_PHONE_NUMBER,
|
|
|
|
'mx_Login_phoneNumberField',
|
|
|
|
'mx_Login_field',
|
|
|
|
'mx_Login_field_has_prefix',
|
|
|
|
)}
|
|
|
|
onBlur={function() {self.validateField(FIELD_PHONE_NUMBER);}}
|
|
|
|
value={self.state.phoneNumber}
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|
2017-03-14 14:50:13 +03:00
|
|
|
|
2017-02-24 14:41:23 +03:00
|
|
|
const registerButton = (
|
2017-06-08 14:33:29 +03:00
|
|
|
<input className="mx_Login_submit" type="submit" value={_t("Register")} />
|
2017-02-24 14:41:23 +03:00
|
|
|
);
|
|
|
|
|
2017-10-11 19:56:17 +03:00
|
|
|
const placeholderUserName = _t("User name");
|
2016-03-15 21:35:09 +03:00
|
|
|
|
2015-11-30 21:11:04 +03:00
|
|
|
return (
|
|
|
|
<div>
|
|
|
|
<form onSubmit={this.onSubmit}>
|
2017-10-11 19:56:17 +03:00
|
|
|
{ emailSection }
|
|
|
|
{ belowEmailSection }
|
|
|
|
{ phoneSection }
|
2016-08-03 17:59:17 +03:00
|
|
|
<input type="text" ref="username"
|
2017-10-11 19:56:17 +03:00
|
|
|
placeholder={placeholderUserName} defaultValue={this.props.defaultUsername}
|
2016-08-03 17:59:17 +03:00
|
|
|
className={this._classForField(FIELD_USERNAME, 'mx_Login_field')}
|
2017-01-20 17:22:27 +03:00
|
|
|
onBlur={function() {self.validateField(FIELD_USERNAME);}} />
|
2015-11-30 21:11:04 +03:00
|
|
|
<br />
|
2016-08-03 17:59:17 +03:00
|
|
|
<input type="password" ref="password"
|
|
|
|
className={this._classForField(FIELD_PASSWORD, 'mx_Login_field')}
|
2017-01-20 17:22:27 +03:00
|
|
|
onBlur={function() {self.validateField(FIELD_PASSWORD);}}
|
2017-06-02 12:47:08 +03:00
|
|
|
placeholder={_t("Password")} defaultValue={this.props.defaultPassword} />
|
2015-11-30 21:11:04 +03:00
|
|
|
<br />
|
2016-08-03 17:59:17 +03:00
|
|
|
<input type="password" ref="passwordConfirm"
|
2017-06-02 12:47:08 +03:00
|
|
|
placeholder={_t("Confirm password")}
|
2016-08-03 17:59:17 +03:00
|
|
|
className={this._classForField(FIELD_PASSWORD_CONFIRM, 'mx_Login_field')}
|
2017-01-20 17:22:27 +03:00
|
|
|
onBlur={function() {self.validateField(FIELD_PASSWORD_CONFIRM);}}
|
2016-07-06 17:22:06 +03:00
|
|
|
defaultValue={this.props.defaultPassword} />
|
2015-11-30 21:11:04 +03:00
|
|
|
<br />
|
2017-10-11 19:56:17 +03:00
|
|
|
{ registerButton }
|
2015-11-30 21:11:04 +03:00
|
|
|
</form>
|
|
|
|
</div>
|
|
|
|
);
|
2017-10-11 19:56:17 +03:00
|
|
|
},
|
2015-11-30 21:11:04 +03:00
|
|
|
});
|