@leafer-ui/worker 1.5.3 → 1.6.0
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/worker.cjs +68 -71
- package/dist/worker.cjs.map +1 -1
- package/dist/worker.esm.js +68 -71
- package/dist/worker.esm.js.map +1 -1
- package/dist/worker.esm.min.js +1 -1
- package/dist/worker.esm.min.js.map +1 -1
- package/dist/worker.js +303 -192
- package/dist/worker.js.map +1 -1
- package/dist/worker.min.cjs +1 -1
- package/dist/worker.min.cjs.map +1 -1
- package/dist/worker.min.js +1 -1
- package/dist/worker.min.js.map +1 -1
- package/dist/worker.module.js +303 -192
- package/dist/worker.module.js.map +1 -1
- package/dist/worker.module.min.js +1 -1
- package/dist/worker.module.min.js.map +1 -1
- package/package.json +11 -10
- package/src/core.ts +86 -0
- package/src/index.ts +2 -2
- package/types/index.d.ts +8 -1
package/dist/worker.cjs
CHANGED
|
@@ -242,7 +242,6 @@ function updateChange(updateList) {
|
|
|
242
242
|
}
|
|
243
243
|
|
|
244
244
|
const { worldBounds } = core.LeafBoundsHelper;
|
|
245
|
-
const bigBounds = { x: 0, y: 0, width: 100000, height: 100000 };
|
|
246
245
|
class LayoutBlockData {
|
|
247
246
|
constructor(list) {
|
|
248
247
|
this.updatedBounds = new core.Bounds();
|
|
@@ -256,13 +255,7 @@ class LayoutBlockData {
|
|
|
256
255
|
this.beforeBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
257
256
|
}
|
|
258
257
|
setAfter() {
|
|
259
|
-
|
|
260
|
-
if (list.some(leaf => leaf.noBounds)) {
|
|
261
|
-
this.afterBounds.set(bigBounds);
|
|
262
|
-
}
|
|
263
|
-
else {
|
|
264
|
-
this.afterBounds.setListWithFn(list, worldBounds);
|
|
265
|
-
}
|
|
258
|
+
this.afterBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
266
259
|
this.updatedBounds.setList([this.beforeBounds, this.afterBounds]);
|
|
267
260
|
}
|
|
268
261
|
merge(data) {
|
|
@@ -464,6 +457,13 @@ class Renderer {
|
|
|
464
457
|
requestLayout() {
|
|
465
458
|
this.target.emit(core.LayoutEvent.REQUEST);
|
|
466
459
|
}
|
|
460
|
+
checkRender() {
|
|
461
|
+
if (this.running) {
|
|
462
|
+
if (this.changed && this.canvas.view)
|
|
463
|
+
this.render();
|
|
464
|
+
this.target.emit(core.RenderEvent.NEXT);
|
|
465
|
+
}
|
|
466
|
+
}
|
|
467
467
|
render(callback) {
|
|
468
468
|
if (!(this.running && this.canvas.view))
|
|
469
469
|
return this.update();
|
|
@@ -472,8 +472,6 @@ class Renderer {
|
|
|
472
472
|
this.totalBounds = new core.Bounds();
|
|
473
473
|
debug.log(target.innerName, '--->');
|
|
474
474
|
try {
|
|
475
|
-
if (!target.isApp)
|
|
476
|
-
target.app.emit(core.RenderEvent.CHILD_START, target);
|
|
477
475
|
this.emitRender(core.RenderEvent.START);
|
|
478
476
|
this.renderOnce(callback);
|
|
479
477
|
this.emitRender(core.RenderEvent.END, this.totalBounds);
|
|
@@ -541,20 +539,12 @@ class Renderer {
|
|
|
541
539
|
}
|
|
542
540
|
clipRender(block) {
|
|
543
541
|
const t = core.Run.start('PartRender');
|
|
544
|
-
const { canvas } = this;
|
|
545
|
-
const bounds = block.getIntersect(canvas.bounds);
|
|
546
|
-
const includes = block.includes(this.target.__world);
|
|
547
|
-
const realBounds = new core.Bounds(bounds);
|
|
542
|
+
const { canvas } = this, bounds = block.getIntersect(canvas.bounds), realBounds = new core.Bounds(bounds);
|
|
548
543
|
canvas.save();
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
bounds.spread(10 + 1 / this.canvas.pixelRatio).ceil();
|
|
554
|
-
canvas.clearWorld(bounds, true);
|
|
555
|
-
canvas.clipWorld(bounds, true);
|
|
556
|
-
}
|
|
557
|
-
this.__render(bounds, includes, realBounds);
|
|
544
|
+
bounds.spread(Renderer.clipSpread).ceil();
|
|
545
|
+
canvas.clearWorld(bounds, true);
|
|
546
|
+
canvas.clipWorld(bounds, true);
|
|
547
|
+
this.__render(bounds, block.includes(this.target.__world), realBounds);
|
|
558
548
|
canvas.restore();
|
|
559
549
|
core.Run.end(t);
|
|
560
550
|
}
|
|
@@ -568,23 +558,17 @@ class Renderer {
|
|
|
568
558
|
core.Run.end(t);
|
|
569
559
|
}
|
|
570
560
|
__render(bounds, includes, realBounds) {
|
|
571
|
-
const options =
|
|
561
|
+
const { canvas } = this, options = includes ? { includes } : { bounds, includes };
|
|
572
562
|
if (this.needFill)
|
|
573
|
-
|
|
563
|
+
canvas.fillWorld(bounds, this.config.fill);
|
|
574
564
|
if (core.Debug.showRepaint)
|
|
575
|
-
|
|
576
|
-
this.target.__render(
|
|
565
|
+
core.Debug.drawRepaint(canvas, bounds);
|
|
566
|
+
this.target.__render(canvas, options);
|
|
577
567
|
this.renderBounds = realBounds = realBounds || bounds;
|
|
578
568
|
this.renderOptions = options;
|
|
579
569
|
this.totalBounds.isEmpty() ? this.totalBounds = realBounds : this.totalBounds.add(realBounds);
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
if (core.Debug.showBoundsView)
|
|
583
|
-
this.renderBoundsView(options);
|
|
584
|
-
this.canvas.updateRender(realBounds);
|
|
585
|
-
}
|
|
586
|
-
renderHitView(_options) { }
|
|
587
|
-
renderBoundsView(_options) { }
|
|
570
|
+
canvas.updateRender(realBounds);
|
|
571
|
+
}
|
|
588
572
|
addBlock(block) {
|
|
589
573
|
if (!this.updateBlocks)
|
|
590
574
|
this.updateBlocks = [];
|
|
@@ -600,17 +584,24 @@ class Renderer {
|
|
|
600
584
|
}
|
|
601
585
|
}
|
|
602
586
|
__requestRender() {
|
|
587
|
+
const target = this.target;
|
|
588
|
+
if (target.parentApp)
|
|
589
|
+
return target.parentApp.renderer.update(false);
|
|
603
590
|
if (this.requestTime)
|
|
604
591
|
return;
|
|
605
592
|
const requestTime = this.requestTime = Date.now();
|
|
606
593
|
core.Platform.requestRender(() => {
|
|
607
594
|
this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() - requestTime)));
|
|
608
595
|
this.requestTime = 0;
|
|
609
|
-
if (
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
596
|
+
if (target.isApp) {
|
|
597
|
+
target.emit(core.RenderEvent.CHILD_START, target);
|
|
598
|
+
target.children.forEach(leafer => {
|
|
599
|
+
leafer.renderer.FPS = this.FPS;
|
|
600
|
+
leafer.renderer.checkRender();
|
|
601
|
+
});
|
|
602
|
+
target.emit(core.RenderEvent.CHILD_END, target);
|
|
613
603
|
}
|
|
604
|
+
this.checkRender();
|
|
614
605
|
});
|
|
615
606
|
}
|
|
616
607
|
__onResize(e) {
|
|
@@ -668,6 +659,7 @@ class Renderer {
|
|
|
668
659
|
}
|
|
669
660
|
}
|
|
670
661
|
}
|
|
662
|
+
Renderer.clipSpread = 10;
|
|
671
663
|
|
|
672
664
|
const { hitRadiusPoint } = core.BoundsHelper;
|
|
673
665
|
class Picker {
|
|
@@ -1187,9 +1179,11 @@ const tempBox = new core.Bounds();
|
|
|
1187
1179
|
const tempPoint = {};
|
|
1188
1180
|
const tempScaleData = {};
|
|
1189
1181
|
function createData(leafPaint, image, paint, box) {
|
|
1190
|
-
const { blendMode, sync } = paint;
|
|
1182
|
+
const { blendMode, changeful, sync } = paint;
|
|
1191
1183
|
if (blendMode)
|
|
1192
1184
|
leafPaint.blendMode = blendMode;
|
|
1185
|
+
if (changeful)
|
|
1186
|
+
leafPaint.changeful = changeful;
|
|
1193
1187
|
if (sync)
|
|
1194
1188
|
leafPaint.sync = sync;
|
|
1195
1189
|
leafPaint.data = getPatternData(paint, box, image);
|
|
@@ -1454,40 +1448,32 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
1454
1448
|
};
|
|
1455
1449
|
|
|
1456
1450
|
const { abs } = Math;
|
|
1457
|
-
function checkImage(ui, canvas, paint,
|
|
1451
|
+
function checkImage(ui, canvas, paint, allowDraw) {
|
|
1458
1452
|
const { scaleX, scaleY } = core.ImageManager.patternLocked ? ui.__world : ui.__nowWorld;
|
|
1459
|
-
const { pixelRatio } = canvas;
|
|
1460
|
-
if (!
|
|
1453
|
+
const { pixelRatio } = canvas, { data } = paint;
|
|
1454
|
+
if (!data || (paint.patternId === scaleX + '-' + scaleY + '-' + pixelRatio && !draw.Export.running)) {
|
|
1461
1455
|
return false;
|
|
1462
1456
|
}
|
|
1463
1457
|
else {
|
|
1464
|
-
|
|
1465
|
-
|
|
1466
|
-
|
|
1467
|
-
let { width, height } = data;
|
|
1468
|
-
width *= abs(scaleX) * pixelRatio;
|
|
1469
|
-
height *= abs(scaleY) * pixelRatio;
|
|
1470
|
-
if (data.scaleX) {
|
|
1471
|
-
width *= data.scaleX;
|
|
1472
|
-
height *= data.scaleY;
|
|
1473
|
-
}
|
|
1474
|
-
allowPaint = (width * height > core.Platform.image.maxCacheSize) || draw.Export.running;
|
|
1458
|
+
if (allowDraw) {
|
|
1459
|
+
if (data.repeat) {
|
|
1460
|
+
allowDraw = false;
|
|
1475
1461
|
}
|
|
1476
1462
|
else {
|
|
1477
|
-
|
|
1463
|
+
if (!(paint.changeful || core.ResizeEvent.isResizing(ui) || draw.Export.running)) {
|
|
1464
|
+
let { width, height } = data;
|
|
1465
|
+
width *= abs(scaleX) * pixelRatio;
|
|
1466
|
+
height *= abs(scaleY) * pixelRatio;
|
|
1467
|
+
if (data.scaleX) {
|
|
1468
|
+
width *= data.scaleX;
|
|
1469
|
+
height *= data.scaleY;
|
|
1470
|
+
}
|
|
1471
|
+
allowDraw = (width * height > core.Platform.image.maxCacheSize);
|
|
1472
|
+
}
|
|
1478
1473
|
}
|
|
1479
1474
|
}
|
|
1480
|
-
if (
|
|
1481
|
-
canvas
|
|
1482
|
-
ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
|
|
1483
|
-
if (paint.blendMode)
|
|
1484
|
-
canvas.blendMode = paint.blendMode;
|
|
1485
|
-
if (data.opacity)
|
|
1486
|
-
canvas.opacity *= data.opacity;
|
|
1487
|
-
if (data.transform)
|
|
1488
|
-
canvas.transform(data.transform);
|
|
1489
|
-
canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
|
|
1490
|
-
canvas.restore();
|
|
1475
|
+
if (allowDraw) {
|
|
1476
|
+
drawImage(ui, canvas, paint, data);
|
|
1491
1477
|
return true;
|
|
1492
1478
|
}
|
|
1493
1479
|
else {
|
|
@@ -1508,13 +1494,26 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1508
1494
|
}
|
|
1509
1495
|
}
|
|
1510
1496
|
}
|
|
1497
|
+
function drawImage(ui, canvas, paint, data) {
|
|
1498
|
+
canvas.save();
|
|
1499
|
+
ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
|
|
1500
|
+
if (paint.blendMode)
|
|
1501
|
+
canvas.blendMode = paint.blendMode;
|
|
1502
|
+
if (data.opacity)
|
|
1503
|
+
canvas.opacity *= data.opacity;
|
|
1504
|
+
if (data.transform)
|
|
1505
|
+
canvas.transform(data.transform);
|
|
1506
|
+
canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
|
|
1507
|
+
canvas.restore();
|
|
1508
|
+
}
|
|
1511
1509
|
|
|
1512
1510
|
function recycleImage(attrName, data) {
|
|
1513
1511
|
const paints = data['_' + attrName];
|
|
1514
1512
|
if (paints instanceof Array) {
|
|
1515
|
-
let image, recycleMap, input, url;
|
|
1513
|
+
let paint, image, recycleMap, input, url;
|
|
1516
1514
|
for (let i = 0, len = paints.length; i < len; i++) {
|
|
1517
|
-
|
|
1515
|
+
paint = paints[i];
|
|
1516
|
+
image = paint.image;
|
|
1518
1517
|
url = image && image.url;
|
|
1519
1518
|
if (url) {
|
|
1520
1519
|
if (!recycleMap)
|
|
@@ -1529,8 +1528,6 @@ function recycleImage(attrName, data) {
|
|
|
1529
1528
|
}
|
|
1530
1529
|
image.unload(paints[i].loadId, !input.some((item) => item.url === url));
|
|
1531
1530
|
}
|
|
1532
|
-
else
|
|
1533
|
-
paints[i].style = null;
|
|
1534
1531
|
}
|
|
1535
1532
|
}
|
|
1536
1533
|
return recycleMap;
|
|
@@ -1709,7 +1706,7 @@ const { toOffsetOutBounds } = core.BoundsHelper;
|
|
|
1709
1706
|
const offsetOutBounds = {};
|
|
1710
1707
|
function innerShadow(ui, current, shape) {
|
|
1711
1708
|
let copyBounds, spreadScale;
|
|
1712
|
-
const { __nowWorld: nowWorld, __layout
|
|
1709
|
+
const { __nowWorld: nowWorld, __layout } = ui;
|
|
1713
1710
|
const { innerShadow } = ui.__;
|
|
1714
1711
|
const { worldCanvas, bounds, shapeBounds, scaleX, scaleY } = shape;
|
|
1715
1712
|
const other = current.getSameCanvas();
|