leafer-draw 1.12.1 → 1.12.2

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.
@@ -461,7 +461,7 @@ function getMatrixData() {
461
461
 
462
462
  const {sin: sin$5, cos: cos$5, acos: acos, sqrt: sqrt$3} = Math;
463
463
 
464
- const {float: float$1} = MathHelper;
464
+ const {float: float$2} = MathHelper;
465
465
 
466
466
  const tempPoint$3 = {};
467
467
 
@@ -712,12 +712,12 @@ const MatrixHelper = {
712
712
  const cosR = c / scaleY;
713
713
  rotation = PI_2 - (d > 0 ? acos(-cosR) : -acos(cosR));
714
714
  }
715
- const cosR = float$1(cos$5(rotation));
715
+ const cosR = float$2(cos$5(rotation));
716
716
  const sinR = sin$5(rotation);
717
- scaleX = float$1(scaleX), scaleY = float$1(scaleY);
718
- skewX = cosR ? float$1((c / scaleY + sinR) / cosR / OneRadian, 9) : 0;
719
- skewY = cosR ? float$1((b / scaleX - sinR) / cosR / OneRadian, 9) : 0;
720
- rotation = float$1(rotation / OneRadian);
717
+ scaleX = float$2(scaleX), scaleY = float$2(scaleY);
718
+ skewX = cosR ? float$2((c / scaleY + sinR) / cosR / OneRadian, 9) : 0;
719
+ skewY = cosR ? float$2((b / scaleX - sinR) / cosR / OneRadian, 9) : 0;
720
+ rotation = float$2(rotation / OneRadian);
721
721
  } else {
722
722
  scaleX = a;
723
723
  scaleY = d;
@@ -761,6 +761,8 @@ const MatrixHelper = {
761
761
 
762
762
  const M$6 = MatrixHelper;
763
763
 
764
+ const {float: float$1} = MathHelper;
765
+
764
766
  const {toInnerPoint: toInnerPoint$2, toOuterPoint: toOuterPoint$3} = MatrixHelper;
765
767
 
766
768
  const {sin: sin$4, cos: cos$4, abs: abs$4, sqrt: sqrt$2, atan2: atan2$2, min: min$1, round: round$2} = Math;
@@ -828,6 +830,11 @@ const PointHelper = {
828
830
  P$5.toInnerRadiusPointOf(t, matrix, temp);
829
831
  return temp;
830
832
  },
833
+ copyRadiusPoint(t, point, x, y) {
834
+ copy$9(t, point);
835
+ setRadius(t, x, y);
836
+ return t;
837
+ },
831
838
  toInnerRadiusPointOf(t, matrix, to) {
832
839
  to || (to = t);
833
840
  toInnerPoint$2(matrix, t, to);
@@ -895,7 +902,7 @@ const PointHelper = {
895
902
  return points;
896
903
  },
897
904
  isSame(t, point) {
898
- return t.x === point.x && t.y === point.y;
905
+ return float$1(t.x) === float$1(point.x) && float$1(t.y) === float$1(point.y);
899
906
  },
900
907
  reset(t) {
901
908
  P$5.reset(t);
@@ -904,7 +911,7 @@ const PointHelper = {
904
911
 
905
912
  const P$5 = PointHelper;
906
913
 
907
- const {getDistanceFrom: getDistanceFrom, copy: copy$9, getAtan2: getAtan2} = P$5;
914
+ const {getDistanceFrom: getDistanceFrom, copy: copy$9, setRadius: setRadius, getAtan2: getAtan2} = P$5;
908
915
 
909
916
  class Point {
910
917
  constructor(x, y) {
@@ -2407,7 +2414,7 @@ class LeaferCanvasBase extends Canvas$1 {
2407
2414
  const {pixelRatio: pixelRatio} = this;
2408
2415
  this.filter = `blur(${blur * pixelRatio}px)`;
2409
2416
  }
2410
- copyWorld(canvas, from, to, blendMode, ceilPixel = true) {
2417
+ copyWorld(canvas, from, to, blendMode, ceilPixel) {
2411
2418
  if (blendMode) this.blendMode = blendMode;
2412
2419
  if (from) {
2413
2420
  this.setTempPixelBounds(from, ceilPixel);
@@ -2418,7 +2425,7 @@ class LeaferCanvasBase extends Canvas$1 {
2418
2425
  }
2419
2426
  if (blendMode) this.blendMode = "source-over";
2420
2427
  }
2421
- copyWorldToInner(canvas, fromWorld, toInnerBounds, blendMode, ceilPixel = true) {
2428
+ copyWorldToInner(canvas, fromWorld, toInnerBounds, blendMode, ceilPixel) {
2422
2429
  if (fromWorld.b || fromWorld.c) {
2423
2430
  this.save();
2424
2431
  this.resetTransform();
@@ -2431,7 +2438,7 @@ class LeaferCanvasBase extends Canvas$1 {
2431
2438
  if (blendMode) this.blendMode = "source-over";
2432
2439
  }
2433
2440
  }
2434
- copyWorldByReset(canvas, from, to, blendMode, onlyResetTransform, ceilPixel = true) {
2441
+ copyWorldByReset(canvas, from, to, blendMode, onlyResetTransform, ceilPixel) {
2435
2442
  this.resetTransform();
2436
2443
  this.copyWorld(canvas, from, to, blendMode, ceilPixel);
2437
2444
  if (!onlyResetTransform) this.useWorldTransform();
@@ -2658,7 +2665,7 @@ const BezierHelper = {
2658
2665
  data.push(M$5, points[0], points[1]);
2659
2666
  if (curve && points.length > 5) {
2660
2667
  let aX, aY, bX, bY, cX, cY, c1X, c1Y, c2X, c2Y;
2661
- let ba, cb, d, len = points.length;
2668
+ let baX, baY, ba, cb, d, len = points.length;
2662
2669
  const t = curve === true ? .5 : curve;
2663
2670
  if (close) {
2664
2671
  points = [ points[len - 2], points[len - 1], ...points, points[0], points[1], points[2], points[3] ];
@@ -2671,7 +2678,9 @@ const BezierHelper = {
2671
2678
  bY = points[i + 1];
2672
2679
  cX = points[i + 2];
2673
2680
  cY = points[i + 3];
2674
- ba = sqrt$1(pow(bX - aX, 2) + pow(bY - aY, 2));
2681
+ baX = bX - aX;
2682
+ baY = bY - aY;
2683
+ ba = sqrt$1(pow(baX, 2) + pow(baY, 2));
2675
2684
  cb = sqrt$1(pow(cX - bX, 2) + pow(cY - bY, 2));
2676
2685
  if (!ba && !cb) continue;
2677
2686
  d = ba + cb;
@@ -2684,7 +2693,7 @@ const BezierHelper = {
2684
2693
  if (i === 2) {
2685
2694
  if (!close) data.push(Q$4, c1X, c1Y, bX, bY);
2686
2695
  } else {
2687
- data.push(C$4, c2X, c2Y, c1X, c1Y, bX, bY);
2696
+ if (baX || baY) data.push(C$4, c2X, c2Y, c1X, c1Y, bX, bY);
2688
2697
  }
2689
2698
  c2X = bX + cb * cX;
2690
2699
  c2Y = bY + cb * cY;
@@ -3269,6 +3278,7 @@ const PathCommandDataHelper = {
3269
3278
  }
3270
3279
  },
3271
3280
  ellipse(data, x, y, radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise) {
3281
+ if (radiusX === radiusY) return arc$2(data, x, y, radiusX, startAngle, endAngle, anticlockwise);
3272
3282
  if (isNull(rotation)) {
3273
3283
  data.push(F$3, x, y, radiusX, radiusY);
3274
3284
  } else {
@@ -3281,6 +3291,7 @@ const PathCommandDataHelper = {
3281
3291
  if (isNull(startAngle)) {
3282
3292
  data.push(P$2, x, y, radius);
3283
3293
  } else {
3294
+ if (isNull(startAngle)) startAngle = 0;
3284
3295
  if (isNull(endAngle)) endAngle = 360;
3285
3296
  data.push(O$2, x, y, radius, startAngle, endAngle, anticlockwise ? 1 : 0);
3286
3297
  }
@@ -3631,6 +3642,7 @@ const PathCorner = {
3631
3642
  smooth(data, cornerRadius, _cornerSmoothing) {
3632
3643
  let command, lastCommand, commandLen;
3633
3644
  let i = 0, x = 0, y = 0, startX = 0, startY = 0, secondX = 0, secondY = 0, lastX = 0, lastY = 0;
3645
+ if (isArray(cornerRadius)) cornerRadius = cornerRadius[0] || 0;
3634
3646
  const len = data.length;
3635
3647
  const smooth = [];
3636
3648
  while (i < len) {
@@ -4046,7 +4058,9 @@ const R = Resource;
4046
4058
  const ImageManager = {
4047
4059
  maxRecycled: 10,
4048
4060
  recycledList: [],
4049
- patternTasker: new TaskProcessor,
4061
+ patternTasker: new TaskProcessor({
4062
+ parallel: 1
4063
+ }),
4050
4064
  get(config) {
4051
4065
  let image = Resource.get(config.url);
4052
4066
  if (!image) Resource.set(config.url, image = Creator.image(config));
@@ -6923,7 +6937,7 @@ class LeafLevelList {
6923
6937
  }
6924
6938
  }
6925
6939
 
6926
- const version = "1.12.1";
6940
+ const version = "1.12.2";
6927
6941
 
6928
6942
  const debug$4 = Debug.get("LeaferCanvas");
6929
6943
 
@@ -6955,6 +6969,7 @@ class LeaferCanvas extends LeaferCanvasBase {
6955
6969
  if (this.parentView) {
6956
6970
  const pStyle = this.parentView.style;
6957
6971
  pStyle.webkitUserSelect = pStyle.userSelect = "none";
6972
+ this.view.classList.add("leafer-canvas-view");
6958
6973
  }
6959
6974
  if (Platform.syncDomFont && !this.parentView) {
6960
6975
  style.display = "none";
@@ -7014,19 +7029,9 @@ class LeaferCanvas extends LeaferCanvasBase {
7014
7029
  updateViewSize() {
7015
7030
  const {width: width, height: height, pixelRatio: pixelRatio} = this;
7016
7031
  const {style: style} = this.view;
7017
- if (this.unreal) {
7018
- const {config: config, autoWidthStr: autoWidthStr, autoHeightStr: autoHeightStr} = this;
7019
- if (config.width) {
7020
- if (isUndefined(autoWidthStr)) this.autoWidthStr = style.width || "";
7021
- style.width = config.width + "px";
7022
- } else if (!isUndefined(autoWidthStr)) style.width = autoWidthStr;
7023
- if (config.height) {
7024
- if (isUndefined(autoHeightStr)) this.autoHeightStr = style.height || "";
7025
- style.height = config.height + "px";
7026
- } else if (!isUndefined(autoHeightStr)) style.height = autoHeightStr;
7027
- } else {
7028
- style.width = width + "px";
7029
- style.height = height + "px";
7032
+ style.width = width + "px";
7033
+ style.height = height + "px";
7034
+ if (!this.unreal) {
7030
7035
  this.view.width = Math.ceil(width * pixelRatio);
7031
7036
  this.view.height = Math.ceil(height * pixelRatio);
7032
7037
  }
@@ -7114,20 +7119,20 @@ class LeaferCanvas extends LeaferCanvasBase {
7114
7119
  }
7115
7120
  unrealCanvas() {
7116
7121
  if (!this.unreal && this.parentView) {
7117
- const view = this.view;
7122
+ let view = this.view;
7118
7123
  if (view) view.remove();
7119
- this.view = this.parentView;
7124
+ view = this.view = document.createElement("div");
7125
+ this.parentView.appendChild(this.view);
7126
+ view.classList.add("leafer-app-view");
7120
7127
  this.unreal = true;
7121
7128
  }
7122
7129
  }
7123
7130
  destroy() {
7124
- if (this.view) {
7131
+ const {view: view} = this;
7132
+ if (view) {
7125
7133
  this.stopAutoLayout();
7126
7134
  this.stopListenPixelRatio();
7127
- if (!this.unreal) {
7128
- const view = this.view;
7129
- if (view.parentElement) view.remove();
7130
- }
7135
+ if (view.parentElement) view.remove();
7131
7136
  super.destroy();
7132
7137
  }
7133
7138
  }
@@ -8293,7 +8298,7 @@ const UIRender = {
8293
8298
  if (stroke && !__fillAfterStroke) data.__isStrokes ? Paint.strokes(stroke, this, canvas, options) : Paint.stroke(stroke, this, canvas, options);
8294
8299
  }
8295
8300
  } else {
8296
- if (data.__pathInputed) drawFast(this, canvas, options); else this.__drawFast(canvas, options);
8301
+ if (data.__pathForRender) drawFast(this, canvas, options); else this.__drawFast(canvas, options);
8297
8302
  }
8298
8303
  },
8299
8304
  __drawShape(canvas, options) {
@@ -8417,7 +8422,7 @@ let UI = UI_1 = class UI extends Leaf {
8417
8422
  getPath(curve, pathForRender) {
8418
8423
  this.__layout.update();
8419
8424
  let path = pathForRender ? this.__.__pathForRender : this.__.path;
8420
- if (!path) pen.set(path = []), this.__drawPathByBox(pen);
8425
+ if (!path) pen.set(path = []), this.__drawPathByBox(pen, !pathForRender);
8421
8426
  return curve ? PathConvert.toCanvasData(path, true) : path;
8422
8427
  }
8423
8428
  getPathString(curve, pathForRender, floatLength) {
@@ -8445,17 +8450,18 @@ let UI = UI_1 = class UI extends Leaf {
8445
8450
  }
8446
8451
  __drawPath(canvas) {
8447
8452
  canvas.beginPath();
8448
- this.__drawPathByData(canvas, this.__.path);
8453
+ this.__drawPathByData(canvas, this.__.path, true);
8449
8454
  }
8450
- __drawPathByData(drawer, data) {
8451
- data ? PathDrawer.drawPathByData(drawer, data) : this.__drawPathByBox(drawer);
8455
+ __drawPathByData(drawer, data, ignoreCornerRadius) {
8456
+ data ? PathDrawer.drawPathByData(drawer, data) : this.__drawPathByBox(drawer, ignoreCornerRadius);
8452
8457
  }
8453
- __drawPathByBox(drawer) {
8458
+ __drawPathByBox(drawer, ignoreCornerRadius) {
8454
8459
  const {x: x, y: y, width: width, height: height} = this.__layout.boxBounds;
8455
- if (this.__.cornerRadius) {
8460
+ if (this.__.cornerRadius && !ignoreCornerRadius) {
8456
8461
  const {cornerRadius: cornerRadius} = this.__;
8457
8462
  drawer.roundRect(x, y, width, height, isNumber(cornerRadius) ? [ cornerRadius ] : cornerRadius);
8458
8463
  } else drawer.rect(x, y, width, height);
8464
+ drawer.closePath();
8459
8465
  }
8460
8466
  drawImagePlaceholder(_paint, canvas, renderOptions) {
8461
8467
  Paint.fill(this.__.placeholderColor, this, canvas, renderOptions);
@@ -8724,6 +8730,9 @@ let Leafer = Leafer_1 = class Leafer extends Group {
8724
8730
  get layoutLocked() {
8725
8731
  return !this.layouter.running;
8726
8732
  }
8733
+ get view() {
8734
+ return this.canvas && this.canvas.view;
8735
+ }
8727
8736
  get FPS() {
8728
8737
  return this.renderer ? this.renderer.FPS : 60;
8729
8738
  }
@@ -8775,7 +8784,6 @@ let Leafer = Leafer_1 = class Leafer extends Group {
8775
8784
  this.__controllers.push(this.renderer = Creator.renderer(this, canvas, config), this.watcher = Creator.watcher(this, config), this.layouter = Creator.layouter(this, config));
8776
8785
  if (this.isApp) this.__setApp();
8777
8786
  this.__checkAutoLayout();
8778
- this.view = canvas.view;
8779
8787
  if (!parentApp) {
8780
8788
  this.selector = Creator.selector(this);
8781
8789
  this.interaction = Creator.interaction(this, canvas, this.selector, config);
@@ -9055,7 +9063,7 @@ let Leafer = Leafer_1 = class Leafer extends Group {
9055
9063
  if (this.canvasManager) this.canvasManager.destroy();
9056
9064
  }
9057
9065
  if (this.canvas) this.canvas.destroy();
9058
- this.config.view = this.view = this.parentApp = null;
9066
+ this.config.view = this.parentApp = null;
9059
9067
  if (this.userConfig) this.userConfig.view = null;
9060
9068
  super.destroy();
9061
9069
  setTimeout(() => {
@@ -9239,7 +9247,6 @@ let Ellipse = class Ellipse extends UI {
9239
9247
  if (startAngle || endAngle) {
9240
9248
  if (innerRadius < 1) ellipse(path, rx, ry, rx * innerRadius, ry * innerRadius, 0, startAngle, endAngle, false);
9241
9249
  ellipse(path, rx, ry, rx, ry, 0, endAngle, startAngle, true);
9242
- if (innerRadius < 1) closePath$2(path);
9243
9250
  } else {
9244
9251
  if (innerRadius < 1) {
9245
9252
  ellipse(path, rx, ry, rx * innerRadius, ry * innerRadius);
@@ -9247,16 +9254,16 @@ let Ellipse = class Ellipse extends UI {
9247
9254
  }
9248
9255
  ellipse(path, rx, ry, rx, ry, 0, 360, 0, true);
9249
9256
  }
9250
- if (Platform.ellipseToCurve) this.__.path = this.getPath(true);
9251
9257
  } else {
9252
9258
  if (startAngle || endAngle) {
9253
9259
  moveTo$3(path, rx, ry);
9254
9260
  ellipse(path, rx, ry, rx, ry, 0, startAngle, endAngle, false);
9255
- closePath$2(path);
9256
9261
  } else {
9257
9262
  ellipse(path, rx, ry, rx, ry);
9258
9263
  }
9259
9264
  }
9265
+ closePath$2(path);
9266
+ if (Platform.ellipseToCurve) this.__.path = this.getPath(true);
9260
9267
  }
9261
9268
  };
9262
9269
 
@@ -10357,10 +10364,12 @@ const {getFloorScale: getFloorScale} = MathHelper, {abs: abs$1} = Math;
10357
10364
  function createPatternTask(paint, ui, canvas, renderOptions) {
10358
10365
  if (!paint.patternTask) {
10359
10366
  paint.patternTask = ImageManager.patternTasker.add(() => __awaiter(this, void 0, void 0, function*() {
10360
- paint.patternTask = null;
10361
- if (canvas.bounds.hit(ui.__nowWorld)) PaintImage.createPattern(paint, ui, canvas, renderOptions);
10367
+ PaintImage.createPattern(paint, ui, canvas, renderOptions);
10362
10368
  ui.forceUpdate("surface");
10363
- }), 300);
10369
+ }), 0, () => {
10370
+ paint.patternTask = null;
10371
+ return canvas.bounds.hit(ui.__nowWorld);
10372
+ });
10364
10373
  }
10365
10374
  }
10366
10375