mirror of
https://github.com/discourse/discourse.git
synced 2024-11-25 09:42:07 +08:00
Migrate create account modal to components
This commit is contained in:
Robin Ward
parent
85c2aaa341
commit
67edb6ce5c
|
|
@ -0,0 +1,25 @@
|
|||
export default Ember.Component.extend({
|
||||
classNames: ['create-account'],
|
||||
|
||||
didInsertElement() {
|
||||
this._super();
|
||||
|
||||
if ($.cookie('email')) {
|
||||
this.set('email', $.cookie('email'));
|
||||
}
|
||||
|
||||
this.$().on('keydown.discourse-create-account', e => {
|
||||
if (!this.get('disabled') && e.keyCode === 13) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
this.sendAction();
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
willDestroyElement() {
|
||||
this._super();
|
||||
this.$().off('keydown.discourse-create-account');
|
||||
}
|
||||
});
|
||||
|
|
@ -1,105 +1,108 @@
|
|||
{{#unless complete}}
|
||||
<div class="modal-body">
|
||||
{{#unless hasAuthOptions}}
|
||||
{{login-buttons action="externalLogin"}}
|
||||
{{/unless}}
|
||||
{{#create-account email=accountEmail disabled=submitDisabled action="createAccount"}}
|
||||
|
||||
{{#if showCreateForm}}
|
||||
<div>
|
||||
<form>
|
||||
<table>
|
||||
{{#unless complete}}
|
||||
{{#d-modal-body title="create_account.title"}}
|
||||
{{#unless hasAuthOptions}}
|
||||
{{login-buttons action="externalLogin"}}
|
||||
{{/unless}}
|
||||
|
||||
<tr class="input">
|
||||
<td class="label"><label for='new-account-email'>{{i18n 'user.email.title'}}</label></td>
|
||||
<td>
|
||||
{{input type="email" value=accountEmail id="new-account-email" disabled=emailValidated name="email" autofocus="autofocus"}}
|
||||
{{input-tip validation=emailValidation}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="instructions">
|
||||
<td></td>
|
||||
<td><label>{{i18n 'user.email.instructions'}}</label></td>
|
||||
</tr>
|
||||
{{#if showCreateForm}}
|
||||
<div>
|
||||
<form>
|
||||
<table>
|
||||
|
||||
{{#if usernameRequired}}
|
||||
<tr class="input">
|
||||
<td class="label"><label for='new-account-username'>{{i18n 'user.username.title'}}</label></td>
|
||||
<td class="label"><label for='new-account-email'>{{i18n 'user.email.title'}}</label></td>
|
||||
<td>
|
||||
{{input value=accountUsername id="new-account-username" name="username" maxlength=maxUsernameLength autocomplete="off"}}
|
||||
{{input-tip validation=usernameValidation id="username-validation"}}
|
||||
{{input type="email" value=accountEmail id="new-account-email" disabled=emailValidated name="email" autofocus="autofocus"}}
|
||||
{{input-tip validation=emailValidation}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="instructions">
|
||||
<td></td>
|
||||
<td><label>{{i18n 'user.username.instructions'}}</label></td>
|
||||
<td><label>{{i18n 'user.email.instructions'}}</label></td>
|
||||
</tr>
|
||||
{{/if}}
|
||||
|
||||
{{#if fullnameRequired}}
|
||||
<tr class="input">
|
||||
<td class="label">
|
||||
<label for='new-account-name'>{{i18n 'user.name.title'}}</label>
|
||||
</td>
|
||||
<td>
|
||||
{{text-field value=accountName id="new-account-name"}} {{input-tip validation=nameValidation}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="instructions">
|
||||
<td></td>
|
||||
<td><label>{{nameInstructions}}</label></td>
|
||||
</tr>
|
||||
{{/if}}
|
||||
{{#if usernameRequired}}
|
||||
<tr class="input">
|
||||
<td class="label"><label for='new-account-username'>{{i18n 'user.username.title'}}</label></td>
|
||||
<td>
|
||||
{{input value=accountUsername id="new-account-username" name="username" maxlength=maxUsernameLength autocomplete="off"}}
|
||||
{{input-tip validation=usernameValidation id="username-validation"}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="instructions">
|
||||
<td></td>
|
||||
<td><label>{{i18n 'user.username.instructions'}}</label></td>
|
||||
</tr>
|
||||
{{/if}}
|
||||
|
||||
{{plugin-outlet "create-account-before-password"}}
|
||||
|
||||
{{#if passwordRequired}}
|
||||
<tr class="input">
|
||||
<td class="label"><label for='new-account-password'>{{i18n 'user.password.title'}}</label></td>
|
||||
<td>
|
||||
{{password-field value=accountPassword type="password" id="new-account-password" capsLockOn=capsLockOn}}
|
||||
{{input-tip validation=passwordValidation}}
|
||||
{{#if fullnameRequired}}
|
||||
<tr class="input">
|
||||
<td class="label">
|
||||
<label for='new-account-name'>{{i18n 'user.name.title'}}</label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="instructions">
|
||||
<td></td>
|
||||
<td>
|
||||
{{text-field value=accountName id="new-account-name"}} {{input-tip validation=nameValidation}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="instructions">
|
||||
<td></td>
|
||||
<td><label>{{nameInstructions}}</label></td>
|
||||
</tr>
|
||||
{{/if}}
|
||||
|
||||
{{plugin-outlet "create-account-before-password"}}
|
||||
|
||||
{{#if passwordRequired}}
|
||||
<tr class="input">
|
||||
<td class="label"><label for='new-account-password'>{{i18n 'user.password.title'}}</label></td>
|
||||
<td>
|
||||
{{password-field value=accountPassword type="password" id="new-account-password" capsLockOn=capsLockOn}}
|
||||
{{input-tip validation=passwordValidation}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="instructions">
|
||||
<td></td>
|
||||
<td>
|
||||
<label>{{passwordInstructions}}</label>
|
||||
<div class="caps-lock-warning {{unless capsLockOn 'invisible'}}"><i class="fa fa-exclamation-triangle"></i> {{i18n 'login.caps_lock_warning'}}</div>
|
||||
</td>
|
||||
</tr>
|
||||
{{/if}}
|
||||
|
||||
<tr class="password-confirmation">
|
||||
<td><label for='new-account-password-confirmation'>{{i18n 'user.password_confirmation.title'}}</label></td>
|
||||
<td>
|
||||
<label>{{passwordInstructions}}</label>
|
||||
<div class="caps-lock-warning {{unless capsLockOn 'invisible'}}"><i class="fa fa-exclamation-triangle"></i> {{i18n 'login.caps_lock_warning'}}</div>
|
||||
{{input type="password" value=accountPasswordConfirm id="new-account-confirmation"}}
|
||||
{{input value=accountChallenge id="new-account-challenge"}}
|
||||
</td>
|
||||
</tr>
|
||||
{{/if}}
|
||||
|
||||
<tr class="password-confirmation">
|
||||
<td><label for='new-account-password-confirmation'>{{i18n 'user.password_confirmation.title'}}</label></td>
|
||||
<td>
|
||||
{{input type="password" value=accountPasswordConfirm id="new-account-confirmation"}}
|
||||
{{input value=accountChallenge id="new-account-challenge"}}
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
</table>
|
||||
{{#if userFields}}
|
||||
<div class='user-fields'>
|
||||
{{#each userFields as |f|}}
|
||||
{{user-field field=f.field value=f.value}}
|
||||
{{/each}}
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{#if userFields}}
|
||||
<div class='user-fields'>
|
||||
{{#each userFields as |f|}}
|
||||
{{user-field field=f.field value=f.value}}
|
||||
{{/each}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</form>
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/d-modal-body}}
|
||||
|
||||
</form>
|
||||
{{#if showCreateForm}}
|
||||
<div class="modal-footer">
|
||||
<button class='btn btn-large btn-primary' disabled={{submitDisabled}} {{action "createAccount"}}>{{i18n 'create_account.title'}}</button>
|
||||
{{#conditional-loading-spinner condition=formSubmitted size="small"}}
|
||||
<button class="btn btn-large" id="login-link" {{action "showLogin"}}>
|
||||
{{i18n 'log_in'}}
|
||||
</button>
|
||||
{{/conditional-loading-spinner}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
{{#if showCreateForm}}
|
||||
<div class="modal-footer">
|
||||
<button class='btn btn-large btn-primary' disabled={{submitDisabled}} {{action "createAccount"}}>{{i18n 'create_account.title'}}</button>
|
||||
{{#conditional-loading-spinner condition=formSubmitted size="small"}}
|
||||
<button class="btn btn-large" id="login-link" {{action "showLogin"}}>
|
||||
{{i18n 'log_in'}}
|
||||
</button>
|
||||
{{/conditional-loading-spinner}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/unless}}
|
||||
{{/unless}}
|
||||
{{/create-account}}
|
||||
|
|
|
|||
|
|
@ -1,25 +0,0 @@
|
|||
import ModalBodyView from "discourse/views/modal-body";
|
||||
|
||||
export default ModalBodyView.extend({
|
||||
templateName: 'modal/create-account',
|
||||
title: I18n.t('create_account.title'),
|
||||
classNames: ['create-account'],
|
||||
|
||||
_setup: function() {
|
||||
// Allows submitting the form when pressing 'ENTER' on *any* text input field
|
||||
// but only when the submit button is enabled.
|
||||
const createAccountController = this.get('controller');
|
||||
|
||||
if ($.cookie('email')) {
|
||||
createAccountController.set('accountEmail', $.cookie('email'));
|
||||
}
|
||||
|
||||
Em.run.schedule('afterRender', function() {
|
||||
$("input[type='text'], input[type='password']").keydown(function(e) {
|
||||
if (createAccountController.get('submitDisabled') === false && e.keyCode === 13) {
|
||||
createAccountController.send('createAccount');
|
||||
}
|
||||
});
|
||||
});
|
||||
}.on('didInsertElement')
|
||||
});
|
||||
Loading…
Reference in New Issue
Block a user