leafer-draw 1.9.4 → 1.9.5
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 +62 -33
- package/dist/web.esm.js +63 -34
- package/dist/web.esm.min.js +1 -1
- package/dist/web.esm.min.js.map +1 -1
- package/dist/web.js +129 -142
- 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 +131 -145
- 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.js
CHANGED
|
@@ -119,6 +119,9 @@ var LeaferUI = function(exports) {
|
|
|
119
119
|
const {path: path} = this;
|
|
120
120
|
return path && path.length === 6 && path[0] === 1;
|
|
121
121
|
}
|
|
122
|
+
get __usePathBox() {
|
|
123
|
+
return this.__pathInputed;
|
|
124
|
+
}
|
|
122
125
|
get __blendMode() {
|
|
123
126
|
if (this.eraser && this.eraser !== "path") return "destination-out";
|
|
124
127
|
const {blendMode: blendMode} = this;
|
|
@@ -1080,10 +1083,10 @@ var LeaferUI = function(exports) {
|
|
|
1080
1083
|
toPoint$5(align, box, to, onlyBoxSize, content, onlyContentSize);
|
|
1081
1084
|
}
|
|
1082
1085
|
};
|
|
1083
|
-
const {tempPointBounds: tempPointBounds$1, setPoint: setPoint$2, addPoint: addPoint$2, toBounds: toBounds$
|
|
1086
|
+
const {tempPointBounds: tempPointBounds$1, setPoint: setPoint$2, addPoint: addPoint$2, toBounds: toBounds$2} = TwoPointBoundsHelper;
|
|
1084
1087
|
const {toOuterPoint: toOuterPoint$2} = MatrixHelper;
|
|
1085
1088
|
const {float: float, fourNumber: fourNumber} = MathHelper;
|
|
1086
|
-
const {floor: floor$2, ceil: ceil$
|
|
1089
|
+
const {floor: floor$2, ceil: ceil$2} = Math;
|
|
1087
1090
|
let right$1, bottom$1, boundsRight, boundsBottom;
|
|
1088
1091
|
const point = {};
|
|
1089
1092
|
const toPoint$4 = {};
|
|
@@ -1207,7 +1210,7 @@ var LeaferUI = function(exports) {
|
|
|
1207
1210
|
point.x = t.x;
|
|
1208
1211
|
toOuterPoint$2(matrix, point, toPoint$4);
|
|
1209
1212
|
addPoint$2(tempPointBounds$1, toPoint$4.x, toPoint$4.y);
|
|
1210
|
-
toBounds$
|
|
1213
|
+
toBounds$2(tempPointBounds$1, to);
|
|
1211
1214
|
}
|
|
1212
1215
|
},
|
|
1213
1216
|
toInnerOf(t, matrix, to) {
|
|
@@ -1245,8 +1248,8 @@ var LeaferUI = function(exports) {
|
|
|
1245
1248
|
const {x: x, y: y} = t;
|
|
1246
1249
|
t.x = floor$2(t.x);
|
|
1247
1250
|
t.y = floor$2(t.y);
|
|
1248
|
-
t.width = x > t.x ? ceil$
|
|
1249
|
-
t.height = y > t.y ? ceil$
|
|
1251
|
+
t.width = x > t.x ? ceil$2(t.width + x - t.x) : ceil$2(t.width);
|
|
1252
|
+
t.height = y > t.y ? ceil$2(t.height + y - t.y) : ceil$2(t.height);
|
|
1250
1253
|
},
|
|
1251
1254
|
unsign(t) {
|
|
1252
1255
|
if (t.width < 0) {
|
|
@@ -1306,7 +1309,7 @@ var LeaferUI = function(exports) {
|
|
|
1306
1309
|
},
|
|
1307
1310
|
setPoints(t, points) {
|
|
1308
1311
|
points.forEach((point, index) => index === 0 ? setPoint$2(tempPointBounds$1, point.x, point.y) : addPoint$2(tempPointBounds$1, point.x, point.y));
|
|
1309
|
-
toBounds$
|
|
1312
|
+
toBounds$2(tempPointBounds$1, t);
|
|
1310
1313
|
},
|
|
1311
1314
|
setPoint(t, point) {
|
|
1312
1315
|
B.set(t, point.x, point.y);
|
|
@@ -2063,15 +2066,15 @@ var LeaferUI = function(exports) {
|
|
|
2063
2066
|
DataHelper.copyAttrs(s, size, canvasSizeAttrs);
|
|
2064
2067
|
canvasSizeAttrs.forEach(key => s[key] || (s[key] = 1));
|
|
2065
2068
|
this.bounds = new Bounds(0, 0, this.width, this.height);
|
|
2066
|
-
|
|
2067
|
-
this.updateViewSize();
|
|
2068
|
-
this.smooth = this.config.smooth;
|
|
2069
|
-
}
|
|
2069
|
+
this.updateViewSize();
|
|
2070
2070
|
this.updateClientBounds();
|
|
2071
|
-
if (this.context
|
|
2072
|
-
this.
|
|
2073
|
-
this.
|
|
2074
|
-
|
|
2071
|
+
if (this.context) {
|
|
2072
|
+
this.smooth = this.config.smooth;
|
|
2073
|
+
if (!this.unreal && takeCanvas) {
|
|
2074
|
+
this.clearWorld(takeCanvas.bounds);
|
|
2075
|
+
this.copyWorld(takeCanvas);
|
|
2076
|
+
takeCanvas.recycle();
|
|
2077
|
+
}
|
|
2075
2078
|
}
|
|
2076
2079
|
}
|
|
2077
2080
|
updateViewSize() {}
|
|
@@ -2372,7 +2375,7 @@ var LeaferUI = function(exports) {
|
|
|
2372
2375
|
data[0] ? drawer.arcTo(x, y, right, y, data[0]) : drawer.lineTo(x, y);
|
|
2373
2376
|
}
|
|
2374
2377
|
};
|
|
2375
|
-
const {sin: sin$3, cos: cos$3, atan2: atan2$1, ceil: ceil, abs: abs$2, PI: PI$2, sqrt: sqrt$1, pow: pow} = Math;
|
|
2378
|
+
const {sin: sin$3, cos: cos$3, hypot: hypot, atan2: atan2$1, ceil: ceil$1, abs: abs$2, PI: PI$2, sqrt: sqrt$1, pow: pow} = Math;
|
|
2376
2379
|
const {setPoint: setPoint$1, addPoint: addPoint$1} = TwoPointBoundsHelper;
|
|
2377
2380
|
const {set: set, toNumberPoints: toNumberPoints} = PointHelper;
|
|
2378
2381
|
const {M: M$5, L: L$6, C: C$4, Q: Q$4, Z: Z$5} = PathCommandMap;
|
|
@@ -2438,9 +2441,11 @@ var LeaferUI = function(exports) {
|
|
|
2438
2441
|
const CBy = toY - y1;
|
|
2439
2442
|
let startRadian = atan2$1(BAy, BAx);
|
|
2440
2443
|
let endRadian = atan2$1(CBy, CBx);
|
|
2444
|
+
const lenBA = hypot(BAx, BAy);
|
|
2445
|
+
const lenCB = hypot(CBx, CBy);
|
|
2441
2446
|
let totalRadian = endRadian - startRadian;
|
|
2442
2447
|
if (totalRadian < 0) totalRadian += PI2;
|
|
2443
|
-
if (
|
|
2448
|
+
if (lenBA < 1e-12 || lenCB < 1e-12 || totalRadian < 1e-12 || abs$2(totalRadian - PI$2) < 1e-12) {
|
|
2444
2449
|
if (data) data.push(L$6, x1, y1);
|
|
2445
2450
|
if (setPointBounds) {
|
|
2446
2451
|
setPoint$1(setPointBounds, fromX, fromY);
|
|
@@ -2473,7 +2478,7 @@ var LeaferUI = function(exports) {
|
|
|
2473
2478
|
let totalRadian = endRadian - startRadian;
|
|
2474
2479
|
if (totalRadian < 0) totalRadian += PI2; else if (totalRadian > PI2) totalRadian -= PI2;
|
|
2475
2480
|
if (anticlockwise) totalRadian -= PI2;
|
|
2476
|
-
const parts = ceil(abs$2(totalRadian / PI_2));
|
|
2481
|
+
const parts = ceil$1(abs$2(totalRadian / PI_2));
|
|
2477
2482
|
const partRadian = totalRadian / parts;
|
|
2478
2483
|
const partRadian4Sin = sin$3(partRadian / 4);
|
|
2479
2484
|
const control = 8 / 3 * partRadian4Sin * partRadian4Sin / sin$3(partRadian / 2);
|
|
@@ -3013,11 +3018,7 @@ var LeaferUI = function(exports) {
|
|
|
3013
3018
|
this.set(path);
|
|
3014
3019
|
}
|
|
3015
3020
|
set(path) {
|
|
3016
|
-
|
|
3017
|
-
this.__path = isString(path) ? PathHelper.parse(path) : path;
|
|
3018
|
-
} else {
|
|
3019
|
-
this.__path = [];
|
|
3020
|
-
}
|
|
3021
|
+
this.__path = path ? isString(path) ? PathHelper.parse(path) : path : [];
|
|
3021
3022
|
return this;
|
|
3022
3023
|
}
|
|
3023
3024
|
beginPath() {
|
|
@@ -3179,7 +3180,7 @@ var LeaferUI = function(exports) {
|
|
|
3179
3180
|
};
|
|
3180
3181
|
const {M: M$1, L: L$2, C: C, Q: Q, Z: Z$1, N: N, D: D$1, X: X, G: G, F: F$1, O: O, P: P, U: U} = PathCommandMap;
|
|
3181
3182
|
const {toTwoPointBounds: toTwoPointBounds, toTwoPointBoundsByQuadraticCurve: toTwoPointBoundsByQuadraticCurve, arcTo: arcTo$1, arc: arc, ellipse: ellipse$1} = BezierHelper;
|
|
3182
|
-
const {addPointBounds: addPointBounds, copy: copy$6, addPoint: addPoint, setPoint: setPoint, addBounds: addBounds, toBounds: toBounds$
|
|
3183
|
+
const {addPointBounds: addPointBounds, copy: copy$6, addPoint: addPoint, setPoint: setPoint, addBounds: addBounds, toBounds: toBounds$1} = TwoPointBoundsHelper;
|
|
3183
3184
|
const debug$a = Debug.get("PathBounds");
|
|
3184
3185
|
let radius, radiusX, radiusY;
|
|
3185
3186
|
const tempPointBounds = {};
|
|
@@ -3188,7 +3189,7 @@ var LeaferUI = function(exports) {
|
|
|
3188
3189
|
const PathBounds = {
|
|
3189
3190
|
toBounds(data, setBounds) {
|
|
3190
3191
|
PathBounds.toTwoPointBounds(data, setPointBounds);
|
|
3191
|
-
toBounds$
|
|
3192
|
+
toBounds$1(setPointBounds, setBounds);
|
|
3192
3193
|
},
|
|
3193
3194
|
toTwoPointBounds(data, setPointBounds) {
|
|
3194
3195
|
if (!data || !data.length) return setPoint(setPointBounds, 0, 0);
|
|
@@ -3370,10 +3371,13 @@ var LeaferUI = function(exports) {
|
|
|
3370
3371
|
return smooth;
|
|
3371
3372
|
}
|
|
3372
3373
|
};
|
|
3373
|
-
|
|
3374
|
+
function path(path) {
|
|
3375
|
+
return new PathCreator(path);
|
|
3376
|
+
}
|
|
3377
|
+
const pen = path();
|
|
3378
|
+
PathHelper.creator = path();
|
|
3374
3379
|
PathHelper.parse = PathConvert.parse;
|
|
3375
3380
|
PathHelper.convertToCanvasData = PathConvert.toCanvasData;
|
|
3376
|
-
const pen = new PathCreator;
|
|
3377
3381
|
const {drawRoundRect: drawRoundRect} = RectHelper;
|
|
3378
3382
|
function roundRect(drawer) {
|
|
3379
3383
|
if (drawer && !drawer.roundRect) {
|
|
@@ -3726,7 +3730,7 @@ var LeaferUI = function(exports) {
|
|
|
3726
3730
|
return FileHelper.alphaPixelTypes.some(item => I.isFormat(item, config));
|
|
3727
3731
|
},
|
|
3728
3732
|
isFormat(format, config) {
|
|
3729
|
-
if (config.format
|
|
3733
|
+
if (config.format) return config.format === format;
|
|
3730
3734
|
const {url: url} = config;
|
|
3731
3735
|
if (url.startsWith("data:")) {
|
|
3732
3736
|
if (url.startsWith("data:" + FileHelper.mineType(format))) return true;
|
|
@@ -3816,7 +3820,7 @@ var LeaferUI = function(exports) {
|
|
|
3816
3820
|
getFull(_filters) {
|
|
3817
3821
|
return this.view;
|
|
3818
3822
|
}
|
|
3819
|
-
getCanvas(width, height, opacity, _filters, xGap, yGap) {
|
|
3823
|
+
getCanvas(width, height, opacity, _filters, xGap, yGap, smooth) {
|
|
3820
3824
|
width || (width = this.width);
|
|
3821
3825
|
height || (height = this.height);
|
|
3822
3826
|
if (this.cache) {
|
|
@@ -3832,6 +3836,7 @@ var LeaferUI = function(exports) {
|
|
|
3832
3836
|
const canvas = Platform.origin.createCanvas(max$1(floor$1(width + (xGap || 0)), 1), max$1(floor$1(height + (yGap || 0)), 1));
|
|
3833
3837
|
const ctx = canvas.getContext("2d");
|
|
3834
3838
|
if (opacity) ctx.globalAlpha = opacity;
|
|
3839
|
+
ctx.imageSmoothingEnabled = smooth === false ? false : true;
|
|
3835
3840
|
ctx.drawImage(this.view, 0, 0, width, height);
|
|
3836
3841
|
this.cache = this.use > 1 ? {
|
|
3837
3842
|
data: canvas,
|
|
@@ -4431,8 +4436,9 @@ var LeaferUI = function(exports) {
|
|
|
4431
4436
|
};
|
|
4432
4437
|
const L = LeafHelper;
|
|
4433
4438
|
const {updateAllMatrix: updateAllMatrix$3, updateMatrix: updateMatrix$2, updateAllWorldOpacity: updateAllWorldOpacity, updateAllChange: updateAllChange$1, updateChange: updateChange$1} = L;
|
|
4434
|
-
function getTempLocal(t,
|
|
4435
|
-
|
|
4439
|
+
function getTempLocal(t, worldPoint) {
|
|
4440
|
+
t.updateLayout();
|
|
4441
|
+
return t.parent ? PointHelper.tempToInnerOf(worldPoint, t.parent.scrollWorldTransform) : worldPoint;
|
|
4436
4442
|
}
|
|
4437
4443
|
const LeafBoundsHelper = {
|
|
4438
4444
|
worldBounds(target) {
|
|
@@ -5357,7 +5363,7 @@ var LeaferUI = function(exports) {
|
|
|
5357
5363
|
const {updateMatrix: updateMatrix$1, updateAllMatrix: updateAllMatrix$2} = LeafHelper;
|
|
5358
5364
|
const {updateBounds: updateBounds$1} = BranchHelper;
|
|
5359
5365
|
const {toOuterOf: toOuterOf$1, copyAndSpread: copyAndSpread$1, copy: copy$3} = BoundsHelper;
|
|
5360
|
-
const {toBounds: toBounds
|
|
5366
|
+
const {toBounds: toBounds} = PathBounds;
|
|
5361
5367
|
const LeafBounds = {
|
|
5362
5368
|
__updateWorldBounds() {
|
|
5363
5369
|
const layout = this.__layout;
|
|
@@ -5428,8 +5434,8 @@ var LeaferUI = function(exports) {
|
|
|
5428
5434
|
__updateBoxBounds(_secondLayout, _bounds) {
|
|
5429
5435
|
const b = this.__layout.boxBounds;
|
|
5430
5436
|
const data = this.__;
|
|
5431
|
-
if (data.
|
|
5432
|
-
toBounds
|
|
5437
|
+
if (data.__usePathBox) {
|
|
5438
|
+
toBounds(data.path, b);
|
|
5433
5439
|
} else {
|
|
5434
5440
|
b.x = 0;
|
|
5435
5441
|
b.y = 0;
|
|
@@ -6344,7 +6350,7 @@ var LeaferUI = function(exports) {
|
|
|
6344
6350
|
this.levelMap = null;
|
|
6345
6351
|
}
|
|
6346
6352
|
}
|
|
6347
|
-
const version = "1.9.
|
|
6353
|
+
const version = "1.9.5";
|
|
6348
6354
|
const debug$4 = Debug.get("LeaferCanvas");
|
|
6349
6355
|
class LeaferCanvas extends LeaferCanvasBase {
|
|
6350
6356
|
set zIndex(zIndex) {
|
|
@@ -6433,10 +6439,22 @@ var LeaferUI = function(exports) {
|
|
|
6433
6439
|
updateViewSize() {
|
|
6434
6440
|
const {width: width, height: height, pixelRatio: pixelRatio} = this;
|
|
6435
6441
|
const {style: style} = this.view;
|
|
6436
|
-
|
|
6437
|
-
|
|
6438
|
-
|
|
6439
|
-
|
|
6442
|
+
if (this.unreal) {
|
|
6443
|
+
const {config: config, autoWidthStr: autoWidthStr, autoHeightStr: autoHeightStr} = this;
|
|
6444
|
+
if (config.width) {
|
|
6445
|
+
if (isUndefined(autoWidthStr)) this.autoWidthStr = style.width || "";
|
|
6446
|
+
style.width = config.width + "px";
|
|
6447
|
+
} else if (!isUndefined(autoWidthStr)) style.width = autoWidthStr;
|
|
6448
|
+
if (config.height) {
|
|
6449
|
+
if (isUndefined(autoHeightStr)) this.autoHeightStr = style.height || "";
|
|
6450
|
+
style.height = config.height + "px";
|
|
6451
|
+
} else if (!isUndefined(autoHeightStr)) style.height = autoHeightStr;
|
|
6452
|
+
} else {
|
|
6453
|
+
style.width = width + "px";
|
|
6454
|
+
style.height = height + "px";
|
|
6455
|
+
this.view.width = Math.ceil(width * pixelRatio);
|
|
6456
|
+
this.view.height = Math.ceil(height * pixelRatio);
|
|
6457
|
+
}
|
|
6440
6458
|
}
|
|
6441
6459
|
updateClientBounds() {
|
|
6442
6460
|
if (this.view.parentElement) this.clientBounds = this.view.getBoundingClientRect();
|
|
@@ -6445,6 +6463,7 @@ var LeaferUI = function(exports) {
|
|
|
6445
6463
|
this.resizeListener = listener;
|
|
6446
6464
|
if (autoBounds) {
|
|
6447
6465
|
this.autoBounds = autoBounds;
|
|
6466
|
+
if (this.resizeObserver) return;
|
|
6448
6467
|
try {
|
|
6449
6468
|
this.resizeObserver = new ResizeObserver(entries => {
|
|
6450
6469
|
this.updateClientBounds();
|
|
@@ -6461,18 +6480,10 @@ var LeaferUI = function(exports) {
|
|
|
6461
6480
|
} catch (_a) {
|
|
6462
6481
|
this.imitateResizeObserver();
|
|
6463
6482
|
}
|
|
6483
|
+
this.stopListenPixelRatio();
|
|
6464
6484
|
} else {
|
|
6465
|
-
|
|
6466
|
-
|
|
6467
|
-
if (!this.config.pixelRatio && this.pixelRatio !== pixelRatio) {
|
|
6468
|
-
const {width: width, height: height} = this;
|
|
6469
|
-
this.emitResize({
|
|
6470
|
-
width: width,
|
|
6471
|
-
height: height,
|
|
6472
|
-
pixelRatio: pixelRatio
|
|
6473
|
-
});
|
|
6474
|
-
}
|
|
6475
|
-
});
|
|
6485
|
+
this.listenPixelRatio();
|
|
6486
|
+
if (this.unreal) this.updateViewSize();
|
|
6476
6487
|
}
|
|
6477
6488
|
}
|
|
6478
6489
|
imitateResizeObserver() {
|
|
@@ -6481,6 +6492,25 @@ var LeaferUI = function(exports) {
|
|
|
6481
6492
|
Platform.requestRender(this.imitateResizeObserver.bind(this));
|
|
6482
6493
|
}
|
|
6483
6494
|
}
|
|
6495
|
+
listenPixelRatio() {
|
|
6496
|
+
if (!this.windowListener) window.addEventListener("resize", this.windowListener = () => {
|
|
6497
|
+
const pixelRatio = Platform.devicePixelRatio;
|
|
6498
|
+
if (!this.config.pixelRatio && this.pixelRatio !== pixelRatio) {
|
|
6499
|
+
const {width: width, height: height} = this;
|
|
6500
|
+
this.emitResize({
|
|
6501
|
+
width: width,
|
|
6502
|
+
height: height,
|
|
6503
|
+
pixelRatio: pixelRatio
|
|
6504
|
+
});
|
|
6505
|
+
}
|
|
6506
|
+
});
|
|
6507
|
+
}
|
|
6508
|
+
stopListenPixelRatio() {
|
|
6509
|
+
if (this.windowListener) {
|
|
6510
|
+
window.removeEventListener("resize", this.windowListener);
|
|
6511
|
+
this.windowListener = null;
|
|
6512
|
+
}
|
|
6513
|
+
}
|
|
6484
6514
|
checkAutoBounds(parentSize) {
|
|
6485
6515
|
const view = this.view;
|
|
6486
6516
|
const {x: x, y: y, width: width, height: height} = this.autoBounds.getBoundsFrom(parentSize);
|
|
@@ -6518,10 +6548,7 @@ var LeaferUI = function(exports) {
|
|
|
6518
6548
|
destroy() {
|
|
6519
6549
|
if (this.view) {
|
|
6520
6550
|
this.stopAutoLayout();
|
|
6521
|
-
|
|
6522
|
-
window.removeEventListener("resize", this.windowListener);
|
|
6523
|
-
this.windowListener = null;
|
|
6524
|
-
}
|
|
6551
|
+
this.stopListenPixelRatio();
|
|
6525
6552
|
if (!this.unreal) {
|
|
6526
6553
|
const view = this.view;
|
|
6527
6554
|
if (view.parentElement) view.remove();
|
|
@@ -6925,7 +6952,7 @@ var LeaferUI = function(exports) {
|
|
|
6925
6952
|
this.times = 0;
|
|
6926
6953
|
this.config = {
|
|
6927
6954
|
usePartRender: true,
|
|
6928
|
-
maxFPS:
|
|
6955
|
+
maxFPS: 120
|
|
6929
6956
|
};
|
|
6930
6957
|
this.target = target;
|
|
6931
6958
|
this.canvas = canvas;
|
|
@@ -7080,11 +7107,15 @@ var LeaferUI = function(exports) {
|
|
|
7080
7107
|
if (this.requestTime || !target) return;
|
|
7081
7108
|
if (target.parentApp) return target.parentApp.requestRender(false);
|
|
7082
7109
|
const requestTime = this.requestTime = Date.now();
|
|
7083
|
-
|
|
7084
|
-
|
|
7110
|
+
const render = () => {
|
|
7111
|
+
const nowFPS = 1e3 / (Date.now() - requestTime);
|
|
7112
|
+
const {maxFPS: maxFPS} = this.config;
|
|
7113
|
+
if (maxFPS && nowFPS > maxFPS - .5) return Platform.requestRender(render);
|
|
7114
|
+
this.FPS = Math.min(120, Math.ceil(nowFPS));
|
|
7085
7115
|
this.requestTime = 0;
|
|
7086
7116
|
this.checkRender();
|
|
7087
|
-
}
|
|
7117
|
+
};
|
|
7118
|
+
Platform.requestRender(render);
|
|
7088
7119
|
}
|
|
7089
7120
|
__onResize(e) {
|
|
7090
7121
|
if (this.canvas.unreal) return;
|
|
@@ -7127,7 +7158,8 @@ var LeaferUI = function(exports) {
|
|
|
7127
7158
|
if (this.target) {
|
|
7128
7159
|
this.stop();
|
|
7129
7160
|
this.__removeListenEvents();
|
|
7130
|
-
this.
|
|
7161
|
+
this.config = {};
|
|
7162
|
+
this.target = this.canvas = null;
|
|
7131
7163
|
}
|
|
7132
7164
|
}
|
|
7133
7165
|
}
|
|
@@ -7404,7 +7436,11 @@ var LeaferUI = function(exports) {
|
|
|
7404
7436
|
}
|
|
7405
7437
|
}
|
|
7406
7438
|
class FrameData extends BoxData {}
|
|
7407
|
-
class LineData extends UIData {
|
|
7439
|
+
class LineData extends UIData {
|
|
7440
|
+
get __usePathBox() {
|
|
7441
|
+
return this.points || this.__pathInputed;
|
|
7442
|
+
}
|
|
7443
|
+
}
|
|
7408
7444
|
class RectData extends UIData {
|
|
7409
7445
|
get __boxStroke() {
|
|
7410
7446
|
return !this.__pathInputed;
|
|
@@ -7415,7 +7451,7 @@ var LeaferUI = function(exports) {
|
|
|
7415
7451
|
return !this.__pathInputed;
|
|
7416
7452
|
}
|
|
7417
7453
|
}
|
|
7418
|
-
class PolygonData extends
|
|
7454
|
+
class PolygonData extends LineData {}
|
|
7419
7455
|
class StarData extends UIData {}
|
|
7420
7456
|
class PathData extends UIData {
|
|
7421
7457
|
get __pathInputed() {
|
|
@@ -7709,20 +7745,9 @@ var LeaferUI = function(exports) {
|
|
|
7709
7745
|
if (!path) this.__drawPathByBox(pen);
|
|
7710
7746
|
return pen;
|
|
7711
7747
|
}
|
|
7712
|
-
constructor(data) {
|
|
7713
|
-
super(data);
|
|
7714
|
-
}
|
|
7715
7748
|
reset(_data) {}
|
|
7716
|
-
set(data,
|
|
7717
|
-
if (data)
|
|
7718
|
-
if (transition) {
|
|
7719
|
-
if (transition === "temp") {
|
|
7720
|
-
this.lockNormalStyle = true;
|
|
7721
|
-
Object.assign(this, data);
|
|
7722
|
-
this.lockNormalStyle = false;
|
|
7723
|
-
} else this.animate(data, transition);
|
|
7724
|
-
} else Object.assign(this, data);
|
|
7725
|
-
}
|
|
7749
|
+
set(data, _transition) {
|
|
7750
|
+
if (data) Object.assign(this, data);
|
|
7726
7751
|
}
|
|
7727
7752
|
get(name) {
|
|
7728
7753
|
return isString(name) ? this.__.__getInput(name) : this.__.__getInputData(name);
|
|
@@ -7768,7 +7793,7 @@ var LeaferUI = function(exports) {
|
|
|
7768
7793
|
const data = this.__;
|
|
7769
7794
|
if (data.path) {
|
|
7770
7795
|
data.__pathForRender = data.cornerRadius ? PathCorner.smooth(data.path, data.cornerRadius, data.cornerSmoothing) : data.path;
|
|
7771
|
-
if (data.__useArrow) PathArrow.addArrows(this
|
|
7796
|
+
if (data.__useArrow) PathArrow.addArrows(this);
|
|
7772
7797
|
} else data.__pathForRender && (data.__pathForRender = undefined);
|
|
7773
7798
|
}
|
|
7774
7799
|
__drawRenderPath(canvas) {
|
|
@@ -7792,7 +7817,8 @@ var LeaferUI = function(exports) {
|
|
|
7792
7817
|
drawImagePlaceholder(canvas, _image) {
|
|
7793
7818
|
Paint.fill(this.__.placeholderColor, this, canvas);
|
|
7794
7819
|
}
|
|
7795
|
-
animate(
|
|
7820
|
+
animate(keyframe, _options, _type, _isTemp) {
|
|
7821
|
+
this.set(keyframe);
|
|
7796
7822
|
return Plugin.need("animate");
|
|
7797
7823
|
}
|
|
7798
7824
|
killAnimate(_type, _nextStyle) {}
|
|
@@ -7906,9 +7932,6 @@ var LeaferUI = function(exports) {
|
|
|
7906
7932
|
get isBranch() {
|
|
7907
7933
|
return true;
|
|
7908
7934
|
}
|
|
7909
|
-
constructor(data) {
|
|
7910
|
-
super(data);
|
|
7911
|
-
}
|
|
7912
7935
|
reset(data) {
|
|
7913
7936
|
this.__setBranch();
|
|
7914
7937
|
super.reset(data);
|
|
@@ -8026,7 +8049,7 @@ var LeaferUI = function(exports) {
|
|
|
8026
8049
|
const canvas = this.canvas = Creator.canvas(config);
|
|
8027
8050
|
this.__controllers.push(this.renderer = Creator.renderer(this, canvas, config), this.watcher = Creator.watcher(this, config), this.layouter = Creator.layouter(this, config));
|
|
8028
8051
|
if (this.isApp) this.__setApp();
|
|
8029
|
-
this.__checkAutoLayout(
|
|
8052
|
+
this.__checkAutoLayout();
|
|
8030
8053
|
this.view = canvas.view;
|
|
8031
8054
|
if (!parentApp) {
|
|
8032
8055
|
this.selector = Creator.selector(this);
|
|
@@ -8125,7 +8148,8 @@ var LeaferUI = function(exports) {
|
|
|
8125
8148
|
this.leafer = leafer;
|
|
8126
8149
|
this.__level = 1;
|
|
8127
8150
|
}
|
|
8128
|
-
__checkAutoLayout(
|
|
8151
|
+
__checkAutoLayout() {
|
|
8152
|
+
const {config: config, parentApp: parentApp} = this;
|
|
8129
8153
|
if (!parentApp) {
|
|
8130
8154
|
if (!config.width || !config.height) this.autoLayout = new AutoBounds(config);
|
|
8131
8155
|
this.canvas.startAutoLayout(this.autoLayout, this.__onResize.bind(this));
|
|
@@ -8151,9 +8175,10 @@ var LeaferUI = function(exports) {
|
|
|
8151
8175
|
return super.__getAttr(attrName);
|
|
8152
8176
|
}
|
|
8153
8177
|
__changeCanvasSize(attrName, newValue) {
|
|
8154
|
-
const
|
|
8155
|
-
data
|
|
8156
|
-
|
|
8178
|
+
const {config: config, canvas: canvas} = this;
|
|
8179
|
+
const data = DataHelper.copyAttrs({}, canvas, canvasSizeAttrs);
|
|
8180
|
+
data[attrName] = config[attrName] = newValue;
|
|
8181
|
+
config.width && config.height ? canvas.stopAutoLayout() : this.__checkAutoLayout();
|
|
8157
8182
|
this.__doResize(data);
|
|
8158
8183
|
}
|
|
8159
8184
|
__changeFill(newValue) {
|
|
@@ -8300,9 +8325,9 @@ var LeaferUI = function(exports) {
|
|
|
8300
8325
|
if (!this.parent) {
|
|
8301
8326
|
if (this.selector) this.selector.destroy();
|
|
8302
8327
|
if (this.hitCanvasManager) this.hitCanvasManager.destroy();
|
|
8303
|
-
this.canvasManager.destroy();
|
|
8328
|
+
if (this.canvasManager) this.canvasManager.destroy();
|
|
8304
8329
|
}
|
|
8305
|
-
this.canvas.destroy();
|
|
8330
|
+
if (this.canvas) this.canvas.destroy();
|
|
8306
8331
|
this.config.view = this.view = this.parentApp = null;
|
|
8307
8332
|
if (this.userConfig) this.userConfig.view = null;
|
|
8308
8333
|
super.destroy();
|
|
@@ -8325,9 +8350,6 @@ var LeaferUI = function(exports) {
|
|
|
8325
8350
|
get __tag() {
|
|
8326
8351
|
return "Rect";
|
|
8327
8352
|
}
|
|
8328
|
-
constructor(data) {
|
|
8329
|
-
super(data);
|
|
8330
|
-
}
|
|
8331
8353
|
};
|
|
8332
8354
|
__decorate([ dataProcessor(RectData) ], exports.Rect.prototype, "__", void 0);
|
|
8333
8355
|
exports.Rect = __decorate([ useModule(RectRender), rewriteAble(), registerUI() ], exports.Rect);
|
|
@@ -8439,9 +8461,6 @@ var LeaferUI = function(exports) {
|
|
|
8439
8461
|
get isFrame() {
|
|
8440
8462
|
return true;
|
|
8441
8463
|
}
|
|
8442
|
-
constructor(data) {
|
|
8443
|
-
super(data);
|
|
8444
|
-
}
|
|
8445
8464
|
};
|
|
8446
8465
|
__decorate([ dataProcessor(FrameData) ], exports.Frame.prototype, "__", void 0);
|
|
8447
8466
|
__decorate([ surfaceType("#FFFFFF") ], exports.Frame.prototype, "fill", void 0);
|
|
@@ -8452,9 +8471,6 @@ var LeaferUI = function(exports) {
|
|
|
8452
8471
|
get __tag() {
|
|
8453
8472
|
return "Ellipse";
|
|
8454
8473
|
}
|
|
8455
|
-
constructor(data) {
|
|
8456
|
-
super(data);
|
|
8457
|
-
}
|
|
8458
8474
|
__updatePath() {
|
|
8459
8475
|
const {width: width, height: height, innerRadius: innerRadius, startAngle: startAngle, endAngle: endAngle} = this.__;
|
|
8460
8476
|
const rx = width / 2, ry = height / 2;
|
|
@@ -8490,7 +8506,6 @@ var LeaferUI = function(exports) {
|
|
|
8490
8506
|
exports.Ellipse = __decorate([ registerUI() ], exports.Ellipse);
|
|
8491
8507
|
const {moveTo: moveTo$2, lineTo: lineTo$2, drawPoints: drawPoints$1} = PathCommandDataHelper;
|
|
8492
8508
|
const {rotate: rotate$1, getAngle: getAngle$1, getDistance: getDistance$2, defaultPoint: defaultPoint} = PointHelper;
|
|
8493
|
-
const {toBounds: toBounds} = PathBounds;
|
|
8494
8509
|
exports.Line = class Line extends exports.UI {
|
|
8495
8510
|
get __tag() {
|
|
8496
8511
|
return "Line";
|
|
@@ -8507,31 +8522,16 @@ var LeaferUI = function(exports) {
|
|
|
8507
8522
|
this.rotation = getAngle$1(defaultPoint, value);
|
|
8508
8523
|
if (this.height) this.height = 0;
|
|
8509
8524
|
}
|
|
8510
|
-
constructor(data) {
|
|
8511
|
-
super(data);
|
|
8512
|
-
}
|
|
8513
8525
|
__updatePath() {
|
|
8514
8526
|
const data = this.__;
|
|
8515
8527
|
const path = data.path = [];
|
|
8516
8528
|
if (data.points) {
|
|
8517
|
-
drawPoints$1(path, data.points,
|
|
8529
|
+
drawPoints$1(path, data.points, data.curve, data.closed);
|
|
8518
8530
|
} else {
|
|
8519
8531
|
moveTo$2(path, 0, 0);
|
|
8520
8532
|
lineTo$2(path, this.width, 0);
|
|
8521
8533
|
}
|
|
8522
8534
|
}
|
|
8523
|
-
__updateRenderPath() {
|
|
8524
|
-
const data = this.__;
|
|
8525
|
-
if (!this.pathInputed && data.points && data.curve) {
|
|
8526
|
-
drawPoints$1(data.__pathForRender = [], data.points, data.curve, data.closed);
|
|
8527
|
-
if (data.__useArrow) PathArrow.addArrows(this, false);
|
|
8528
|
-
} else super.__updateRenderPath();
|
|
8529
|
-
}
|
|
8530
|
-
__updateBoxBounds() {
|
|
8531
|
-
if (this.points) {
|
|
8532
|
-
toBounds(this.__.__pathForRender, this.__layout.boxBounds);
|
|
8533
|
-
} else super.__updateBoxBounds();
|
|
8534
|
-
}
|
|
8535
8535
|
};
|
|
8536
8536
|
__decorate([ dataProcessor(LineData) ], exports.Line.prototype, "__", void 0);
|
|
8537
8537
|
__decorate([ affectStrokeBoundsType("center") ], exports.Line.prototype, "strokeAlign", void 0);
|
|
@@ -8547,15 +8547,13 @@ var LeaferUI = function(exports) {
|
|
|
8547
8547
|
get __tag() {
|
|
8548
8548
|
return "Polygon";
|
|
8549
8549
|
}
|
|
8550
|
-
constructor(data) {
|
|
8551
|
-
super(data);
|
|
8552
|
-
}
|
|
8553
8550
|
__updatePath() {
|
|
8554
|
-
const
|
|
8555
|
-
|
|
8556
|
-
|
|
8551
|
+
const data = this.__;
|
|
8552
|
+
const path = data.path = [];
|
|
8553
|
+
if (data.points) {
|
|
8554
|
+
drawPoints(path, data.points, data.curve, true);
|
|
8557
8555
|
} else {
|
|
8558
|
-
const {width: width, height: height, sides: sides} =
|
|
8556
|
+
const {width: width, height: height, sides: sides} = data;
|
|
8559
8557
|
const rx = width / 2, ry = height / 2;
|
|
8560
8558
|
moveTo$1(path, rx, 0);
|
|
8561
8559
|
for (let i = 1; i < sides; i++) {
|
|
@@ -8580,9 +8578,6 @@ var LeaferUI = function(exports) {
|
|
|
8580
8578
|
get __tag() {
|
|
8581
8579
|
return "Star";
|
|
8582
8580
|
}
|
|
8583
|
-
constructor(data) {
|
|
8584
|
-
super(data);
|
|
8585
|
-
}
|
|
8586
8581
|
__updatePath() {
|
|
8587
8582
|
const {width: width, height: height, corners: corners, innerRadius: innerRadius} = this.__;
|
|
8588
8583
|
const rx = width / 2, ry = height / 2;
|
|
@@ -8610,9 +8605,6 @@ var LeaferUI = function(exports) {
|
|
|
8610
8605
|
const {fill: fill} = this.__;
|
|
8611
8606
|
return isArray(fill) && fill[0].image;
|
|
8612
8607
|
}
|
|
8613
|
-
constructor(data) {
|
|
8614
|
-
super(data);
|
|
8615
|
-
}
|
|
8616
8608
|
};
|
|
8617
8609
|
__decorate([ dataProcessor(ImageData) ], exports.Image.prototype, "__", void 0);
|
|
8618
8610
|
__decorate([ boundsType("") ], exports.Image.prototype, "url", void 0);
|
|
@@ -8697,9 +8689,6 @@ var LeaferUI = function(exports) {
|
|
|
8697
8689
|
this.updateLayout();
|
|
8698
8690
|
return this.__.__textDrawData;
|
|
8699
8691
|
}
|
|
8700
|
-
constructor(data) {
|
|
8701
|
-
super(data);
|
|
8702
|
-
}
|
|
8703
8692
|
__updateTextDrawData() {
|
|
8704
8693
|
const data = this.__;
|
|
8705
8694
|
const {lineHeight: lineHeight, letterSpacing: letterSpacing, fontFamily: fontFamily, fontSize: fontSize, fontWeight: fontWeight, italic: italic, textCase: textCase, textOverflow: textOverflow, padding: padding} = data;
|
|
@@ -8803,9 +8792,6 @@ var LeaferUI = function(exports) {
|
|
|
8803
8792
|
get __tag() {
|
|
8804
8793
|
return "Path";
|
|
8805
8794
|
}
|
|
8806
|
-
constructor(data) {
|
|
8807
|
-
super(data);
|
|
8808
|
-
}
|
|
8809
8795
|
};
|
|
8810
8796
|
__decorate([ dataProcessor(PathData) ], exports.Path.prototype, "__", void 0);
|
|
8811
8797
|
__decorate([ affectStrokeBoundsType("center") ], exports.Path.prototype, "strokeAlign", void 0);
|
|
@@ -8814,9 +8800,6 @@ var LeaferUI = function(exports) {
|
|
|
8814
8800
|
get __tag() {
|
|
8815
8801
|
return "Pen";
|
|
8816
8802
|
}
|
|
8817
|
-
constructor(data) {
|
|
8818
|
-
super(data);
|
|
8819
|
-
}
|
|
8820
8803
|
setStyle(data) {
|
|
8821
8804
|
const path = this.pathElement = new exports.Path(data);
|
|
8822
8805
|
this.pathStyle = data;
|
|
@@ -9462,7 +9445,7 @@ var LeaferUI = function(exports) {
|
|
|
9462
9445
|
if (leafer && leafer.viewReady) leafer.renderer.ignore = value;
|
|
9463
9446
|
}
|
|
9464
9447
|
const {get: get$1, scale: scale, copy: copy$1} = MatrixHelper;
|
|
9465
|
-
const {floor: floor, max: max, abs: abs} = Math;
|
|
9448
|
+
const {floor: floor, ceil: ceil, max: max, abs: abs} = Math;
|
|
9466
9449
|
function createPattern(ui, paint, pixelRatio) {
|
|
9467
9450
|
let {scaleX: scaleX, scaleY: scaleY} = ui.getRenderScaleData(true, paint.scaleFixed);
|
|
9468
9451
|
const id = scaleX + "-" + scaleY + "-" + pixelRatio;
|
|
@@ -9471,8 +9454,6 @@ var LeaferUI = function(exports) {
|
|
|
9471
9454
|
let imageScale, imageMatrix, {width: width, height: height, scaleX: sx, scaleY: sy, transform: transform, repeat: repeat, gap: gap} = data;
|
|
9472
9455
|
scaleX *= pixelRatio;
|
|
9473
9456
|
scaleY *= pixelRatio;
|
|
9474
|
-
const xGap = gap && gap.x * scaleX;
|
|
9475
|
-
const yGap = gap && gap.y * scaleY;
|
|
9476
9457
|
if (sx) {
|
|
9477
9458
|
sx = abs(sx);
|
|
9478
9459
|
sy = abs(sy);
|
|
@@ -9489,7 +9470,10 @@ var LeaferUI = function(exports) {
|
|
|
9489
9470
|
if (size > Platform.image.maxCacheSize) return false;
|
|
9490
9471
|
}
|
|
9491
9472
|
let maxSize = Platform.image.maxPatternSize;
|
|
9492
|
-
if (
|
|
9473
|
+
if (image.isSVG) {
|
|
9474
|
+
const ws = width / image.width;
|
|
9475
|
+
if (ws > 1) imageScale = ws / ceil(ws);
|
|
9476
|
+
} else {
|
|
9493
9477
|
const imageSize = image.width * image.height;
|
|
9494
9478
|
if (maxSize > imageSize) maxSize = imageSize;
|
|
9495
9479
|
}
|
|
@@ -9504,18 +9488,20 @@ var LeaferUI = function(exports) {
|
|
|
9504
9488
|
scaleX /= sx;
|
|
9505
9489
|
scaleY /= sy;
|
|
9506
9490
|
}
|
|
9491
|
+
const xGap = gap && gap.x * scaleX;
|
|
9492
|
+
const yGap = gap && gap.y * scaleY;
|
|
9507
9493
|
if (transform || scaleX !== 1 || scaleY !== 1) {
|
|
9494
|
+
const canvasWidth = width + (xGap || 0);
|
|
9495
|
+
const canvasHeight = height + (yGap || 0);
|
|
9496
|
+
scaleX /= canvasWidth / max(floor(canvasWidth), 1);
|
|
9497
|
+
scaleY /= canvasHeight / max(floor(canvasHeight), 1);
|
|
9508
9498
|
if (!imageMatrix) {
|
|
9509
9499
|
imageMatrix = get$1();
|
|
9510
9500
|
if (transform) copy$1(imageMatrix, transform);
|
|
9511
9501
|
}
|
|
9512
9502
|
scale(imageMatrix, 1 / scaleX, 1 / scaleY);
|
|
9513
9503
|
}
|
|
9514
|
-
|
|
9515
|
-
const canvasWidth = width + (xGap || 0), canvasHeight = height + (yGap || 0);
|
|
9516
|
-
scale(imageMatrix, canvasWidth / max(floor(canvasWidth), 1), canvasHeight / max(floor(canvasHeight), 1));
|
|
9517
|
-
}
|
|
9518
|
-
const canvas = image.getCanvas(width, height, data.opacity, data.filters, xGap, yGap);
|
|
9504
|
+
const canvas = image.getCanvas(width, height, data.opacity, data.filters, xGap, yGap, ui.leafer && ui.leafer.config.smooth);
|
|
9519
9505
|
const pattern = image.getPattern(canvas, repeat || (Platform.origin.noRepeat || "no-repeat"), imageMatrix, paint);
|
|
9520
9506
|
paint.style = pattern;
|
|
9521
9507
|
paint.patternId = id;
|
|
@@ -10511,6 +10497,7 @@ var LeaferUI = function(exports) {
|
|
|
10511
10497
|
exports.maskType = maskType;
|
|
10512
10498
|
exports.naturalBoundsType = naturalBoundsType;
|
|
10513
10499
|
exports.opacityType = opacityType;
|
|
10500
|
+
exports.path = path;
|
|
10514
10501
|
exports.pathInputType = pathInputType;
|
|
10515
10502
|
exports.pathType = pathType;
|
|
10516
10503
|
exports.pen = pen;
|