@meta2d/core 1.0.23 → 1.0.25

package/src/core.js

@@ -83,7 +83,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 };
 import { commonAnchors, commonPens, cube } from './diagrams';
 import { Canvas } from './canvas';
-import { calcInView, calcTextDrawRect, calcTextLines, calcTextRect, facePen, formatAttrs, getAllChildren, getFromAnchor, getParent, getToAnchor, getWords, LockState, PenType, renderPenRaw, setElemPosition, connectLine, nearestAnchor, setChildValue, isAncestor, } from './pen';
+import { calcInView, calcTextDrawRect, calcTextLines, calcTextRect, facePen, formatAttrs, getAllChildren, getFromAnchor, getParent, getToAnchor, getWords, LockState, PenType, renderPenRaw, setElemPosition, connectLine, nearestAnchor, setChildValue, isAncestor, isShowChild, } from './pen';
 import { rotatePoint } from './point';
 import { clearStore, EditType, globalStore, register, registerAnchors, registerCanvasDraw, useStore, } from './store';
 import { formatPadding, loadCss, s8, valueInArray, valueInRange, } from './utils';
@@ -95,6 +95,7 @@ import * as mqtt from 'mqtt/dist/mqtt.min.js';
 import pkg from '../package.json';
 import { lockedError } from './utils/error';
 import { Scroll } from './scroll';
+import { getter } from './utils/object';
 var Meta2d = /** @class */ (function () {
     function Meta2d(parent, opts) {
         var _this = this;
@@ -168,6 +169,13 @@ var Meta2d = /** @class */ (function () {
                     _this.onSizeUpdate();
                     break;
             }
+            if (_this.store.messageEvents[eventName]) {
+                _this.store.messageEvents[eventName].forEach(function (item) {
+                    item.event.actions.forEach(function (action) {
+                        _this.events[action.action](item.pen, action);
+                    });
+                });
+            }
         };
         this.doEvent = function (pen, eventName) {
             var _a, _b;
@@ -548,7 +556,7 @@ var Meta2d = /** @class */ (function () {
         this.events[EventAction.SendData] = function (pen, e) {
             var value = deepClone(e.value);
             if (value && typeof value === 'object') {
-                if (e.targetType === 'action') {
+                if (e.targetType === 'id') {
                     var _pen = e.params ? _this.findOne(e.params) : pen;
                     for (var key in value) {
                         if (!value[key]) {
@@ -604,18 +612,34 @@ var Meta2d = /** @class */ (function () {
     };
     Meta2d.prototype.sendDataToNetWork = function (value, network) {
         return __awaiter(this, void 0, void 0, function () {
-            var res, clients_1, mqttClient_1, websockets, websocket_1;
+            var i, keys, params, res, clients_1, mqttClient_1, websockets, websocket_1;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
                         if (!network.url) {
                             return [2 /*return*/];
                         }
-                        if (!(network.type === 'http')) return [3 /*break*/, 2];
-                        return [4 /*yield*/, fetch(network.url, {
-                                headers: network.headers,
+                        if (!(network.protocol === 'http')) return [3 /*break*/, 2];
+                        if (typeof network.headers === 'object') {
+                            for (i in network.headers) {
+                                keys = network.headers[i].match(/(?<=\$\{).*?(?=\})/g);
+                                if (keys) {
+                                    network.headers[i] = network.headers[i].replace("${" + keys[0] + "}", this.getDynamicParam(keys[0]));
+                                }
+                            }
+                        }
+                        params = undefined;
+                        if (network.method === 'GET') {
+                            params =
+                                '?' +
+                                    Object.keys(value)
+                                        .map(function (key) { return key + '=' + value[key]; })
+                                        .join('&');
+                        }
+                        return [4 /*yield*/, fetch(network.url + (params ? params : ''), {
+                                headers: network.headers || {},
                                 method: network.method,
-                                body: value,
+                                body: network.method === 'POST' ? JSON.stringify(value) : undefined,
                             })];
                     case 1:
                         res = _a.sent();
@@ -624,7 +648,7 @@ var Meta2d = /** @class */ (function () {
                         }
                         return [3 /*break*/, 3];
                     case 2:
-                        if (network.type === 'mqtt') {
+                        if (network.protocol === 'mqtt') {
                             clients_1 = this.mqttClients.filter(function (client) { return client.options.href === network.url; });
                             if (clients_1 && clients_1.length) {
                                 if (clients_1[0].connected) {
@@ -644,7 +668,7 @@ var Meta2d = /** @class */ (function () {
                                 });
                             }
                         }
-                        else if (network.type === 'websocket') {
+                        else if (network.protocol === 'websocket') {
                             websockets = this.websockets.filter(function (socket) { return socket.url === network.url; });
                             if (websockets && websockets.length) {
                                 if (websockets[0].readyState === 1) {
@@ -831,11 +855,17 @@ var Meta2d = /** @class */ (function () {
                 finally { if (e_3) throw e_3.error; }
             }
         }
+        this.canvas.patchFlagsLines.forEach(function (pen) {
+            if (pen.type) {
+                _this.canvas.initLineRect(pen);
+            }
+        });
         if (!render) {
             this.canvas.opening = true;
         }
         this.initBindDatas();
         this.initBinds();
+        this.initMessageEvents();
         this.render();
         this.listenSocket();
         this.connectSocket();
@@ -1002,6 +1032,9 @@ var Meta2d = /** @class */ (function () {
                 pen.onMove && pen.onMove(pen);
             }
         });
+        if (lock > 0) {
+            this.initMessageEvents();
+        }
     };
     // end  - 当前鼠标位置，是否作为终点
     Meta2d.prototype.finishDrawLine = function (end) {
@@ -1111,6 +1144,10 @@ var Meta2d = /** @class */ (function () {
         clearStore(this.store);
         this.hideInput();
         this.canvas.tooltip.hide();
+        if (this.map && this.map.isShow) {
+            this.map.show();
+            this.map.setView();
+        }
         this.canvas.clearCanvas();
         sessionStorage.removeItem('page');
         this.store.clipboard = undefined;
@@ -1645,7 +1682,9 @@ var Meta2d = /** @class */ (function () {
                         return __generator(this, function (_a) {
                             switch (_a.label) {
                                 case 0: return [4 /*yield*/, fetch(item.http, {
+                                        method: item.method || 'GET',
                                         headers: item.httpHeaders,
+                                        body: item.method === 'POST' ? JSON.stringify(item.body) : undefined,
                                     })];
                                 case 1:
                                     res = _a.sent();
@@ -1931,6 +1970,28 @@ var Meta2d = /** @class */ (function () {
             }
         }
     };
+    //获取动态参数
+    Meta2d.prototype.getDynamicParam = function (key) {
+        function queryURLParams() {
+            var url = window.location.href.split('?')[1];
+            var urlSearchParams = new URLSearchParams(url);
+            var params = Object.fromEntries(urlSearchParams.entries());
+            return params;
+        }
+        function getCookie(name) {
+            var arr;
+            var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)');
+            if ((arr = document.cookie.match(reg))) {
+                return decodeURIComponent(arr[2]);
+            }
+            else {
+                return '';
+            }
+        }
+        var params = queryURLParams();
+        var value = params[key] || localStorage[key] || getCookie(key) || '';
+        return value;
+    };
     Meta2d.prototype.onNetworkConnect = function (https) {
         var _this = this;
         var enable = this.store.data.enableMock;
@@ -1944,15 +2005,31 @@ var Meta2d = /** @class */ (function () {
                     _this.penMock(pen);
                 });
             https.forEach(function (item) { return __awaiter(_this, void 0, void 0, function () {
-                var res, data;
+                var i, keys, i, keys, res, data;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0:
                             if (!item.url) return [3 /*break*/, 3];
+                            if (typeof item.headers === 'object') {
+                                for (i in item.headers) {
+                                    keys = item.headers[i].match(/(?<=\$\{).*?(?=\})/g);
+                                    if (keys) {
+                                        item.headers[i] = item.headers[i].replace("${" + keys[0] + "}", this.getDynamicParam(keys[0]));
+                                    }
+                                }
+                            }
+                            if (typeof item.body === 'object') {
+                                for (i in item.body) {
+                                    keys = item.body[i].match(/(?<=\$\{).*?(?=\})/g);
+                                    if (keys) {
+                                        item.body[i] = item.body[i].replace("${" + keys[0] + "}", this.getDynamicParam(keys[0]));
+                                    }
+                                }
+                            }
                             return [4 /*yield*/, fetch(item.url, {
                                     headers: item.headers,
                                     method: item.method,
-                                    body: item.method === 'GET' ? undefined : item.body,
+                                    body: item.method === 'GET' ? undefined : JSON.stringify(item.body),
                                 })];
                         case 1:
                             res = _a.sent();
@@ -2016,6 +2093,9 @@ var Meta2d = /** @class */ (function () {
         if (!Array.isArray(data)) {
             data = [data];
         }
+        if (!data.length) {
+            return;
+        }
         if (data[0].dataId) {
             this.setDatas(data);
         }
@@ -2219,6 +2299,23 @@ var Meta2d = /** @class */ (function () {
     Meta2d.prototype.clearDropdownList = function () {
         this.canvas.clearDropdownList();
     };
+    Meta2d.prototype.initMessageEvents = function () {
+        var _this = this;
+        this.store.data.pens.forEach(function (pen) {
+            var _a;
+            (_a = pen.events) === null || _a === void 0 ? void 0 : _a.forEach(function (event) {
+                if (event.name === 'message' && event.message) {
+                    if (!_this.store.messageEvents[event.message]) {
+                        _this.store.messageEvents[event.message] = [];
+                    }
+                    _this.store.messageEvents[event.message].push({
+                        pen: pen,
+                        event: event,
+                    });
+                }
+            });
+        });
+    };
     Meta2d.prototype.judgeCondition = function (pen, key, condition) {
         var type = condition.type, target = condition.target, fnJs = condition.fnJs, fn = condition.fn, operator = condition.operator, valueType = condition.valueType;
         var can = false;
@@ -2245,37 +2342,38 @@ var Meta2d = /** @class */ (function () {
             if (valueType === 'prop') {
                 value = this.store.pens[target][condition.value];
             }
+            var compareValue = getter(pen, key);
             switch (operator) {
                 case '>':
-                    can = pen[key] > +value;
+                    can = compareValue > +value;
                     break;
                 case '>=':
-                    can = pen[key] >= +value;
+                    can = compareValue >= +value;
                     break;
                 case '<':
-                    can = pen[key] < +value;
+                    can = compareValue < +value;
                     break;
                 case '<=':
-                    can = pen[key] <= +value;
+                    can = compareValue <= +value;
                     break;
                 case '=':
                 case '==':
-                    can = pen[key] == value;
+                    can = compareValue == value;
                     break;
                 case '!=':
-                    can = pen[key] != value;
+                    can = compareValue != value;
                     break;
                 case '[)':
-                    can = valueInRange(+pen[key], value);
+                    can = valueInRange(+compareValue, value);
                     break;
                 case '![)':
-                    can = !valueInRange(+pen[key], value);
+                    can = !valueInRange(+compareValue, value);
                     break;
                 case '[]':
-                    can = valueInArray(+pen[key], value);
+                    can = valueInArray(+compareValue, value);
                     break;
                 case '![]':
-                    can = !valueInArray(+pen[key], value);
+                    can = !valueInArray(+compareValue, value);
                     break;
             }
         }
@@ -2338,6 +2436,9 @@ var Meta2d = /** @class */ (function () {
         if (containBkImg === void 0) { containBkImg = false; }
         return this.canvas.toPng(padding, callback, containBkImg);
     };
+    Meta2d.prototype.activeToPng = function (padding) {
+        return this.canvas.activeToPng(padding);
+    };
     /**
      * 下载 png
      * @param name 传入参数自带文件后缀名 例如：'test.png'
@@ -2372,6 +2473,53 @@ var Meta2d = /** @class */ (function () {
             a.dispatchEvent(evt);
         });
     };
+    Meta2d.prototype.downloadSvg = function () {
+        var e_7, _a;
+        if (!window.C2S) {
+            console.error('请先加载乐吾乐官网下的canvas2svg.js', 'https://assets.le5lecdn.com/2d/canvas2svg.js');
+            throw new Error('请先加载乐吾乐官网下的canvas2svg.js');
+        }
+        var rect = this.getRect();
+        rect.x -= 10;
+        rect.y -= 10;
+        var ctx = new window.C2S(rect.width + 20, rect.height + 20);
+        ctx.textBaseline = 'middle';
+        try {
+            for (var _b = __values(this.store.data.pens), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var pen = _c.value;
+                if (pen.visible == false || !isShowChild(pen, this.store)) {
+                    continue;
+                }
+                renderPenRaw(ctx, pen, rect);
+            }
+        }
+        catch (e_7_1) { e_7 = { error: e_7_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_7) throw e_7.error; }
+        }
+        var mySerializedSVG = ctx.getSerializedSvg();
+        if (this.store.data.background) {
+            mySerializedSVG = mySerializedSVG.replace('{{bk}}', '');
+            mySerializedSVG = mySerializedSVG.replace('{{bkRect}}', "<rect x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" fill=\"" + this.store.data.background + "\"></rect>");
+        }
+        else {
+            mySerializedSVG = mySerializedSVG.replace('{{bk}}', '');
+            mySerializedSVG = mySerializedSVG.replace('{{bkRect}}', '');
+        }
+        mySerializedSVG = mySerializedSVG.replace(/--le5le--/g, '&#x');
+        var urlObject = window.URL;
+        var export_blob = new Blob([mySerializedSVG]);
+        var url = urlObject.createObjectURL(export_blob);
+        var a = document.createElement('a');
+        a.setAttribute('download', (this.store.data.name || 'le5le.meta2d') + ".svg");
+        a.setAttribute('href', url);
+        var evt = document.createEvent('MouseEvents');
+        evt.initEvent('click', true, true);
+        a.dispatchEvent(evt);
+    };
     Meta2d.prototype.getRect = function (pens) {
         if (pens === void 0) { pens = this.store.data.pens; }
         return getRect(pens);
@@ -2429,12 +2577,20 @@ var Meta2d = /** @class */ (function () {
         var w = (width - padding[1] - padding[3]) / _width;
         var h = (height - padding[0] - padding[2]) / _height;
         var ratio = w;
-        if (fit) {
-            // 完整显示取小的
-            ratio = w > h ? h : w;
+        if (fit === 'width') {
+            ratio = w;
+        }
+        else if (fit === 'height') {
+            ratio = h;
         }
         else {
-            ratio = w > h ? w : h;
+            if (fit) {
+                // 完整显示取小的
+                ratio = w > h ? h : w;
+            }
+            else {
+                ratio = w > h ? w : h;
+            }
         }
         // 该方法直接更改画布的 scale 属性，所以比率应该乘以当前 scale
         this.scale(ratio * this.store.data.scale);
@@ -2689,7 +2845,7 @@ var Meta2d = /** @class */ (function () {
         this.formatPainter();
     };
     Meta2d.prototype.alignNodes = function (align, pens, rect) {
-        var e_7, _a;
+        var e_8, _a;
         if (pens === void 0) { pens = this.store.data.pens; }
         !rect && (rect = this.getPenRect(this.getRect(pens)));
         var initPens = deepClone(pens); // 原 pens ，深拷贝一下
@@ -2699,12 +2855,12 @@ var Meta2d = /** @class */ (function () {
                 this.alignPen(align, item, rect);
             }
         }
-        catch (e_7_1) { e_7 = { error: e_7_1 }; }
+        catch (e_8_1) { e_8 = { error: e_8_1 }; }
         finally {
             try {
                 if (pens_1_1 && !pens_1_1.done && (_a = pens_1.return)) _a.call(pens_1);
             }
-            finally { if (e_7) throw e_7.error; }
+            finally { if (e_8) throw e_8.error; }
         }
         this.render();
         this.pushHistory({
@@ -2793,7 +2949,7 @@ var Meta2d = /** @class */ (function () {
      * @param distance 总的宽 or 高
      */
     Meta2d.prototype.spaceBetweenByDirection = function (direction, pens, distance) {
-        var e_8, _a;
+        var e_9, _a;
         var _this = this;
         if (pens === void 0) { pens = this.store.data.pens; }
         !distance && (distance = this.getPenRect(this.getRect(pens))[direction]);
@@ -2827,12 +2983,12 @@ var Meta2d = /** @class */ (function () {
                 this.setValue(__assign({ id: pen.id }, penRect), { render: false, doEvent: false });
             }
         }
-        catch (e_8_1) { e_8 = { error: e_8_1 }; }
+        catch (e_9_1) { e_9 = { error: e_9_1 }; }
         finally {
             try {
                 if (pens_2_1 && !pens_2_1.done && (_a = pens_2.return)) _a.call(pens_2);
             }
-            finally { if (e_8) throw e_8.error; }
+            finally { if (e_9) throw e_9.error; }
         }
         this.render();
         this.pushHistory({
@@ -2949,7 +3105,7 @@ var Meta2d = /** @class */ (function () {
      * @param pens pen 置顶的画笔
      */
     Meta2d.prototype.top = function (pens) {
-        var e_9, _a;
+        var e_10, _a;
         var _this = this;
         if (!pens)
             pens = this.store.active;
@@ -2977,12 +3133,12 @@ var Meta2d = /** @class */ (function () {
                 _loop_3(pen);
             }
         }
-        catch (e_9_1) { e_9 = { error: e_9_1 }; }
+        catch (e_10_1) { e_10 = { error: e_10_1 }; }
         finally {
             try {
                 if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
             }
-            finally { if (e_9) throw e_9.error; }
+            finally { if (e_10) throw e_10.error; }
         }
     };
     /**
@@ -2998,7 +3154,7 @@ var Meta2d = /** @class */ (function () {
      * @param pens 画笔们，注意 pen 必须在该数组内才有效
      */
     Meta2d.prototype.bottom = function (pens) {
-        var e_10, _a;
+        var e_11, _a;
         if (!pens)
             pens = this.store.active;
         if (!Array.isArray(pens))
@@ -3029,12 +3185,12 @@ var Meta2d = /** @class */ (function () {
                 _loop_4(pen);
             }
         }
-        catch (e_10_1) { e_10 = { error: e_10_1 }; }
+        catch (e_11_1) { e_11 = { error: e_11_1 }; }
         finally {
             try {
                 if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
             }
-            finally { if (e_10) throw e_10.error; }
+            finally { if (e_11) throw e_11.error; }
         }
     };
     /**
@@ -3043,7 +3199,7 @@ var Meta2d = /** @class */ (function () {
      * @param pen 画笔
      */
     Meta2d.prototype.upByArea = function (pen) {
-        var _a, e_11, _b;
+        var _a, e_12, _b;
         var _this = this;
         var index = this.store.data.pens.findIndex(function (p) { return p.id === pen.id; });
         if (index === -1) {
@@ -3093,12 +3249,12 @@ var Meta2d = /** @class */ (function () {
                 _loop_6(pen_2);
             }
         }
-        catch (e_11_1) { e_11 = { error: e_11_1 }; }
+        catch (e_12_1) { e_12 = { error: e_12_1 }; }
         finally {
             try {
                 if (allPens_1_1 && !allPens_1_1.done && (_b = allPens_1.return)) _b.call(allPens_1);
             }
-            finally { if (e_11) throw e_11.error; }
+            finally { if (e_12) throw e_12.error; }
         }
         this.initImageCanvas([pen]);
     };
@@ -3139,7 +3295,7 @@ var Meta2d = /** @class */ (function () {
      * @param pens 画笔
      */
     Meta2d.prototype.up = function (pens) {
-        var e_12, _a;
+        var e_13, _a;
         var _this = this;
         if (!pens)
             pens = this.store.active;
@@ -3192,12 +3348,12 @@ var Meta2d = /** @class */ (function () {
                 _loop_7(pen);
             }
         }
-        catch (e_12_1) { e_12 = { error: e_12_1 }; }
+        catch (e_13_1) { e_13 = { error: e_13_1 }; }
         finally {
             try {
                 if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
             }
-            finally { if (e_12) throw e_12.error; }
+            finally { if (e_13) throw e_13.error; }
         }
     };
     /**
@@ -3205,7 +3361,7 @@ var Meta2d = /** @class */ (function () {
      * @param pen 画笔
      */
     Meta2d.prototype.down = function (pens) {
-        var e_13, _a;
+        var e_14, _a;
         var _this = this;
         if (!pens)
             pens = this.store.active;
@@ -3260,12 +3416,12 @@ var Meta2d = /** @class */ (function () {
                 _loop_9(pen);
             }
         }
-        catch (e_13_1) { e_13 = { error: e_13_1 }; }
+        catch (e_14_1) { e_14 = { error: e_14_1 }; }
         finally {
             try {
                 if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
             }
-            finally { if (e_13) throw e_13.error; }
+            finally { if (e_14) throw e_14.error; }
         }
     };
     Meta2d.prototype.setLayer = function (pen, toIndex, pens) {
@@ -3340,7 +3496,7 @@ var Meta2d = /** @class */ (function () {
             var nextNodes_1 = [];
             // 2. 遍历出线的 nextNode
             lines.forEach(function (line) {
-                var e_14, _a;
+                var e_15, _a;
                 var lineNextNode = _this.nextNode(line);
                 var _loop_11 = function (node) {
                     var have = nextNodes_1.find(function (next) { return next.id === node.id; });
@@ -3353,12 +3509,12 @@ var Meta2d = /** @class */ (function () {
                         _loop_11(node);
                     }
                 }
-                catch (e_14_1) { e_14 = { error: e_14_1 }; }
+                catch (e_15_1) { e_15 = { error: e_15_1 }; }
                 finally {
                     try {
                         if (lineNextNode_1_1 && !lineNextNode_1_1.done && (_a = lineNextNode_1.return)) _a.call(lineNextNode_1);
                     }
-                    finally { if (e_14) throw e_14.error; }
+                    finally { if (e_15) throw e_15.error; }
                 }
             });
             return nextNodes_1;
@@ -3381,7 +3537,7 @@ var Meta2d = /** @class */ (function () {
             var preNodes_1 = [];
             // 2. 遍历入线的 preNode
             lines.forEach(function (line) {
-                var e_15, _a;
+                var e_16, _a;
                 var linePreNode = _this.previousNode(line);
                 var _loop_12 = function (node) {
                     var have = preNodes_1.find(function (pre) { return pre.id === node.id; });
@@ -3394,12 +3550,12 @@ var Meta2d = /** @class */ (function () {
                         _loop_12(node);
                     }
                 }
-                catch (e_15_1) { e_15 = { error: e_15_1 }; }
+                catch (e_16_1) { e_16 = { error: e_16_1 }; }
                 finally {
                     try {
                         if (linePreNode_1_1 && !linePreNode_1_1.done && (_a = linePreNode_1.return)) _a.call(linePreNode_1);
                     }
-                    finally { if (e_15) throw e_15.error; }
+                    finally { if (e_16) throw e_16.error; }
                 }
             });
             return preNodes_1;
@@ -3675,7 +3831,7 @@ var Meta2d = /** @class */ (function () {
             : deepClone(__spreadArray([parent], __read(components), false));
     };
     Meta2d.prototype.setVisible = function (pen, visible, render) {
-        var e_16, _a;
+        var e_17, _a;
         if (render === void 0) { render = true; }
         this.onSizeUpdate();
         this.setValue({ id: pen.id, visible: visible }, { render: false, doEvent: false });
@@ -3687,12 +3843,12 @@ var Meta2d = /** @class */ (function () {
                     child && this.setVisible(child, visible, false);
                 }
             }
-            catch (e_16_1) { e_16 = { error: e_16_1 }; }
+            catch (e_17_1) { e_17 = { error: e_17_1 }; }
             finally {
                 try {
                     if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                 }
-                finally { if (e_16) throw e_16.error; }
+                finally { if (e_17) throw e_17.error; }
             }
         }
         render && this.render();