fix

KochC · Mar 2, 2023 · c3497f5 · c3497f5
1 parent c45d3c4
commit c3497f5
Show file tree

Hide file tree

Showing 16 changed files with 90 additions and 73 deletions.
diff --git a/background.js b/background.js
@@ -18,17 +18,17 @@ chrome.runtime.onInstalled.addListener(() => {
                 if (request.scheme == "light") {
                     chrome.action.setIcon({
                         path: {
-                            128: "src/icon/icon128_light.png",
-                            48: "src/icon/icon48_light.png",
-                            16: "src/icon/icon16_light.png",
+                            128: "icon/icon128_light.png",
+                            48: "icon/icon48_light.png",
+                            16: "icon/icon16_light.png",
                         },
                     });
                 } else if (request.schema == "dark") {
                     chrome.action.setIcon({
                         path: {
-                            128: "src/icon/icon128_dark.png",
-                            48: "src/icon/icon48_dark.png",
-                            16: "src/icon/icon16_dark.png",
+                            128: "icon/icon128_dark.png",
+                            48: "icon/icon48_dark.png",
+                            16: "icon/icon16_dark.png",
                         },
                     });
                 }

diff --git a/icon/icon128.png b/icon/icon128.png
diff --git a/icon/icon128_dark.png b/icon/icon128_dark.png
diff --git a/icon/icon128_light.png b/icon/icon128_light.png
diff --git a/icon/icon16.png b/icon/icon16.png
diff --git a/icon/icon16_dark.png b/icon/icon16_dark.png
diff --git a/icon/icon16_light.png b/icon/icon16_light.png
diff --git a/icon/icon48.png b/icon/icon48.png
diff --git a/icon/icon48_dark.png b/icon/icon48_dark.png
diff --git a/icon/icon48_light.png b/icon/icon48_light.png
diff --git a/manifest.json b/manifest.json
@@ -5,6 +5,7 @@
     "author": "Christopher Koch",
     "version": "0",
     "action": {
+        "default_popup": "popup.html",
         "default_title": "Foundry Pro Chrome Extension"
     },
     "permissions": ["storage"],
@@ -32,8 +33,8 @@
         }
     ],
     "icons": {
-        "16": "src/icon/icon16_light.png",
-        "48": "src/icon/icon48_light.png",
-        "128": "src/icon/icon128_light.png"
+        "16": "icon/icon16_light.png",
+        "48": "icon/icon48_light.png",
+        "128": "icon/icon128_light.png"
     }
 }
diff --git a/popup.html b/popup.html
@@ -0,0 +1,4 @@
+<head>
+    <script src="content.js"></script>
+</head>
+<body id="pf_popup_container"></body>
diff --git a/public/index.html b/public/index.html
@@ -1,21 +1,21 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="theme-color" content="#000000" />
-    <meta
-      name="description"
-      content="Web site created using create-react-app"
-    />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
-    <!--
+    <head>
+        <meta charset="utf-8" />
+        <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <meta name="theme-color" content="#000000" />
+        <meta
+            name="description"
+            content="Web site created using create-react-app"
+        />
+        <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+        <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
     -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <!--
+        <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+        <!--
       Notice the use of %PUBLIC_URL% in the tags above.
       It will be replaced with the URL of the `public` folder during the build.
       Only files inside the `public` folder can be referenced from the HTML.
@@ -24,12 +24,22 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>React App</title>
-  </head>
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
-    <!--
+        <title>React App</title>
+        <link href="./normalize.css/normalize.css" rel="stylesheet" />
+        <!-- blueprint-icons.css file must be included alongside blueprint.css! -->
+        <link
+            href="./@blueprintjs/icons/lib/css/blueprint-icons.css"
+            rel="stylesheet"
+        />
+        <link
+            href="./@blueprintjs/core/lib/css/blueprint.css"
+            rel="stylesheet"
+        />
+    </head>
+    <body>
+        <noscript>You need to enable JavaScript to run this app.</noscript>
+        <div id="root"></div>
+        <!--
       This HTML file is a template.
       If you open it directly in the browser, you will see an empty page.
 
@@ -38,6 +48,5 @@
 
       To begin the development, run `npm start` or `yarn start`.
       To create a production bundle, use `npm run build` or `yarn build`.
-    -->
-  </body>
+    --></body>
 </html>
diff --git a/src/Popup/Popup.tsx b/src/Popup/Popup.tsx
@@ -0,0 +1,24 @@
+import { useEffect } from 'react';
+
+const CustomLinks = () => {
+
+    const init = async () => { }
+
+    const reset = () => {
+        chrome.storage.sync.clear()
+    }
+
+    // this function runs once at the beginning
+    useEffect(() => {
+        init();
+    }, [])
+
+
+    return (
+        <>
+            <button onClick={reset}>Reset</button>
+        </>
+    );
+};
+
+export default CustomLinks;
diff --git a/src/index.css b/src/index.css
@@ -2,13 +2,6 @@
     outline: none;
 }
 
-body#pf_popup_container {
-    margin: 0;
-    padding: 0;
-    background: #edeff2;
-    width: 660px;
-}
-
 .code_guard_error span{
     text-decoration: #fbb360 underline  wavy;
 }

diff --git a/src/index.tsx b/src/index.tsx
@@ -6,6 +6,7 @@ import './index.css';
 import $ from "jquery";
 
 import RootComponent from './RootComponent'
+import Popup from './Popup/Popup'
 import { Settings } from './Store';
 import { load_store } from './chrome_store';
 import { version, branch, commit } from './version'
@@ -26,20 +27,19 @@ const attachComponentToWebsite = (n: HTMLElement, tmp_store: Settings) => {
   );
 }
 
-const welcomeConsoleMessage = () => {
-  console.log('\n' +
-    '********************************' + '\n\n' +
-    '   Foundry Pro' + '\n' +
-    '   Version: ' + version + '\n' +
-    '   Branch:  ' + branch + '\n' +
-    '   Commit:  ' + commit + '\n\n' +
-    '******************************** \n\n')
+const attachComponentToPopup = (n: any) => {
+  const popup = ReactDOM.createRoot(n);
+  popup.render(
+    <React.StrictMode>
+      <Popup />
+    </React.StrictMode>
+  );
 }
 
-const welcomeDevConsoleMessage = () => {
+const welcomeConsoleMessage = () => {
   console.log('\n' +
     '********************************' + '\n\n' +
-    '   Foundry Pro Dev' + '\n' +
+    '   Foundry Pro' + '\n' +
     '   Version: ' + version + '\n' +
     '   Branch:  ' + branch + '\n' +
     '   Commit:  ' + commit + '\n\n' +
@@ -52,6 +52,14 @@ const tryToInit = (restored_settings: Settings) => {
     // try to init menu
     // this part tries to find the following element on every website
     // this can be optimized and limited by setting a custom host
+    var p = document.getElementById("pf_popup_container")
+    if (p !== null) {
+      console.log("Init popup")
+      if (init_interval != null)
+        clearInterval(init_interval);
+      attachComponentToPopup(p);
+      return;
+    }
 
     // check if custom hosts are setup
     if (restored_settings.custom_hosts.length > 0) {
@@ -77,31 +85,12 @@ const tryToInit = (restored_settings: Settings) => {
       attachComponentToWebsite(n, restored_settings);
       return;
     }
+
   } else {
     // stop trying because there is no foundry installation
     if (init_interval != null) {
       clearInterval(init_interval);
       init_interval = null
-
-      let normalize = document.createElement('link')
-      normalize.href = "../node_modules/normalize.css/normalize.css"
-      normalize.rel = "stylesheet"
-      document.head.appendChild(normalize)
-
-      let blueprint = document.createElement('link')
-      blueprint.href = "../node_modules/@blueprintjs/core/lib/css/blueprint.css"
-      blueprint.rel = "stylesheet"
-      document.head.appendChild(blueprint)
-
-      let blueprint_icons = document.createElement('link')
-      blueprint_icons.href = "../node_modules/@blueprintjs/icons/lib/css/blueprint-icons.css"
-      blueprint_icons.rel = "stylesheet"
-      document.head.appendChild(blueprint_icons)
-
-      welcomeDevConsoleMessage()
-      const dummy: HTMLElement = document.createElement('div')
-      $(dummy).prependTo(document.body);
-      attachComponentToWebsite(dummy, restored_settings);
       return;
     }
   }
@@ -122,12 +111,9 @@ const start = async () => {
   init_interval = setInterval(() => tryToInit(restored_settings), 100);
 }
 
-try {
-  console.log(process.env)
-} catch (e) {
-  console.log(e)
-}
+$(document).ready(function () {
+  start()
+});
 
-start()