diff --git a/src/components/views/elements/Dropdown.js b/src/components/views/elements/Dropdown.js index 1b2117bb6a..0fb5a37414 100644 --- a/src/components/views/elements/Dropdown.js +++ b/src/components/views/elements/Dropdown.js @@ -302,6 +302,7 @@ export default class Dropdown extends React.Component { const dropdownClasses = { mx_Dropdown: true, + mx_Dropdown_disabled: this.props.disabled, }; if (this.props.className) { dropdownClasses[this.props.className] = true; diff --git a/src/components/views/login/CountryDropdown.js b/src/components/views/login/CountryDropdown.js index 7024db339c..56ab962d98 100644 --- a/src/components/views/login/CountryDropdown.js +++ b/src/components/views/login/CountryDropdown.js @@ -123,7 +123,7 @@ export default class CountryDropdown extends React.Component { return {options} ; @@ -137,4 +137,5 @@ CountryDropdown.propTypes = { showPrefix: React.PropTypes.bool, onOptionChange: React.PropTypes.func.isRequired, value: React.PropTypes.string, + disabled: React.PropTypes.bool, }; diff --git a/src/components/views/login/PasswordLogin.js b/src/components/views/login/PasswordLogin.js index 7e78de3f54..d532c400bc 100644 --- a/src/components/views/login/PasswordLogin.js +++ b/src/components/views/login/PasswordLogin.js @@ -116,11 +116,17 @@ class PasswordLogin extends React.Component { this.props.onPasswordChanged(ev.target.value); } - renderLoginField(loginType) { + renderLoginField(loginType, disabled) { + const classes = { + mx_Login_field: true, + mx_Login_field_disabled: disabled, + }; + switch(loginType) { case PasswordLogin.LOGIN_FIELD_EMAIL: + classes.mx_Login_email = true; return ; case PasswordLogin.LOGIN_FIELD_MXID: + classes.mx_Login_username = true; return ; case PasswordLogin.LOGIN_FIELD_PHONE: const CountryDropdown = sdk.getComponent('views.login.CountryDropdown'); + classes.mx_Login_phoneNumberField = true; + classes.mx_Login_field_has_prefix = true; return
; } @@ -177,15 +190,6 @@ class PasswordLogin extends React.Component { ); } - const pwFieldClass = classNames({ - mx_Login_field: true, - error: this.props.loginIncorrect, - }); - - const Dropdown = sdk.getComponent('elements.Dropdown'); - - const loginField = this.renderLoginField(this.state.loginType); - let matrixIdText = ''; if (this.props.hsUrl) { try { @@ -196,6 +200,16 @@ class PasswordLogin extends React.Component { } } + const pwFieldClass = classNames({ + mx_Login_field: true, + mx_Login_field_disabled: matrixIdText === '', + error: this.props.loginIncorrect, + }); + + const Dropdown = sdk.getComponent('elements.Dropdown'); + + const loginField = this.renderLoginField(this.state.loginType, matrixIdText === ''); + return (
@@ -215,10 +229,12 @@ class PasswordLogin extends React.Component { {this._passwordField = e;}} type="password" name="password" value={this.state.password} onChange={this.onPasswordChanged} - placeholder={ _t('Password') } /> + placeholder={ _t('Password') } + disabled={matrixIdText === ''} + />
{forgotPasswordJsx} - +
);