@leafer-draw/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 +260 -165
- 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 +260 -165
- 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 +9 -7
- package/src/core.ts +86 -0
- package/src/index.ts +2 -2
- package/types/index.d.ts +8 -1
package/dist/worker.cjs
CHANGED
|
@@ -241,7 +241,6 @@ function updateChange(updateList) {
|
|
|
241
241
|
}
|
|
242
242
|
|
|
243
243
|
const { worldBounds } = core.LeafBoundsHelper;
|
|
244
|
-
const bigBounds = { x: 0, y: 0, width: 100000, height: 100000 };
|
|
245
244
|
class LayoutBlockData {
|
|
246
245
|
constructor(list) {
|
|
247
246
|
this.updatedBounds = new core.Bounds();
|
|
@@ -255,13 +254,7 @@ class LayoutBlockData {
|
|
|
255
254
|
this.beforeBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
256
255
|
}
|
|
257
256
|
setAfter() {
|
|
258
|
-
|
|
259
|
-
if (list.some(leaf => leaf.noBounds)) {
|
|
260
|
-
this.afterBounds.set(bigBounds);
|
|
261
|
-
}
|
|
262
|
-
else {
|
|
263
|
-
this.afterBounds.setListWithFn(list, worldBounds);
|
|
264
|
-
}
|
|
257
|
+
this.afterBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
265
258
|
this.updatedBounds.setList([this.beforeBounds, this.afterBounds]);
|
|
266
259
|
}
|
|
267
260
|
merge(data) {
|
|
@@ -463,6 +456,13 @@ class Renderer {
|
|
|
463
456
|
requestLayout() {
|
|
464
457
|
this.target.emit(core.LayoutEvent.REQUEST);
|
|
465
458
|
}
|
|
459
|
+
checkRender() {
|
|
460
|
+
if (this.running) {
|
|
461
|
+
if (this.changed && this.canvas.view)
|
|
462
|
+
this.render();
|
|
463
|
+
this.target.emit(core.RenderEvent.NEXT);
|
|
464
|
+
}
|
|
465
|
+
}
|
|
466
466
|
render(callback) {
|
|
467
467
|
if (!(this.running && this.canvas.view))
|
|
468
468
|
return this.update();
|
|
@@ -471,8 +471,6 @@ class Renderer {
|
|
|
471
471
|
this.totalBounds = new core.Bounds();
|
|
472
472
|
debug.log(target.innerName, '--->');
|
|
473
473
|
try {
|
|
474
|
-
if (!target.isApp)
|
|
475
|
-
target.app.emit(core.RenderEvent.CHILD_START, target);
|
|
476
474
|
this.emitRender(core.RenderEvent.START);
|
|
477
475
|
this.renderOnce(callback);
|
|
478
476
|
this.emitRender(core.RenderEvent.END, this.totalBounds);
|
|
@@ -540,20 +538,12 @@ class Renderer {
|
|
|
540
538
|
}
|
|
541
539
|
clipRender(block) {
|
|
542
540
|
const t = core.Run.start('PartRender');
|
|
543
|
-
const { canvas } = this;
|
|
544
|
-
const bounds = block.getIntersect(canvas.bounds);
|
|
545
|
-
const includes = block.includes(this.target.__world);
|
|
546
|
-
const realBounds = new core.Bounds(bounds);
|
|
541
|
+
const { canvas } = this, bounds = block.getIntersect(canvas.bounds), realBounds = new core.Bounds(bounds);
|
|
547
542
|
canvas.save();
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
bounds.spread(10 + 1 / this.canvas.pixelRatio).ceil();
|
|
553
|
-
canvas.clearWorld(bounds, true);
|
|
554
|
-
canvas.clipWorld(bounds, true);
|
|
555
|
-
}
|
|
556
|
-
this.__render(bounds, includes, realBounds);
|
|
543
|
+
bounds.spread(Renderer.clipSpread).ceil();
|
|
544
|
+
canvas.clearWorld(bounds, true);
|
|
545
|
+
canvas.clipWorld(bounds, true);
|
|
546
|
+
this.__render(bounds, block.includes(this.target.__world), realBounds);
|
|
557
547
|
canvas.restore();
|
|
558
548
|
core.Run.end(t);
|
|
559
549
|
}
|
|
@@ -567,23 +557,17 @@ class Renderer {
|
|
|
567
557
|
core.Run.end(t);
|
|
568
558
|
}
|
|
569
559
|
__render(bounds, includes, realBounds) {
|
|
570
|
-
const options =
|
|
560
|
+
const { canvas } = this, options = includes ? { includes } : { bounds, includes };
|
|
571
561
|
if (this.needFill)
|
|
572
|
-
|
|
562
|
+
canvas.fillWorld(bounds, this.config.fill);
|
|
573
563
|
if (core.Debug.showRepaint)
|
|
574
|
-
|
|
575
|
-
this.target.__render(
|
|
564
|
+
core.Debug.drawRepaint(canvas, bounds);
|
|
565
|
+
this.target.__render(canvas, options);
|
|
576
566
|
this.renderBounds = realBounds = realBounds || bounds;
|
|
577
567
|
this.renderOptions = options;
|
|
578
568
|
this.totalBounds.isEmpty() ? this.totalBounds = realBounds : this.totalBounds.add(realBounds);
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
if (core.Debug.showBoundsView)
|
|
582
|
-
this.renderBoundsView(options);
|
|
583
|
-
this.canvas.updateRender(realBounds);
|
|
584
|
-
}
|
|
585
|
-
renderHitView(_options) { }
|
|
586
|
-
renderBoundsView(_options) { }
|
|
569
|
+
canvas.updateRender(realBounds);
|
|
570
|
+
}
|
|
587
571
|
addBlock(block) {
|
|
588
572
|
if (!this.updateBlocks)
|
|
589
573
|
this.updateBlocks = [];
|
|
@@ -599,17 +583,24 @@ class Renderer {
|
|
|
599
583
|
}
|
|
600
584
|
}
|
|
601
585
|
__requestRender() {
|
|
586
|
+
const target = this.target;
|
|
587
|
+
if (target.parentApp)
|
|
588
|
+
return target.parentApp.renderer.update(false);
|
|
602
589
|
if (this.requestTime)
|
|
603
590
|
return;
|
|
604
591
|
const requestTime = this.requestTime = Date.now();
|
|
605
592
|
core.Platform.requestRender(() => {
|
|
606
593
|
this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() - requestTime)));
|
|
607
594
|
this.requestTime = 0;
|
|
608
|
-
if (
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
595
|
+
if (target.isApp) {
|
|
596
|
+
target.emit(core.RenderEvent.CHILD_START, target);
|
|
597
|
+
target.children.forEach(leafer => {
|
|
598
|
+
leafer.renderer.FPS = this.FPS;
|
|
599
|
+
leafer.renderer.checkRender();
|
|
600
|
+
});
|
|
601
|
+
target.emit(core.RenderEvent.CHILD_END, target);
|
|
612
602
|
}
|
|
603
|
+
this.checkRender();
|
|
613
604
|
});
|
|
614
605
|
}
|
|
615
606
|
__onResize(e) {
|
|
@@ -667,6 +658,7 @@ class Renderer {
|
|
|
667
658
|
}
|
|
668
659
|
}
|
|
669
660
|
}
|
|
661
|
+
Renderer.clipSpread = 10;
|
|
670
662
|
|
|
671
663
|
Object.assign(core.Creator, {
|
|
672
664
|
watcher: (target, options) => new Watcher(target, options),
|
|
@@ -1029,9 +1021,11 @@ const tempBox = new core.Bounds();
|
|
|
1029
1021
|
const tempPoint = {};
|
|
1030
1022
|
const tempScaleData = {};
|
|
1031
1023
|
function createData(leafPaint, image, paint, box) {
|
|
1032
|
-
const { blendMode, sync } = paint;
|
|
1024
|
+
const { blendMode, changeful, sync } = paint;
|
|
1033
1025
|
if (blendMode)
|
|
1034
1026
|
leafPaint.blendMode = blendMode;
|
|
1027
|
+
if (changeful)
|
|
1028
|
+
leafPaint.changeful = changeful;
|
|
1035
1029
|
if (sync)
|
|
1036
1030
|
leafPaint.sync = sync;
|
|
1037
1031
|
leafPaint.data = getPatternData(paint, box, image);
|
|
@@ -1296,40 +1290,32 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
1296
1290
|
};
|
|
1297
1291
|
|
|
1298
1292
|
const { abs } = Math;
|
|
1299
|
-
function checkImage(ui, canvas, paint,
|
|
1293
|
+
function checkImage(ui, canvas, paint, allowDraw) {
|
|
1300
1294
|
const { scaleX, scaleY } = core.ImageManager.patternLocked ? ui.__world : ui.__nowWorld;
|
|
1301
|
-
const { pixelRatio } = canvas;
|
|
1302
|
-
if (!
|
|
1295
|
+
const { pixelRatio } = canvas, { data } = paint;
|
|
1296
|
+
if (!data || (paint.patternId === scaleX + '-' + scaleY + '-' + pixelRatio && !draw.Export.running)) {
|
|
1303
1297
|
return false;
|
|
1304
1298
|
}
|
|
1305
1299
|
else {
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
let { width, height } = data;
|
|
1310
|
-
width *= abs(scaleX) * pixelRatio;
|
|
1311
|
-
height *= abs(scaleY) * pixelRatio;
|
|
1312
|
-
if (data.scaleX) {
|
|
1313
|
-
width *= data.scaleX;
|
|
1314
|
-
height *= data.scaleY;
|
|
1315
|
-
}
|
|
1316
|
-
allowPaint = (width * height > core.Platform.image.maxCacheSize) || draw.Export.running;
|
|
1300
|
+
if (allowDraw) {
|
|
1301
|
+
if (data.repeat) {
|
|
1302
|
+
allowDraw = false;
|
|
1317
1303
|
}
|
|
1318
1304
|
else {
|
|
1319
|
-
|
|
1305
|
+
if (!(paint.changeful || core.ResizeEvent.isResizing(ui) || draw.Export.running)) {
|
|
1306
|
+
let { width, height } = data;
|
|
1307
|
+
width *= abs(scaleX) * pixelRatio;
|
|
1308
|
+
height *= abs(scaleY) * pixelRatio;
|
|
1309
|
+
if (data.scaleX) {
|
|
1310
|
+
width *= data.scaleX;
|
|
1311
|
+
height *= data.scaleY;
|
|
1312
|
+
}
|
|
1313
|
+
allowDraw = (width * height > core.Platform.image.maxCacheSize);
|
|
1314
|
+
}
|
|
1320
1315
|
}
|
|
1321
1316
|
}
|
|
1322
|
-
if (
|
|
1323
|
-
canvas
|
|
1324
|
-
ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
|
|
1325
|
-
if (paint.blendMode)
|
|
1326
|
-
canvas.blendMode = paint.blendMode;
|
|
1327
|
-
if (data.opacity)
|
|
1328
|
-
canvas.opacity *= data.opacity;
|
|
1329
|
-
if (data.transform)
|
|
1330
|
-
canvas.transform(data.transform);
|
|
1331
|
-
canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
|
|
1332
|
-
canvas.restore();
|
|
1317
|
+
if (allowDraw) {
|
|
1318
|
+
drawImage(ui, canvas, paint, data);
|
|
1333
1319
|
return true;
|
|
1334
1320
|
}
|
|
1335
1321
|
else {
|
|
@@ -1350,13 +1336,26 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1350
1336
|
}
|
|
1351
1337
|
}
|
|
1352
1338
|
}
|
|
1339
|
+
function drawImage(ui, canvas, paint, data) {
|
|
1340
|
+
canvas.save();
|
|
1341
|
+
ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
|
|
1342
|
+
if (paint.blendMode)
|
|
1343
|
+
canvas.blendMode = paint.blendMode;
|
|
1344
|
+
if (data.opacity)
|
|
1345
|
+
canvas.opacity *= data.opacity;
|
|
1346
|
+
if (data.transform)
|
|
1347
|
+
canvas.transform(data.transform);
|
|
1348
|
+
canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
|
|
1349
|
+
canvas.restore();
|
|
1350
|
+
}
|
|
1353
1351
|
|
|
1354
1352
|
function recycleImage(attrName, data) {
|
|
1355
1353
|
const paints = data['_' + attrName];
|
|
1356
1354
|
if (paints instanceof Array) {
|
|
1357
|
-
let image, recycleMap, input, url;
|
|
1355
|
+
let paint, image, recycleMap, input, url;
|
|
1358
1356
|
for (let i = 0, len = paints.length; i < len; i++) {
|
|
1359
|
-
|
|
1357
|
+
paint = paints[i];
|
|
1358
|
+
image = paint.image;
|
|
1360
1359
|
url = image && image.url;
|
|
1361
1360
|
if (url) {
|
|
1362
1361
|
if (!recycleMap)
|
|
@@ -1371,8 +1370,6 @@ function recycleImage(attrName, data) {
|
|
|
1371
1370
|
}
|
|
1372
1371
|
image.unload(paints[i].loadId, !input.some((item) => item.url === url));
|
|
1373
1372
|
}
|
|
1374
|
-
else
|
|
1375
|
-
paints[i].style = null;
|
|
1376
1373
|
}
|
|
1377
1374
|
}
|
|
1378
1375
|
return recycleMap;
|
|
@@ -1551,7 +1548,7 @@ const { toOffsetOutBounds } = core.BoundsHelper;
|
|
|
1551
1548
|
const offsetOutBounds = {};
|
|
1552
1549
|
function innerShadow(ui, current, shape) {
|
|
1553
1550
|
let copyBounds, spreadScale;
|
|
1554
|
-
const { __nowWorld: nowWorld, __layout
|
|
1551
|
+
const { __nowWorld: nowWorld, __layout } = ui;
|
|
1555
1552
|
const { innerShadow } = ui.__;
|
|
1556
1553
|
const { worldCanvas, bounds, shapeBounds, scaleX, scaleY } = shape;
|
|
1557
1554
|
const other = current.getSameCanvas();
|