@leafer-draw/node 1.5.3 → 1.6.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/node.cjs +73 -75
- package/dist/node.cjs.map +1 -1
- package/dist/node.esm.js +73 -75
- package/dist/node.esm.js.map +1 -1
- package/dist/node.esm.min.js +1 -1
- package/dist/node.esm.min.js.map +1 -1
- package/dist/node.min.cjs +1 -1
- package/dist/node.min.cjs.map +1 -1
- package/package.json +10 -8
- package/src/core.ts +73 -0
- package/src/index.ts +1 -1
- package/types/index.d.ts +8 -1
package/dist/node.cjs
CHANGED
|
@@ -254,7 +254,6 @@ function updateChange(updateList) {
|
|
|
254
254
|
}
|
|
255
255
|
|
|
256
256
|
const { worldBounds } = core.LeafBoundsHelper;
|
|
257
|
-
const bigBounds = { x: 0, y: 0, width: 100000, height: 100000 };
|
|
258
257
|
class LayoutBlockData {
|
|
259
258
|
constructor(list) {
|
|
260
259
|
this.updatedBounds = new core.Bounds();
|
|
@@ -268,13 +267,7 @@ class LayoutBlockData {
|
|
|
268
267
|
this.beforeBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
269
268
|
}
|
|
270
269
|
setAfter() {
|
|
271
|
-
|
|
272
|
-
if (list.some(leaf => leaf.noBounds)) {
|
|
273
|
-
this.afterBounds.set(bigBounds);
|
|
274
|
-
}
|
|
275
|
-
else {
|
|
276
|
-
this.afterBounds.setListWithFn(list, worldBounds);
|
|
277
|
-
}
|
|
270
|
+
this.afterBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
278
271
|
this.updatedBounds.setList([this.beforeBounds, this.afterBounds]);
|
|
279
272
|
}
|
|
280
273
|
merge(data) {
|
|
@@ -476,6 +469,22 @@ class Renderer {
|
|
|
476
469
|
requestLayout() {
|
|
477
470
|
this.target.emit(core.LayoutEvent.REQUEST);
|
|
478
471
|
}
|
|
472
|
+
checkRender() {
|
|
473
|
+
if (this.running) {
|
|
474
|
+
const { target } = this;
|
|
475
|
+
if (target.isApp) {
|
|
476
|
+
target.emit(core.RenderEvent.CHILD_START, target);
|
|
477
|
+
target.children.forEach(leafer => {
|
|
478
|
+
leafer.renderer.FPS = this.FPS;
|
|
479
|
+
leafer.renderer.checkRender();
|
|
480
|
+
});
|
|
481
|
+
target.emit(core.RenderEvent.CHILD_END, target);
|
|
482
|
+
}
|
|
483
|
+
if (this.changed && this.canvas.view)
|
|
484
|
+
this.render();
|
|
485
|
+
this.target.emit(core.RenderEvent.NEXT);
|
|
486
|
+
}
|
|
487
|
+
}
|
|
479
488
|
render(callback) {
|
|
480
489
|
if (!(this.running && this.canvas.view))
|
|
481
490
|
return this.update();
|
|
@@ -484,8 +493,6 @@ class Renderer {
|
|
|
484
493
|
this.totalBounds = new core.Bounds();
|
|
485
494
|
debug$1.log(target.innerName, '--->');
|
|
486
495
|
try {
|
|
487
|
-
if (!target.isApp)
|
|
488
|
-
target.app.emit(core.RenderEvent.CHILD_START, target);
|
|
489
496
|
this.emitRender(core.RenderEvent.START);
|
|
490
497
|
this.renderOnce(callback);
|
|
491
498
|
this.emitRender(core.RenderEvent.END, this.totalBounds);
|
|
@@ -553,20 +560,12 @@ class Renderer {
|
|
|
553
560
|
}
|
|
554
561
|
clipRender(block) {
|
|
555
562
|
const t = core.Run.start('PartRender');
|
|
556
|
-
const { canvas } = this;
|
|
557
|
-
const bounds = block.getIntersect(canvas.bounds);
|
|
558
|
-
const includes = block.includes(this.target.__world);
|
|
559
|
-
const realBounds = new core.Bounds(bounds);
|
|
563
|
+
const { canvas } = this, bounds = block.getIntersect(canvas.bounds), realBounds = new core.Bounds(bounds);
|
|
560
564
|
canvas.save();
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
bounds.spread(10 + 1 / this.canvas.pixelRatio).ceil();
|
|
566
|
-
canvas.clearWorld(bounds, true);
|
|
567
|
-
canvas.clipWorld(bounds, true);
|
|
568
|
-
}
|
|
569
|
-
this.__render(bounds, includes, realBounds);
|
|
565
|
+
bounds.spread(Renderer.clipSpread).ceil();
|
|
566
|
+
canvas.clearWorld(bounds, true);
|
|
567
|
+
canvas.clipWorld(bounds, true);
|
|
568
|
+
this.__render(bounds, realBounds);
|
|
570
569
|
canvas.restore();
|
|
571
570
|
core.Run.end(t);
|
|
572
571
|
}
|
|
@@ -575,28 +574,22 @@ class Renderer {
|
|
|
575
574
|
const { canvas } = this;
|
|
576
575
|
canvas.save();
|
|
577
576
|
canvas.clear();
|
|
578
|
-
this.__render(canvas.bounds
|
|
577
|
+
this.__render(canvas.bounds);
|
|
579
578
|
canvas.restore();
|
|
580
579
|
core.Run.end(t);
|
|
581
580
|
}
|
|
582
|
-
__render(bounds,
|
|
583
|
-
const
|
|
581
|
+
__render(bounds, realBounds) {
|
|
582
|
+
const { canvas } = this, includes = bounds.includes(this.target.__world), options = includes ? { includes } : { bounds, includes };
|
|
584
583
|
if (this.needFill)
|
|
585
|
-
|
|
584
|
+
canvas.fillWorld(bounds, this.config.fill);
|
|
586
585
|
if (core.Debug.showRepaint)
|
|
587
|
-
|
|
588
|
-
this.target.__render(
|
|
586
|
+
core.Debug.drawRepaint(canvas, bounds);
|
|
587
|
+
this.target.__render(canvas, options);
|
|
589
588
|
this.renderBounds = realBounds = realBounds || bounds;
|
|
590
589
|
this.renderOptions = options;
|
|
591
590
|
this.totalBounds.isEmpty() ? this.totalBounds = realBounds : this.totalBounds.add(realBounds);
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
if (core.Debug.showBoundsView)
|
|
595
|
-
this.renderBoundsView(options);
|
|
596
|
-
this.canvas.updateRender(realBounds);
|
|
597
|
-
}
|
|
598
|
-
renderHitView(_options) { }
|
|
599
|
-
renderBoundsView(_options) { }
|
|
591
|
+
canvas.updateRender(realBounds);
|
|
592
|
+
}
|
|
600
593
|
addBlock(block) {
|
|
601
594
|
if (!this.updateBlocks)
|
|
602
595
|
this.updateBlocks = [];
|
|
@@ -612,17 +605,16 @@ class Renderer {
|
|
|
612
605
|
}
|
|
613
606
|
}
|
|
614
607
|
__requestRender() {
|
|
615
|
-
|
|
608
|
+
const target = this.target;
|
|
609
|
+
if (this.requestTime || !target)
|
|
616
610
|
return;
|
|
611
|
+
if (target.parentApp)
|
|
612
|
+
return target.parentApp.requestRender(false);
|
|
617
613
|
const requestTime = this.requestTime = Date.now();
|
|
618
614
|
core.Platform.requestRender(() => {
|
|
619
615
|
this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() - requestTime)));
|
|
620
616
|
this.requestTime = 0;
|
|
621
|
-
|
|
622
|
-
if (this.changed && this.canvas.view)
|
|
623
|
-
this.render();
|
|
624
|
-
this.target.emit(core.RenderEvent.NEXT);
|
|
625
|
-
}
|
|
617
|
+
this.checkRender();
|
|
626
618
|
});
|
|
627
619
|
}
|
|
628
620
|
__onResize(e) {
|
|
@@ -680,6 +672,7 @@ class Renderer {
|
|
|
680
672
|
}
|
|
681
673
|
}
|
|
682
674
|
}
|
|
675
|
+
Renderer.clipSpread = 10;
|
|
683
676
|
|
|
684
677
|
Object.assign(core.Creator, {
|
|
685
678
|
watcher: (target, options) => new Watcher(target, options),
|
|
@@ -1042,9 +1035,11 @@ const tempBox = new core.Bounds();
|
|
|
1042
1035
|
const tempPoint = {};
|
|
1043
1036
|
const tempScaleData = {};
|
|
1044
1037
|
function createData(leafPaint, image, paint, box) {
|
|
1045
|
-
const { blendMode, sync } = paint;
|
|
1038
|
+
const { blendMode, changeful, sync } = paint;
|
|
1046
1039
|
if (blendMode)
|
|
1047
1040
|
leafPaint.blendMode = blendMode;
|
|
1041
|
+
if (changeful)
|
|
1042
|
+
leafPaint.changeful = changeful;
|
|
1048
1043
|
if (sync)
|
|
1049
1044
|
leafPaint.sync = sync;
|
|
1050
1045
|
leafPaint.data = getPatternData(paint, box, image);
|
|
@@ -1277,40 +1272,32 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1277
1272
|
}
|
|
1278
1273
|
|
|
1279
1274
|
const { abs } = Math;
|
|
1280
|
-
function checkImage(ui, canvas, paint,
|
|
1275
|
+
function checkImage(ui, canvas, paint, allowDraw) {
|
|
1281
1276
|
const { scaleX, scaleY } = core.ImageManager.patternLocked ? ui.__world : ui.__nowWorld;
|
|
1282
|
-
const { pixelRatio } = canvas;
|
|
1283
|
-
if (!
|
|
1277
|
+
const { pixelRatio } = canvas, { data } = paint;
|
|
1278
|
+
if (!data || (paint.patternId === scaleX + '-' + scaleY + '-' + pixelRatio && !draw.Export.running)) {
|
|
1284
1279
|
return false;
|
|
1285
1280
|
}
|
|
1286
1281
|
else {
|
|
1287
|
-
|
|
1288
|
-
|
|
1289
|
-
|
|
1290
|
-
let { width, height } = data;
|
|
1291
|
-
width *= abs(scaleX) * pixelRatio;
|
|
1292
|
-
height *= abs(scaleY) * pixelRatio;
|
|
1293
|
-
if (data.scaleX) {
|
|
1294
|
-
width *= data.scaleX;
|
|
1295
|
-
height *= data.scaleY;
|
|
1296
|
-
}
|
|
1297
|
-
allowPaint = (width * height > core.Platform.image.maxCacheSize) || draw.Export.running;
|
|
1282
|
+
if (allowDraw) {
|
|
1283
|
+
if (data.repeat) {
|
|
1284
|
+
allowDraw = false;
|
|
1298
1285
|
}
|
|
1299
1286
|
else {
|
|
1300
|
-
|
|
1287
|
+
if (!(paint.changeful || core.ResizeEvent.isResizing(ui) || draw.Export.running)) {
|
|
1288
|
+
let { width, height } = data;
|
|
1289
|
+
width *= abs(scaleX) * pixelRatio;
|
|
1290
|
+
height *= abs(scaleY) * pixelRatio;
|
|
1291
|
+
if (data.scaleX) {
|
|
1292
|
+
width *= data.scaleX;
|
|
1293
|
+
height *= data.scaleY;
|
|
1294
|
+
}
|
|
1295
|
+
allowDraw = (width * height > core.Platform.image.maxCacheSize);
|
|
1296
|
+
}
|
|
1301
1297
|
}
|
|
1302
1298
|
}
|
|
1303
|
-
if (
|
|
1304
|
-
canvas
|
|
1305
|
-
ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
|
|
1306
|
-
if (paint.blendMode)
|
|
1307
|
-
canvas.blendMode = paint.blendMode;
|
|
1308
|
-
if (data.opacity)
|
|
1309
|
-
canvas.opacity *= data.opacity;
|
|
1310
|
-
if (data.transform)
|
|
1311
|
-
canvas.transform(data.transform);
|
|
1312
|
-
canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
|
|
1313
|
-
canvas.restore();
|
|
1299
|
+
if (allowDraw) {
|
|
1300
|
+
drawImage(ui, canvas, paint, data);
|
|
1314
1301
|
return true;
|
|
1315
1302
|
}
|
|
1316
1303
|
else {
|
|
@@ -1331,13 +1318,26 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1331
1318
|
}
|
|
1332
1319
|
}
|
|
1333
1320
|
}
|
|
1321
|
+
function drawImage(ui, canvas, paint, data) {
|
|
1322
|
+
canvas.save();
|
|
1323
|
+
ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
|
|
1324
|
+
if (paint.blendMode)
|
|
1325
|
+
canvas.blendMode = paint.blendMode;
|
|
1326
|
+
if (data.opacity)
|
|
1327
|
+
canvas.opacity *= data.opacity;
|
|
1328
|
+
if (data.transform)
|
|
1329
|
+
canvas.transform(data.transform);
|
|
1330
|
+
canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
|
|
1331
|
+
canvas.restore();
|
|
1332
|
+
}
|
|
1334
1333
|
|
|
1335
1334
|
function recycleImage(attrName, data) {
|
|
1336
1335
|
const paints = data['_' + attrName];
|
|
1337
1336
|
if (paints instanceof Array) {
|
|
1338
|
-
let image, recycleMap, input, url;
|
|
1337
|
+
let paint, image, recycleMap, input, url;
|
|
1339
1338
|
for (let i = 0, len = paints.length; i < len; i++) {
|
|
1340
|
-
|
|
1339
|
+
paint = paints[i];
|
|
1340
|
+
image = paint.image;
|
|
1341
1341
|
url = image && image.url;
|
|
1342
1342
|
if (url) {
|
|
1343
1343
|
if (!recycleMap)
|
|
@@ -1352,8 +1352,6 @@ function recycleImage(attrName, data) {
|
|
|
1352
1352
|
}
|
|
1353
1353
|
image.unload(paints[i].loadId, !input.some((item) => item.url === url));
|
|
1354
1354
|
}
|
|
1355
|
-
else
|
|
1356
|
-
paints[i].style = null;
|
|
1357
1355
|
}
|
|
1358
1356
|
}
|
|
1359
1357
|
return recycleMap;
|
|
@@ -1532,7 +1530,7 @@ const { toOffsetOutBounds } = core.BoundsHelper;
|
|
|
1532
1530
|
const offsetOutBounds = {};
|
|
1533
1531
|
function innerShadow(ui, current, shape) {
|
|
1534
1532
|
let copyBounds, spreadScale;
|
|
1535
|
-
const { __nowWorld: nowWorld, __layout
|
|
1533
|
+
const { __nowWorld: nowWorld, __layout } = ui;
|
|
1536
1534
|
const { innerShadow } = ui.__;
|
|
1537
1535
|
const { worldCanvas, bounds, shapeBounds, scaleX, scaleY } = shape;
|
|
1538
1536
|
const other = current.getSameCanvas();
|