feat: 支持文本模板，系统命令

src/main/browsers/index.js

@@ -0,0 +1,4 @@
+module.exports = () => ({
+  picker: require("./picker")(),
+  separator: require("./separate")(),
+});

src/main/browsers/picker.js

@@ -0,0 +1,42 @@
+const { BrowserWindow, nativeImage } = require("electron");
+
+module.exports = () => {
+  let win;
+
+  let init = () => {
+    if (win === null || win === undefined) {
+      createWindow();
+    }
+  };
+
+  let createWindow = () => {
+    win = new BrowserWindow({
+      frame: false,
+      autoHideMenuBar: true,
+      width: 100,
+      height: 100,
+      transparent: true,
+      alwaysOnTop: true,
+      resizable: false,
+      focusable: true,
+      hasShadow: false,
+      // icon: nativeImage.createFromPath(`${dirname}/build/icon.png`),
+      webPreferences: {
+        nodeIntegration: true,
+        devTools: false,
+      },
+    });
+
+    win.loadURL(`file://${__static}/plugins/picker/index.html`);
+    win.on("closed", () => {
+      win = undefined;
+    });
+  };
+
+  let getWindow = () => win;
+
+  return {
+    init: init,
+    getWindow: getWindow,
+  };
+};

src/main/browsers/separate.js

@@ -0,0 +1,46 @@
+const {stringify} = require('query-string');
+const { BrowserWindow, nativeImage } = require("electron");
+
+module.exports = () => {
+  let win;
+
+  let init = (opts) => {
+    createWindow(opts);
+  };
+
+  let createWindow = (opts) => {
+    const winURL = process.env.NODE_ENV === 'development'
+      ? `http://localhost:9080/#/plugin?${stringify(opts)}`
+      : `${__dirname}/index.html`
+    win = new BrowserWindow({
+      height: 600,
+      useContentSize: true,
+      width: 800,
+      titleBarStyle: 'hiddenInset',
+      title: '拉比克',
+      show: false,
+      webPreferences: {
+        webSecurity: false,
+        enableRemoteModule: true,
+        backgroundThrottling: false,
+        webviewTag: true,
+        nodeIntegration: true // 在网页中集成Node
+      }
+    });
+
+    process.env.NODE_ENV === 'development' ? win.loadURL(winURL) : win.loadFile(winURL, {
+      hash: `#/plugin?${stringify(opts)}`,
+    });
+    win.once('ready-to-show', () => win.show());
+    win.on("closed", () => {
+      win = undefined;
+    });
+  };
+
+  let getWindow = () => win;
+
+  return {
+    init: init,
+    getWindow: getWindow,
+  };
+};

src/main/common.js

@@ -1,71 +0,0 @@
-import {globalShortcut, ipcMain, BrowserWindow} from 'electron';
-import {stringify} from 'query-string';
-import Api from './api';
-import path from 'path';
-
-export default function init(mainWindow) {
-  ipcMain.on('changeWindowSize', (event, arg) => {
-    mainWindow.setSize(arg.width || 788, arg.height);
-  });
-
-  mainWindow.on('blur', () => {
-    // mainWindow.hide();
-  });
-
-  globalShortcut.register('Alt+R', () => {
-    mainWindow.show();
-  });
-
-  ipcMain.on('init-shortcut', (event) => {
-    globalShortcut.register('Esc', () => {
-      mainWindow.show();
-      event.sender.send('init-rubick');
-    });
-    globalShortcut.register('ctrl+d', () => {
-      event.sender.send('new-window');
-    });
-  })
-
-
-  ipcMain.on('msg-trigger', async (event, arg) => {
-    const window = arg.winId ? BrowserWindow.fromId(arg.winId) : mainWindow
-    const operators = arg.type.split('.');
-    let fn = Api;
-    operators.forEach((op) => {
-      fn = fn[op];
-    });
-    const data = await fn(arg, window);
-    event.sender.send(`msg-back-${arg.type}`, data);
-  });
-
-  ipcMain.on('new-window', (event, arg) => {
-    const opts = {
-      ...arg,
-      searchType: 'subWindow',
-    }
-    const winURL = process.env.NODE_ENV === 'development'
-      ? `http://localhost:9080/#/plugin?${stringify(opts)}`
-      : `${__dirname}/index.html`
-    const win = new BrowserWindow({
-      height: 600,
-      useContentSize: true,
-      width: 788,
-      titleBarStyle: 'hiddenInset',
-      title: '拉比克',
-      show: false,
-      webPreferences: {
-        webSecurity: false,
-        enableRemoteModule: true,
-        backgroundThrottling: false,
-        webviewTag: true,
-        nodeIntegration: true // 在网页中集成Node
-      }
-    });
-    process.env.NODE_ENV === 'development' ? win.loadURL(winURL) : win.loadFile(winURL, {
-      hash: `#/plugin?${stringify(opts)}`,
-    });
-    win.once('ready-to-show', () => win.show());
-  })
-}
-
-

src/main/common/api.js

@@ -1,5 +1,5 @@
 import {app, BrowserWindow} from 'electron';
-import {getlocalDataFile, saveData, getData} from './common/utils';
+import {getlocalDataFile, saveData, getData} from './utils';
 import path from "path";
 
 const puppeteer = require("puppeteer-core");

src/main/common/common.js

@@ -0,0 +1,112 @@
+import {
+  globalShortcut,
+  ipcMain,
+  BrowserWindow,
+  clipboard,
+  Notification,
+} from 'electron';
+import Api from './api';
+import robot from 'robotjs';
+
+const browsers = require("../browsers")();
+const mouseEvents = require("osx-mouse");
+const {picker, separator} = browsers;
+
+let closePicker = (newColor) => {
+  if (picker.getWindow()) {
+    ipcMain.removeListener("closePicker", closePicker);
+    ipcMain.removeListener("pickerRequested", (event) => {});
+    picker.getWindow().close();
+  }
+};
+
+export default function init(mainWindow) {
+  const mouseTrack = mouseEvents();
+  let down_time = 0;
+  mouseTrack.on('right-down', () => {
+    down_time = Date.now();
+  })
+  mouseTrack.on('right-up', () => {
+    if ((Date.now() - down_time) > 1000) {
+      new Notification({ title: 'Rubick 通知', body: '长按了' }).show();
+    }
+  });
+
+  ipcMain.on('changeWindowSize-rubick', (event, arg) => {
+    mainWindow.setSize(arg.width || 788, arg.height);
+  });
+
+  mainWindow.on('blur', () => {
+    // mainWindow.hide();
+  });
+
+  globalShortcut.register('Alt+R', () => {
+    mainWindow.show();
+  });
+
+  ipcMain.on('init-shortcut', (event) => {
+    globalShortcut.register('Esc', () => {
+      mainWindow.show();
+      event.sender.send('init-rubick');
+    });
+    globalShortcut.register('ctrl+d', () => {
+      event.sender.send('new-window');
+    });
+  })
+
+
+  ipcMain.on('msg-trigger', async (event, arg) => {
+    const window = arg.winId ? BrowserWindow.fromId(arg.winId) : mainWindow
+    const operators = arg.type.split('.');
+    let fn = Api;
+    operators.forEach((op) => {
+      fn = fn[op];
+    });
+    const data = await fn(arg, window);
+    window.webContents.send(`msg-back-${arg.type}`, data);
+  });
+
+  ipcMain.on('new-window', (event, arg) => {
+    const opts = {
+      ...arg,
+      searchType: 'subWindow',
+    }
+    separator.init(opts);
+  });
+
+  ipcMain.on('start-picker', () => {
+    const mouseTrack = mouseEvents();
+    picker.init();
+    picker.getWindow().on("close", () => {
+      mouseTrack.destroy();
+    });
+    mouseTrack.on('move', (x, y) => {
+      if (!picker.getWindow()) return;
+      let color = "#" + robot.getPixelColor(parseInt(x), parseInt(y));
+      picker.getWindow().setPosition(parseInt(x) - 50, parseInt(y) - 50);
+      picker.getWindow().webContents.send("updatePicker", color);
+    })
+    mouseTrack.on("left-up", (x, y) => {
+      const color = "#" + robot.getPixelColor(parseInt(x), parseInt(y));
+      clipboard.writeText("#" + robot.getPixelColor(parseInt(x), parseInt(y)));
+      new Notification({ title: 'Rubick 通知', body: `${color} 已保存到剪切板` }).show();
+      closePicker();
+    });
+    let pos = robot.getMousePos();
+    picker
+      .getWindow()
+      .setPosition(parseInt(pos.x) - 50, parseInt(pos.y) - 50);
+
+    picker
+      .getWindow()
+      .webContents.send(
+      "updatePicker",
+      robot.getPixelColor(pos.x, pos.y)
+    );
+
+    ipcMain.on("closePicker", closePicker);
+    mouseTrack.on("right-up", closePicker);
+  })
+}
+
+

src/main/index.js

@@ -1,6 +1,6 @@
 import { app, BrowserWindow, protocol } from 'electron'
 import '../renderer/store'
-import init from './common';
+import init from './common/common';
 import createTray from './tray';
 /**
  * Set `__static` path to static files in production

src/renderer/App.vue

@@ -16,7 +16,7 @@
           id="search"
           :placeholder="subPlaceHolder && selected && selected.key === 'plugin-container' ? subPlaceHolder : 'Hi, Rubick'"
           class="main-input"
-          @change="onSearch"
+          @change="e => onSearch({value: e.target.value})"
           :value="searchValue"
           :maxLength="selected && selected.key !== 'plugin-container' ? 0 : 1000"
       >
@@ -49,7 +49,7 @@
         <a-input
             :placeholder="subPlaceHolder"
             class="sub-input"
-            @change="onSearch"
+            @change="(e) => onSearch({value: e.target.value, searchType: $route.query.searchType})"
             :value="searchValue"
         ></a-input>
       </div>
@@ -84,8 +84,6 @@ export default {
     const searchNd = document.getElementById('search');
     searchNd && searchNd.addEventListener('keydown', this.checkNeedInit)
   },
-  beforeDestroy() {
-  },
   methods: {
     ...mapActions('main', ['onSearch', 'showMainUI']),
     ...mapMutations('main', ['commonUpdate']),
@@ -104,8 +102,9 @@ export default {
       this.commonUpdate({
         selected: null,
         showMain: false,
+        options: [],
       });
-      ipcRenderer.send('changeWindowSize', {
+      ipcRenderer.send('changeWindowSize-rubick', {
         height: getWindowHeight([]),
       });
       this.$router.push({
@@ -167,7 +166,7 @@ export default {
   }
 };
 </script>
-<style lang="scss">
+<style lang="less">
 * {
   margin: 0;
   padding: 0;

src/renderer/assets/common/constans.js

@@ -2,8 +2,36 @@ const WINDOW_MAX_HEIGHT = 600;
 const WINDOW_MIN_HEIGHT = 60;
 const PRE_ITEM_HEIGHT = 60;
 
+const SYSTEM_PLUGINS = [
+  {
+    "pluginName": "rubick 帮助文档",
+    "logo": "logo.png",
+    "features": [
+      {
+        "code": "help",
+        "explain": "rubick 帮助文档",
+        "cmds": [ "Help", "帮助" ]
+      },
+    ],
+    "tag": 'rubick-help',
+  },
+  {
+    "pluginName": "屏幕颜色拾取",
+    "logo": "logo.png",
+    "features": [
+      {
+        "code": "pick",
+        "explain": "rubick 帮助文档",
+        "cmds": [ "取色", "拾色", 'Pick color' ]
+      },
+    ],
+    "tag": 'rubick-color',
+  }
+]
+
 export {
   WINDOW_MAX_HEIGHT,
   WINDOW_MIN_HEIGHT,
   PRE_ITEM_HEIGHT,
+  SYSTEM_PLUGINS,
 }

src/renderer/assets/common/system.js

@@ -0,0 +1,13 @@
+import {shell, ipcRenderer} from 'electron';
+export default {
+  'rubick-help': {
+    help() {
+      shell.openExternal('https://u.tools/docs/guide/about-uTools.html')
+    }
+  },
+  'rubick-color': {
+    pick() {
+      ipcRenderer.send('start-picker')
+    }
+  }
+}

src/renderer/assets/common/utils.js

@@ -1,4 +1,4 @@
-import {WINDOW_MAX_HEIGHT, WINDOW_MIN_HEIGHT, PRE_ITEM_HEIGHT} from './constans';
+import {WINDOW_MAX_HEIGHT, WINDOW_MIN_HEIGHT, PRE_ITEM_HEIGHT, SYSTEM_PLUGINS} from './constans';
 import download from 'download-git-repo';
 import path from 'path';
 import fs from 'fs';
@@ -14,7 +14,6 @@ function getWindowHeight(searchList) {
 }
 
 function searchKeyValues(lists, value){
-  console.log(lists);
   return lists.filter(item => item.indexOf(value) >= 0)
 }
 
@@ -90,9 +89,24 @@ const sysFile = {
   }
 }
 
+function mergePlugins(plugins) {
+  return [
+    ...plugins,
+    ...SYSTEM_PLUGINS.map(plugin => {
+      return {
+        ...plugin,
+        status: true,
+        sourceFile: '',
+        type: 'system',
+      }
+    }),
+  ]
+}
+
 export {
   getWindowHeight,
   searchKeyValues,
   downloadFunc,
   sysFile,
+  mergePlugins,
 }

src/renderer/pages/index/index.vue

@@ -46,7 +46,7 @@ export default {
   },
 }
 </script>
-<style lang="scss">
+<style lang="less">
   .fava-btn {
     cursor: pointer;
     &:hover {

src/renderer/pages/plugins/index.vue

@@ -10,6 +10,10 @@
 <script>
 import path from 'path';
 import {mapMutations, mapState} from 'vuex';
+import {remote} from "electron";
+
+const currentWindow = remote.getCurrentWindow();
+const winId = currentWindow.id;
 
 export default {
   name: "index.vue",
@@ -20,7 +24,7 @@ export default {
       webview: null,
       query: this.$route.query,
       config: {},
-      templatePath: `File://${path.join(__static, './doc-tpl.html')}?code=${JSON.parse(this.$route.query.detail).code}&targetFile=${encodeURIComponent(this.$route.query.sourceFile)}`,
+      templatePath: `File://${path.join(__static, './plugins/doc/doc-tpl.html')}?code=${JSON.parse(this.$route.query.detail).code}&targetFile=${encodeURIComponent(this.$route.query.sourceFile)}`,
     }
   },
   mounted() {
@@ -90,9 +94,9 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="less">
 #webview {
   width: 100%;
-  height: calc(100vh - 60px);
+  height: calc(~'100vh - 60px');
 }
 </style>

src/renderer/pages/search/index.vue

@@ -45,7 +45,7 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="less">
 .main-input {
   -webkit-app-region: drag;
   height: 60px !important;

src/renderer/pages/search/subpages/dev.vue

@@ -110,9 +110,9 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="less">
  .dev-container {
-   height: calc(100vh - 110px);
+   height: calc(~'100vh - 110px');
    .dev-detail {
      display: flex;
      align-items: flex-start;

src/renderer/pages/search/subpages/market.vue

@@ -74,9 +74,9 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="less">
  .market {
-   height: calc(100vh - 110px);
+   height: calc(~'100vh - 110px');
    background: #fff;
    padding: 20px;
    box-sizing: border-box;

src/renderer/pages/search/subpages/plugin.vue

@@ -95,9 +95,9 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="less">
 .dev-container {
-  height: calc(100vh - 110px);
+  height: calc(~'100vh - 110px');
   overflow: auto;
   .dev-detail {
     display: flex;

src/renderer/store/modules/main.js

@@ -1,6 +1,13 @@
 import {clipboard, ipcRenderer, remote} from "electron";
 import { v4 as uuidv4 } from 'uuid';
-import {getWindowHeight, searchKeyValues, downloadFunc, sysFile} from '../../assets/common/utils';
+import {
+  getWindowHeight,
+  searchKeyValues,
+  downloadFunc,
+  sysFile,
+  mergePlugins,
+} from '../../assets/common/utils';
+import systemMethod from '../../assets/common/system';
 import fs from "fs";
 import path from 'path';
 
@@ -10,7 +17,7 @@ const state = {
   showMain: false,
   current: ['market'],
   searchValue: '',
-  devPlugins: sysFile.getUserPlugins() || [],
+  devPlugins: mergePlugins(sysFile.getUserPlugins() || []),
   subPlaceHolder: '',
 }
 
@@ -48,7 +55,7 @@ const mutations = {
 
 const actions = {
   showMainUI ({ commit, state }, paylpad) {
-    ipcRenderer.send('changeWindowSize', {
+    ipcRenderer.send('changeWindowSize-rubick', {
       height: getWindowHeight(),
     });
     setTimeout(() => {
@@ -85,9 +92,9 @@ const actions = {
       commit('commonUpdate', {searchValue: ''});
       return;
     }
-    const value = paylpad.target.value;
+    const value = paylpad.value;
     // 在插件界面
-    if(state.selected && state.selected.key === 'plugin-container') {
+    if((state.selected && state.selected.key === 'plugin-container') || paylpad.searchType === 'subWindow') {
       commit('commonUpdate', {searchValue: value})
       return;
     }
@@ -131,7 +138,7 @@ const actions = {
                 },
                 current: ['dev'],
               });
-              ipcRenderer.send('changeWindowSize', {
+              ipcRenderer.send('changeWindowSize-rubick', {
                 height: getWindowHeight(),
               });
               router.push('/home/dev')
@@ -149,7 +156,7 @@ const actions = {
         ]
       });
       // 调整窗口大小
-      ipcRenderer.send('changeWindowSize', {
+      ipcRenderer.send('changeWindowSize-rubick', {
         height: getWindowHeight(state.options),
       });
       return
@@ -184,7 +191,7 @@ const actions = {
     commit('commonUpdate', {
       options
     });
-    ipcRenderer.send('changeWindowSize', {
+    ipcRenderer.send('changeWindowSize-rubick', {
       height: getWindowHeight(state.options),
     });
   },
@@ -212,9 +219,24 @@ const actions = {
       searchValue: '',
       showMain: true,
     });
-    ipcRenderer.send('changeWindowSize', {
+    ipcRenderer.send('changeWindowSize-rubick', {
       height: getWindowHeight(),
     });
+    if (plugin.type === 'system') {
+      systemMethod[plugin.tag][feature.code]()
+      commit('commonUpdate', {
+        selected: null,
+        showMain: false,
+        options: [],
+      });
+      ipcRenderer.send('changeWindowSize-rubick', {
+        height: getWindowHeight([]),
+      });
+      router.push({
+        path: '/home',
+      });
+      return;
+    }
     router.push({
       path: '/plugin',
       query: {