github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2024-12-13 07:03:35 +08:00
Code Issues Actions 6 Packages Projects Releases Wiki Activity

Persist modal across routes

Browse Source 
Don't hide it unless it's already been shown, otherwise bootstrap JS
won't be initialized correctly
This commit is contained in:
Toby Zerner 2015-07-22 09:54:00 +09:30
parent 22a27620b4
commit 8455aa7907
1 changed files with 17 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
framework/core/js/lib/components/ModalManager.js
View File

@ -7,6 +7,13 @@ import Modal from 'flarum/components/Modal';
* overwrite the previous one. * overwrite the previous one.
*/ */
export default class ModalManager extends Component { export default class ModalManager extends Component {
constructor(...args) {
super(...args);
this.showing = false;
this.component = null;
}
view() { view() {
return ( return (
<div className="ModalManager modal fade"> <div className="ModalManager modal fade">
@ -15,9 +22,11 @@ export default class ModalManager extends Component {
); );
} }
config(isInitialized) { config(isInitialized, context) {
if (isInitialized) return; if (isInitialized) return;
context.retain = true;
this.$() this.$()
.on('hidden.bs.modal', this.clear.bind(this)) .on('hidden.bs.modal', this.clear.bind(this))
.on('shown.bs.modal', this.onready.bind(this)); .on('shown.bs.modal', this.onready.bind(this));
@ -36,6 +45,7 @@ export default class ModalManager extends Component {
clearTimeout(this.hideTimeout); clearTimeout(this.hideTimeout);
this.showing = true;
this.component = component; this.component = component;
m.redraw(true); m.redraw(true);
@ -50,12 +60,17 @@ export default class ModalManager extends Component {
* @public * @public
*/ */
close() { close() {
if (!this.showing) return;
// Don't hide the modal immediately, because if the consumer happens to call // Don't hide the modal immediately, because if the consumer happens to call
// the `show` method straight after to show another modal dialog, it will // the `show` method straight after to show another modal dialog, it will
// cause Bootstrap's modal JS to misbehave. Instead we will wait for a tiny // cause Bootstrap's modal JS to misbehave. Instead we will wait for a tiny
// bit to give the `show` method the opportunity to prevent this from going // bit to give the `show` method the opportunity to prevent this from going
// ahead. // ahead.
this.hideTimeout = setTimeout(() => this.$().modal('hide')); this.hideTimeout = setTimeout(() => {
this.$().modal('hide');
this.showing = false;
});
} }
/** /**