From d35d1fd44a20175aa8eff72f7e96234f4868bfd8 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sun, 18 Oct 2020 09:39:55 -0400 Subject: [PATCH] Generalize modal, move to popup-elements.js (#931) --- .../settings/{modal.js => popup-elements.js} | 32 +++++++++++-------- 1 file changed, 18 insertions(+), 14 deletions(-) rename ext/bg/js/settings/{modal.js => popup-elements.js} (83%) diff --git a/ext/bg/js/settings/modal.js b/ext/bg/js/settings/popup-elements.js similarity index 83% rename from ext/bg/js/settings/modal.js rename to ext/bg/js/settings/popup-elements.js index dadab111..1a35ddc9 100644 --- a/ext/bg/js/settings/modal.js +++ b/ext/bg/js/settings/popup-elements.js @@ -15,16 +15,16 @@ * along with this program. If not, see . */ -class Modal extends EventDispatcher { - constructor(node) { +class PopupElement extends EventDispatcher { + constructor({node, visibleClassName, openingClassName, closingClassName, closingAnimationDuration}) { super(); this._node = node; + this._visibleClassName = visibleClassName; + this._openingClassName = openingClassName; + this._closingClassName = closingClassName; + this._closingAnimationDuration = closingAnimationDuration; this._mutationObserver = null; this._visible = false; - this._visibleClassName = 'modal-container-open'; - this._openingClassName = 'modal-container-opening'; - this._closingClassName = 'modal-container-closing'; - this._closingAnimationDuration = 375; // Milliseconds; includes buffer this._closeTimer = null; } @@ -93,14 +93,6 @@ class Modal extends EventDispatcher { // Private - _onModalHide() { - this.trigger('visibilityChanged', {visible: false}); - } - - _onModalShow() { - this.trigger('visibilityChanged', {visible: true}); - } - _onMutation() { const visible = this._node.classList.contains(this._visibleClassName); if (this._visible === visible) { return; } @@ -108,3 +100,15 @@ class Modal extends EventDispatcher { this.trigger('visibilityChanged', {visible}); } } + +class Modal extends EventDispatcher { + constructor(node) { + super({ + node, + visibleClassName: 'modal-container-open', + openingClassName: 'modal-container-opening', + closingClassName: 'modal-container-closing', + closingAnimationDuration: 375 // Milliseconds; includes buffer + }); + } +}