[FB] Nora | Use Class insyead of Object

Floorp-Projects · Jun 1, 2024 · e6985d8 · e6985d8
1 parent 539bb36
commit e6985d8
Showing 1 changed file with 34 additions and 56 deletions.
diff --git a/nora/src/content/context-menu/browser-context-menu.tsx b/nora/src/content/context-menu/browser-context-menu.tsx
@@ -2,70 +2,46 @@ import { insert } from "@solid-xul/solid-xul";
 import { ContextMenu } from "./context-menu";
 import type { JSXElement } from "solid-js";
 
-export const gFloorpContextMenu: {
-  initialized: boolean;
-  checkItems: (() => void)[];
-  contextMenuObserver: MutationObserver;
-  windowModalDialogElem: XULElement;
-  screenShotContextMenuItems: XULElement;
-  contentAreaContextMenu: XULElement;
-  pdfjsContextMenuSeparator: XULElement;
-  contextMenuSeparators: NodeListOf<XULElement>;
-  init: () => void;
-  addContextBox: (
-    id: string,
-    l10n: string,
-    insert: string,
-    runFunction: () => void,
-    checkID: string,
-    checkedFunction: () => void,
-  ) => void;
-  contextMenuObserverFunc: () => void;
-  addToolbarContentMenuPopupSet: (xulElement: JSXElement) => void;
-  onPopupShowing: () => void;
-} = {
-  initialized: false,
-  checkItems: [],
-  contextMenuObserver: new MutationObserver(() =>
-    gFloorpContextMenu.contextMenuObserverFunc(),
-  ),
+class gFloorpContextMenuServices {
+  initialized = false;
+  checkItems: (() => void)[] = [];
+  contextMenuObserver: MutationObserver = new MutationObserver(() => {
+    this.contextMenuObserverFunc();
+  });
 
   get windowModalDialogElem() {
     return document.getElementById("window-modal-dialog") as XULElement;
-  },
+  }
   get screenShotContextMenuItems() {
     return document.getElementById("context-take-screenshot") as XULElement;
-  },
+  }
   get contentAreaContextMenu() {
     return document.getElementById("contentAreaContextMenu") as XULElement;
-  },
+  }
   get pdfjsContextMenuSeparator() {
     return document.getElementById("context-sep-pdfjs-selectall") as XULElement;
-  },
-  get contextMenuSeparators() {
-    return document.querySelectorAll(
-      "#contentAreaContextMenu > menuseparator",
-    ) as NodeListOf<XULElement>;
-  },
+  }
+  get contextMenuSeparators(): NodeListOf<XULElement> {
+    return document.querySelectorAll("#contentAreaContextMenu > menuseparator");
+  }
 
   init() {
     if (this.initialized) {
       return;
     }
-    gFloorpContextMenu.contentAreaContextMenu.addEventListener(
-      "popupshowing",
-      gFloorpContextMenu.onPopupShowing,
+    this.contentAreaContextMenu.addEventListener("popupshowing", () =>
+      this.onPopupShowing(),
     );
     this.initialized = true;
-  },
+  }
 
   addContextBox(
-    id,
-    l10n,
-    insertElementId,
-    runFunction,
-    checkID,
-    checkedFunction,
+    id: string,
+    l10n: string,
+    insertElementId: string,
+    runFunction: () => void,
+    checkID: string,
+    checkedFunction: () => void,
   ) {
     const contextMenu = ContextMenu(id, l10n, runFunction);
     const targetNode = document.getElementById(checkID) as XULElement;
@@ -77,31 +53,31 @@ export const gFloorpContextMenu: {
     this.contextMenuObserver.observe(targetNode, { attributes: true });
     this.checkItems.push(checkedFunction);
     this.contextMenuObserverFunc();
-  },
+  }
 
   contextMenuObserverFunc() {
     for (const checkItem of this.checkItems) {
       checkItem();
     }
-  },
+  }
 
-  addToolbarContentMenuPopupSet(JSXElem) {
+  addToolbarContentMenuPopupSet(JSXElem: JSXElement) {
     insert(document.body, JSXElem, this.windowModalDialogElem);
-  },
+  }
 
   onPopupShowing() {
-    if (!gFloorpContextMenu.screenShotContextMenuItems.hidden) {
-      gFloorpContextMenu.pdfjsContextMenuSeparator.hidden = false;
+    if (!this.screenShotContextMenuItems.hidden) {
+      this.pdfjsContextMenuSeparator.hidden = false;
 
-      const nextSibling = gFloorpContextMenu.screenShotContextMenuItems
+      const nextSibling = this.screenShotContextMenuItems
         .nextSibling as XULElement;
       if (nextSibling) {
         nextSibling.hidden = false;
       }
     }
 
     (async () => {
-      for (const contextMenuSeparator of gFloorpContextMenu.contextMenuSeparators) {
+      for (const contextMenuSeparator of this.contextMenuSeparators) {
         if (
           contextMenuSeparator.nextSibling.hidden &&
           contextMenuSeparator.previousSibling.hidden &&
@@ -112,5 +88,7 @@ export const gFloorpContextMenu: {
         }
       }
     })();
-  },
-};
+  }
+}
+
+export const gFloorpContextMenu = new gFloorpContextMenuServices();