fix: GM_getValue not working # json 不支持 Set 类型

2023-04-05 19:54:55 +08:00
parent 278c768d24
commit c388582d72
6 changed files with 92 additions and 91 deletions
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -3,25 +3,22 @@ import Setting from "./Setting";
 import SiteBtn from "./SiteBtn";
 import { GM_getValue, GM_setValue } from "$";
 import { SiteItem, siteList } from "@/utils/siteList";
-import type { Current } from "@/utils/matchList";
+import type { LibItem } from "@/utils/libSites";

-const App = memo(function ({ current, CODE }: { current: Current; CODE: string }) {
+const App = memo(function ({ libItem, CODE }: { libItem: LibItem; CODE: string }) {
  const defDisables = ["AvJoy", "baihuse", "GGJAV", "AV01", "JavBus", "JavDB", "JAVLib"];

-  const defDis: Set<SiteItem["name"]> = new Set(defDisables);
-
-  /** 默认不显示的站 */
-  const [disables, setDisables] = useState(GM_getValue("disable", defDis));
+  // 默认不显示
+  const [disables, setDisables] = useState(GM_getValue<SiteItem["name"][]>("disable", defDisables));

  return (
    <>
      <div class="jop-list">
-        {siteList.map((item) => {
-          // const hidden = disables.find((disItem) => disItem === item.name) === undefined;
-          const hidden = !disables.has(item.name);
-
-          if (hidden && current.name !== item.disableHostname) {
-            return <SiteBtn siteItem={item} CODE={CODE} key={item.name} />;
+        {siteList.map((siteItem) => {
+          const hidden = disables.find((disItem) => disItem === siteItem.name) === undefined;
+          const sameSite = libItem.name !== siteItem.disableLibItemName;
+          if (hidden && sameSite) {
+            return <SiteBtn siteItem={siteItem} CODE={CODE} key={siteItem.name} />;
          } else {
            return <></>;
          }
--- a/src/components/Setting.tsx
+++ b/src/components/Setting.tsx
@@ -7,19 +7,17 @@ const Setting = ({
  disables,
 }: {
  siteList: SiteItem[];
-  setDisables: StateUpdater<Set<string>>;
-  disables: Set<string>;
+  setDisables: StateUpdater<string[]>;
+  disables: SiteItem["name"][];
 }) => {
  const [showSetting, setShowSetting] = useState(false);

  const changeCheck = (item: SiteItem, isHidden: boolean) => {
    if (isHidden) {
-      disables.delete(item.name);
+      setDisables(disables.filter((disItem) => disItem !== item.name));
    } else {
-      disables.add(item.name);
+      setDisables([...disables, item.name]);
    }
-    const newDis = new Set(disables);
-    setDisables(newDis);
  };

  return (
@@ -41,7 +39,7 @@ const Setting = ({
          <div className="jop-setting">
            <div className="jop-setting-list">
              {siteList.map((item) => {
-                const isHidden = disables.has(item.name);
+                const isHidden = disables.includes(item.name);
                return (
                  <div
                    className="jop-setting-item"
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1,28 +1,32 @@
 import { render } from "preact";
-import { Current, matchList } from "@/utils/matchList";
+import { LibItem, libSites } from "@/utils/libSites";
 import { getCode } from "@/utils/getCode";

 import "@/style.css";
 import App from "./components/App";

-// !debugger 图片关
+// !debugger 关图片
 // document.querySelectorAll("img").forEach((item) => (item.style.display = "none"));

 function main() {
-  /** 当前 macth 站点对象 */
-  const current = matchList.find((item) => item.href.test(window.location.href)) as Current;
+  /** 当前匹配的图书馆站点对象 */
+  const libItem = libSites.find((item) => item.href.test(window.location.href)) as LibItem;
+  const CODE = getCode(libItem);

-  const CODE = getCode(current);
-  current.method();
+  // 执行对于当前图书馆站的特殊适配，如单独的样式改动
+  libItem.method();

-  const panel = document.querySelector<HTMLElement>(current.querys.panelQueryStr);
-  if (panel === null) return;
+  const panel = document.querySelector<HTMLElement>(libItem.querys.panelQueryStr);
+  if (panel === null) {
+    console.error("脚本挂载错误");
+    return;
+  }

  const app = document.createElement("div");
  app.classList.add("jop-app");
  panel.append(app);

-  render(<App current={current} CODE={CODE} />, app);
+  render(<App libItem={libItem} CODE={CODE} />, app);
 }

 main();
--- a/src/utils/getCode.ts
+++ b/src/utils/getCode.ts
@@ -1,6 +1,6 @@
-import { Current } from "./matchList";
+import { LibItem } from "./libSites";

-export function getCode(cms: Current): string {
+export function getCode(cms: LibItem): string {
  const { codeQueryStr } = cms.querys;
  const codeNode = document.querySelector<HTMLElement>(codeQueryStr);
  if (!codeNode) return "";
--- a/src/utils/matchList.ts
+++ b/src/utils/matchList.ts
@@ -1,55 +1,57 @@
-/** 当前 macth 站点对象 */
-export type Current = {
-  name: "javdb" | "javbus" | "javlib";
-  enable: boolean;
-  href: RegExp;
-  querys: {
-    panelQueryStr: string;
-    codeQueryStr: string;
-  };
-  method: () => void;
-};
-export const matchList: Current[] = [
-  {
-    name: "javdb",
-    enable: true,
-    href: /^https:\/\/(\w*\.)?javdb(\d)*\.com.*$/,
-    querys: {
-      panelQueryStr: ".video-meta-panel>.columns.is-desktop .panel.movie-panel-info",
-      codeQueryStr: `[data-clipboard-text]`,
-    },
-    method() {
-      const columnVideoCover = document.querySelector<HTMLElement>(
-        ".column-video-cover",
-      ) as HTMLElement;
-      columnVideoCover.style.width = "60%";
-      const panel = document.querySelector<HTMLElement>(
-        ".video-meta-panel>.columns.is-desktop>.column:not(.column-video-cover)",
-      ) as HTMLElement;
-      panel.classList.add("db-panel");
-    },
-  },
-  {
-    name: "javbus",
-    enable: true,
-    href: /^https?:\/\/(\w*\.)?(javbus|seejav|javsee)*\.(com|cc|me|life).*$/,
-    querys: {
-      panelQueryStr: ".movie>div.info",
-      codeQueryStr: `span[style="color:#CC0000;"]`,
-    },
-    method() {},
-  },
-  {
-    name: "javlib",
-    enable: true,
-    href: /^https?:\/\/(\w*\.)?(javlib|javlibrary)*\.com.*$/,
-    querys: {
-      panelQueryStr: "#video_jacket_info #video_info",
-      codeQueryStr: `#video_id td.text`,
-    },
-    method() {
-      const panel = document.querySelector<HTMLElement>("#video_info") as HTMLElement;
-      panel.classList.add("lib-panel");
-    },
-  },
-];
+/** 当前 macth 站点对象 */
+export type LibItem = {
+  name: "javdb" | "javbus" | "javlib";
+  enable: boolean;
+  href: RegExp;
+  querys: {
+    panelQueryStr: string;
+    codeQueryStr: string;
+  };
+  method: () => void;
+};
+
+/** 需要匹配的图书馆站点列表 */
+export const libSites: LibItem[] = [
+  {
+    name: "javdb",
+    enable: true,
+    href: /^https:\/\/(\w*\.)?javdb(\d)*\.com.*$/,
+    querys: {
+      panelQueryStr: ".video-meta-panel>.columns.is-desktop .panel.movie-panel-info",
+      codeQueryStr: `[data-clipboard-text]`,
+    },
+    method() {
+      const columnVideoCover = document.querySelector<HTMLElement>(
+        ".column-video-cover",
+      ) as HTMLElement;
+      columnVideoCover.style.width = "60%";
+      const panel = document.querySelector<HTMLElement>(
+        ".video-meta-panel>.columns.is-desktop>.column:not(.column-video-cover)",
+      ) as HTMLElement;
+      panel.classList.add("db-panel");
+    },
+  },
+  {
+    name: "javbus",
+    enable: true,
+    href: /^https?:\/\/(\w*\.)?(javbus|seejav|javsee)*\.(com|cc|me|life).*$/,
+    querys: {
+      panelQueryStr: ".movie>div.info",
+      codeQueryStr: `span[style="color:#CC0000;"]`,
+    },
+    method() {},
+  },
+  {
+    name: "javlib",
+    enable: true,
+    href: /^https?:\/\/(\w*\.)?(javlib|javlibrary)*\.com.*$/,
+    querys: {
+      panelQueryStr: "#video_jacket_info #video_info",
+      codeQueryStr: `#video_id td.text`,
+    },
+    method() {
+      const panel = document.querySelector<HTMLElement>("#video_info") as HTMLElement;
+      panel.classList.add("lib-panel");
+    },
+  },
+];
--- a/src/utils/siteList.ts
+++ b/src/utils/siteList.ts
@@ -36,10 +36,10 @@ interface SiteItemBase {
  /** 用户定义的 disable */
  disable: boolean;

-  /** 在指定 hostname 下不显示
+  /** 在指定 LibItem.name 下不显示
   * 点名：都是针对的 matchList 里的三个，防止出现自己检索自己站。
   */
-  disableHostname?: string;
+  disableLibItemName?: string;

  hostname: string;
  url: string;
@@ -65,7 +65,7 @@ const print = (name: string) => {
  console.log(name);
 };

-/** 网站列表 */
+/** 在线网站列表 */
 export const siteList: SiteItem[] = [
  {
    name: "Jable",
@@ -258,7 +258,7 @@ export const siteList: SiteItem[] = [
  },
  {
    name: "JavBus",
-    disableHostname: "javbus",
+    disableLibItemName: "javbus",
    disable: false,
    hostname: "javbus.com",
    url: "https://javbus.com/{{code}}",
@@ -268,7 +268,7 @@ export const siteList: SiteItem[] = [
  },
  {
    name: "JavDB",
-    disableHostname: "javdb",
+    disableLibItemName: "javdb",
    disable: false,
    hostname: "javdb.com",
    url: "https://javdb.com/search?q={{code}}",
@@ -281,7 +281,7 @@ export const siteList: SiteItem[] = [
  },
  {
    name: "JAVLib",
-    disableHostname: "javlibrary",
+    disableLibItemName: "javlibrary",
    disable: false,
    hostname: "javlibrary.com",
    url: "https://www.javlibrary.com/cn/vl_searchbyid.php?keyword={{code}}",