clickgo 3.0.7-dev8 → 3.1.1-dev10

package/README.md

@@ -19,7 +19,7 @@ Load the module loader first, and then load it using the module loader.
 **index.html**
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/@litert/loader@3.3.0/dist/loader.min.js?path=index&npm={'clickgo':'3.0.7-dev8'}"></script>
+<script src="https://cdn.jsdelivr.net/npm/@litert/loader@3.4.1/dist/loader.min.js?path=index&npm={'clickgo':'3.0.7-dev8'}"></script>
 ```
 
 **index.js**

package/dist/app/demo/app.js

@@ -0,0 +1,93 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const clickgo = require("clickgo");
+const main_1 = require("./form/main");
+class default_1 extends clickgo.core.AbstractApp {
+    main() {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield this.config({
+                'name': 'Clickgo Demo',
+                'ver': 1,
+                'version': '0.1',
+                'author': 'clickgo',
+                'controls': [
+                    '/clickgo/control/common',
+                    '/clickgo/control/form',
+                    '/clickgo/control/monaco',
+                    '/clickgo/control/property'
+                ],
+                'style': '/package/global',
+                'files': [
+                    '/form/control/block/block.css',
+                    '/form/control/block/block.xml',
+                    '/form/control/button/button.css',
+                    '/form/control/button/button.xml',
+                    '/form/control/check/check.xml',
+                    '/form/control/dialog/dialog.xml',
+                    '/form/control/file/file.xml',
+                    '/form/control/form/form.css',
+                    '/form/control/form/form.xml',
+                    '/form/control/greatview/greatview.css',
+                    '/form/control/greatview/greatview.xml',
+                    '/form/control/img/img.xml',
+                    '/form/control/label/label.xml',
+                    '/form/control/list/list.css',
+                    '/form/control/list/list.xml',
+                    '/form/control/loading/loading.xml',
+                    '/form/control/marquee/marquee.xml',
+                    '/form/control/menu/menu.xml',
+                    '/form/control/monaco/monaco.xml',
+                    '/form/control/overflow/overflow.css',
+                    '/form/control/overflow/overflow.xml',
+                    '/form/control/property/property.xml',
+                    '/form/control/radio/radio.xml',
+                    '/form/control/scroll/scroll.xml',
+                    '/form/control/select/select.xml',
+                    '/form/control/tab/tab.xml',
+                    '/form/control/text/text.xml',
+                    '/form/control/view/view.css',
+                    '/form/control/view/view.xml',
+                    '/form/event/form/form.css',
+                    '/form/event/form/form.xml',
+                    '/form/event/screen/screen.xml',
+                    '/form/event/task/task.xml',
+                    '/form/method/core/core.xml',
+                    '/form/method/dom/dom.css',
+                    '/form/method/dom/dom.xml',
+                    '/form/method/form/form.css',
+                    '/form/method/form/form.xml',
+                    '/form/method/form/test.xml',
+                    '/form/method/fs/fs.xml',
+                    '/form/method/fs/text.xml',
+                    '/form/method/task/locale1.json',
+                    '/form/method/task/locale2.json',
+                    '/form/method/task/task.xml',
+                    '/form/method/theme/theme.xml',
+                    '/form/method/tool/tool.xml',
+                    '/form/method/zip/zip.xml',
+                    '/form/main.css',
+                    '/form/main.xml',
+                    '/res/icon.svg',
+                    '/res/img.jpg',
+                    '/res/r-1.svg',
+                    '/res/r-2.svg',
+                    '/res/sql.svg',
+                    '/res/txt.svg',
+                    '/res/zip.svg',
+                    '/global.css'
+                ]
+            });
+            this.run(yield main_1.default.create());
+        });
+    }
+}
+exports.default = default_1;

package/dist/app/demo/form/control/dialog/dialog.js

@@ -1,8 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.data = void 0;
-exports.data = {
-    'message': 'message',
-    'buttons': ['OK'],
-    'btn': 'none'
-};
+const clickgo = require("clickgo");
+class default_1 extends clickgo.form.AbstractForm {
+    constructor() {
+        super(...arguments);
+        this.message = 'message';
+        this.buttons = ['OK'];
+        this.btn = 'none';
+    }
+}
+exports.default = default_1;

package/dist/app/demo/form/control/form/form.js

@@ -9,30 +9,31 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.methods = exports.data = void 0;
 const clickgo = require("clickgo");
-exports.data = {
-    'width': 300,
-    'height': 520,
-    'icon': '',
-    'title': 'Form',
-    'min': true,
-    'max': true,
-    'close': true,
-    'stateMax': false,
-    'stateMin': false,
-    'minWidth': 200,
-    'minHeight': 100,
-    'resize': true,
-    'loading': false,
-    'border': 'normal'
-};
-exports.methods = {
-    showLoading: function () {
+class default_1 extends clickgo.form.AbstractForm {
+    constructor() {
+        super(...arguments);
+        this.width = 300;
+        this.height = 520;
+        this.icon = '';
+        this.title = 'Form';
+        this.min = true;
+        this.max = true;
+        this.close = true;
+        this.stateMax = false;
+        this.stateMin = false;
+        this.minWidth = 200;
+        this.minHeight = 100;
+        this.resize = true;
+        this.loading = false;
+        this.border = 'normal';
+    }
+    showLoading() {
         return __awaiter(this, void 0, void 0, function* () {
             this.loading = true;
             yield clickgo.tool.sleep(1000);
             this.loading = false;
         });
     }
-};
+}
+exports.default = default_1;

package/dist/app/demo/form/control/form/form.xml

@@ -1,7 +1,7 @@
 <form v-model:width="width" v-model:height="height" :icon="icon" :title="title" :min="min" :max="max" :close="close" v-model:state-max="stateMax" v-model:state-min="stateMin" :min-width="minWidth" :min-height="minHeight" :resize="resize" :loading="loading" :border="border" direction="v">
     <overflow direction="v">
         <layout direction="v" gutter="10" style="padding: 10px;">
-            <label>focus: {{cgFocus}}, width: {{width}}, height: {{height}}, state-max: {{stateMax}}, state-min: {{stateMin}}.</label>
+            <label>focus: {{formFocus}}, width: {{width}}, height: {{height}}, state-max: {{stateMax}}, state-min: {{stateMin}}.</label>
             <button @click="icon = icon ? '' : '/package/res/icon.svg'">Set icon</button>
             <button @click="title = (title === 'Form') ? 'Changed' : 'Form'">Set title</button>
             <button @click="min = min ? false : true">{{min ? 'Hide' : 'Show'}} min button</button>
@@ -13,8 +13,8 @@
             <button @click="minHeight = (minHeight === 100) ? 200 : 100">Set min-height to {{minHeight === 100 ? '200' : '100'}}</button>
             <button @click="width = 350">Set width to 350</button>
             <button @click="height = 400">Set height to 400</button>
-            <button @click="width = 'auto'">Set width to "auto"</button>
-            <button @click="height = 'auto'">Set height to "auto"</button>
+            <button @click="width = 0">Set width auto</button>
+            <button @click="height = 0">Set height auto</button>
             <button @click="resize = resize ? false : true">{{resize ? 'Disabled' : 'Enabled'}} resize</button>
             <button @click="showLoading">Show loading</button>
             <layout class="bottom" gutter="10">

package/dist/app/demo/form/main.js

@@ -9,17 +9,41 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.methods = exports.data = void 0;
 const clickgo = require("clickgo");
-exports.data = {
-    'ntab': ''
-};
-exports.methods = {
-    openForm: function (type, name) {
+const form_1 = require("./control/form/form");
+const dialog_1 = require("./control/dialog/dialog");
+const form_2 = require("./method/form/form");
+class default_1 extends clickgo.form.AbstractForm {
+    constructor() {
+        super(...arguments);
+        this.ntab = '';
+    }
+    openForm(name) {
         return __awaiter(this, void 0, void 0, function* () {
-            yield clickgo.form.create({
-                'file': `${type}/${name}/${name}`
-            });
+            let frm = 0;
+            switch (name) {
+                case 'cblock': {
+                    frm = yield this.createForm('control/block/block');
+                    break;
+                }
+                case 'cform': {
+                    frm = yield form_1.default.create();
+                    break;
+                }
+                case 'cdialog': {
+                    frm = yield dialog_1.default.create();
+                    break;
+                }
+                case 'mform': {
+                    frm = yield form_2.default.create();
+                    break;
+                }
+            }
+            if (typeof frm === 'number') {
+                return;
+            }
+            frm.show();
         });
     }
-};
+}
+exports.default = default_1;

package/dist/app/demo/form/main.xml

@@ -2,7 +2,7 @@
     <tab v-model="ntab" :tabs="['control', 'method', 'event']" style="margin: 10px; flex: 1;">
         <overflow v-if="ntab === 'control'" class="inner" direction="v">
             <layout class="buttons" gutter="10" direction="v">
-                <button @click="openForm('control', 'form')">Form</button>
+                <button @click="openForm('cform')">Form</button>
                 <button @click="openForm('control', 'img')">Img</button>
                 <button @click="openForm('control', 'button')">Button</button>
                 <button @click="openForm('control', 'check')">Check</button>
@@ -11,9 +11,9 @@
                 <button @click="openForm('control', 'tab')">Tab</button>
                 <button @click="openForm('control', 'label')">Label</button>
                 <button @click="openForm('control', 'loading')">Loading</button>
-                <button @click="openForm('control', 'dialog')">Dialog</button>
+                <button @click="openForm('cdialog')">Dialog</button>
                 <button @click="openForm('control', 'file')">File</button>
-                <button @click="openForm('control', 'block')">Block</button>
+                <button @click="openForm('cblock')">Block</button>
                 <button @click="openForm('control', 'overflow')">Overflow</button>
                 <button @click="openForm('control', 'view')">View</button>
                 <button @click="openForm('control', 'greatview')">Greatview</button>
@@ -30,7 +30,7 @@
             <layout class="buttons" gutter="10" direction="v">
                 <button @click="openForm('method', 'core')">Library core</button>
                 <button @click="openForm('method', 'dom')">Library dom</button>
-                <button @click="openForm('method', 'form')">Library form</button>
+                <button @click="openForm('mform')">Library form</button>
                 <button @click="openForm('method', 'fs')">Library fs</button>
                 <button @click="openForm('method', 'task')">Library task</button>
                 <button @click="openForm('method', 'theme')">Library theme</button>

package/dist/app/demo/form/method/form/form.js

@@ -9,76 +9,76 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.mounted = exports.receive = exports.methods = exports.data = void 0;
 const clickgo = require("clickgo");
-exports.data = {
-    'fid': '0',
-    'sendValue': 'sendValue',
-    'tid': '0',
-    'type': 'primary',
-    'progress': 'noraml',
-    'dialogResult': '',
-    'setTopMostValue': false
-};
-exports.methods = {
-    min: function () {
-        clickgo.form.min();
-    },
-    max: function () {
-        clickgo.form.max();
-    },
-    close: function () {
-        clickgo.form.close();
-    },
-    bindResize: function (e) {
+class default_1 extends clickgo.form.AbstractForm {
+    constructor() {
+        super(...arguments);
+        this.fid = '0';
+        this.sendValue = 'sendValue';
+        this.tid = '0';
+        this.type = 'primary';
+        this.progress = 'noraml';
+        this.dr = '';
+        this.setTopMostValue = false;
+    }
+    min() {
+        clickgo.form.min(this.formId);
+    }
+    max() {
+        clickgo.form.max(this.formId);
+    }
+    close() {
+        clickgo.form.close(this.formId);
+    }
+    bindResize(e) {
         clickgo.form.bindResize(e, 'rb');
-    },
-    bindDrag: function (e) {
+    }
+    bindDrag(e) {
         clickgo.form.bindDrag(e);
-    },
-    getTaskId: function () {
+    }
+    getTaskId() {
         clickgo.form.dialog(clickgo.form.getTaskId(parseInt(this.fid)).toString()).catch((e) => { throw e; });
-    },
-    get: function () {
+    }
+    get() {
         clickgo.form.dialog(JSON.stringify(clickgo.form.get(parseInt(this.fid)))).catch((e) => { throw e; });
-    },
-    send: function () {
+    }
+    send() {
         clickgo.form.send(parseInt(this.fid), {
             'key': this.sendValue
         });
-    },
-    changeFocus: function () {
+    }
+    changeFocus() {
         clickgo.form.changeFocus(parseInt(this.fid));
-    },
-    getList: function () {
+    }
+    getList() {
         let str = JSON.stringify(clickgo.form.getList(this.taskId));
         str = str.replace(/"icon":"(.*?)"/g, function (t, t1) {
             return `"icon":"${t1 ? (t1.slice(0, 10) + '...') : t1}"`;
         });
         clickgo.form.dialog(`<overflow direction="v" style="width: 200px; height: 80px;">${str}</overflow>`).catch((e) => { throw e; });
-    },
-    getMaxZIndexID: function () {
+    }
+    getMaxZIndexID() {
         const fid = clickgo.form.getMaxZIndexID();
         clickgo.form.dialog(JSON.stringify(fid)).catch((e) => { throw e; });
-    },
-    getRectByBorder: function () {
+    }
+    getRectByBorder() {
         const size = clickgo.form.getRectByBorder('rb');
         clickgo.form.dialog(JSON.stringify(size)).catch((e) => { throw e; });
-    },
-    showCircular: function (e) {
+    }
+    showCircular(e) {
         clickgo.form.showCircular(e.clientX, e.clientY);
-    },
-    showRectangle: function (e) {
+    }
+    showRectangle(e) {
         return __awaiter(this, void 0, void 0, function* () {
             clickgo.form.showRectangle(e.clientX, e.clientY, 'rb');
             yield clickgo.tool.sleep(1000);
             clickgo.form.hideRectangle();
         });
-    },
-    showDrag: function () {
+    }
+    showDrag() {
         return __awaiter(this, void 0, void 0, function* () {
             clickgo.form.showDrag();
-            const rect = this.$refs.showDrag.$el.getBoundingClientRect();
+            const rect = this.refs.showDrag.$el.getBoundingClientRect();
             clickgo.form.moveDrag({
                 'left': rect.left,
                 'top': rect.top,
@@ -88,8 +88,8 @@ exports.methods = {
             yield clickgo.tool.sleep(1000);
             clickgo.form.hideDrag();
         });
-    },
-    notify: function () {
+    }
+    notify() {
         return __awaiter(this, void 0, void 0, function* () {
             let icon = null;
             if (this.progress === 'progress + icon') {
@@ -117,56 +117,59 @@ exports.methods = {
                 clickgo.form.notifyProgress(nid, 100);
             }
         });
-    },
-    showPop: function (e) {
+    }
+    showPop(e) {
         if (!e.currentTarget) {
             return;
         }
-        clickgo.form.showPop(e.currentTarget, this.$refs.pop, 'v');
-    },
-    createParam: function () {
+        clickgo.form.showPop(e.currentTarget, this.refs.pop, 'v');
+    }
+    createParam() {
         clickgo.form.create({
             'layout': '<form width=\'300\' height=\'300\' title=\'normal\'></form>'
         }).catch((e) => { throw e; });
-    },
-    createPath: function () {
-        clickgo.form.create('test').then((e) => { console.log(e); }).catch((e) => { throw e; });
-    },
-    createTop: function () {
-        clickgo.form.create({
-            'layout': '<form width=\'300\' height=\'300\' title=\'normal\'></form>',
-            'topMost': true
-        }).catch((e) => { throw e; });
-    },
-    dialog: function () {
+    }
+    createPath() {
+        this.createForm('test').then((e) => { console.log(e); }).catch((e) => { throw e; });
+    }
+    createTop() {
+        return __awaiter(this, void 0, void 0, function* () {
+            const frm = yield this.createForm('test');
+            if (typeof frm === 'number') {
+                return;
+            }
+            frm.topMost = true;
+        });
+    }
+    dialog() {
         return __awaiter(this, void 0, void 0, function* () {
-            this.dialogResult = yield clickgo.form.dialog('Hello world!');
+            this.dr = yield clickgo.form.dialog('Hello world!');
         });
-    },
-    dialogLong: function () {
+    }
+    dialogLong() {
         return __awaiter(this, void 0, void 0, function* () {
-            this.dialogResult = yield clickgo.form.dialog('longlonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglong');
+            this.dr = yield clickgo.form.dialog('longlonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglong');
         });
-    },
-    dialogTitle: function () {
+    }
+    dialogTitle() {
         return __awaiter(this, void 0, void 0, function* () {
-            this.dialogResult = yield clickgo.form.dialog({
+            this.dr = yield clickgo.form.dialog({
                 'title': 'Title',
                 'content': 'Hello world!'
             });
         });
-    },
-    dialogButtons: function () {
+    }
+    dialogButtons() {
         return __awaiter(this, void 0, void 0, function* () {
-            this.dialogResult = yield clickgo.form.dialog({
+            this.dr = yield clickgo.form.dialog({
                 'content': 'Hello world!',
                 'buttons': ['A', 'B', 'C']
             });
         });
-    },
-    dialogCannot: function () {
+    }
+    dialogCannot() {
         return __awaiter(this, void 0, void 0, function* () {
-            this.dialogResult = yield clickgo.form.dialog({
+            this.dr = yield clickgo.form.dialog({
                 'content': 'Hello world!',
                 'buttons': ['Do not close', 'Close'],
                 'select': (e, button) => {
@@ -176,42 +179,41 @@ exports.methods = {
                 }
             });
         });
-    },
-    confirm: function (cancel) {
+    }
+    confirm(cancel) {
         return __awaiter(this, void 0, void 0, function* () {
-            this.dialogResult = yield clickgo.form.confirm({
+            this.dr = yield clickgo.form.confirm({
                 'content': 'Hello world?',
                 'cancel': cancel
             });
-            if (typeof this.dialogResult === 'boolean') {
-                this.dialogResult = this.dialogResult ? 'true (boolean)' : 'false (boolean)';
+            if (typeof this.dr === 'boolean') {
+                this.dr = this.dr ? 'true (boolean)' : 'false (boolean)';
             }
             else {
-                this.dialogResult = this.dialogResult.toString() + ' (number)';
+                this.dr = this.dr.toString() + ' (number)';
             }
         });
-    },
-    setTopMost: function () {
+    }
+    setTopMost() {
         this.setTopMostValue = !this.setTopMostValue;
-        clickgo.form.setTopMost(this.setTopMostValue);
-    },
-    flash: function () {
-        clickgo.form.flash();
-    },
-    hide: function () {
+        this.topMost = this.setTopMostValue;
+    }
+    flash() {
+        clickgo.form.flash(this.formId);
+    }
+    hhide() {
         return __awaiter(this, void 0, void 0, function* () {
-            clickgo.form.hide();
+            this.hide();
             yield clickgo.tool.sleep(1000);
-            clickgo.form.show();
+            this.show();
         });
     }
-};
-const receive = function (obj) {
-    clickgo.form.dialog(JSON.stringify(obj)).catch((e) => { throw e; });
-};
-exports.receive = receive;
-const mounted = function () {
-    this.fid = this.formId;
-    this.tid = this.taskId;
-};
-exports.mounted = mounted;
+    onReceive(obj) {
+        clickgo.form.dialog(JSON.stringify(obj)).catch((e) => { throw e; });
+    }
+    onMounted() {
+        this.fid = this.formId.toString();
+        this.tid = this.taskId.toString();
+    }
+}
+exports.default = default_1;

package/dist/app/demo/form/method/form/form.xml

@@ -1,11 +1,11 @@
-<form width="350" height="400" title="Library form" padding="10">
-    <overflow direction="v" style="flex: 1;">
+<form width="350" height="400" title="Library form">
+    <overflow direction="v" style="flex: 1; padding: 10px;">
         <layout gutter="10" direction="v" style="flex: 1;">
-            <button @click="min" style="height: 30px;">min()</button>
-            <button @click="max" style="height: 30px;">max()</button>
-            <button @click="close" style="height: 30px;">close()</button>
+            <button @click="min" style="height: 30px;">min({{formId}})</button>
+            <button @click="max" style="height: 30px;">max({{formId}})</button>
+            <button @click="close" style="height: 30px;">close({{formId}})</button>
             <label @mousedown="bindResize" @touchstart="bindResize" style="padding: 20px; background: rgba(0, 0, 0, .1); cursor: se-resize;">bindResize(e, 'rb')</label>
-            <label @mousedown="bindDrag" @touchstart="bindDrag" style="padding: 20px; background: rgba(0, 0, 0, .1);">bindDrag(e)</label>
+            <label @mousedown="bindDrag" @touchstart="bindDrag" style="padding: 20px; background: rgba(0, 0, 0, .1); cursor: move;">bindDrag(e)</label>
             <layout gutter="10" align-v="center">
                 <label>Form ID:</label>
                 <text v-model="fid" style="flex: 1; width: 0; height: 30px;"></text>
@@ -37,10 +37,9 @@
             <teleport to="#cg-pop-list">
                 <block ref="pop" data-cg-pop style="border: solid 1px #000; background: #FFF; width: 200px; height: 100px; display: flex; justify-content: center; align-items: center;">$refs.pop</block>
             </teleport>
-            <button @click="createParam" style="height: 30px;">create({'layout':'xxx'})</button>
             <button @click="createPath" style="height: 30px;">create('test')</button>
             <button @click="createTop" style="height: 30px;">create({'layout':'xxx','topMost':true})</button>
-            <label>Dialog result: {{dialogResult}}.</label>
+            <label>Dialog result: {{dr}}.</label>
             <button @click="dialog" style="height: 30px;">dialog('Hello world!')</button>
             <button @click="dialogLong">dialog('long...')</button>
             <button @click="dialogTitle" style="height: 30px;">dialog({'title':'Title','content':'Hello world!'})</button>
@@ -49,8 +48,8 @@
             <button @click="confirm(false)" style="height: 30px;">confirm('confirm')</button>
             <button @click="confirm(true)" style="height: 30px;">confirm({'content':'confirm','cancel':true})</button>
             <button @click="setTopMost" style="height: 30px;">setTopMost({{setTopMostValue ? 'false' : 'true'}})</button>
-            <button @click="flash" style="height: 30px;">flash()</button>
-            <button @click="hide" style="height: 30px;">hide() and show()</button>
+            <button @click="flash" style="height: 30px;">flash({{formId}})</button>
+            <button @click="hhide" style="height: 30px;">hide({{formId}}) and show({{formId}})</button>
         </layout>
     </overflow>
 </form>