github-mirror/framework
github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2025-02-21 00:53:38 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Remove modal responsibility for loading UI; using loading button state

Browse Source
This commit is contained in:
Toby Zerner 2015-08-02 17:25:05 +09:30
parent 5876ee30ed
commit d44ffd1866
9 changed files with 46 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
js/admin/src/components/EditGroupModal.js
View File

@ -63,7 +63,7 @@ export default class EditGroupModal extends Modal {
{Button.component({
type: 'submit',
className: 'Button Button--primary EditGroupModal-save',
loading: this._loading,
loading: this.loading,
children: 'Save Changes'
})}
{this.group.exists && this.group.id() !== Group.ADMINISTRATOR_ID ? (
@ -80,7 +80,7 @@ export default class EditGroupModal extends Modal {
onsubmit(e) {
e.preventDefault();
this._loading = true;
this.loading = true;
this.group.save({
nameSingular: this.nameSingular(),
@ -90,7 +90,7 @@ export default class EditGroupModal extends Modal {
}).then(
() => this.hide(),
() => {
this._loading = false;
this.loading = false;
m.redraw();
}
);

10
js/forum/src/components/ChangeEmailModal.js
View File

@ -1,4 +1,5 @@
import Modal from 'flarum/components/Modal';
import Button from 'flarum/components/Button';
/**
* The `ChangeEmailModal` component shows a modal dialog which allows the user
@ -60,9 +61,12 @@ export default class ChangeEmailModal extends Modal {
disabled={this.loading}/>
</div>
<div className="Form-group">
<button type="submit" className="Button Button--primary Button--block" disabled={this.loading}>
{app.trans('core.save_changes')}
</button>
{Button.component({
className: 'Button Button--primary Button--block',
type: 'submit',
loading: this.loading,
children: app.trans('core.save_changes')
})}
</div>
</div>
</div>

10
js/forum/src/components/ChangePasswordModal.js
View File

@ -1,4 +1,5 @@
import Modal from 'flarum/components/Modal';
import Button from 'flarum/components/Button';
/**
* The `ChangePasswordModal` component shows a modal dialog which allows the
@ -19,9 +20,12 @@ export default class ChangePasswordModal extends Modal {
<div className="Form Form--centered">
<p className="helpText">{app.trans('core.change_password_help')}</p>
<div className="Form-group">
<button type="submit" className="Button Button--primary Button--block" disabled={this.loading}>
{app.trans('core.send_password_reset_email')}
</button>
{Button.component({
className: 'Button Button--primary Button--block',
type: 'submit',
loading: this.loading,
children: app.trans('core.send_password_reset_email')
})}
</div>
</div>
</div>

13
js/forum/src/components/DeleteAccountModal.js
View File

@ -1,4 +1,5 @@
import Modal from 'flarum/components/Modal';
import Button from 'flarum/components/Button';
/**
* The `DeleteAccountModal` component shows a modal dialog which allows the user
@ -44,11 +45,13 @@ export default class DeleteAccountModal extends Modal {
oninput={m.withAttr('value', this.confirmation)}/>
</div>
<div className="Form-group">
<button type="submit"
className="Button Button--primary Button--block"
disabled={this.loading || this.confirmation() !== 'DELETE'}>
Delete Account
</button>
{Button.component({
className: 'Button Button--primary Button--block',
type: 'submit',
loading: this.loading,
disabled: this.confirmation() !== 'DELETE',
children: app.trans('core.delete_account')
})}
</div>
</div>
</div>

10
js/forum/src/components/ForgotPasswordModal.js
View File

@ -1,5 +1,6 @@
import Modal from 'flarum/components/Modal';
import Alert from 'flarum/components/Alert';
import Button from 'flarum/components/Button';
/**
* The `ForgotPasswordModal` component displays a modal which allows the user to
@ -65,9 +66,12 @@ export default class ForgotPasswordModal extends Modal {
disabled={this.loading} />
</div>
<div className="Form-group">
<button type="submit" className="Button Button--primary Button--block" disabled={this.loading}>
{app.trans('core.recover_password')}
</button>
{Button.component({
className: 'Button Button--primary Button--block',
type: 'submit',
loading: this.loading,
children: app.trans('core.recover_password')
})}
</div>
</div>
</div>

12
js/forum/src/components/LogInModal.js
View File

@ -2,6 +2,7 @@ import Modal from 'flarum/components/Modal';
import ForgotPasswordModal from 'flarum/components/ForgotPasswordModal';
import SignUpModal from 'flarum/components/SignUpModal';
import Alert from 'flarum/components/Alert';
import Button from 'flarum/components/Button';
/**
* The `LogInModal` component displays a modal dialog with a login form.
@ -57,11 +58,12 @@ export default class LogInModal extends Modal {
</div>
<div className="Form-group">
<button className="Button Button--primary Button--block"
type="submit"
disabled={this.loading}>
Log In
</button>
{Button.component({
className: 'Button Button--primary Button--block',
type: 'submit',
loading: this.loading,
children: app.trans('core.log_in')
})}
</div>
</div>
</div>,

12
js/forum/src/components/SignUpModal.js
View File

@ -1,6 +1,7 @@
import Modal from 'flarum/components/Modal';
import LogInModal from 'flarum/components/LogInModal';
import avatar from 'flarum/helpers/avatar';
import Button from 'flarum/components/Button';
/**
* The `SignUpModal` component displays a modal dialog with a singup form.
@ -88,11 +89,12 @@ export default class SignUpModal extends Modal {
</div>
<div className="Form-group">
<button className="Button Button--primary Button--block"
type="submit"
disabled={this.loading}>
{app.trans('core.sign_up')}
</button>
{Button.component({
className: 'Button Button--primary Button--block',
type: 'submit',
loading: this.loading,
children: app.trans('core.sign_up')
})}
</div>
</div>
)];

12
js/lib/components/Modal.js
View File

@ -1,5 +1,4 @@
import Component from 'flarum/Component';
import LoadingIndicator from 'flarum/components/LoadingIndicator';
import Alert from 'flarum/components/Alert';
import Button from 'flarum/components/Button';
@ -19,13 +18,6 @@ export default class Modal extends Component {
* @type {Alert}
*/
this.alert = null;
/**
* Whether or not the form is processing.
*
* @type {Boolean}
*/
this.loading = false;
}
view() {
@ -54,10 +46,6 @@ export default class Modal extends Component {
{this.content()}
</form>
</div>
{LoadingIndicator.component({
className: 'Modal-loading ' + (this.loading ? 'active' : '')
})}
</div>
);
}

1
less/lib/Button.less
View File

@ -93,7 +93,6 @@
.LoadingIndicator {
color: inherit;
margin: 0 -10px 0 -15px;
float: right;
}
&.loading {
.Button-label {