Merge branch 'master' into feat-win

README.md

@@ -1,30 +1,27 @@
 <div align= "center">
-<img align="center" src="https://user-images.githubusercontent.com/21073039/123022701-c3848180-d408-11eb-86ec-7727f355ea96.png" />
+<img align="center" width=200 src="https://user-images.githubusercontent.com/21073039/128333805-73e086f0-5523-46a3-a096-cba80b904c46.png" />
 </div>
 
-# Rubick
 
-<p>
+<div align= "center">
+ <h1>Rubick</h1>
+
  <a href="https://github.com/clouDr-f2e/rubick/releases/tag/v0.0.1-beta">
     <img alt="release" src="https://img.shields.io/badge/release-v0.0.1-brightgreen" />
  </a>
  <a href="https://github.com/clouDr-f2e/rubick/blob/master/LICENSE">
     <img alt="npm" src="https://img.shields.io/github/license/clouDr-f2e/rubick" />
  </a>
-</p>
+</div>
-
-首先致敬 uTools！我做 Rubick 旨在技术分享，并不以商业化为目的，uTools 非常优秀，欢迎大家去使用 uTools，毕竟是一个团队在维护，可以享受最新的功能和体验。
 
 
-基于 electron 的工具箱，媲美 utools的开源插件。之所以做这个工具箱一方面是 utools 本身并未开源，但是公司内部的工具库又无法发布到 utools 插件中，所以为了既要享受 utools 生态又要有定制化需求，我们自己参考 utools 设计，做了 Rubick.
+基于 electron 的工具箱。Rubick(拉比克) 是 dota 里面的英雄之一，其核心技能是插件化使用其他英雄的技能，用完即走。非常符合本工具的设计理念，所以取名 Rubick。
-
-Rubick(拉比克) 是 dota 里面的英雄之一，其核心技能是插件化使用其他英雄的技能，用完即走。非常符合本工具的设计理念，所以取名 Rubick。
 
 ## 安装包
-* [Rubick Mac OS V0.0.2-beta.2](https://github.com/clouDr-f2e/rubick/releases/tag/v0.0.2-beta.2)
+* [Rubick Mac OS V0.0.3-beta.1](https://github.com/clouDr-f2e/rubick/releases/tag/v0.0.3-beta.1)
 * [Rubick Windows V0.0.2-beta.2](https://github.com/clouDr-f2e/rubick/releases/download/v0.0.2-beta.2/rubick2.Setup.0.0.2-beta.2.exe)
 
-## 支持能力。
+## 支持能力
 - [x] 支持远程下载安装插件，支持插件开发者模式
 - [x] 支持插件分离
 - [x] 支持系统命令取色、截屏、帮助
@@ -35,8 +32,12 @@ Rubick(拉比克) 是 dota 里面的英雄之一，其核心技能是插件化
 - [ ] 支持 Linux
 
 
-![QQ20210705-210753](https://user-images.githubusercontent.com/21073039/124477360-8770f980-ddd6-11eb-8dc3-ba318223697f.gif)
 
+![example.gif](https://user-images.githubusercontent.com/21073039/128359309-2377d3cf-7b70-4e8f-9973-ae8f337a8006.gif)
+
+## 使用文档
+
+[Rubick Docs](https://cloudr-f2e.github.io/rubick/)
 
 
 ## 使用问题
@@ -44,12 +45,6 @@ Rubick(拉比克) 是 dota 里面的英雄之一，其核心技能是插件化
 2. windows 版本目前有了一个最基础的可用版，代码在 [feat-win](https://github.com/clouDr-f2e/rubick/tree/feat-win) 分支。完整版正在开发中，敬请期待
 
 ## 目前支持能力
-### 加载插件
-拿 `github` 上开源的 斗图 插件举例，要加载斗图插件，只需要将代码 clone下来后，复制其 `plugin.json` 进入搜索框即可使用
-
-斗图：https://github.com/vst93/doutu-uToolsPlugin
-
-<img src=https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/cba1eb758180433294c93b59724adefd~tplv-k3u1fbpfcp-watermark.image width=500 />
 
 ### 超级面板
 长按鼠标右键，即可呼起超级面板，可以根据当前鼠标选择内容，匹配对应插件能力。比如当前选择图片后长按右击，则会呼起上传图床插件：
@@ -57,7 +52,7 @@ Rubick(拉比克) 是 dota 里面的英雄之一，其核心技能是插件化
 ![image.png](https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/1706cc730f1f46078cb700a445211317~tplv-k3u1fbpfcp-watermark.image)
 
 ### 模板
-为了更贴合 `uTools` 的插件能力，需要实现模板功能，模板即是一个内置 UI 样式的功能插件。
+模板即是一个内置 UI 样式的功能插件。
 
 <img src=https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/0b113ad547974699b9c73c28bc09b9b1~tplv-k3u1fbpfcp-watermark.image width=500 />
 

deploy.sh

@@ -0,0 +1,24 @@
+#!/usr/bin/env sh
+
+# 确保脚本抛出遇到的错误
+set -e
+
+# 生成静态文件
+cd docs && npm run docs:build
+# 进入生成的文件夹
+cd docs/.vuepress/dist
+
+# 如果是发布到自定义域名
+# echo 'www.example.com' > CNAME
+
+git init
+git add -A
+git commit -m 'deploy'
+
+# 如果发布到 https://<USERNAME>.github.io
+# git push -f git@github.com:<USERNAME>/<USERNAME>.github.io.git master
+
+# 如果发布到 https://<USERNAME>.github.io/<REPO>
+git push -f git@github.com:clouDr-f2e/rubick.git master:gh-pages
+
+cd -

docs/docs/.vuepress/config.js

@@ -0,0 +1,55 @@
+module.exports = {
+  title: 'Rubick',
+  description: '你的开源桌面插件应用',
+  base: '/rubick/',
+  themeConfig: {
+    themeColor: {
+      blue: "#2196f3",
+      red: "#2196f3",
+      green: "#2196f3",
+      orange: "#2196f3",
+    },
+    logo: '/images/logo.png',
+    nav: [
+      { text: '使用文档', link: '/guide/' },
+      { text: '开发者', link: '/dev/' },
+    ],
+    sidebar: [
+      {
+        title: '使用文档',   // 必要的
+        path: '/guide/',      // 可选的, 标题的跳转链接，应为绝对路径且必须存在
+        sidebarDepth: 1,    // 可选的, 默认值是 1
+      },
+      {
+        title: '开发者',
+        path: '/dev/',
+      },
+      {
+        title: 'TODO: 原理解析',
+        children: [
+          {
+            title: '插件化实现原理'
+          },
+          {
+            title: '右击增强实现原理'
+          },
+          {
+            title: '系统插件实现原理'
+          },
+          {
+            title: '文件检索实现原理'
+          },
+        ]
+      },
+    ],
+    // 假定是 GitHub. 同时也可以是一个完整的 GitLab URL
+    repo: 'https://github.com/clouDr-f2e/rubick',
+    // 自定义仓库链接文字。默认从 `themeConfig.repo` 中自动推断为
+    // "GitHub"/"GitLab"/"Bitbucket" 其中之一，或是 "Source"。
+    repoLabel: 'Github',
+    // 默认是 false, 设置为 true 来启用
+    editLinks: true,
+    // 默认为 "Edit this page"
+    editLinkText: '帮助我们改善此页面！'
+  }
+}

docs/docs/.vuepress/styles/palette.styl

@@ -0,0 +1,7 @@
+$accentColor = #ff4ea4//默认主题颜色
+$codeBgColor = #282c34//默认背景颜色
+
+//示例修改相关样式f12找到需要修改的地方找到对应class类拿过来直接用就行了
+.sidebar-group.is-sub-group > .sidebar-heading:not(.clickable){
+  opacity :1
+}

docs/docs/README.md

@@ -0,0 +1,16 @@
+---
+home: true
+heroImage: /images/logo.png
+heroText: Rubick
+tagline: 基于 Electron 开源的插件化工具箱
+actionText: 快速上手 →
+actionLink: /guide/
+features:
+- title: 开箱即用
+  details: 支持快速检索系统应用
+- title: 自由定制
+  details: 支持自定义插件开发
+- title: 海量示例
+  details: 新版文档 code Demo & playground 一应俱全
+footer: MIT Licensed | Copyright (c) 2021 muwoo
+---

docs/docs/dev/README.md

@@ -0,0 +1,81 @@
+## 开发一个最基础的插件
+一个最基础插件的目录是这样的：
+```
+rubick-plugin-demo
+  |-- index.html
+  |-- logo.png
+  |-- plugin.json
+  |-- preload.js
+```
+## 文件说明
+### plugin.json
+用于指定插件最基础的配置，一个最基础的配置信息如下：
+```json
+{
+  "pluginName": "测试插件",
+  "author": "muwoo",
+  "description": "我的第一个 rubick 插件",
+  "main": "index.html",
+  "version": "0.0.2",
+  "logo": "logo.png",
+  "name": "rubick-plugin-demo",
+  "features": [
+    {
+      "code": "hello",
+      "explain": "这是一个测试的插件",
+      "cmds":["hello", "你好"]
+    }
+  ],
+  "preload": "preload.js"
+}
+```
+核心字段说明：
+
+* name 插件仓库名称，需要保持和git仓库同名，不要随意变更
+* pluginName 插件显示名称，用于展示给使用者
+* description 插件描述，描述这个插件的作用
+* main 入口文件，一般为 `index.html`
+* version 插件的版本
+* features 插件核心功能列表
+* features.code 插件某个功能的识别码，可用于区分不同的功能
+* features.cmds 输入框内搜索该 cmd 进入插件
+
+### index.html
+插件的入口文件，用于展示插件的样式，一个最基础的 `html` 结构可以是这样：
+```html
+<!DOCTYPE html>
+<html>
+<body>
+  hello Rubick
+  <button id="showNotification">通知</button>
+</body>
+<script>
+  document.getElementById('showNotification').addEventListener('click', () => {
+    window.showNotification();
+  })
+</script>
+</html>
+```
+
+### preload.js
+细心的同学可能已经注意到上面的 `index.html` 使用了一个全局函数 `showNotification` 那么这个函数是在哪里定义的呢？
+答案就是在 `preload.js` 里面。我们知道 `electron` 是可以再渲染进程中执行 `node.js` 的，所以 `preload.js` 是既可以
+执行 `node.js` 以及执行 `Rubick` 提供的系统命令的位置：
+```js
+window.showNotification = function () {
+  rubick.showNotification('HI, rubick')
+}
+```
+rubick 更多支持 API 能力参考：[rubick 全局API](https://github.com/clouDr-f2e/rubick/blob/master/static/preload.js#L49)
+
+### logo.png
+当前插件的logo图标，建议是 200 x 200 方形图标
+
+## 测试插件
+复制 `plugin.json` 文件，在 `rubick` 主窗口执行 `ctrl/command + v` 即可唤起安装插件的功能，选择`新建rubick插件`，进入插件主界面，
+开启插件后，在插件主窗口即可通过命令打开插件：
+
+![](/images/5.gif)
+
+本小节所有代码：[rubcik-plugin-demo](https://github.com/clouDr-f2e/rubick-plugin-demo)
+

docs/docs/guide/README.md

@@ -0,0 +1,56 @@
+## 下载 rubick
+[rubick 下载安装地址](https://github.com/clouDr-f2e/rubick/releases)
+
+安装完成后打开 rubick 即可看到主搜索界面：
+
+![](/images/1.png)
+
+目前支持 windows 和 macos。linux 小伙伴正在开发中
+
+## 功能说明
+接下来详细介绍 rubick 所包含和支持的功能
+
+### 1. 搜索系统应用
+`macos` 下支持搜索当前电脑内所安装的所有 app 和一些偏好设置，目前可搜索路径为：
+```json
+[
+  "/System/Applications",
+  "/Applications",
+  "/System/Library/PreferencePanes"
+]
+```
+也就是说只要当前系统软件安装到这些目录才会被检索到。支持中文搜索和拼音、拼音首字母搜索：
+
+![](/images/2.gif)
+
+`Windows` 内由于安装目录太多不确定，有的在 C盘，有的在D盘，还有的在自定义其他位置，所以该功能还在设计中，如果您有好的方案也欢迎提供：[issues](https://github.com/clouDr-f2e/rubick/issues)
+
+### 2. rubick 内置功能
+
+`rubick` 参考了钉钉、微信等 App 的基础功能，也设计内置了 `截图`、`取色`、`锁屏` 基础功能，通过搜索框输入对应关键词呼起。
+
+#### 截屏
+输入：`'截屏'` 或者 `'shortCut'` 或者 `'jp'`。
+
+#### 取色
+输入：`'取色'` 或者 `'拾色'` 或者 `'Pick color'` 、`'qs'`、`'ss'`。
+
+#### 锁屏
+输入：`'锁屏'` 或者 `'lock screen'` 或者 `'sp'`。
+
+### 3. 使用插件
+点击搜索框右侧 rubick 图标，进入插件市场，选择所需插件，点击下载按钮即可下载，下载完成后在已安装 tab 下可以找到安装插件。
+安装完成后，输入插件呼起命令即可使用对应插件：
+
+![](/images/3.gif)
+
+### 4. 右击增强
+通常我们需要使用鼠标右击来对桌面属性进行拓展，`Rubick` 支持对右击属性进行增强功能，长按鼠标右键即可呼起。如果安装的插件支持
+特殊类型的文件操作，还可以在右键中唤起插件：
+
+![](/images/4.gif)
+
+### 更多功能
+如果您还需要更多功能，欢迎来这里给我们提建议：[issues](https://github.com/clouDr-f2e/rubick/issues/20) 
+有价值的想法我们会加入到后期的开发当中。同时也欢迎一起加入共建。
+

docs/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "rubick-docs",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "docs:dev": "vuepress dev docs",
+    "docs:build": "vuepress build docs"
+  },
+  "author": "muwoo",
+  "license": "ISC",
+  "devDependencies": {
+    "vuepress": "^1.8.2"
+  }
+}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "rubick2",
-  "version": "0.0.2-beta.2",
+  "version": "0.0.3-beta.1",
   "author": "muwoo <2424880409@qq.com>",
   "description": "An electron-vue project",
   "license": null,

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

@@ -1,6 +1,6 @@
 <template>
   <div class="market">
-    <a-carousel arrows>
+    <a-carousel v-if="bannerList && !!bannerList.length" arrows>
       <div
           slot="prevArrow"
           slot-scope="props"
@@ -16,7 +16,7 @@
         <img width="100%" :src="banner.src" />
       </div>
     </a-carousel>
-    <a-divider></a-divider>
+    <a-divider v-if="bannerList && !!bannerList.length"></a-divider>
     <h2>插件</h2>
     <a-list item-layout="horizontal" style="width: 100%" :grid="{ gutter: 16, column: 2 }" :data-source="pluginList">
       <a-list-item slot="renderItem" slot-scope="item, index">

static/preload.js

@@ -46,7 +46,7 @@ function convertImgToBase64(url, callback, outputFormat){
   img.src = url;
 }
 
-window.utools = window.rubick = {
+window.rubick = {
   // 事件
   onPluginEnter(cb) {
     ipcRenderer.on('onPluginEnter', (e, message) => {
@@ -240,78 +240,6 @@ window.utools = window.rubick = {
   removeFeature(code) {
     ipcRenderer.sendToHost('removeFeature', {code});
   },
-  ubrowser: {
-    winId: '',
-    async goto(md, opts) {
-      const objExp = new RegExp(/http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/);
-      let winId;
-      let win;
-      win = new BrowserWindow({
-        show: false,
-        title: typeof opts === 'object' ? '' : opts,
-        webPreferences: {
-          webSecurity: false,
-          enableRemoteModule: true,
-          backgroundThrottling: false,
-          webviewTag: true,
-          nodeIntegration: true // 在网页中集成Node
-        }
-      });
-      if(objExp.test(md) && md.indexOf('http') === 0) {
-        await win.loadURL(md);
-        winId = win.id;
-      } else {
-        marked.setOptions({
-          renderer: rendererMD,
-          gfm: true,
-          tables: true,
-          breaks: false,
-          pedantic: false,
-          sanitize: false,
-          smartLists: true,
-          smartypants: false
-        });
-        const htmlContent = marked(md);
-        win.loadURL('data:text/html;charset=UTF-8,' + encodeURIComponent(htmlContent))
-        win.once('ready-to-show', () => win.show());
-        winId = win.id;
-      }
-      return {
-        value(selector, value) {
-          ipcRenderer.send('msg-trigger', {
-            type: 'ubrowser.value',
-            winId,
-            selector, value
-          });
-          return new Promise(resolve => {
-            ipcRenderer.once(`msg-back-ubrowser.value`, (e, result) => {
-              resolve(this)
-            });
-          })
-        },
-        click(selector) {
-          ipcRenderer.send('msg-trigger', {
-            type: 'ubrowser.click',
-            winId,
-            selector,
-          });
-          return new Promise(resolve => {
-            ipcRenderer.once(`msg-back-ubrowser.click`, (e, result) => {
-              resolve(this)
-            });
-          })
-        },
-        run(options) {
-          ipcRenderer.send('msg-trigger', {
-            type: 'ubrowser.run',
-            winId,
-            ...options
-          });
-        }
-      }
-    },
-  },
-
   // 系统
   shellOpenExternal(url) {
     shell.openExternal(url);