leafer-game 2.2.9 → 2.2.11

package/dist/web.js

@@ -4327,37 +4327,39 @@ var LeaferUI = function(exports) {
             if (oldValue === 0 || value === 0) doBoundsType(leaf);
         }
     }
+    function sortParentChange(parent) {
+        parent.__layout.childrenSortChange();
+        if (parent.__.flow) parent.__layout.boxChange();
+    }
     function sortType(defaultValue) {
         return decorateLeafAttr(defaultValue, key => attr({
             set(value) {
                 if (this.__setAttr(key, value)) {
-                    this.waitParent(() => {
-                        const {parent: parent} = this;
-                        parent.__layout.childrenSortChange();
-                        if (parent.__.flow) parent.__layout.boxChange();
-                    });
+                    this.waitParentChange(sortParentChange);
                 }
             }
         }));
     }
+    function maskParentChange(parent) {
+        parent.__updateMask();
+    }
     function maskType(defaultValue, updateSelf) {
         return decorateLeafAttr(defaultValue, key => attr({
             set(value) {
                 if (this.__setAttr(key, value)) {
                     this.__layout.boxChanged || this.__layout.boxChange();
-                    updateSelf ? this.__updateMask() : this.waitParent(() => {
-                        this.parent.__updateMask(value);
-                    });
+                    updateSelf ? this.__updateMask() : this.waitParentChange(maskParentChange);
                 }
             }
         }));
     }
+    function eraserParentChange(parent) {
+        parent.__updateEraser();
+    }
     function eraserType(defaultValue) {
         return decorateLeafAttr(defaultValue, key => attr({
             set(value) {
-                this.__setAttr(key, value) && this.waitParent(() => {
-                    this.parent.__updateEraser(value);
-                });
+                this.__setAttr(key, value) && this.waitParentChange(eraserParentChange);
             }
         }));
     }
@@ -6063,6 +6065,11 @@ var LeaferUI = function(exports) {
             this.__hasMask = this.__hasEraser = null;
             this.forceUpdate();
         }
+        waitParentChange(item) {
+            this.__parentChange || (this.__parentChange = []);
+            if (!this.__parentChange.includes(item)) this.__parentChange.push(item);
+            if (this.parent) item(this.parent, this);
+        }
         waitParent(item, bind) {
             if (bind) item = item.bind(bind);
             this.parent ? item() : this.on(ChildEvent.ADD, item, "once");
@@ -6150,8 +6157,8 @@ var LeaferUI = function(exports) {
         __extraUpdate() {
             if (this.leaferIsReady) this.leafer.layouter.addExtra(this);
         }
-        __updateEraser(value) {
-            this.__hasEraser = value ? true : this.children.some(item => item.__.eraser);
+        __updateEraser() {
+            this.__hasEraser = this.children.some(item => item.__.eraser);
         }
         __renderEraser(canvas, options) {
             canvas.save();
@@ -6160,7 +6167,7 @@ var LeaferUI = function(exports) {
             canvas.clearRect(r.x, r.y, r.width, r.height);
             canvas.restore();
         }
-        __updateMask(_value) {
+        __updateMask() {
             const hasMask = this.children.some(item => item.__.mask && item.__.visible && item.__.opacity);
             this.__hasMask = this.__.maskskip ? hasMask && 0 : hasMask;
         }
@@ -6408,6 +6415,7 @@ var LeaferUI = function(exports) {
             const childLayout = child.__layout;
             childLayout.boxChanged || childLayout.boxChange();
             childLayout.matrixChanged || childLayout.matrixChange();
+            if (child.__parentChange) child.__parentChange.forEach(item => item(this, child));
             if (child.__bubbleMap) child.__emitLifeEvent(ChildEvent.ADD);
             if (this.isFrame) child.__bindFrame(this);
             if (this.leafer) {
@@ -6626,7 +6634,7 @@ var LeaferUI = function(exports) {
             this.levelMap = null;
         }
     }
-    const version = "2.2.9";
+    const version = "2.2.11";
     const debug$5 = Debug.get("LeaferCanvas");
     class LeaferCanvas extends LeaferCanvasBase {
         set zIndex(zIndex) {
@@ -8285,7 +8293,7 @@ var LeaferUI = function(exports) {
         getPath(curve, pathForRender) {
             this.__layout.update();
             let path = pathForRender ? this.__.__pathForRender : this.__.path;
-            if (!path) pen.set(path = []), this.__drawPathByBox(pen, !pathForRender);
+            if (!path) pen.set(path = []), this.__drawPathByBox(pen, "box", !pathForRender);
             return curve ? PathConvert.toCanvasData(path, true) : path;
         }
         getPathString(curve, pathForRender, floatLength) {
@@ -8323,10 +8331,10 @@ var LeaferUI = function(exports) {
             data.__usePointsMode ? PathDrawer.drawPathByPoints(canvas, data.points, data.closed) : this.__drawPathByData(canvas, data.path, true);
         }
         __drawPathByData(drawer, data, ignoreCornerRadius) {
-            data ? PathDrawer.drawPathByData(drawer, data) : this.__drawPathByBox(drawer, ignoreCornerRadius);
+            data ? PathDrawer.drawPathByData(drawer, data) : this.__drawPathByBox(drawer, "box", ignoreCornerRadius);
         }
-        __drawPathByBox(drawer, ignoreCornerRadius) {
-            const {x: x, y: y, width: width, height: height} = this.__layout.boxBounds;
+        __drawPathByBox(drawer, boundsType = "box", ignoreCornerRadius) {
+            const {x: x, y: y, width: width, height: height} = this.__layout[boundsType + "Bounds"];
             if (this.__.cornerRadius && !ignoreCornerRadius) {
                 const {cornerRadius: cornerRadius} = this.__;
                 drawer.roundRect(x, y, width, height, isNumber(cornerRadius) ? [ cornerRadius ] : cornerRadius);
@@ -9246,14 +9254,15 @@ var LeaferUI = function(exports) {
         }
         __updateTextDrawData() {
             const data = this.__;
-            const {lineHeight: lineHeight, letterSpacing: letterSpacing, fontFamily: fontFamily, fontSize: fontSize, fontWeight: fontWeight, italic: italic, textCase: textCase, textOverflow: textOverflow, padding: padding, width: width, height: height} = data;
+            const {lineHeight: lineHeight, letterSpacing: letterSpacing, wordSpacing: wordSpacing, fontFamily: fontFamily, fontSize: fontSize, fontWeight: fontWeight, italic: italic, textCase: textCase, textOverflow: textOverflow, padding: padding, width: width, height: height} = data;
             data.__lineHeight = UnitConvert.number(lineHeight, fontSize);
             data.__letterSpacing = UnitConvert.number(letterSpacing, fontSize);
+            data.__wordSpacing = UnitConvert.number(wordSpacing, fontSize);
             data.__baseLine = data.__lineHeight - (data.__lineHeight - fontSize * .7) / 2;
             data.__font = `${italic ? "italic " : ""}${textCase === "small-caps" ? "small-caps " : ""}${fontWeight !== "normal" ? fontWeight + " " : ""}${fontSize || 12}px ${fontFamily || "caption"}`;
             stintSet$1(data, "__padding", padding && MathHelper.fourNumber(padding));
             stintSet$1(data, "__clipText", textOverflow !== "show" && !data.__autoSize);
-            stintSet$1(data, "__isCharMode", width || height || data.__letterSpacing || data.motionText || textCase !== "none");
+            stintSet$1(data, "__isCharMode", width || height || data.__letterSpacing || data.__wordSpacing || data.motionText || textCase !== "none");
             data.__textDrawData = TextConvert.getDrawData((data.__isPlacehold = data.placeholder && data.text === "") ? data.placeholder : data.text, this.__);
         }
         __updateBoxBounds() {
@@ -9333,6 +9342,7 @@ var LeaferUI = function(exports) {
     __decorate([ boundsType("none") ], exports.Text.prototype, "textCase", void 0);
     __decorate([ boundsType("none") ], exports.Text.prototype, "textDecoration", void 0);
     __decorate([ boundsType(0) ], exports.Text.prototype, "letterSpacing", void 0);
+    __decorate([ boundsType(0) ], exports.Text.prototype, "wordSpacing", void 0);
     __decorate([ boundsType({
         type: "percent",
         value: 1.5
@@ -11143,7 +11153,7 @@ var LeaferUI = function(exports) {
                     if (scaleX !== 1) canvas.scale(scaleX, scaleY);
                 }
                 if (originPaint.blendMode) canvas.blendMode = originPaint.blendMode;
-                fillPathOrText(ui, canvas, renderOptions);
+                fillPathOrText(ui, canvas, renderOptions, true);
                 canvas.restore();
             } else {
                 if (originPaint.blendMode) {
@@ -11154,24 +11164,45 @@ var LeaferUI = function(exports) {
             }
         }
     }
-    function fillPathOrText(ui, canvas, renderOptions) {
-        ui.__.__font ? Paint.fillText(ui, canvas, renderOptions) : ui.__.windingRule ? canvas.fill(ui.__.windingRule) : canvas.fill();
+    function fillPathOrText(ui, canvas, renderOptions, complexPaint) {
+        ui.__.__font ? Paint.fillText(ui, canvas, renderOptions, complexPaint) : ui.__.windingRule ? canvas.fill(ui.__.windingRule) : canvas.fill();
     }
-    function fillText(ui, canvas, renderOptions) {
-        if (ui.motionText) return Paint.fillMotionText(ui, canvas, renderOptions);
-        const data = ui.__, {rows: rows, decorationY: decorationY} = data.__textDrawData;
+    function fillText(ui, canvas, renderOptions, complexPaint) {
+        const data = ui.__;
         if (data.__isPlacehold && data.placeholderColor) canvas.fillStyle = data.placeholderColor;
-        let row;
-        for (let i = 0, len = rows.length; i < len; i++) {
-            row = rows[i];
-            if (row.text) canvas.fillText(row.text, row.x, row.y); else if (row.data) row.data.forEach(charData => {
-                canvas.fillText(charData.char, charData.x, row.y);
-            });
+        let originCanvas;
+        if (complexPaint) {
+            originCanvas = canvas;
+            canvas = canvas.getSameCanvas(true, true);
+            canvas.font = ui.__.__font;
+            canvas.fillStyle = "#000";
+        }
+        if (ui.motionText) {
+            Paint.fillMotionText(ui, canvas, renderOptions);
+        } else {
+            let row;
+            const {rows: rows, decorationY: decorationY} = data.__textDrawData;
+            for (let i = 0, len = rows.length; i < len; i++) {
+                row = rows[i];
+                if (row.text) canvas.fillText(row.text, row.x, row.y); else if (row.data) row.data.forEach(charData => {
+                    canvas.fillText(charData.char, charData.x, row.y);
+                });
+            }
+            if (decorationY) {
+                const {decorationColor: decorationColor, decorationHeight: decorationHeight} = data.__textDrawData;
+                if (decorationColor) canvas.fillStyle = decorationColor;
+                rows.forEach(row => decorationY.forEach(value => canvas.fillRect(row.x, row.y + value, row.width, decorationHeight)));
+            }
         }
-        if (decorationY) {
-            const {decorationColor: decorationColor, decorationHeight: decorationHeight} = data.__textDrawData;
-            if (decorationColor) canvas.fillStyle = decorationColor;
-            rows.forEach(row => decorationY.forEach(value => canvas.fillRect(row.x, row.y + value, row.width, decorationHeight)));
+        if (complexPaint) {
+            canvas.beginPath();
+            ui.__drawPathByBox(canvas, "render");
+            canvas.fillStyle = originCanvas.fillStyle;
+            canvas.setTransform(originCanvas.getTransform());
+            canvas.blendMode = "source-in";
+            canvas.fill();
+            originCanvas.copyWorldByReset(canvas, ui.__nowWorld);
+            canvas.recycle(ui.__nowWorld);
         }
     }
     function stroke(stroke, ui, canvas, renderOptions) {
@@ -12189,8 +12220,8 @@ var LeaferUI = function(exports) {
     const afterChar = ">)]}%!?,.:;'\"" + langAfter;
     const symbolChar = afterChar + "_#~&*+\\=|" + langSymbol;
     const breakChar = "- " + langBreak$1;
-    const cjkRangeList = [ [ 19968, 40959 ], [ 13312, 19903 ], [ 131072, 173791 ], [ 173824, 177983 ], [ 177984, 178207 ], [ 178208, 183983 ], [ 183984, 191471 ], [ 196608, 201551 ], [ 201552, 205743 ], [ 11904, 12031 ], [ 12032, 12255 ], [ 12272, 12287 ], [ 12288, 12351 ], [ 12736, 12783 ], [ 12800, 13055 ], [ 13056, 13311 ], [ 63744, 64255 ], [ 65072, 65103 ], [ 127488, 127743 ], [ 194560, 195103 ] ];
-    const cjkReg = new RegExp(cjkRangeList.map(([start, end]) => `[\\u${start.toString(16)}-\\u${end.toString(16)}]`).join("|"));
+    const cjkRangeList = [ [ 19968, 40959 ], [ 13312, 19903 ], [ 131072, 173791 ], [ 173824, 177983 ], [ 177984, 178207 ], [ 178208, 183983 ], [ 183984, 191471 ], [ 196608, 201551 ], [ 201552, 205743 ], [ 11904, 12031 ], [ 12032, 12255 ], [ 12272, 12287 ], [ 12288, 12351 ], [ 4352, 4607 ], [ 12352, 12447 ], [ 12448, 12543 ], [ 12544, 12591 ], [ 12592, 12687 ], [ 12688, 12703 ], [ 12704, 12735 ], [ 12784, 12799 ], [ 12736, 12783 ], [ 12800, 13055 ], [ 13056, 13311 ], [ 63744, 64255 ], [ 65072, 65103 ], [ 127488, 127743 ], [ 194560, 195103 ] ];
+    const cjkReg = new RegExp(cjkRangeList.map(([start, end]) => `[\\u{${start.toString(16)}}-\\u{${end.toString(16)}}]`).join("|"), "u");
     function mapChar(str) {
         const map = {};
         str.split("").forEach(char => map[char] = true);
@@ -12269,11 +12300,13 @@ var LeaferUI = function(exports) {
         rows = drawData.rows;
         bounds = drawData.bounds;
         findMaxWidth = !bounds.width && !style.autoSizeAlign;
-        const {__letterSpacing: __letterSpacing, paraIndent: paraIndent, textCase: textCase} = style;
+        const {paraIndent: paraIndent, textCase: textCase} = style;
         const {canvas: canvas} = Platform, {width: width} = bounds;
         if (style.__isCharMode) {
             const wrap = style.textWrap !== "none";
             const breakAll = style.textWrap === "break";
+            const letterSpacing = style.__letterSpacing;
+            const wordSpacing = style.__wordSpacing;
             paraStart = true;
             lastCharType = null;
             startCharSize = charWidth = charSize = wordWidth = rowWidth = 0;
@@ -12294,9 +12327,9 @@ var LeaferUI = function(exports) {
                     charType = getCharType(char);
                     if (charType === Letter && textCase !== "none") char = getTextCase(char, textCase, !wordWidth);
                     charWidth = canvas.measureText(char).width;
-                    if (__letterSpacing) {
-                        if (__letterSpacing < 0) charSize = charWidth;
-                        charWidth += __letterSpacing;
+                    if (letterSpacing) {
+                        if (letterSpacing < 0) charSize = charWidth;
+                        charWidth += letterSpacing;
                     }
                     langBreak = charType === Single && (lastCharType === Single || lastCharType === Letter) || lastCharType === Single && charType !== After;
                     afterBreak = (charType === Before || charType === Single) && (lastCharType === Symbol || lastCharType === After);
@@ -12317,11 +12350,11 @@ var LeaferUI = function(exports) {
                     }
                     if (char === " " && paraStart !== true && rowWidth + wordWidth === 0) ; else {
                         if (charType === Break) {
-                            if (char === " " && wordWidth) addWord();
+                            if (char === " " && wordWidth) addWord(wordSpacing);
                             addChar(char, charWidth);
                             addWord();
                         } else if (langBreak || afterBreak) {
-                            if (wordWidth) addWord();
+                            if (wordWidth) addWord(wordSpacing);
                             addChar(char, charWidth);
                         } else {
                             addChar(char, charWidth);
@@ -12355,7 +12388,11 @@ var LeaferUI = function(exports) {
         });
         wordWidth += width;
     }
-    function addWord() {
+    function addWord(wordSpacing) {
+        if (wordSpacing) {
+            rowWidth += wordSpacing;
+            word.addWidth = wordSpacing;
+        }
         rowWidth += wordWidth;
         word.width = wordWidth;
         row.words.push(word);
@@ -12393,6 +12430,7 @@ var LeaferUI = function(exports) {
         const {rows: rows} = drawData;
         const {textAlign: textAlign, paraIndent: paraIndent} = style;
         const useLetter = style.__letterSpacing || style.motionText;
+        const wordSpacing = style.__wordSpacing;
         const justifyLast = width && textAlign.includes("both");
         const justify = justifyLast || width && textAlign.includes("justify");
         const justifyLetter = justify && textAlign.includes("letter");
@@ -12405,7 +12443,7 @@ var LeaferUI = function(exports) {
                     remainingWidth = width - row.width - indentWidth;
                     if (justifyLetter) addLetterWidth = remainingWidth / (row.words.reduce((total, item) => total + item.data.length, 0) - 1); else addWordWidth = wordsLength > 1 ? remainingWidth / (wordsLength - 1) : 0;
                 }
-                mode = useLetter || row.isOverflow || justifyLetter ? CharMode : addWordWidth ? WordMode : TextMode;
+                mode = useLetter || row.isOverflow || justifyLetter ? CharMode : addWordWidth || wordSpacing ? WordMode : TextMode;
                 if (row.isOverflow && !useLetter) row.textMode = true;
                 if (mode === TextMode) {
                     row.x += indentWidth;
@@ -12425,6 +12463,7 @@ var LeaferUI = function(exports) {
                         } else {
                             charX = toChar(word.data, charX, row.data, row.isOverflow, canJustify && addLetterWidth);
                         }
+                        if (word.addWidth) charX += word.addWidth;
                         if (canJustify) {
                             isLastWord = index === wordsLength - 1;
                             if (addWordWidth) {
@@ -12679,9 +12718,15 @@ var LeaferUI = function(exports) {
     });
     useCanvas();
     class RobotData extends UIData {
+        get __isCanvas() {
+            return true;
+        }
         get __drawAfterFill() {
             return true;
         }
+        get __boxStroke() {
+            return !this.__pathInputed;
+        }
         setRobot(value) {
             this._robot = value;
             this.__leaf.__updateRobot();