From b4f563c38fc9bbc54cf1af17f7b162c6b5039889 Mon Sep 17 00:00:00 2001 From: Alexander Skvortsov Date: Fri, 25 Sep 2020 12:45:46 -0400 Subject: [PATCH 1/6] Revert "Fix opening modals from other modals. (#2263)" This reverts commit 1d7002a63f50a868750d1465fd485eb921cf660d. --- framework/core/js/src/common/components/Modal.js | 4 ++++ framework/core/js/src/common/components/ModalManager.js | 6 ------ 2 files changed, 4 insertions(+), 6 deletions(-) diff --git a/framework/core/js/src/common/components/Modal.js b/framework/core/js/src/common/components/Modal.js index b554b255e..2a59beb01 100644 --- a/framework/core/js/src/common/components/Modal.js +++ b/framework/core/js/src/common/components/Modal.js @@ -27,6 +27,10 @@ export default class Modal extends Component { this.attrs.onshow(() => this.onready()); } + onremove() { + this.attrs.onhide(); + } + view() { if (this.alertAttrs) { this.alertAttrs.dismissible = false; diff --git a/framework/core/js/src/common/components/ModalManager.js b/framework/core/js/src/common/components/ModalManager.js index 8d13fe434..35922f70d 100644 --- a/framework/core/js/src/common/components/ModalManager.js +++ b/framework/core/js/src/common/components/ModalManager.js @@ -16,12 +16,6 @@ export default class ModalManager extends Component { ); } - onupdate() { - if (this.$('.Modal') && !this.attrs.state.modal) { - this.animateHide(); - } - } - oncreate(vnode) { super.oncreate(vnode); From 822ace668a84b434a6d28e48a948eae1b47dfd1a Mon Sep 17 00:00:00 2001 From: Alexander Skvortsov Date: Fri, 25 Sep 2020 12:54:03 -0400 Subject: [PATCH 2/6] Prevent hide animation when opening modal from other modal --- framework/core/js/src/common/components/Modal.js | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/framework/core/js/src/common/components/Modal.js b/framework/core/js/src/common/components/Modal.js index 2a59beb01..b08f73b3a 100644 --- a/framework/core/js/src/common/components/Modal.js +++ b/framework/core/js/src/common/components/Modal.js @@ -27,8 +27,13 @@ export default class Modal extends Component { this.attrs.onshow(() => this.onready()); } - onremove() { - this.attrs.onhide(); + onbeforeremove() { + // If the global modal state currently contains a modal, + // we've just opened up a new one, and accordingly, + // we don't need to show a hide animation. + if (!app.modal.modal) { + this.attrs.onhide(); + } } view() { @@ -107,7 +112,7 @@ export default class Modal extends Component { * Hide the modal. */ hide() { - this.attrs.onhide(); + app.modal.close(); } /** From 5127e7d06396de4cc60f3af5ff3cf12c27a795dd Mon Sep 17 00:00:00 2001 From: Alexander Skvortsov Date: Fri, 25 Sep 2020 13:00:44 -0400 Subject: [PATCH 3/6] Ensure that readyCallback is called on modals opened from other modals --- framework/core/js/src/common/components/ModalManager.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/framework/core/js/src/common/components/ModalManager.js b/framework/core/js/src/common/components/ModalManager.js index 35922f70d..1b063552e 100644 --- a/framework/core/js/src/common/components/ModalManager.js +++ b/framework/core/js/src/common/components/ModalManager.js @@ -28,6 +28,13 @@ export default class ModalManager extends Component { animateShow(readyCallback) { const dismissible = !!this.attrs.state.modal.componentClass.isDismissible; + // If we are opening this modal while another modal is already open, + // the shown event will not run, because the modal is already open. + // So, we need to manually trigger the readyCallback. + if (this.$().hasClass('in')) { + readyCallback(); + } + this.$() .one('shown.bs.modal', readyCallback) .modal({ From 4c3f36a53b6ad17c5df28ee2cde24ee1b76678cc Mon Sep 17 00:00:00 2001 From: Alexander Skvortsov Date: Fri, 25 Sep 2020 13:02:10 -0400 Subject: [PATCH 4/6] Pass ModalManagerState into Modal instances instead of calling the global. --- framework/core/js/src/common/components/Modal.js | 4 ++-- framework/core/js/src/common/components/ModalManager.js | 9 ++++++++- 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/framework/core/js/src/common/components/Modal.js b/framework/core/js/src/common/components/Modal.js index b08f73b3a..97e3a273e 100644 --- a/framework/core/js/src/common/components/Modal.js +++ b/framework/core/js/src/common/components/Modal.js @@ -31,7 +31,7 @@ export default class Modal extends Component { // If the global modal state currently contains a modal, // we've just opened up a new one, and accordingly, // we don't need to show a hide animation. - if (!app.modal.modal) { + if (!this.attrs.state.modal) { this.attrs.onhide(); } } @@ -112,7 +112,7 @@ export default class Modal extends Component { * Hide the modal. */ hide() { - app.modal.close(); + this.attrs.state.close(); } /** diff --git a/framework/core/js/src/common/components/ModalManager.js b/framework/core/js/src/common/components/ModalManager.js index 1b063552e..124eed226 100644 --- a/framework/core/js/src/common/components/ModalManager.js +++ b/framework/core/js/src/common/components/ModalManager.js @@ -11,7 +11,14 @@ export default class ModalManager extends Component { return (
- {modal ? modal.componentClass.component({ ...modal.attrs, onshow: this.animateShow.bind(this), onhide: this.animateHide.bind(this) }) : ''} + {modal + ? modal.componentClass.component({ + ...modal.attrs, + onshow: this.animateShow.bind(this), + onhide: this.animateHide.bind(this), + state: this.attrs.state, + }) + : ''}
); } From e798cb104b34b3cac5d864496e7e9c0c296862eb Mon Sep 17 00:00:00 2001 From: Alexander Skvortsov Date: Fri, 25 Sep 2020 16:37:32 -0400 Subject: [PATCH 5/6] Return on animateShow if already loaded --- framework/core/js/src/common/components/ModalManager.js | 1 + 1 file changed, 1 insertion(+) diff --git a/framework/core/js/src/common/components/ModalManager.js b/framework/core/js/src/common/components/ModalManager.js index 124eed226..b4c8814b3 100644 --- a/framework/core/js/src/common/components/ModalManager.js +++ b/framework/core/js/src/common/components/ModalManager.js @@ -40,6 +40,7 @@ export default class ModalManager extends Component { // So, we need to manually trigger the readyCallback. if (this.$().hasClass('in')) { readyCallback(); + return; } this.$() From 12bfff9b5d24a15a6bf3d61431a278f159cbebd7 Mon Sep 17 00:00:00 2001 From: Alexander Skvortsov Date: Tue, 29 Sep 2020 18:37:26 -0400 Subject: [PATCH 6/6] Rename onshow and onhide animateShow and animateHide are more descriptive --- framework/core/js/src/common/components/Modal.js | 4 ++-- framework/core/js/src/common/components/ModalManager.js | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/framework/core/js/src/common/components/Modal.js b/framework/core/js/src/common/components/Modal.js index 97e3a273e..0d621060a 100644 --- a/framework/core/js/src/common/components/Modal.js +++ b/framework/core/js/src/common/components/Modal.js @@ -24,7 +24,7 @@ export default class Modal extends Component { oncreate(vnode) { super.oncreate(vnode); - this.attrs.onshow(() => this.onready()); + this.attrs.animateShow(() => this.onready()); } onbeforeremove() { @@ -32,7 +32,7 @@ export default class Modal extends Component { // we've just opened up a new one, and accordingly, // we don't need to show a hide animation. if (!this.attrs.state.modal) { - this.attrs.onhide(); + this.attrs.animateHide(); } } diff --git a/framework/core/js/src/common/components/ModalManager.js b/framework/core/js/src/common/components/ModalManager.js index b4c8814b3..9d0609c18 100644 --- a/framework/core/js/src/common/components/ModalManager.js +++ b/framework/core/js/src/common/components/ModalManager.js @@ -14,8 +14,8 @@ export default class ModalManager extends Component { {modal ? modal.componentClass.component({ ...modal.attrs, - onshow: this.animateShow.bind(this), - onhide: this.animateHide.bind(this), + animateShow: this.animateShow.bind(this), + animateHide: this.animateHide.bind(this), state: this.attrs.state, }) : ''}