init

MapleRecall · Jul 27, 2024 · 995bb6b · 995bb6b
1 parent 109d7ab
commit 995bb6b
Show file tree

Hide file tree

Showing 20 changed files with 471 additions and 28 deletions.
diff --git a/README.md b/README.md
@@ -1,4 +1,15 @@
-# Plugin-Template
+# LiteLoaderQQNT-CanCanNeed
 
-LiteLoaderQQNT的插件模板  
-LiteLoaderQQNT本体：[LiteLoaderQQNT](https://github.com/mo-jinran/LiteLoaderQQNT)
+方便快捷的工具，快速混淆界面，帮你防范窥屏和社死。美观的实现方案还是演示截图的好助手。
+
+## 安装方法
+
+### 方法1：下载release包，解压到插件目录
+https://github.com/MapleRecall/LiteLoaderQQNT-CCND/releases
+
+### 方法2： 插件目录下直接git clone 本项目
+
+`git clone https://github.com/MapleRecall/LiteLoaderQQNT-CCND.git`
+
+## 纯CSS版本
+https://github.com/MapleRecall/Transitio-user-css?#2-private-plus
diff --git a/manifest.json b/manifest.json
@@ -2,16 +2,16 @@
     "$schema": "./manifest_schema.json",
     "manifest_version": 4,
     "type": "extension",
-    "name": "插件模板",
-    "slug": "plugin_template",
-    "description": "LiteLoaderQQNT 的插件模板",
+    "name": "CanCanNeed",
+    "slug": "CanCanNeed",
+    "description": "担心窥屏和社死？快来试试这个吧！还能方便界面演示和截图，美观实用，混沌有趣。",
     "version": "0.1.0",
-    "icon": "./icon.png",
-    "thumb": "./icon.svg",
+    "thumb":"./static/images/icon.svg",
+    "icon": "./static/images/icon.svg",
     "authors": [
         {
-            "name": "LiteLoaderQQNT",
-            "link": "https://github.com/LiteLoaderQQNT"
+            "name": "MapleRecall",
+            "link": "https://github.com/MapleRecall"
         }
     ],
     "platform": [
@@ -25,11 +25,10 @@
         "preload": "./src/preload.js"
     },
     "repository": {
-        "repo": "LiteLoaderQQNT/Plugin-Template",
+        "repo": "MapleRecall/LiteLoaderQQNT-CCND",
         "branch": "main",
         "release": {
-            "tag": "0.1.0",
-            "file": "Plugin-Template.zip"
+            "tag": "0.1.0"
         }
     }
 }
diff --git a/src/config_default.json b/src/config_default.json
@@ -0,0 +1,7 @@
+{
+    "enabled": true,
+    "font": "KFC",
+    "peekOnBody": false,
+    "peekOnContact": true,
+    "peekOnAIO": true
+}
diff --git a/src/main.js b/src/main.js
@@ -1,8 +1,22 @@
-// 运行在 Electron 主进程 下的插件入口
+const manifest = require("../manifest.json");
+const default_config = require("./config_default.json");
+const { BrowserWindow, ipcMain } = require("electron");
 
+// exports.onBrowserWindowCreated = (window) => {
+//   window.on("show", () => update(window));
+//   window.on("focus", () => update(window));
+// };
 
+(async () => {
+  const config = await LiteLoader.api.config.get(manifest.slug, default_config);
+  LiteLoader.api.config.set(manifest.slug, config);
+})();
 
-// 创建窗口时触发
-module.exports.onBrowserWindowCreated = window => {
-    // window 为 Electron 的 BrowserWindow 实例
-}
+ipcMain.handle("LiteLoader.ccnd.update", () => {
+  const allWindows = BrowserWindow.getAllWindows();
+  allWindows.forEach((window) => {
+    if (!window.isDestroyed()) {
+      window.webContents.send("LiteLoader.ccnd.onUpdate");
+    }
+  });
+});
diff --git a/src/preload.js b/src/preload.js
@@ -1,8 +1,8 @@
-// Electron 主进程 与 渲染进程 交互的桥梁
-const { contextBridge } = require("electron");
+const { contextBridge, ipcRenderer } = require("electron");
 
+contextBridge.exposeInMainWorld("LL_CCND", {
+  onUpdate: (callback) => ipcRenderer.on("LiteLoader.ccnd.onUpdate", callback),
+  update: () => ipcRenderer.invoke("LiteLoader.ccnd.update"),
 
-// 在window对象下导出只读对象
-contextBridge.exposeInMainWorld("plugin_template", {
-
+  BASE_PATH: LiteLoader.plugins["CanCanNeed"].path.plugin,
 });
diff --git a/src/renderer.js b/src/renderer.js
@@ -1,7 +1,12 @@
-// 运行在 Electron 渲染进程 下的页面脚本
+import { getConfig } from "./scripts/config.js";
+import onSettingWindowCreated from "./scripts/renderer/settings.js";
+import initStyles from "./scripts/renderer/initStyles.js";
+import initSideButton from "./scripts/renderer/sideButton.js";
 
+(async () => {
+  await getConfig();
+  await initStyles();
+  await initSideButton();
+})();
 
-// 打开设置界面时触发
-export const onSettingWindowCreated = view => {
-    // view 为 Element 对象，修改将同步到插件设置界面
-}
+export { onSettingWindowCreated };
diff --git a/src/scripts/config.js b/src/scripts/config.js
@@ -0,0 +1,7 @@
+export const getConfig = async () => await LiteLoader.api.config.get("CanCanNeed");
+
+export const setConfig = async (_config) => {
+  await LiteLoader.api.config.set("CanCanNeed", _config);
+  await getConfig();
+  LL_CCND.update();
+};
diff --git a/src/scripts/renderer/initStyles.js b/src/scripts/renderer/initStyles.js
@@ -0,0 +1,38 @@
+import { getConfig } from "../config.js";
+
+const getFontStyle = (font) => {
+  const FONT_PATH = `local:///${LL_CCND.BASE_PATH.replace(/\\/gi, "/")}/static/fonts/${font}.woff2?r=${Date.now()}`;
+  return `@font-face {
+        font-family: 'Messed Sans Pro';
+        src: url('${FONT_PATH}');
+    }`;
+};
+
+export default async () => {
+  const baseStyle = document.createElement("link");
+  baseStyle.rel = "stylesheet";
+  baseStyle.id = "LL_CCND_Style";
+  document.head.append(baseStyle);
+
+  const fontStyle = document.createElement("style");
+  fontStyle.id = "LL_CCND_Font";
+  document.head.append(fontStyle);
+
+  const updateStyles = async () => {
+    const config = await getConfig();
+    if (!config.enabled) {
+      baseStyle.removeAttribute("href");
+      return;
+    }
+
+    baseStyle.setAttribute("href", `local:///${LL_CCND.BASE_PATH}/src/styles/base.css?r=${Date.now()}`);
+    fontStyle.textContent = getFontStyle(config.font);
+
+    document.querySelector("#app")?.classList.toggle("ll-ccnd-peekable", config.peekOnBody);
+    document.querySelector(".recent-contact")?.classList.toggle("ll-ccnd-peekable", config.peekOnContact);
+    document.querySelector(".aio")?.classList.toggle("ll-ccnd-peekable", config.peekOnAIO);
+  };
+  updateStyles();
+
+  LL_CCND.onUpdate(updateStyles);
+};
diff --git a/src/scripts/renderer/settings.js b/src/scripts/renderer/settings.js
@@ -0,0 +1,28 @@
+import { getConfig, setConfig } from "../config.js";
+
+export default async (view) => {
+  const config = await getConfig();
+  view.innerHTML = await (await fetch(`local:///${LL_CCND.BASE_PATH}/src/settings.html`)).text();
+
+  // Initialize switch
+  [...view.querySelectorAll("setting-switch")].forEach((input) => {
+    const configName = input.dataset["config"];
+    input.toggleAttribute("is-active", config[configName]);
+
+    input.addEventListener("click", async (event) => {
+      event.target.toggleAttribute("is-active");
+      config[configName] = event.target.hasAttribute("is-active");
+      setConfig(config);
+    });
+  });
+
+  [...view.querySelectorAll("setting-select")].forEach((input) => {
+    const configName = input.dataset["config"];
+    input.querySelector(`[data-value="${config.font}"]`)?.click();
+
+    input.addEventListener("selected", async (event) => {
+      config[configName] = event.detail.value;
+      setConfig(config);
+    });
+  });
+};
diff --git a/src/scripts/renderer/sideButton.js b/src/scripts/renderer/sideButton.js
@@ -0,0 +1,39 @@
+import { getConfig, setConfig } from "../config.js";
+
+const DISABLE_ICON = "/_upper_/resource/icons/channel_handup_speech_24.svg#channel_handup_speech_24";
+const ENABLE_ICON = "/_upper_/resource/icons/channel_kick_red_16.svg#channel_kick_red_16";
+
+export default async () => {
+  const addButtonInterval = setInterval(() => {
+    if (location.hash.includes("#/main")) {
+      const funcMenu = document.querySelector(".func-menu");
+      if (!funcMenu) return;
+
+      const button = funcMenu.querySelector(".func-menu__item_wrap")?.cloneNode(true);
+      if (!button) return;
+
+      button.classList.add("ll-ccnd-button");
+
+
+
+      const updateButton = async () => {
+        const config = await getConfig();
+        button.querySelector("use").setAttribute("xlink:href", config.enabled ? ENABLE_ICON : DISABLE_ICON);
+        button.title = config.enabled ? "不给看" : "看看你的";
+        button.classList.toggle("enabled", config.enabled);
+      };
+      updateButton();
+      LL_CCND.onUpdate(updateButton);
+
+      button.addEventListener("click", async () => {
+        const config = await getConfig();
+        config.enabled = !config.enabled;
+        setConfig(config);
+      });
+      funcMenu.prepend(button);
+
+      clearInterval(addButtonInterval);
+    }
+  }, 100);
+  setTimeout(() => clearInterval(addButtonInterval), 10000);
+};
diff --git a/src/settings.html b/src/settings.html
@@ -0,0 +1,138 @@
+<style>
+    .ll-ccnd-settings {
+        .font-selector {
+            width: auto;
+        }
+
+        setting-text[data-type="secondary"] svg {
+            height: 20px;
+            vertical-align: bottom;
+        }
+    }
+</style>
+
+<div class="ll-ccnd-settings">
+    <setting-section>
+        <setting-panel class="Main">
+            <setting-list data-direction="column">
+                <setting-item>
+                    <div>
+                        <setting-text>全局开关</setting-text>
+                        <setting-text data-type="secondary">
+                            也可以使用界面右下角的
+                            <svg viewBox="0 0 24 24">
+                                <use
+                                    xlink:href="/_upper_/resource/icons/channel_handup_speech_24.svg#channel_handup_speech_24" />
+                            </svg>
+                            来切换
+                        </setting-text>
+                    </div>
+                    <setting-switch data-config="enabled"></setting-switch>
+                </setting-item>
+            </setting-list>
+        </setting-panel>
+    </setting-section>
+    <setting-section data-title="样式配置">
+        <setting-panel>
+            <setting-list data-direction="column">
+                <setting-item>
+                    <div>
+                        <setting-text>文字混淆模式</setting-text>
+                        <setting-text data-type="secondary">选择你的喜欢的混淆风格</setting-text>
+                    </div>
+                    <setting-select class="font-selector" data-config="font">
+                        <setting-option data-value="">不混淆</setting-option>
+                        <setting-option data-value="Chaos" title="C H A O S">🌀 乱序映射</setting-option>
+                        <setting-option data-value="KFC" title="🍟麦当劳">🍔 狂亂木曜日</setting-option>
+                        <setting-option data-value="KunJinKao" title="AMD全责">🐞 锟斤拷烫囤</setting-option>
+                        <setting-option data-value="Furry" title="😾小心福瑞控">🐶 ♡喵呜~汪oωo</setting-option>
+                        <setting-option data-value="JP" title="全是片假名谁看得懂啊">⚔️ 異世界の伝説</setting-option>
+                        <setting-option data-value="Geek" title="澤野弘之">💥 βios</setting-option>
+                        <setting-option data-value="EN" >🌐 ENGILHS</setting-option>
+                    </setting-select>
+                </setting-item>
+                <setting-item is-disabled>
+                    <div>
+                        <setting-text>头像样式（暂未实现）</setting-text>
+                        <setting-text data-type="secondary">选择头像遮罩的样式</setting-text>
+                    </div>
+                </setting-item>
+                <setting-item is-disabled>
+                    <div>
+                        <setting-text>图片样式（暂未实现）</setting-text>
+                        <setting-text data-type="secondary">选择图片遮罩的样式</setting-text>
+                    </div>
+                </setting-item>
+            </setting-list>
+        </setting-panel>
+    </setting-section>
+    <setting-section data-title="交互配置">
+        <setting-panel>
+            <setting-list data-direction="column">
+                <setting-item>
+                    <div>
+                        <setting-text>概览聊天框</setting-text>
+                        <setting-text data-type="secondary">鼠标在聊天区内时还原全部消息，方便聊天</setting-text>
+                    </div>
+                    <setting-switch data-config="peekOnAIO"></setting-switch>
+                </setting-item>
+                <setting-item>
+                    <div>
+                        <setting-text>概览联系人</setting-text>
+                        <setting-text data-type="secondary">鼠标在最近联系列表中时还原全部列表，方便选取</setting-text>
+                    </div>
+                    <setting-switch data-config="peekOnContact"></setting-switch>
+                </setting-item>
+                <setting-item>
+                    <div>
+                        <setting-text>概览窗口</setting-text>
+                        <setting-text data-type="secondary">鼠标在窗口内时还原整个窗口，会覆盖上面两个的设置</setting-text>
+                    </div>
+                    <setting-switch data-config="peekOnBody"></setting-switch>
+                </setting-item>
+
+
+                <setting-item is-disabled>
+                    <div>
+                        <setting-text>定时隐藏（暂未实现）</setting-text>
+                        <setting-text data-type="secondary">当静置一段时间后自动开启功能</setting-text>
+                    </div>
+                </setting-item>
+            </setting-list>
+        </setting-panel>
+    </setting-section>
+    <setting-section data-title="生效范围（暂未实现）" is-disabled>
+        <setting-panel>
+            <setting-list data-direction="row">
+                <setting-item>
+                    <setting-text>联系人列表</setting-text>
+                    <setting-switch data-config=""></setting-switch>
+                </setting-item>
+                <setting-item>
+                    <setting-text>聊天窗口</setting-text>
+                    <setting-switch data-config=""></setting-switch>
+                </setting-item>
+                <setting-item>
+                    <setting-text>群信息</setting-text>
+                    <setting-switch data-config=""></setting-switch>
+                </setting-item>
+            </setting-list>
+        </setting-panel>
+        <setting-panel>
+            <setting-list data-direction="row">
+                <setting-item>
+                    <setting-text>我的头像</setting-text>
+                    <setting-switch data-config=""></setting-switch>
+                </setting-item>
+                <setting-item>
+                    <setting-text>我的信息</setting-text>
+                    <setting-switch data-config=""></setting-switch>
+                </setting-item>
+                <setting-item>
+                    <setting-text>我发送的消息</setting-text>
+                    <setting-switch data-config=""></setting-switch>
+                </setting-item>
+            </setting-list>
+        </setting-panel>
+    </setting-section>
+</div>