Generalize modal, move to popup-elements.js (#931)

ext/bg/js/settings/popup-elements.js

@@ -15,16 +15,16 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
  */
 
-class Modal extends EventDispatcher {
+class PopupElement extends EventDispatcher {
-    constructor(node) {
+    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
+        });
+    }
+}