@meta2d/core 1.0.43 → 1.0.45

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@meta2d/core",
-    "version": "1.0.43",
+    "version": "1.0.45",
     "description": "@meta2d/core: Powerful, Beautiful, Simple, Open - Web-Based 2D At Its Best .",
     "main": "index.js",
     "types": "index.d.ts",

package/src/canvas/canvas.js

@@ -84,7 +84,7 @@ var __values = (this && this.__values) || function(o) {
 import { KeydownType } from '../options';
 import { addLineAnchor, calcIconRect, calcTextRect, calcWorldAnchors, calcWorldRects, LockState, nearestAnchor, PenType, pushPenAnchor, removePenAnchor, renderPen, scalePen, translateLine, deleteTempAnchor, connectLine, disconnectLine, getAnchor, calcAnchorDock, calcMoveDock, calcTextLines, setNodeAnimate, setLineAnimate, calcPenRect, setChildrenActive, getParent, setHover, randomId, getPensLock, getToAnchor, getFromAnchor, calcPadding, getPensDisableRotate, getPensDisableResize, needCalcTextRectProps, calcResizeDock, needPatchFlagsPenRectProps, needCalcIconRectProps, isDomShapes, renderPenRaw, needSetPenProps, getAllChildren, calcInView, isShowChild, getTextColor, getGlobalColor, clearLifeCycle, rotatePen, calcTextAutoWidth, getGradientAnimatePath, CanvasLayer, ctxFlip, ctxRotate, setGlobalAlpha, drawImage, setElemPosition, } from '../pen';
 import { calcRotate, distance, getDistance, hitPoint, PointType, PrevNextType, rotatePoint, samePoint, scalePoint, translatePoint, TwoWay, } from '../point';
-import { calcCenter, calcRightBottom, calcRelativePoint, getRect, getRectOfPoints, pointInRect, pointInSimpleRect, rectInRect, rectToPoints, resizeRect, translateRect, } from '../rect';
+import { calcCenter, calcRightBottom, calcRelativePoint, getRect, getRectOfPoints, pointInRect, pointInSimpleRect, rectInRect, rectToPoints, resizeRect, translateRect, pointInPolygon } from '../rect';
 import { EditType, globalStore, } from '../store';
 import { deepClone, fileToBase64, uploadFile, formatPadding, rgba, s8, } from '../utils';
 import { inheritanceProps, defaultCursors, defaultDrawLineFns, HotkeyType, HoverType, MouseRight, rotatedCursors, } from '../data';
@@ -166,7 +166,7 @@ var Canvas = /** @class */ (function () {
             _this.cut();
         };
         this.onPaste = function (event) {
-            if (_this.store.options.disableClipboard) {
+            if (_this.store.data.locked || _this.store.options.disableClipboard) {
                 return;
             }
             if (event.target !== _this.externalElements &&
@@ -591,7 +591,7 @@ var Canvas = /** @class */ (function () {
                             _this.drawingLineName = _this.store.options.drawingLineName;
                         }
                     }
-                    if ((e.ctrlKey || e.metaKey) && (_this.store.options.disableClipboard ||
+                    if (!_this.store.data.locked && (e.ctrlKey || e.metaKey) && (_this.store.options.disableClipboard ||
                         (!_this.store.options.disableClipboard && e.altKey)) //alt按下，paste事件无效
                     ) {
                         _this.paste();
@@ -1192,7 +1192,7 @@ var Canvas = /** @class */ (function () {
             _this.render();
         };
         this.onMouseMove = function (e) {
-            var _a, _b, _c, _d, _e, _f;
+            var _a, _b, _c, _d, _e, _f, _g;
             if (_this.store.data.locked === LockState.Disable) {
                 _this.hoverType = HoverType.None;
                 return;
@@ -1249,6 +1249,9 @@ var Canvas = /** @class */ (function () {
                     if (!_this.drawingLineName && !_this.movingAnchor) {
                         // 在锚点上开始连线
                         if (_this.hoverType === HoverType.NodeAnchor) {
+                            if (!_this.store.hoverAnchor) {
+                                return;
+                            }
                             _this.drawingLineName = _this.store.options.drawingLineName;
                             var pt = {
                                 id: s8(),
@@ -1295,13 +1298,13 @@ var Canvas = /** @class */ (function () {
                         var pt = { x: e.x, y: e.y };
                         // Move line anchor
                         if (_this.hoverType === HoverType.LineAnchor) {
-                            if ((_this.dockInAnchor(e) || _this.store.active[0].lineName === 'line') &&
+                            if ((_this.dockInAnchor(e) || ((_b = _this.store.active[0]) === null || _b === void 0 ? void 0 : _b.lineName) === 'line') &&
                                 !_this.store.options.disableDock &&
                                 !_this.store.options.disableLineDock) {
                                 _this.clearDock();
                                 _this.dock = calcAnchorDock(_this.store, pt, _this.store.activeAnchor);
-                                ((_b = _this.dock) === null || _b === void 0 ? void 0 : _b.xDock) && (pt.x += _this.dock.xDock.step);
-                                ((_c = _this.dock) === null || _c === void 0 ? void 0 : _c.yDock) && (pt.y += _this.dock.yDock.step);
+                                ((_c = _this.dock) === null || _c === void 0 ? void 0 : _c.xDock) && (pt.x += _this.dock.xDock.step);
+                                ((_d = _this.dock) === null || _d === void 0 ? void 0 : _d.yDock) && (pt.y += _this.dock.yDock.step);
                             }
                             _this.moveLineAnchor(pt, e);
                             return;
@@ -1341,7 +1344,7 @@ var Canvas = /** @class */ (function () {
                         if (_this.store.active.length === 1) {
                             var activePen = _this.store.active[0];
                             if (activePen.locked < LockState.DisableMove) {
-                                (_d = activePen === null || activePen === void 0 ? void 0 : activePen.onMouseMove) === null || _d === void 0 ? void 0 : _d.call(activePen, activePen, _this.mousePos);
+                                (_e = activePen === null || activePen === void 0 ? void 0 : activePen.onMouseMove) === null || _e === void 0 ? void 0 : _e.call(activePen, activePen, _this.mousePos);
                             }
                         }
                         _this.movePens(e);
@@ -1366,8 +1369,8 @@ var Canvas = /** @class */ (function () {
                     !_this.store.options.disableLineDock) {
                     _this.clearDock();
                     _this.dock = calcAnchorDock(_this.store, pt);
-                    ((_e = _this.dock) === null || _e === void 0 ? void 0 : _e.xDock) && (pt.x += _this.dock.xDock.step);
-                    ((_f = _this.dock) === null || _f === void 0 ? void 0 : _f.yDock) && (pt.y += _this.dock.yDock.step);
+                    ((_f = _this.dock) === null || _f === void 0 ? void 0 : _f.xDock) && (pt.x += _this.dock.xDock.step);
+                    ((_g = _this.dock) === null || _g === void 0 ? void 0 : _g.yDock) && (pt.y += _this.dock.yDock.step);
                 }
                 if (_this.mouseDown &&
                     _this.drawingLineName === 'curve' &&
@@ -1593,7 +1596,7 @@ var Canvas = /** @class */ (function () {
                 var pens = _this.store.data.pens.filter(function (pen) {
                     if (pen.visible === false ||
                         pen.locked >= LockState.DisableMove ||
-                        pen.parentId) {
+                        pen.parentId || pen.isRuleLine) {
                         return false;
                     }
                     if (rectInRect(pen.calculative.worldRect, _this.dragRect, _this.store.options.dragAllIn)) {
@@ -1791,9 +1794,10 @@ var Canvas = /** @class */ (function () {
             (_b = (_a = _this.store.hover) === null || _a === void 0 ? void 0 : _a.onMouseMove) === null || _b === void 0 ? void 0 : _b.call(_a, _this.store.hover, _this.mousePos);
         };
         this.inPens = function (pt, pens) {
+            var _a;
             var hoverType = HoverType.None;
             var _loop_2 = function (i) {
-                var e_1, _a, e_2, _b;
+                var e_1, _b, e_2, _c;
                 var pen = pens[i];
                 if (pen.visible == false ||
                     pen.calculative.inView == false ||
@@ -1831,8 +1835,8 @@ var Canvas = /** @class */ (function () {
                 if (!_this.store.data.locked && _this.hotkeyType !== HotkeyType.Resize) {
                     if (pen.calculative.worldAnchors) {
                         try {
-                            for (var _c = (e_1 = void 0, __values(pen.calculative.worldAnchors)), _d = _c.next(); !_d.done; _d = _c.next()) {
-                                var anchor = _d.value;
+                            for (var _d = (e_1 = void 0, __values(pen.calculative.worldAnchors)), _e = _d.next(); !_e.done; _e = _d.next()) {
+                                var anchor = _e.value;
                                 hoverType = _this.inAnchor(pt, pen, anchor);
                                 if (hoverType) {
                                     //title显示
@@ -1846,7 +1850,7 @@ var Canvas = /** @class */ (function () {
                         catch (e_1_1) { e_1 = { error: e_1_1 }; }
                         finally {
                             try {
-                                if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
+                                if (_e && !_e.done && (_b = _d.return)) _b.call(_d);
                             }
                             finally { if (e_1) throw e_1.error; }
                         }
@@ -1854,6 +1858,13 @@ var Canvas = /** @class */ (function () {
                 }
                 // 图形
                 if (pen.type) {
+                    if (pen.isRuleLine) {
+                        var ruleH = ((_a = _this.store.options.ruleOptions) === null || _a === void 0 ? void 0 : _a.height) || 20;
+                        if (pt.x + _this.store.data.x > ruleH &&
+                            pt.y + _this.store.data.y > ruleH) {
+                            return "break";
+                        }
+                    }
                     var pos = pointInLine(pt, pen);
                     if (pos) {
                         if (!_this.store.data.locked && !pen.locked) {
@@ -1894,6 +1905,12 @@ var Canvas = /** @class */ (function () {
                         isIn = pointInRect(pt, pen.calculative.worldRect);
                     }
                     if (isIn) {
+                        if (pen.type === PenType.Node && pen.name === 'line') {
+                            var pIn = pointInPolygon(pt, pen.calculative.worldAnchors);
+                            if (!pIn) {
+                                return "continue";
+                            }
+                        }
                         if (!_this.store.data.locked && !pen.locked) {
                             if (_this.hotkeyType === HotkeyType.AddAnchor) {
                                 _this.externalElements.style.cursor = 'pointer';
@@ -1911,7 +1928,7 @@ var Canvas = /** @class */ (function () {
                         _this.store.pointAt = pt;
                         // 锚点贴边吸附
                         if (!pt.ctrlKey) {
-                            var _e = _this.store.hover.calculative.worldRect, x = _e.x, y = _e.y, ex = _e.ex, ey = _e.ey, rotate_1 = _e.rotate, center_1 = _e.center;
+                            var _f = _this.store.hover.calculative.worldRect, x = _f.x, y = _f.y, ex = _f.ex, ey = _f.ey, rotate_1 = _f.rotate, center_1 = _f.center;
                             if (rotate_1) {
                                 var pts = [
                                     { x: x, y: y },
@@ -1939,7 +1956,7 @@ var Canvas = /** @class */ (function () {
                                 catch (e_2_1) { e_2 = { error: e_2_1 }; }
                                 finally {
                                     try {
-                                        if (pts_1_1 && !pts_1_1.done && (_b = pts_1.return)) _b.call(pts_1);
+                                        if (pts_1_1 && !pts_1_1.done && (_c = pts_1.return)) _c.call(pts_1);
                                     }
                                     finally { if (e_2) throw e_2.error; }
                                 }
@@ -3846,6 +3863,9 @@ var Canvas = /** @class */ (function () {
                     if (this.store.hover) {
                         this.store.hoverAnchor =
                             this.store.hover.calculative.worldAnchors.find(function (a) { return a.id === anchor.anchorId; });
+                        if (!this.store.hoverAnchor) {
+                            return HoverType.None;
+                        }
                         this.externalElements.style.cursor = 'crosshair';
                         return HoverType.NodeAnchor;
                     }
@@ -5641,6 +5661,9 @@ var Canvas = /** @class */ (function () {
                 if (!_this.store.options.moveConnectedLine && !_this.canMoveLine) {
                     return;
                 }
+                if (pen.isRuleLine) {
+                    return;
+                }
                 translateLine(pen, x, y);
                 _this.checkDisconnect(pen, containChildPens);
                 _this.store.path2dMap.set(pen, globalStore.path2dDraws[pen.name](pen));
@@ -5808,6 +5831,10 @@ var Canvas = /** @class */ (function () {
             }
             this.updatePenRect(pen, { worldRectIsReady: true });
             this.updateLines(pen);
+            if (pen.image && pen.name !== 'gif') {
+                this.canvasImage.init();
+                this.canvasImageBottom.init();
+            }
             if (pen.calculative.text !== pen.text) {
                 pen.calculative.text = pen.text;
                 calcTextLines(pen);
@@ -6691,6 +6718,9 @@ var Canvas = /** @class */ (function () {
                 }
             }
         };
+        this.inputDiv.onblur = function () {
+            _this.hideInput();
+        };
         this.inputDiv.oninput = function (e) {
             // //无文本时，光标确保居中
             if (navigator.userAgent.includes('Firefox')) {
@@ -6831,7 +6861,7 @@ var Canvas = /** @class */ (function () {
         }
     };
     Canvas.prototype.updateValue = function (pen, data) {
-        var _a, _b, _c, _d, _e;
+        var _a, _b, _c, _d, _e, _f;
         var penRect = this.getPenRect(pen);
         var oldName = pen.name;
         Object.assign(pen, data);
@@ -6972,9 +7002,9 @@ var Canvas = /** @class */ (function () {
                 this.canvasImage.init();
             }
         }
-        else {
-            this.initImageCanvas([pen]);
-        }
+        // else {
+        //   this.initImageCanvas([pen]);
+        // }
         // if (data.template !== undefined || pen.template) {
         //   this.initTemplateCanvas([pen]);
         // }
@@ -6983,7 +7013,7 @@ var Canvas = /** @class */ (function () {
             this.initTemplateCanvas([pen]);
         }
         if (data.zIndex !== undefined) {
-            pen.calculative.singleton.div &&
+            ((_f = pen.calculative.singleton) === null || _f === void 0 ? void 0 : _f.div) &&
                 setElemPosition(pen, pen.calculative.singleton.div);
         }
     };