optimize magnify image + not require for enable to use

Author: hoang.tran12

popup/helpers/utils.js

@@ -14,6 +14,7 @@ export const canClick = (script) => {
 
 function hasChildFunction(object, excludedNamesSet = new Set()) {
   for (let key in object) {
+    if (key.startsWith("_")) continue;
     if (!object[key]) continue;
     if (excludedNamesSet.has(key)) continue;
     if (typeof object[key] === "function") return true;

scripts/_test.js

@@ -150,7 +150,10 @@ export default {
   },
 
   contentScript: {
-    onClick: () => {
+    onClick() {
+      console.log(UfsGlobal.DOM.getMousePos());
+    },
+    _onClick: () => {
       function formatSize(size, fixed = 0) {
         size = Number(size);
         if (!size) return "?";
@@ -289,29 +292,6 @@ export default {
       console.log(res);
     },
   },
-
-  backgroundScript: {
-    runtime: {
-      onInstalled: () => {
-        console.log("installed");
-      },
-      onStartup: () => {
-        console.log("startup");
-      },
-      onMessage: ({ request, sender, sendResponse }) => {
-        console.log(request, sender, sendResponse);
-        if (request.action === "test") {
-          sendResponse({ data: "result test" });
-        }
-        return null;
-      },
-    },
-    storage: {
-      onChanged: (details) => {
-        console.log("on Storage changed", details);
-      },
-    },
-  },
 };
 
 const backup = () => {

scripts/background-scripts/background_script.js

@@ -351,7 +351,7 @@ function main() {
   listenTabs();
   listenMessage();
 
-  chrome.contextMenus.onClicked.addListener((info) => {
+  chrome.contextMenus.onClicked.addListener(async (info) => {
     console.log(info);
     if (info.menuItemId == "ufs-magnify-image") {
       trackEvent("magnify-image-CONTEXT-MENU");
@@ -366,21 +366,17 @@ function main() {
         "pageUrl": "https://www.deviantart.com/kat-zaphire/art/Deep-in-the-forest-989494503",
         "srcUrl": "https://wixmp-70a14ff54af6225c7974eec7.wixmp.com/offers-assets/94f22a36-bb47-4836-8bce-fea45f844aa4.gif"
     } */
-      runScriptInCurrentTab(
-        (imgUrl) => {
-          let fn = window.top?.ufs_magnify_image_createPreview;
-          if (typeof fn === "function") {
-            fn(imgUrl, window.top.innerWidth / 2, window.top.innerHeight / 2);
-          } else {
-            alert(
-              "Useful-script:\n\n" +
-                "Vui lòng bật chức năng 'Tự động hoá' > 'Phóng to mọi hình ảnh' trước.\n\n" +
-                "Please enable 'Automation' > 'Magnify any Image' first."
-            );
-          }
+      let tab = await utils.getCurrentTab();
+      utils.runScriptInTabWithEventChain({
+        target: {
+          tabId: tab.id,
+          frameIds: [0],
         },
-        [info.srcUrl]
-      );
+        scriptIds: ["magnify_image"],
+        eventChain: "contentScript._createPreview",
+        details: info,
+        world: "ISOLATED",
+      });
     }
   });
 

scripts/content-scripts/ufs_global.js

@@ -16,6 +16,7 @@ Call UseGlobal directly, no need to import
       waitForTabToLoad,
     },
     DOM: {
+      getMousePos,
       isInCrossOriginFrame,
       isInIframe,
       checkElementvisibility,
@@ -111,7 +112,24 @@ Call UseGlobal directly, no need to import
   });
 
   // store cache for all functions in UfsGlobal
-  const CACHED = {};
+  const CACHED = {
+    mouse: {
+      x: 0,
+      y: 0,
+    },
+  };
+
+  if (typeof window !== "undefined") {
+    if (typeof window?.addEventListener === "function") {
+      window.addEventListener("mousemove", (e) => {
+        CACHED.mouse.x = e.clientX;
+        CACHED.mouse.y = e.clientY;
+      });
+    }
+  }
+  function getMousePos() {
+    return CACHED.mouse;
+  }
 
   // #region Extension
 
@@ -664,11 +682,12 @@ Call UseGlobal directly, no need to import
     else css.innerText = code;
     (document.head || document.documentElement).appendChild(css);
   }
-  function injectCssFile(filePath) {
+  function injectCssFile(filePath, id) {
     var css = document.createElement("link");
     css.setAttribute("rel", "stylesheet");
     css.setAttribute("type", "text/css");
     css.setAttribute("href", filePath);
+    if (id) css.setAttribute("id", id);
     (document.head || document.documentElement).appendChild(css);
   }
   function getTrustedPolicy() {
@@ -939,7 +958,7 @@ Call UseGlobal directly, no need to import
         let res = await fetchByPassOrigin(url, {
           method: "HEAD",
         });
-        if (res.redirected) {
+        if (res?.redirected) {
           console.log("redirected:", url, "->", res.url);
           url = res.url;
         } else {