clickgo 3.0.6-dev7 → 3.0.7-dev8

package/dist/lib/form.ts

@@ -36,6 +36,7 @@ const info: {
         'yes': string;
         'no': string;
         'cancel': string;
+        'search': string;
     }>;
 } = {
     'lastId': 0,
@@ -46,25 +47,29 @@ const info: {
             'ok': '好',
             'yes': '是',
             'no': '否',
-            'cancel': '取消'
+            'cancel': '取消',
+            'search': '搜索'
         },
         'tc': {
             'ok': '好',
             'yes': '是',
             'no': '否',
-            'cancel': '取消'
+            'cancel': '取消',
+            'search': '檢索'
         },
         'en': {
             'ok': 'OK',
             'yes': 'Yes',
             'no': 'No',
-            'cancel': 'Cancel'
+            'cancel': 'Cancel',
+            'search': 'Search'
         },
         'ja': {
             'ok': '好',
             'yes': 'はい',
             'no': 'いいえ',
-            'cancel': 'キャンセル'
+            'cancel': 'キャンセル',
+            'search': '検索'
         }
     }
 };
@@ -84,6 +89,7 @@ const popInfo: {
 };
 
 export let simpleSystemTaskRoot: types.IVue;
+export let launcherRoot: types.IVue;
 const elements: {
     'wrap': HTMLDivElement;
     'list': HTMLDivElement;
@@ -95,6 +101,7 @@ const elements: {
     'dragIcon'?: HTMLElement;
     'system': HTMLElement;
     'simpleSystemtask': HTMLDivElement;
+    'launcher': HTMLDivElement;
     'init': () => void;
 } = {
     'wrap': document.createElement('div'),
@@ -107,22 +114,17 @@ const elements: {
     'dragIcon': undefined,
     'system': document.createElement('div'),
     'simpleSystemtask': document.createElement('div'),
+    'launcher': document.createElement('div'),
     'init': function() {
         /** --- clickgo 所有的 div wrap --- */
         this.wrap.id = 'cg-wrap';
         document.getElementsByTagName('body')[0].appendChild(this.wrap);
         if (clickgo.getNative() && (clickgo.getPlatform() === 'win32')) {
             this.wrap.addEventListener('mouseenter', function() {
-                native.send('cg-mouse-ignore', JSON.stringify({
-                    'token': native.getToken(),
-                    'param': false
-                }));
+                native.invoke('cg-mouse-ignore', native.getToken(), false);
             });
             this.wrap.addEventListener('mouseleave', function() {
-                native.send('cg-mouse-ignore', JSON.stringify({
-                    'token': native.getToken(),
-                    'param': true
-                }));
+                native.invoke('cg-mouse-ignore', native.getToken(), true);
             });
         }
 
@@ -242,6 +244,192 @@ const elements: {
             }
         });
         simpletaskApp.mount('#cg-simpletask');
+
+        // --- cg-launcher ---
+        this.launcher.id = 'cg-launcher';
+        this.launcher.addEventListener('contextmenu', function(e): void {
+            e.preventDefault();
+        });
+        this.wrap.appendChild(this.launcher);
+        this.launcher.addEventListener('touchmove', function(e): void {
+            // --- 防止拖动时整个网页跟着动 ---
+            e.preventDefault();
+        }, {
+            'passive': false
+        });
+        // --- Vue 挂载在这里 ---
+        const waiting = function(): void {
+            // --- 必须在这里执行，要不然 computed 无法更新，因为 core 还没加载进来 ---
+            if (!core.config) {
+                setTimeout(function() {
+                    waiting();
+                }, 2000);
+                return;
+            }
+            const launcherApp = clickgo.vue.createApp({
+                'template': `<div class="cg-launcher-search">` +
+    `<input v-if="folderName === ''" class="cg-launcher-sinput" :placeholder="search" v-model="name">` +
+    `<input v-else class="cg-launcher-foldername" :value="folderName" @change="folderNameChange">` +
+`</div>` +
+`<div class="cg-launcher-list" @mousedown="mousedown" @click="listClick" :class="[folderName === '' ? '' : 'cg-folder-open']">` +
+    `<div v-for="item of list" class="cg-launcher-item">` +
+        `<div class="cg-launcher-inner">` +
+            `<div v-if="!item.list || item.list.length === 0" class="cg-launcher-icon" :style="{'background-image': 'url(' + item.icon + ')'}" @click="iconClick($event, item)"></div>` +
+            `<div v-else class="cg-launcher-folder" @click="openFolder($event, item)">` +
+                `<div>` +
+                    `<div v-for="sub of item.list" class="cg-launcher-item">` +
+                        `<div class="cg-launcher-inner">` +
+                            `<div class="cg-launcher-icon" :style="{'background-image': 'url(' + sub.icon + ')'}" @click="subIconClick($event, sub)"></div>` +
+                            `<div class="cg-launcher-name">{{sub.name}}</div>` +
+                        `</div>` +
+                        `<div class="cg-launcher-space"></div>` +
+                    `</div>` +
+                `</div>` +
+            `</div>` +
+            `<div class="cg-launcher-name">{{item.name}}</div>` +
+        `</div>` +
+        `<div class="cg-launcher-space"></div>` +
+    `</div>` +
+`</div>`,
+                'data': function() {
+                    return {
+                        'name': '',
+                        'folderName': ''
+                    };
+                },
+                'computed': {
+                    'search': function() {
+                        return info.locale[core.config.locale]?.search ?? info.locale['en'].search;
+                    },
+                    'list': function(this: types.IVue) {
+                        if (this.name === '') {
+                            return core.config['launcher.list'];
+                        }
+                        const list = [];
+                        for (const item of core.config['launcher.list']) {
+                            if (item.list && item.list.length > 0) {
+                                for (const sub of item.list) {
+                                    if (sub.name.toLowerCase().includes(this.name.toLowerCase())) {
+                                        list.push(sub);
+                                    }
+                                }
+                            }
+                            else {
+                                if (item.name.toLowerCase().includes(this.name.toLowerCase())) {
+                                    list.push(item);
+                                }
+                            }
+                        }
+                        return list;
+                    }
+                },
+                'methods': {
+                    mousedown: function(this: types.IVue, e: MouseEvent): void {
+                        this.md = e.pageX + e.pageY;
+                    },
+                    listClick: function(this: types.IVue, e: MouseEvent) {
+                        if (this.md !== e.pageX + e.pageY) {
+                            return;
+                        }
+                        if (e.currentTarget !== e.target) {
+                            return;
+                        }
+                        if (this.folderName === '') {
+                            hideLauncher();
+                        }
+                        else {
+                            this.closeFolder();
+                        }
+                    },
+                    iconClick: async function(
+                        this: types.IVue,
+                        e: MouseEvent,
+                        item: types.IConfigLauncherItem
+                    ): Promise<void> {
+                        if (this.md !== e.pageX + e.pageY) {
+                            return;
+                        }
+                        hideLauncher();
+                        await clickgo.task.run(item.path!, {
+                            'icon': item.icon
+                        });
+                    },
+                    subIconClick: async function(
+                        this: types.IVue,
+                        e: MouseEvent,
+                        item: types.IConfigLauncherItem
+                    ): Promise<void> {
+                        if (this.md !== e.pageX + e.pageY) {
+                            return;
+                        }
+                        hideLauncher();
+                        await clickgo.task.run(item.path!, {
+                            'icon': item.icon
+                        });
+                    },
+                    closeFolder: function(this: types.IVue): void {
+                        // --- 关闭文件夹 ---
+                        this.folderName = '';
+                        const el = this.folderEl as HTMLDivElement;
+                        const rect = (el.parentNode as HTMLDivElement).getBoundingClientRect();
+                        el.classList.remove('cg-show');
+                        el.style.left = (rect.left + 30).toString() + 'px';
+                        el.style.top = rect.top.toString() + 'px';
+                        el.style.width = '';
+                        el.style.height = '';
+                        setTimeout(() => {
+                            el.style.position = '';
+                            el.style.left = '';
+                            el.style.top = '';
+                        }, 150);
+                    },
+                    openFolder: function(this: types.IVue, e: MouseEvent, item: types.IConfigLauncherItem): void {
+                        if (this.md !== e.pageX + e.pageY) {
+                            return;
+                        }
+                        if ((e.currentTarget as HTMLElement).childNodes[0] !== e.target) {
+                            return;
+                        }
+                        if (this.folderName !== '') {
+                            this.closeFolder();
+                            return;
+                        }
+                        this.folderName = item.name;
+                        this.folderItem = item;
+                        const el = (e.currentTarget as HTMLDivElement).childNodes.item(0) as HTMLDivElement;
+                        this.folderEl = el;
+                        const searchEl = document.getElementsByClassName('cg-launcher-search')[0] as HTMLDivElement;
+                        const rect = el.getBoundingClientRect();
+                        el.style.left = rect.left.toString() + 'px';
+                        el.style.top = rect.top.toString() + 'px';
+                        el.style.position = 'fixed';
+                        requestAnimationFrame(() => {
+                            el.classList.add('cg-show');
+                            el.style.left = '50px';
+                            el.style.top = searchEl.offsetHeight.toString() + 'px';
+                            el.style.width = 'calc(100% - 100px)';
+                            el.style.height = 'calc(100% - 50px - ' + searchEl.offsetHeight.toString() + 'px)';
+                        });
+                    },
+                    folderNameChange: function(this: types.IVue, e: InputEvent): void {
+                        const input = e.target as HTMLInputElement;
+                        const val = input.value.trim();
+                        if (val === '') {
+                            input.value = this.folderName;
+                            return;
+                        }
+                        this.folderName = val;
+                        // --- 触发 folder name change 事件 ---
+                        core.trigger('launcherFolderNameChanged', this.folderItem.id ?? '', val);
+                    }
+                },
+                'mounted': function(this: types.IVue): void {
+                    launcherRoot = this;
+                }
+            });
+            launcherApp.mount('#cg-launcher');
+        };
+        waiting();
     }
 };
 elements.init();
@@ -1620,6 +1808,12 @@ export async function create(opt: string | types.IFormCreateOptions): Promise<nu
                 },
                 hide: function(fid?: number): void {
                     clickgo.form.hide(fid ?? formId, taskId);
+                },
+                showLauncher: function(): void {
+                    clickgo.form.showLauncher();
+                },
+                hideLauncher: function(): void {
+                    clickgo.form.hideLauncher();
                 }
             },
             'fs': {
@@ -1739,36 +1933,8 @@ export async function create(opt: string | types.IFormCreateOptions): Promise<nu
                 }
             },
             'native': {
-                getListeners: function(): Array<{ 'id': number; 'name': string; 'once': boolean; 'taskId'?: number; }> {
-                    return clickgo.native.getListeners();
-                },
-                send: function(
-                    name: string,
-                    param?: string,
-                    handler?: (param?: string) => void | Promise<void>
-                ): number {
-                    return clickgo.native.send(name, param, handler, taskId);
-                },
-                on: function(
-                    name: string,
-                    handler: (param?: string) => void | Promise<void>,
-                    id?: number,
-                    once: boolean = false
-                ): void {
-                    clickgo.native.on(name, handler, id, once, taskId);
-                },
-                once: function(
-                    name: string,
-                    handler: (param?: string) => void | Promise<void>,
-                    id?: number
-                ): void {
-                    clickgo.native.once(name, handler, id, taskId);
-                },
-                off: function(name: string, handler: (param?: string) => void | Promise<void>): void {
-                    clickgo.native.off(name, handler, taskId);
-                },
-                clearListener: function(): void {
-                    clickgo.native.clearListener(taskId);
+                invoke: function(name: string, ...param: any[]): any {
+                    return clickgo.native.invoke(name, ...param);
                 },
                 max: function(): void {
                     clickgo.native.max();
@@ -2509,6 +2675,30 @@ export function hide(formId?: number, taskId?: number): void {
     form.vroot.$refs.form.$data.showData = false;
 }
 
+/**
+ * --- 显示 launcher 界面 ---
+ */
+export function showLauncher(): void {
+    elements.launcher.style.display = 'flex';
+    requestAnimationFrame(function() {
+        elements.launcher.classList.add('cg-show');
+    });
+}
+
+/**
+ * --- 隐藏 launcher 界面 ---
+ */
+export function hideLauncher(): void {
+    elements.launcher.classList.remove('cg-show');
+    setTimeout(function() {
+        if (launcherRoot.folderName !== '') {
+            launcherRoot.closeFolder();
+        }
+        launcherRoot.name = '';
+        elements.launcher.style.display = 'none';
+    }, 300);
+}
+
 // --- 绑定 resize 事件 ---
 window.addEventListener('resize', function(): void {
     // --- 触发 screenResize 事件 ---

package/dist/lib/native.js

@@ -1,172 +1,32 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.cgInnerReceive = exports.cgInnerGetSends = exports.size = exports.restore = exports.min = exports.max = exports.clearListener = exports.off = exports.once = exports.on = exports.send = exports.getListeners = exports.getToken = void 0;
+exports.size = exports.restore = exports.min = exports.max = exports.invoke = exports.getToken = void 0;
 const clickgo = require("../clickgo");
-let sendId = 0;
-let sendList = [];
-const listeners = {};
 const token = (Math.random() * 100000000000000 * (100 + Math.round(Math.random() * (999 - 100)))).toString(32);
 function getToken() {
     return token;
 }
 exports.getToken = getToken;
-function getListeners() {
-    const list = [];
-    for (const name in listeners) {
-        for (const item of listeners[name]) {
-            list.push({
-                'id': item.id,
-                'name': name,
-                'once': item.once,
-                'taskId': item.taskId
-            });
-        }
-    }
-    return list;
-}
-exports.getListeners = getListeners;
-function send(name, param, handler, taskId) {
-    if (!clickgo.getNative()) {
-        return 0;
-    }
-    const id = ++sendId;
-    sendList.push({
-        'id': id,
-        'name': name,
-        'param': param
-    });
-    if (handler) {
-        on(name, handler, id, true, taskId);
-    }
-    return id;
-}
-exports.send = send;
-function on(name, handler, id, once = false, taskId) {
+function invoke(name, ...param) {
     if (!clickgo.getNative()) {
         return;
     }
-    if (!listeners[name]) {
-        listeners[name] = [];
-    }
-    listeners[name].push({
-        'id': id !== null && id !== void 0 ? id : 0,
-        'once': once,
-        'taskId': taskId,
-        'handler': handler
-    });
-}
-exports.on = on;
-function once(name, handler, id, taskId) {
-    on(name, handler, id, true, taskId);
+    return window.clickgoNative.invoke(name, ...param);
 }
-exports.once = once;
-function off(name, handler, taskId) {
-    if (!listeners[name]) {
-        return;
-    }
-    for (let i = 0; i < listeners[name].length; ++i) {
-        if (listeners[name][i].handler !== handler) {
-            continue;
-        }
-        if (taskId && (listeners[name][i].taskId !== taskId)) {
-            continue;
-        }
-        listeners[name].splice(i, 1);
-        if (listeners[name].length === 0) {
-            delete listeners[name];
-            break;
-        }
-        --i;
-    }
-}
-exports.off = off;
-function clearListener(taskId) {
-    if (!taskId) {
-        return;
-    }
-    for (const name in listeners) {
-        for (let i = 0; i < listeners[name].length; ++i) {
-            if (listeners[name][i].taskId !== taskId) {
-                continue;
-            }
-            listeners[name].splice(i, 1);
-            if (listeners[name].length === 0) {
-                delete listeners[name];
-                break;
-            }
-        }
-    }
-}
-exports.clearListener = clearListener;
+exports.invoke = invoke;
 function max() {
-    send('cg-set-state', JSON.stringify({
-        'token': token,
-        'state': 'max'
-    }));
+    invoke('cg-set-state', token, 'max');
 }
 exports.max = max;
 function min() {
-    send('cg-set-state', JSON.stringify({
-        'token': token,
-        'state': 'min'
-    }));
+    invoke('cg-set-state', token, 'min');
 }
 exports.min = min;
 function restore() {
-    send('cg-set-state', JSON.stringify({
-        'token': token,
-        'state': 'restore'
-    }));
+    invoke('cg-set-state', token, 'restore');
 }
 exports.restore = restore;
 function size(width, height) {
-    send('cg-set-size', JSON.stringify({
-        'token': token,
-        'width': width,
-        'height': height
-    }));
+    invoke('cg-set-size', token, width, height);
 }
 exports.size = size;
-function cgInnerGetSends() {
-    const json = JSON.stringify(sendList);
-    sendList = [];
-    return json;
-}
-exports.cgInnerGetSends = cgInnerGetSends;
-function cgInnerReceive(id, name, result) {
-    if (!listeners[name]) {
-        return;
-    }
-    for (let i = 0; i < listeners[name].length; ++i) {
-        const item = listeners[name][i];
-        if (item.id > 0) {
-            if (item.id !== id) {
-                continue;
-            }
-            const r = item.handler(result);
-            if (r instanceof Promise) {
-                r.catch(function (e) {
-                    console.log(e);
-                });
-            }
-        }
-        else {
-            const r = item.handler(result);
-            if (r instanceof Promise) {
-                r.catch(function (e) {
-                    console.log(e);
-                });
-            }
-        }
-        if (item.once) {
-            listeners[name].splice(i, 1);
-            --i;
-        }
-    }
-}
-exports.cgInnerReceive = cgInnerReceive;
-window.clickGoNative = {
-    isReady: true,
-    cgInnerGetSends: cgInnerGetSends,
-    cgInnerReceive: cgInnerReceive
-};