leafer-draw 2.1.0 → 2.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/web.cjs +26 -16
- package/dist/web.esm.js +26 -16
- package/dist/web.esm.min.js +1 -1
- package/dist/web.esm.min.js.map +1 -1
- package/dist/web.js +44 -25
- package/dist/web.min.cjs +1 -1
- package/dist/web.min.cjs.map +1 -1
- package/dist/web.min.js +1 -1
- package/dist/web.min.js.map +1 -1
- package/dist/web.module.js +44 -25
- package/dist/web.module.min.js +1 -1
- package/dist/web.module.min.js.map +1 -1
- package/package.json +3 -3
package/dist/web.module.js
CHANGED
|
@@ -3082,7 +3082,7 @@ const PathConvert = {
|
|
|
3082
3082
|
case M$4:
|
|
3083
3083
|
x = old[i + 1];
|
|
3084
3084
|
y = old[i + 2];
|
|
3085
|
-
data.push(M$4, x, y);
|
|
3085
|
+
data.push(lastCommand === command ? L$5 : M$4, x, y);
|
|
3086
3086
|
i += 3;
|
|
3087
3087
|
break;
|
|
3088
3088
|
|
|
@@ -6075,12 +6075,13 @@ const LeafBounds = {
|
|
|
6075
6075
|
if (this.__hasWorldEvent) BoundsEvent.emitWorld(this);
|
|
6076
6076
|
},
|
|
6077
6077
|
__updateLocalBounds() {
|
|
6078
|
-
const layout = this.__layout;
|
|
6078
|
+
const layout = this.__layout, data = this.__;
|
|
6079
6079
|
if (layout.boxChanged) {
|
|
6080
|
-
if (!
|
|
6080
|
+
if (!data.__pathInputed) this.__updatePath();
|
|
6081
6081
|
this.__updateRenderPath();
|
|
6082
6082
|
this.__updateBoxBounds();
|
|
6083
6083
|
layout.resized = "inner";
|
|
6084
|
+
if (data.__strokeGeometry) data.__strokeGeometry = undefined;
|
|
6084
6085
|
}
|
|
6085
6086
|
if (layout.localBoxChanged) {
|
|
6086
6087
|
if (this.__local) this.__updateLocalBoxBounds();
|
|
@@ -6103,6 +6104,7 @@ const LeafBounds = {
|
|
|
6103
6104
|
if (layout.renderSpread || layout.strokeSpread !== layout.strokeBoxSpread) layout.renderChanged = true;
|
|
6104
6105
|
if (this.parent) this.parent.__layout.strokeChange();
|
|
6105
6106
|
layout.resized = "inner";
|
|
6107
|
+
if (data.__strokeGeometry) data.__strokeGeometry = undefined;
|
|
6106
6108
|
}
|
|
6107
6109
|
if (layout.renderChanged) {
|
|
6108
6110
|
layout.renderSpread = this.__updateRenderSpread();
|
|
@@ -7079,7 +7081,7 @@ class LeafLevelList {
|
|
|
7079
7081
|
}
|
|
7080
7082
|
}
|
|
7081
7083
|
|
|
7082
|
-
const version = "2.1.
|
|
7084
|
+
const version = "2.1.1";
|
|
7083
7085
|
|
|
7084
7086
|
const debug$4 = Debug.get("LeaferCanvas");
|
|
7085
7087
|
|
|
@@ -8148,7 +8150,7 @@ class UIData extends LeafData {
|
|
|
8148
8150
|
const isStr = isString(value);
|
|
8149
8151
|
if (isStr || value && isObject(value[0])) {
|
|
8150
8152
|
this.__setInput("path", value);
|
|
8151
|
-
this._path = isStr ? parse(value) : objectToCanvasData(value);
|
|
8153
|
+
this._path = isStr ? parse(value, this.__useArrow) : objectToCanvasData(value);
|
|
8152
8154
|
} else {
|
|
8153
8155
|
if (this.__input) this.__removeInput("path");
|
|
8154
8156
|
this._path = value;
|
|
@@ -8263,7 +8265,11 @@ class EllipseData extends UIData {
|
|
|
8263
8265
|
}
|
|
8264
8266
|
}
|
|
8265
8267
|
|
|
8266
|
-
class PolygonData extends
|
|
8268
|
+
class PolygonData extends UIData {
|
|
8269
|
+
get __usePathBox() {
|
|
8270
|
+
return this.points || this.__pathInputed;
|
|
8271
|
+
}
|
|
8272
|
+
}
|
|
8267
8273
|
|
|
8268
8274
|
class StarData extends UIData {
|
|
8269
8275
|
get __boxStroke() {
|
|
@@ -8374,7 +8380,7 @@ const UIBounds = {
|
|
|
8374
8380
|
if ((data.stroke || data.hitStroke === "all") && strokeWidth && strokeAlign !== "inside") {
|
|
8375
8381
|
boxSpread = spread = strokeAlign === "center" ? strokeWidth / 2 : strokeWidth;
|
|
8376
8382
|
if (!data.__boxStroke || data.__useArrow) {
|
|
8377
|
-
const miterLimitAddWidth = data.__isLinePath ? 0 : 10 * spread;
|
|
8383
|
+
const miterLimitAddWidth = data.__isLinePath ? 0 : (data.strokeJoin === "miter" ? 10 : 1) * spread;
|
|
8378
8384
|
const storkeCapAddWidth = data.strokeCap === "none" ? 0 : strokeWidth;
|
|
8379
8385
|
spread += Math.max(miterLimitAddWidth, storkeCapAddWidth);
|
|
8380
8386
|
}
|
|
@@ -9678,7 +9684,7 @@ __decorate([ resizeType() ], Canvas.prototype, "contextSettings", void 0);
|
|
|
9678
9684
|
|
|
9679
9685
|
Canvas = __decorate([ registerUI() ], Canvas);
|
|
9680
9686
|
|
|
9681
|
-
const {copyAndSpread: copyAndSpread$1, includes: includes,
|
|
9687
|
+
const {copyAndSpread: copyAndSpread$1, includes: includes, setList: setList} = BoundsHelper, {stintSet: stintSet$1} = DataHelper;
|
|
9682
9688
|
|
|
9683
9689
|
let Text = class Text extends UI {
|
|
9684
9690
|
get __tag() {
|
|
@@ -9706,9 +9712,10 @@ let Text = class Text extends UI {
|
|
|
9706
9712
|
const {fontSize: fontSize, italic: italic, padding: padding, __autoWidth: autoWidth, __autoHeight: autoHeight} = data;
|
|
9707
9713
|
this.__updateTextDrawData();
|
|
9708
9714
|
const {bounds: contentBounds} = data.__textDrawData;
|
|
9715
|
+
console.log(contentBounds);
|
|
9709
9716
|
const b = layout.boxBounds;
|
|
9710
9717
|
layout.contentBounds = contentBounds;
|
|
9711
|
-
if (data.__lineHeight < fontSize)
|
|
9718
|
+
if (data.__lineHeight < fontSize) layout.renderChanged = true;
|
|
9712
9719
|
if (autoWidth || autoHeight) {
|
|
9713
9720
|
b.x = autoWidth ? contentBounds.x : 0;
|
|
9714
9721
|
b.y = autoHeight ? contentBounds.y : 0;
|
|
@@ -9728,6 +9735,8 @@ let Text = class Text extends UI {
|
|
|
9728
9735
|
__updateRenderSpread() {
|
|
9729
9736
|
let spread = super.__updateRenderSpread();
|
|
9730
9737
|
if (!spread) spread = this.isOverflow ? 1 : 0;
|
|
9738
|
+
const {__lineHeight: __lineHeight, fontSize: fontSize} = this.__;
|
|
9739
|
+
if (__lineHeight < fontSize) spread = FourNumberHelper.max(spread, (fontSize - __lineHeight) / 2);
|
|
9731
9740
|
return spread;
|
|
9732
9741
|
}
|
|
9733
9742
|
__updateRenderBounds() {
|
|
@@ -10185,8 +10194,8 @@ function compute(attrName, ui) {
|
|
|
10185
10194
|
}
|
|
10186
10195
|
}
|
|
10187
10196
|
}
|
|
10188
|
-
data["_" + attrName] = leafPaints.length ? leafPaints : undefined;
|
|
10189
10197
|
if (leafPaints.length) {
|
|
10198
|
+
data["_" + attrName] = leafPaints;
|
|
10190
10199
|
if (leafPaints.every(item => item.isTransparent)) {
|
|
10191
10200
|
if (leafPaints.some(item => item.image)) isAlphaPixel = true;
|
|
10192
10201
|
isTransparent = true;
|
|
@@ -10201,6 +10210,7 @@ function compute(attrName, ui) {
|
|
|
10201
10210
|
}
|
|
10202
10211
|
} else {
|
|
10203
10212
|
data.__removePaint(attrName, false);
|
|
10213
|
+
data["_" + attrName] = "";
|
|
10204
10214
|
}
|
|
10205
10215
|
}
|
|
10206
10216
|
|
|
@@ -10350,11 +10360,12 @@ function checkSizeAndCreateData(ui, attrName, paint, image, leafPaint, boxBounds
|
|
|
10350
10360
|
needUpdate = false;
|
|
10351
10361
|
}
|
|
10352
10362
|
}
|
|
10363
|
+
if (paint.mode === "brush") PaintImage.brush(leafPaint);
|
|
10353
10364
|
if (!leafPaint.data) {
|
|
10354
10365
|
PaintImage.createData(leafPaint, image, paint, boxBounds);
|
|
10355
|
-
const {transform: transform} = leafPaint.data, {opacity: opacity
|
|
10356
|
-
const clip = transform && !transform.onlyScale || data.path || data.cornerRadius;
|
|
10357
|
-
if (clip || opacity && opacity < 1 || blendMode) leafPaint.complex = clip ? 2 : true;
|
|
10366
|
+
const {transform: transform} = leafPaint.data, {opacity: opacity} = paint;
|
|
10367
|
+
const clip = (transform && !transform.onlyScale || data.path || data.cornerRadius) && !leafPaint.brush;
|
|
10368
|
+
if (clip || opacity && opacity < 1 || paint.blendMode) leafPaint.complex = clip ? 2 : true;
|
|
10358
10369
|
}
|
|
10359
10370
|
if (paint.filter) PaintImage.applyFilter(leafPaint, image, paint.filter, ui);
|
|
10360
10371
|
return needUpdate;
|
|
@@ -10444,6 +10455,7 @@ function getPatternData(paint, box, image) {
|
|
|
10444
10455
|
break;
|
|
10445
10456
|
|
|
10446
10457
|
case "repeat":
|
|
10458
|
+
case "brush":
|
|
10447
10459
|
if (!sameBox || scaleX || rotation || skew) PaintImage.repeatMode(data, box, width, height, tempImage.x, tempImage.y, scaleX, scaleY, rotation, skew, align, paint.freeTransform);
|
|
10448
10460
|
if (!repeat) data.repeat = "repeat";
|
|
10449
10461
|
const count = isObject(repeat);
|
|
@@ -10584,7 +10596,7 @@ function createPattern(paint, ui, canvas, renderOptions) {
|
|
|
10584
10596
|
let {scaleX: scaleX, scaleY: scaleY} = PaintImage.getImageRenderScaleData(paint, ui, canvas, renderOptions), id = paint.film ? paint.nowIndex : scaleX + "-" + scaleY;
|
|
10585
10597
|
if (paint.patternId !== id && !ui.destroyed) {
|
|
10586
10598
|
if (!(Platform.image.isLarge(paint.image, scaleX, scaleY) && !paint.data.repeat)) {
|
|
10587
|
-
const {image: image, data: data} = paint, {opacity: opacity} = paint.originPaint, {transform: transform, gap: gap} = data, fixScale = PaintImage.getPatternFixScale(paint, scaleX, scaleY);
|
|
10599
|
+
const {image: image, brush: brush, data: data} = paint, {opacity: opacity} = paint.originPaint, {transform: transform, gap: gap} = data, fixScale = PaintImage.getPatternFixScale(paint, scaleX, scaleY);
|
|
10588
10600
|
let imageMatrix, xGap, yGap, {width: width, height: height} = image;
|
|
10589
10601
|
if (fixScale) scaleX *= fixScale, scaleY *= fixScale;
|
|
10590
10602
|
width *= scaleX;
|
|
@@ -10592,6 +10604,10 @@ function createPattern(paint, ui, canvas, renderOptions) {
|
|
|
10592
10604
|
if (gap) {
|
|
10593
10605
|
xGap = gap.x * scaleX / abs$1(data.scaleX || 1);
|
|
10594
10606
|
yGap = gap.y * scaleY / abs$1(data.scaleY || 1);
|
|
10607
|
+
if (brush) {
|
|
10608
|
+
const brushScale = PaintImage.getBrushScale(paint, ui);
|
|
10609
|
+
xGap /= brushScale, yGap /= brushScale;
|
|
10610
|
+
}
|
|
10595
10611
|
}
|
|
10596
10612
|
if (transform || scaleX !== 1 || scaleY !== 1) {
|
|
10597
10613
|
scaleX *= getFloorScale(width + (xGap || 0));
|
|
@@ -10601,7 +10617,7 @@ function createPattern(paint, ui, canvas, renderOptions) {
|
|
|
10601
10617
|
scale(imageMatrix, 1 / scaleX, 1 / scaleY);
|
|
10602
10618
|
}
|
|
10603
10619
|
const imageCanvas = image.getCanvas(width, height, opacity, undefined, xGap, yGap, ui.leafer && ui.leafer.config.smooth, data.interlace);
|
|
10604
|
-
const pattern = image.getPattern(imageCanvas, data.repeat || (Platform.origin.noRepeat || "no-repeat"), imageMatrix, paint);
|
|
10620
|
+
const pattern = brush ? imageCanvas : image.getPattern(imageCanvas, data.repeat || (Platform.origin.noRepeat || "no-repeat"), imageMatrix, paint);
|
|
10605
10621
|
paint.style = pattern;
|
|
10606
10622
|
paint.patternId = id;
|
|
10607
10623
|
}
|
|
@@ -10622,9 +10638,9 @@ function getPatternFixScale(paint, imageScaleX, imageScaleY) {
|
|
|
10622
10638
|
|
|
10623
10639
|
function checkImage(paint, drawImage, ui, canvas, renderOptions) {
|
|
10624
10640
|
const {scaleX: scaleX, scaleY: scaleY} = PaintImage.getImageRenderScaleData(paint, ui, canvas, renderOptions), id = paint.film ? paint.nowIndex : scaleX + "-" + scaleY;
|
|
10625
|
-
const {image: image, data: data, originPaint: originPaint} = paint, {exporting: exporting, snapshot: snapshot} = renderOptions;
|
|
10641
|
+
const {image: image, brush: brush, data: data, originPaint: originPaint} = paint, {exporting: exporting, snapshot: snapshot} = renderOptions;
|
|
10626
10642
|
if (!data || paint.patternId === id && !exporting || snapshot) {
|
|
10627
|
-
return false;
|
|
10643
|
+
if (!(brush && paint.style)) return false;
|
|
10628
10644
|
} else {
|
|
10629
10645
|
if (drawImage) {
|
|
10630
10646
|
if (data.repeat) {
|
|
@@ -10638,18 +10654,18 @@ function checkImage(paint, drawImage, ui, canvas, renderOptions) {
|
|
|
10638
10654
|
canvas.fillStyle = paint.style || "#000";
|
|
10639
10655
|
canvas.fill();
|
|
10640
10656
|
}
|
|
10641
|
-
PaintImage.drawImage(paint, scaleX, scaleY, ui, canvas, renderOptions);
|
|
10642
|
-
return true;
|
|
10643
10657
|
} else {
|
|
10644
10658
|
if (!paint.style || originPaint.sync || exporting) PaintImage.createPattern(paint, ui, canvas, renderOptions); else PaintImage.createPatternTask(paint, ui, canvas, renderOptions);
|
|
10645
|
-
return false;
|
|
10659
|
+
if (!(brush && paint.style)) return false;
|
|
10646
10660
|
}
|
|
10647
10661
|
}
|
|
10662
|
+
PaintImage.drawImage(paint, scaleX, scaleY, ui, canvas, renderOptions);
|
|
10663
|
+
return true;
|
|
10648
10664
|
}
|
|
10649
10665
|
|
|
10650
10666
|
function drawImage(paint, imageScaleX, imageScaleY, ui, canvas, _renderOptions) {
|
|
10651
|
-
const {data: data, image: image, complex: complex} = paint;
|
|
10652
|
-
let {width: width, height: height} = image;
|
|
10667
|
+
const {data: data, image: image, brush: brush, complex: complex} = paint;
|
|
10668
|
+
let {width: width, height: height} = image, view = brush || image;
|
|
10653
10669
|
if (complex) {
|
|
10654
10670
|
const {blendMode: blendMode, opacity: opacity} = paint.originPaint, {transform: transform} = data;
|
|
10655
10671
|
canvas.save();
|
|
@@ -10657,16 +10673,17 @@ function drawImage(paint, imageScaleX, imageScaleY, ui, canvas, _renderOptions)
|
|
|
10657
10673
|
blendMode && (canvas.blendMode = blendMode);
|
|
10658
10674
|
opacity && (canvas.opacity *= opacity);
|
|
10659
10675
|
transform && canvas.transform(transform);
|
|
10660
|
-
|
|
10676
|
+
view.render(canvas, 0, 0, width, height, ui, paint, imageScaleX, imageScaleY);
|
|
10661
10677
|
canvas.restore();
|
|
10662
10678
|
} else {
|
|
10663
10679
|
if (data.scaleX) width *= data.scaleX, height *= data.scaleY;
|
|
10664
|
-
|
|
10680
|
+
view.render(canvas, 0, 0, width, height, ui, paint, imageScaleX, imageScaleY);
|
|
10665
10681
|
}
|
|
10666
10682
|
}
|
|
10667
10683
|
|
|
10668
10684
|
function getImageRenderScaleData(paint, ui, canvas, _renderOptions) {
|
|
10669
10685
|
const scaleData = ui.getRenderScaleData(true, paint.originPaint.scaleFixed), {data: data} = paint;
|
|
10686
|
+
if (paint.brush) PaintImage.addBrushScale(scaleData, paint, ui);
|
|
10670
10687
|
if (canvas) {
|
|
10671
10688
|
const {pixelRatio: pixelRatio} = canvas;
|
|
10672
10689
|
scaleData.scaleX *= pixelRatio;
|
|
@@ -10683,6 +10700,7 @@ function recycleImage(attrName, data) {
|
|
|
10683
10700
|
const paints = data["_" + attrName];
|
|
10684
10701
|
if (isArray(paints)) {
|
|
10685
10702
|
let paint, image, recycleMap, input, url;
|
|
10703
|
+
const ui = data.__leaf;
|
|
10686
10704
|
for (let i = 0, len = paints.length; i < len; i++) {
|
|
10687
10705
|
paint = paints[i];
|
|
10688
10706
|
image = paint.image;
|
|
@@ -10691,7 +10709,8 @@ function recycleImage(attrName, data) {
|
|
|
10691
10709
|
if (!recycleMap) recycleMap = {};
|
|
10692
10710
|
recycleMap[url] = true;
|
|
10693
10711
|
ImageManager.recyclePaint(paint);
|
|
10694
|
-
if (
|
|
10712
|
+
if (paint.brush) PaintImage.recycleBrush(paint, ui);
|
|
10713
|
+
if (data.__willDestroy && image.parent) PaintImage.recycleFilter(image, ui);
|
|
10695
10714
|
if (image.loading) {
|
|
10696
10715
|
if (!input) {
|
|
10697
10716
|
input = data.__input && data.__input[attrName] || [];
|