diff --git a/addons/website/static/src/interactions/popup/no_backdrop_popup.edit.js b/addons/website/static/src/interactions/popup/no_backdrop_popup.edit.js new file mode 100644 index 0000000000000..b62d593d9b394 --- /dev/null +++ b/addons/website/static/src/interactions/popup/no_backdrop_popup.edit.js @@ -0,0 +1,20 @@ +import { registry } from "@web/core/registry"; +import { NoBackdropPopup } from "./no_backdrop_popup"; + +export const NoBackdropPopupEdit = (I) => class extends I { + setup() { + super.setup(); + if (this.el.classList.contains("show")) { + // Use case: When the "Backdrop" option is disabled in edit mode. + // The page scrollbar must be adjusted and events must be added. + this.addModalNoBackdropEvents(); + } + } +}; + +registry + .category("website.editable_active_elements_builders") + .add("website.no_backdrop_popup", { + Interaction: NoBackdropPopup, + mixin: NoBackdropPopupEdit + }); diff --git a/addons/website/static/src/interactions/popup/no_backdrop_popup.js b/addons/website/static/src/interactions/popup/no_backdrop_popup.js index df52c51d3f94d..5aca4f5180418 100644 --- a/addons/website/static/src/interactions/popup/no_backdrop_popup.js +++ b/addons/website/static/src/interactions/popup/no_backdrop_popup.js @@ -4,8 +4,6 @@ import { Interaction } from "@website/core/interaction"; export class NoBackdropPopup extends Interaction { static selector = ".s_popup_no_backdrop"; - // TODO: handle edit mode - // disabledInEditableMode = false; dynamicContent = { "_root": { "t-on-shown.bs.modal": this.addModalNoBackdropEvents, @@ -17,12 +15,6 @@ export class NoBackdropPopup extends Interaction { this.throttledUpdateScrollbar = this.throttledForAnimation(this.updateScrollbar); this.removeResizeListener = null; this.resizeObserver = null; - // TODO: handle edit mode - // if (this.editableMode && this.el.classList.contains("show")) { - // // Use case: When the "Backdrop" option is disabled in edit mode. - // // The page scrollbar must be adjusted and events must be added. - // this.addModalNoBackdropEvents(); - // } } destroy() { diff --git a/addons/website/static/src/interactions/popup/popup.js b/addons/website/static/src/interactions/popup/popup.js index 37a0a5d2854bf..5d811b0adb160 100644 --- a/addons/website/static/src/interactions/popup/popup.js +++ b/addons/website/static/src/interactions/popup/popup.js @@ -27,6 +27,9 @@ export class Popup extends Interaction { this.modalEl = this.el.querySelector(".modal"); /** @type {import("bootstrap").Modal} */ this.bsModal = window.Modal.getOrCreateInstance(this.modalEl); + this.registerCleanup(() => { + this.bsModal.dispose(); + }); this.modalShownOnClickEl = this.el.querySelector(".modal[data-display='onClick']"); if (this.modalShownOnClickEl) { @@ -60,15 +63,6 @@ export class Popup extends Interaction { } } - destroy() { - // You cannot hide after dispose, so we do both here to make sure they - // trigger in order. The cleanup is not registered in setup so that the - // hide.bs.modal event isn't triggered (it is cleaned before destroy), - // and no cookie is set. - this.bsModal.hide(); - this.bsModal.dispose(); - } - bindPopup() { let display = this.modalEl.dataset.display; let delay = parseInt(this.modalEl.dataset.showAfter); diff --git a/addons/website/static/src/interactions/popup/shared_popup.js b/addons/website/static/src/interactions/popup/shared_popup.js index 0c25de8924464..a14e789f31842 100644 --- a/addons/website/static/src/interactions/popup/shared_popup.js +++ b/addons/website/static/src/interactions/popup/shared_popup.js @@ -5,8 +5,6 @@ import { Interaction } from "@website/core/interaction"; export class SharedPopup extends Interaction { static selector = ".s_popup"; - // TODO: support edit mode - disabledInEditableMode = false; dynamicContent = { // A popup element is composed of a `.s_popup` parent containing the // actual `.modal` BS modal. Our internal logic and events are hiding @@ -28,16 +26,6 @@ export class SharedPopup extends Interaction { setup() { this.popupShown = false; - - // TODO: support edit mode, maybe this can be removed completely. - // Popup are always closed when entering edit mode (see Popup interaction), - // this allows to make sure the class is sync on the .s_popup parent - // after that moment too. - // if (!this.editableMode) { - this.registerCleanup(() => { - this.popupShown = false; - }); - // } } onModalHidden() { @@ -52,4 +40,10 @@ export class SharedPopup extends Interaction { } } -registry.category("website.active_elements").add("website.shared_popup", SharedPopup); +registry + .category("website.active_elements") + .add("website.shared_popup", SharedPopup); + +registry + .category("website.editable_active_elements_builders") + .add("website.shared_popup", { Interaction: SharedPopup });