@leafer-ui/node 1.0.0-rc.6 → 1.0.0-rc.8
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 +171 -97
- package/dist/node.esm.js +174 -100
- package/dist/node.esm.min.js +1 -1
- package/dist/node.min.cjs +1 -1
- package/package.json +6 -6
package/dist/node.cjs
CHANGED
|
@@ -42,7 +42,7 @@ class Watcher {
|
|
|
42
42
|
if (this.hasRemove) {
|
|
43
43
|
const updatedList = new core.LeafList();
|
|
44
44
|
this.__updatedList.list.forEach(item => { if (item.leafer)
|
|
45
|
-
updatedList.
|
|
45
|
+
updatedList.add(item); });
|
|
46
46
|
return updatedList;
|
|
47
47
|
}
|
|
48
48
|
else {
|
|
@@ -77,7 +77,7 @@ class Watcher {
|
|
|
77
77
|
this.target.emit(core.RenderEvent.REQUEST);
|
|
78
78
|
}
|
|
79
79
|
__onAttrChange(event) {
|
|
80
|
-
this.__updatedList.
|
|
80
|
+
this.__updatedList.add(event.target);
|
|
81
81
|
this.update();
|
|
82
82
|
}
|
|
83
83
|
__onChildEvent(event) {
|
|
@@ -87,12 +87,12 @@ class Watcher {
|
|
|
87
87
|
}
|
|
88
88
|
else {
|
|
89
89
|
this.hasRemove = true;
|
|
90
|
-
this.__updatedList.
|
|
90
|
+
this.__updatedList.add(event.parent);
|
|
91
91
|
}
|
|
92
92
|
this.update();
|
|
93
93
|
}
|
|
94
94
|
__pushChild(child) {
|
|
95
|
-
this.__updatedList.
|
|
95
|
+
this.__updatedList.add(child);
|
|
96
96
|
if (child.isBranch)
|
|
97
97
|
this.__loopChildren(child);
|
|
98
98
|
}
|
|
@@ -131,7 +131,7 @@ class Watcher {
|
|
|
131
131
|
}
|
|
132
132
|
}
|
|
133
133
|
|
|
134
|
-
const {
|
|
134
|
+
const { updateAllMatrix: updateAllMatrix$1, updateBounds: updateOneBounds, updateAllWorldOpacity } = core.LeafHelper;
|
|
135
135
|
const { pushAllChildBranch, pushAllParent } = core.BranchHelper;
|
|
136
136
|
function updateMatrix(updateList, levelList) {
|
|
137
137
|
let layout;
|
|
@@ -139,14 +139,14 @@ function updateMatrix(updateList, levelList) {
|
|
|
139
139
|
layout = leaf.__layout;
|
|
140
140
|
if (levelList.without(leaf) && !layout.proxyZoom) {
|
|
141
141
|
if (layout.matrixChanged) {
|
|
142
|
-
|
|
143
|
-
levelList.
|
|
142
|
+
updateAllMatrix$1(leaf, true);
|
|
143
|
+
levelList.add(leaf);
|
|
144
144
|
if (leaf.isBranch)
|
|
145
145
|
pushAllChildBranch(leaf, levelList);
|
|
146
146
|
pushAllParent(leaf, levelList);
|
|
147
147
|
}
|
|
148
148
|
else if (layout.boundsChanged) {
|
|
149
|
-
levelList.
|
|
149
|
+
levelList.add(leaf);
|
|
150
150
|
if (leaf.isBranch)
|
|
151
151
|
leaf.__tempNumber = 0;
|
|
152
152
|
pushAllParent(leaf, levelList);
|
|
@@ -155,20 +155,21 @@ function updateMatrix(updateList, levelList) {
|
|
|
155
155
|
});
|
|
156
156
|
}
|
|
157
157
|
function updateBounds(boundsList) {
|
|
158
|
-
let
|
|
158
|
+
let list, branch, children;
|
|
159
159
|
boundsList.sort(true);
|
|
160
160
|
boundsList.levels.forEach(level => {
|
|
161
|
-
|
|
162
|
-
for (let i = 0, len =
|
|
163
|
-
branch =
|
|
161
|
+
list = boundsList.levelMap[level];
|
|
162
|
+
for (let i = 0, len = list.length; i < len; i++) {
|
|
163
|
+
branch = list[i];
|
|
164
164
|
if (branch.isBranch && branch.__tempNumber) {
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
165
|
+
children = branch.children;
|
|
166
|
+
for (let j = 0, jLen = children.length; j < jLen; j++) {
|
|
167
|
+
if (!children[j].isBranch) {
|
|
168
|
+
updateOneBounds(children[j]);
|
|
168
169
|
}
|
|
169
170
|
}
|
|
170
171
|
}
|
|
171
|
-
branch
|
|
172
|
+
updateOneBounds(branch);
|
|
172
173
|
}
|
|
173
174
|
});
|
|
174
175
|
}
|
|
@@ -181,7 +182,7 @@ function updateChange(updateList) {
|
|
|
181
182
|
}
|
|
182
183
|
|
|
183
184
|
const { worldBounds } = core.LeafBoundsHelper;
|
|
184
|
-
const {
|
|
185
|
+
const bigBounds = { x: 0, y: 0, width: 100000, height: 100000 };
|
|
185
186
|
class LayoutBlockData {
|
|
186
187
|
constructor(list) {
|
|
187
188
|
this.updatedBounds = new core.Bounds();
|
|
@@ -192,14 +193,20 @@ class LayoutBlockData {
|
|
|
192
193
|
this.updatedList = list;
|
|
193
194
|
}
|
|
194
195
|
setBefore() {
|
|
195
|
-
|
|
196
|
+
this.beforeBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
196
197
|
}
|
|
197
198
|
setAfter() {
|
|
198
|
-
|
|
199
|
-
|
|
199
|
+
const { list } = this.updatedList;
|
|
200
|
+
if (list.some(leaf => leaf.noBounds)) {
|
|
201
|
+
this.afterBounds.set(bigBounds);
|
|
202
|
+
}
|
|
203
|
+
else {
|
|
204
|
+
this.afterBounds.setListWithFn(list, worldBounds);
|
|
205
|
+
}
|
|
206
|
+
this.updatedBounds.setList([this.beforeBounds, this.afterBounds]);
|
|
200
207
|
}
|
|
201
208
|
merge(data) {
|
|
202
|
-
this.updatedList.
|
|
209
|
+
this.updatedList.addList(data.updatedList.list);
|
|
203
210
|
this.beforeBounds.add(data.beforeBounds);
|
|
204
211
|
this.afterBounds.add(data.afterBounds);
|
|
205
212
|
this.updatedBounds.add(data.updatedBounds);
|
|
@@ -209,8 +216,7 @@ class LayoutBlockData {
|
|
|
209
216
|
}
|
|
210
217
|
}
|
|
211
218
|
|
|
212
|
-
const {
|
|
213
|
-
const { pushAllBranchStack, updateWorldBoundsByBranchStack } = core.BranchHelper;
|
|
219
|
+
const { updateAllMatrix, updateAllChange } = core.LeafHelper;
|
|
214
220
|
const debug$1 = core.Debug.get('Layouter');
|
|
215
221
|
class Layouter {
|
|
216
222
|
constructor(target, userConfig) {
|
|
@@ -287,12 +293,15 @@ class Layouter {
|
|
|
287
293
|
const { target, __updatedList: updateList } = this;
|
|
288
294
|
const { BEFORE, LAYOUT, AFTER } = core.LayoutEvent;
|
|
289
295
|
const blocks = this.getBlocks(updateList);
|
|
290
|
-
blocks.forEach(item =>
|
|
296
|
+
blocks.forEach(item => item.setBefore());
|
|
291
297
|
target.emitEvent(new core.LayoutEvent(BEFORE, blocks, this.times));
|
|
298
|
+
this.extraBlock = null;
|
|
292
299
|
updateList.sort();
|
|
293
300
|
updateMatrix(updateList, this.__levelList);
|
|
294
301
|
updateBounds(this.__levelList);
|
|
295
302
|
updateChange(updateList);
|
|
303
|
+
if (this.extraBlock)
|
|
304
|
+
blocks.push(this.extraBlock);
|
|
296
305
|
blocks.forEach(item => item.setAfter());
|
|
297
306
|
target.emitEvent(new core.LayoutEvent(LAYOUT, blocks, this.times));
|
|
298
307
|
target.emitEvent(new core.LayoutEvent(AFTER, blocks, this.times));
|
|
@@ -315,17 +324,20 @@ class Layouter {
|
|
|
315
324
|
core.Run.end(t);
|
|
316
325
|
}
|
|
317
326
|
static fullLayout(target) {
|
|
318
|
-
|
|
327
|
+
updateAllMatrix(target, true);
|
|
319
328
|
if (target.isBranch) {
|
|
320
|
-
|
|
321
|
-
pushAllBranchStack(target, branchStack);
|
|
322
|
-
updateWorldBoundsByBranchStack(branchStack);
|
|
329
|
+
core.BranchHelper.updateBounds(target);
|
|
323
330
|
}
|
|
324
331
|
else {
|
|
325
|
-
|
|
332
|
+
core.LeafHelper.updateBounds(target);
|
|
326
333
|
}
|
|
327
334
|
updateAllChange(target);
|
|
328
335
|
}
|
|
336
|
+
addExtra(leaf) {
|
|
337
|
+
const block = this.extraBlock || (this.extraBlock = new LayoutBlockData([]));
|
|
338
|
+
block.updatedList.add(leaf);
|
|
339
|
+
block.beforeBounds.add(leaf.__world);
|
|
340
|
+
}
|
|
329
341
|
createBlock(data) {
|
|
330
342
|
return new LayoutBlockData(data);
|
|
331
343
|
}
|
|
@@ -353,8 +365,7 @@ class Layouter {
|
|
|
353
365
|
if (this.target) {
|
|
354
366
|
this.stop();
|
|
355
367
|
this.__removeListenEvents();
|
|
356
|
-
this.target = null;
|
|
357
|
-
this.config = null;
|
|
368
|
+
this.target = this.config = null;
|
|
358
369
|
}
|
|
359
370
|
}
|
|
360
371
|
}
|
|
@@ -465,7 +476,7 @@ class Renderer {
|
|
|
465
476
|
const { canvas } = this;
|
|
466
477
|
const bounds = block.getIntersect(canvas.bounds);
|
|
467
478
|
const includes = block.includes(this.target.__world);
|
|
468
|
-
const realBounds = new core.Bounds(
|
|
479
|
+
const realBounds = new core.Bounds(bounds);
|
|
469
480
|
canvas.save();
|
|
470
481
|
if (includes && !core.Debug.showRepaint) {
|
|
471
482
|
canvas.clear();
|
|
@@ -515,7 +526,7 @@ class Renderer {
|
|
|
515
526
|
const { updateBlocks: list } = this;
|
|
516
527
|
if (list) {
|
|
517
528
|
const bounds = new core.Bounds();
|
|
518
|
-
bounds.
|
|
529
|
+
bounds.setList(list);
|
|
519
530
|
list.length = 0;
|
|
520
531
|
list.push(bounds);
|
|
521
532
|
}
|
|
@@ -555,7 +566,7 @@ class Renderer {
|
|
|
555
566
|
empty = (!leaf.__world.width || !leaf.__world.height);
|
|
556
567
|
if (empty) {
|
|
557
568
|
if (!leaf.isLeafer)
|
|
558
|
-
debug.
|
|
569
|
+
debug.tip(leaf.innerName, ': empty');
|
|
559
570
|
empty = (!leaf.isBranch || leaf.isBranchLeaf);
|
|
560
571
|
}
|
|
561
572
|
return empty;
|
|
@@ -589,6 +600,14 @@ class Renderer {
|
|
|
589
600
|
}
|
|
590
601
|
}
|
|
591
602
|
|
|
603
|
+
var AnswerType;
|
|
604
|
+
(function (AnswerType) {
|
|
605
|
+
AnswerType[AnswerType["No"] = 0] = "No";
|
|
606
|
+
AnswerType[AnswerType["Yes"] = 1] = "Yes";
|
|
607
|
+
AnswerType[AnswerType["NoAndSkip"] = 2] = "NoAndSkip";
|
|
608
|
+
AnswerType[AnswerType["YesAndSkip"] = 3] = "YesAndSkip";
|
|
609
|
+
})(AnswerType || (AnswerType = {}));
|
|
610
|
+
|
|
592
611
|
const { hitRadiusPoint } = core.BoundsHelper;
|
|
593
612
|
class Pather {
|
|
594
613
|
constructor(target, selector) {
|
|
@@ -633,10 +652,10 @@ class Pather {
|
|
|
633
652
|
getPath(leaf) {
|
|
634
653
|
const path = new core.LeafList();
|
|
635
654
|
while (leaf) {
|
|
636
|
-
path.
|
|
655
|
+
path.add(leaf);
|
|
637
656
|
leaf = leaf.parent;
|
|
638
657
|
}
|
|
639
|
-
path.
|
|
658
|
+
path.add(this.target);
|
|
640
659
|
return path;
|
|
641
660
|
}
|
|
642
661
|
getHitablePath(leaf) {
|
|
@@ -646,7 +665,7 @@ class Pather {
|
|
|
646
665
|
item = path.list[i];
|
|
647
666
|
if (!item.__.hittable)
|
|
648
667
|
break;
|
|
649
|
-
hittablePath.
|
|
668
|
+
hittablePath.addAt(item, 0);
|
|
650
669
|
if (!item.__.hitChildren)
|
|
651
670
|
break;
|
|
652
671
|
}
|
|
@@ -665,7 +684,7 @@ class Pather {
|
|
|
665
684
|
leaf = path.list[j];
|
|
666
685
|
if (nextPath && nextPath.has(leaf))
|
|
667
686
|
break;
|
|
668
|
-
throughPath.
|
|
687
|
+
throughPath.add(leaf);
|
|
669
688
|
}
|
|
670
689
|
}
|
|
671
690
|
return throughPath;
|
|
@@ -707,14 +726,15 @@ class Pather {
|
|
|
707
726
|
}
|
|
708
727
|
}
|
|
709
728
|
|
|
729
|
+
const { Yes, NoAndSkip, YesAndSkip } = AnswerType;
|
|
710
730
|
class Selector {
|
|
711
731
|
constructor(target, userConfig) {
|
|
712
732
|
this.config = {};
|
|
713
733
|
this.innerIdMap = {};
|
|
714
734
|
this.idMap = {};
|
|
715
735
|
this.methods = {
|
|
716
|
-
id: (leaf, name) => leaf.id === name ? this.idMap[name] = leaf : 0,
|
|
717
|
-
innerId: (leaf, innerId) => leaf.innerId === innerId ? this.innerIdMap[innerId] = leaf : 0,
|
|
736
|
+
id: (leaf, name) => leaf.id === name ? (this.idMap[name] = leaf, 1) : 0,
|
|
737
|
+
innerId: (leaf, innerId) => leaf.innerId === innerId ? (this.innerIdMap[innerId] = leaf, 1) : 0,
|
|
718
738
|
className: (leaf, name) => leaf.className === name ? 1 : 0,
|
|
719
739
|
tag: (leaf, name) => leaf.__tag === name ? 1 : 0
|
|
720
740
|
};
|
|
@@ -724,11 +744,6 @@ class Selector {
|
|
|
724
744
|
this.pather = new Pather(target, this);
|
|
725
745
|
this.__listenEvents();
|
|
726
746
|
}
|
|
727
|
-
getByPoint(hitPoint, hitRadius, options) {
|
|
728
|
-
if (core.Platform.name === 'node')
|
|
729
|
-
this.target.emit(core.LayoutEvent.CHECK_UPDATE);
|
|
730
|
-
return this.pather.getByPoint(hitPoint, hitRadius, options);
|
|
731
|
-
}
|
|
732
747
|
getBy(condition, branch, one, options) {
|
|
733
748
|
switch (typeof condition) {
|
|
734
749
|
case 'number':
|
|
@@ -748,6 +763,11 @@ class Selector {
|
|
|
748
763
|
return this.getByMethod(condition, branch, one, options);
|
|
749
764
|
}
|
|
750
765
|
}
|
|
766
|
+
getByPoint(hitPoint, hitRadius, options) {
|
|
767
|
+
if (core.Platform.name === 'node')
|
|
768
|
+
this.target.emit(core.LayoutEvent.CHECK_UPDATE);
|
|
769
|
+
return this.pather.getByPoint(hitPoint, hitRadius, options);
|
|
770
|
+
}
|
|
751
771
|
getByInnerId(innerId, branch) {
|
|
752
772
|
const cache = this.innerIdMap[innerId];
|
|
753
773
|
if (cache)
|
|
@@ -774,10 +794,11 @@ class Selector {
|
|
|
774
794
|
return list || this.findLeaf;
|
|
775
795
|
}
|
|
776
796
|
eachFind(children, method, list, options) {
|
|
777
|
-
let child;
|
|
797
|
+
let child, result;
|
|
778
798
|
for (let i = 0, len = children.length; i < len; i++) {
|
|
779
799
|
child = children[i];
|
|
780
|
-
|
|
800
|
+
result = method(child, options);
|
|
801
|
+
if (result === Yes || result === YesAndSkip) {
|
|
781
802
|
if (list) {
|
|
782
803
|
list.push(child);
|
|
783
804
|
}
|
|
@@ -786,7 +807,7 @@ class Selector {
|
|
|
786
807
|
return;
|
|
787
808
|
}
|
|
788
809
|
}
|
|
789
|
-
if (child.isBranch)
|
|
810
|
+
if (child.isBranch && result < NoAndSkip)
|
|
790
811
|
this.eachFind(child.children, method, list, options);
|
|
791
812
|
}
|
|
792
813
|
}
|
|
@@ -903,9 +924,8 @@ core.Platform.name = 'node';
|
|
|
903
924
|
core.Platform.requestRender = function (render) { setTimeout(render); };
|
|
904
925
|
core.Platform.devicePixelRatio = 1;
|
|
905
926
|
core.Platform.conicGradientSupport = true;
|
|
906
|
-
core.Platform.realtimeLayout = true;
|
|
907
927
|
|
|
908
|
-
const { get: get$4, rotateOfOuter: rotateOfOuter$2, translate: translate$1, scaleOfOuter: scaleOfOuter$2, scale: scaleHelper
|
|
928
|
+
const { get: get$4, rotateOfOuter: rotateOfOuter$2, translate: translate$1, scaleOfOuter: scaleOfOuter$2, scale: scaleHelper, rotate } = core.MatrixHelper;
|
|
909
929
|
function fillOrFitMode(data, mode, box, width, height, rotation) {
|
|
910
930
|
const transform = get$4();
|
|
911
931
|
const swap = rotation && rotation !== 180;
|
|
@@ -915,7 +935,7 @@ function fillOrFitMode(data, mode, box, width, height, rotation) {
|
|
|
915
935
|
const x = box.x + (box.width - width * scale) / 2;
|
|
916
936
|
const y = box.y + (box.height - height * scale) / 2;
|
|
917
937
|
translate$1(transform, x, y);
|
|
918
|
-
scaleHelper
|
|
938
|
+
scaleHelper(transform, scale);
|
|
919
939
|
if (rotation)
|
|
920
940
|
rotateOfOuter$2(transform, { x: box.x + box.width / 2, y: box.y + box.height / 2 }, rotation);
|
|
921
941
|
data.scaleX = data.scaleY = scale;
|
|
@@ -927,7 +947,7 @@ function clipMode(data, box, offset, scale, rotation) {
|
|
|
927
947
|
if (offset)
|
|
928
948
|
translate$1(transform, offset.x, offset.y);
|
|
929
949
|
if (scale) {
|
|
930
|
-
typeof scale === 'number' ? scaleHelper
|
|
950
|
+
typeof scale === 'number' ? scaleHelper(transform, scale) : scaleHelper(transform, scale.x, scale.y);
|
|
931
951
|
data.scaleX = transform.a;
|
|
932
952
|
data.scaleY = transform.d;
|
|
933
953
|
}
|
|
@@ -962,7 +982,7 @@ function repeatMode(data, box, width, height, scale, rotation) {
|
|
|
962
982
|
const { get: get$3, translate } = core.MatrixHelper;
|
|
963
983
|
function createData(leafPaint, image, paint, box) {
|
|
964
984
|
let { width, height } = image;
|
|
965
|
-
const { opacity, mode, offset, scale, rotation, blendMode } = paint;
|
|
985
|
+
const { opacity, mode, offset, scale, rotation, blendMode, repeat } = paint;
|
|
966
986
|
const sameBox = box.width === width && box.height === height;
|
|
967
987
|
if (blendMode)
|
|
968
988
|
leafPaint.blendMode = blendMode;
|
|
@@ -983,6 +1003,8 @@ function createData(leafPaint, image, paint, box) {
|
|
|
983
1003
|
case 'repeat':
|
|
984
1004
|
if (!sameBox || scale || rotation)
|
|
985
1005
|
repeatMode(data, box, width, height, scale, rotation);
|
|
1006
|
+
if (!repeat)
|
|
1007
|
+
data.repeat = 'repeat';
|
|
986
1008
|
break;
|
|
987
1009
|
case 'fit':
|
|
988
1010
|
case 'cover':
|
|
@@ -994,6 +1016,8 @@ function createData(leafPaint, image, paint, box) {
|
|
|
994
1016
|
data.height = height;
|
|
995
1017
|
if (opacity)
|
|
996
1018
|
data.opacity = opacity;
|
|
1019
|
+
if (repeat)
|
|
1020
|
+
data.repeat = typeof repeat === 'string' ? (repeat === 'x' ? 'repeat-x' : 'repeat-y') : 'repeat';
|
|
997
1021
|
}
|
|
998
1022
|
|
|
999
1023
|
function image(ui, attrName, attrValue, box, firstUse) {
|
|
@@ -1041,6 +1065,10 @@ function hasNaturalSize(ui, attrName, image) {
|
|
|
1041
1065
|
d.__naturalHeight = image.height;
|
|
1042
1066
|
if (!d.__getInput('width') || !d.__getInput('height')) {
|
|
1043
1067
|
ui.forceUpdate('width');
|
|
1068
|
+
if (ui.__proxyData) {
|
|
1069
|
+
ui.setProxyAttr('width', ui.__.width);
|
|
1070
|
+
ui.setProxyAttr('height', ui.__.height);
|
|
1071
|
+
}
|
|
1044
1072
|
return false;
|
|
1045
1073
|
}
|
|
1046
1074
|
}
|
|
@@ -1051,22 +1079,21 @@ function emit(type, data) {
|
|
|
1051
1079
|
data.target.emitEvent(new core.ImageEvent(type, data));
|
|
1052
1080
|
}
|
|
1053
1081
|
|
|
1054
|
-
const
|
|
1082
|
+
const Export$1 = {};
|
|
1083
|
+
|
|
1084
|
+
const { get: get$2, scale, copy: copy$1 } = core.MatrixHelper;
|
|
1055
1085
|
function createPattern(ui, paint, pixelRatio) {
|
|
1056
1086
|
let { scaleX, scaleY } = ui.__world;
|
|
1057
1087
|
const id = scaleX + '-' + scaleY;
|
|
1058
1088
|
if (paint.patternId !== id && !ui.destroyed) {
|
|
1059
|
-
paint.patternId = id;
|
|
1060
1089
|
scaleX = Math.abs(scaleX);
|
|
1061
1090
|
scaleY = Math.abs(scaleY);
|
|
1062
1091
|
const { image, data } = paint;
|
|
1063
|
-
|
|
1064
|
-
const maxHeight = image.isSVG ? 4096 : Math.min(image.height, 4096);
|
|
1065
|
-
let scale, matrix, { width, height, scaleX: sx, scaleY: sy, opacity, transform, mode } = data;
|
|
1092
|
+
let imageScale, imageMatrix, { width, height, scaleX: sx, scaleY: sy, opacity, transform, repeat } = data;
|
|
1066
1093
|
if (sx) {
|
|
1067
|
-
|
|
1068
|
-
copy$1(
|
|
1069
|
-
|
|
1094
|
+
imageMatrix = get$2();
|
|
1095
|
+
copy$1(imageMatrix, transform);
|
|
1096
|
+
scale(imageMatrix, 1 / sx, 1 / sy);
|
|
1070
1097
|
scaleX *= sx;
|
|
1071
1098
|
scaleY *= sy;
|
|
1072
1099
|
}
|
|
@@ -1074,38 +1101,49 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1074
1101
|
scaleY *= pixelRatio;
|
|
1075
1102
|
width *= scaleX;
|
|
1076
1103
|
height *= scaleY;
|
|
1077
|
-
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
|
|
1084
|
-
|
|
1104
|
+
const size = width * height;
|
|
1105
|
+
if (!repeat) {
|
|
1106
|
+
if (size > core.Platform.image.maxCacheSize)
|
|
1107
|
+
return false;
|
|
1108
|
+
}
|
|
1109
|
+
let maxSize = core.Platform.image.maxPatternSize;
|
|
1110
|
+
if (!image.isSVG) {
|
|
1111
|
+
const imageSize = image.width * image.height;
|
|
1112
|
+
if (maxSize > imageSize)
|
|
1113
|
+
maxSize = imageSize;
|
|
1114
|
+
}
|
|
1115
|
+
if (size > maxSize)
|
|
1116
|
+
imageScale = Math.sqrt(size / maxSize);
|
|
1117
|
+
if (imageScale) {
|
|
1118
|
+
scaleX /= imageScale;
|
|
1119
|
+
scaleY /= imageScale;
|
|
1120
|
+
width /= imageScale;
|
|
1121
|
+
height /= imageScale;
|
|
1085
1122
|
}
|
|
1086
1123
|
if (sx) {
|
|
1087
1124
|
scaleX /= sx;
|
|
1088
1125
|
scaleY /= sy;
|
|
1089
1126
|
}
|
|
1090
1127
|
if (transform || scaleX !== 1 || scaleY !== 1) {
|
|
1091
|
-
if (!
|
|
1092
|
-
|
|
1128
|
+
if (!imageMatrix) {
|
|
1129
|
+
imageMatrix = get$2();
|
|
1093
1130
|
if (transform)
|
|
1094
|
-
copy$1(
|
|
1131
|
+
copy$1(imageMatrix, transform);
|
|
1095
1132
|
}
|
|
1096
|
-
|
|
1133
|
+
scale(imageMatrix, 1 / scaleX, 1 / scaleY);
|
|
1097
1134
|
}
|
|
1098
|
-
const
|
|
1135
|
+
const pattern = core.Platform.canvas.createPattern(image.getCanvas(width < 1 ? 1 : width, height < 1 ? 1 : height, opacity), repeat || (core.Platform.origin.noRepeat || 'no-repeat'));
|
|
1099
1136
|
try {
|
|
1100
1137
|
if (paint.transform)
|
|
1101
1138
|
paint.transform = null;
|
|
1102
|
-
if (
|
|
1103
|
-
|
|
1139
|
+
if (imageMatrix)
|
|
1140
|
+
pattern.setTransform ? pattern.setTransform(imageMatrix) : paint.transform = imageMatrix;
|
|
1104
1141
|
}
|
|
1105
1142
|
catch (_a) {
|
|
1106
|
-
paint.transform =
|
|
1143
|
+
paint.transform = imageMatrix;
|
|
1107
1144
|
}
|
|
1108
|
-
paint.style =
|
|
1145
|
+
paint.style = pattern;
|
|
1146
|
+
paint.patternId = id;
|
|
1109
1147
|
return true;
|
|
1110
1148
|
}
|
|
1111
1149
|
else {
|
|
@@ -1113,18 +1151,24 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1113
1151
|
}
|
|
1114
1152
|
}
|
|
1115
1153
|
|
|
1154
|
+
const { abs } = Math;
|
|
1116
1155
|
function checkImage(ui, canvas, paint, allowPaint) {
|
|
1117
1156
|
const { scaleX, scaleY } = ui.__world;
|
|
1118
1157
|
if (!paint.data || paint.patternId === scaleX + '-' + scaleY) {
|
|
1119
1158
|
return false;
|
|
1120
1159
|
}
|
|
1121
1160
|
else {
|
|
1161
|
+
const { data } = paint;
|
|
1122
1162
|
if (allowPaint) {
|
|
1123
|
-
if (
|
|
1124
|
-
let { width, height } =
|
|
1125
|
-
width *= scaleX * canvas.pixelRatio;
|
|
1126
|
-
height *= scaleY * canvas.pixelRatio;
|
|
1127
|
-
|
|
1163
|
+
if (!data.repeat) {
|
|
1164
|
+
let { width, height } = data;
|
|
1165
|
+
width *= abs(scaleX) * canvas.pixelRatio;
|
|
1166
|
+
height *= abs(scaleY) * canvas.pixelRatio;
|
|
1167
|
+
if (data.scaleX) {
|
|
1168
|
+
width *= data.scaleX;
|
|
1169
|
+
height *= data.scaleY;
|
|
1170
|
+
}
|
|
1171
|
+
allowPaint = width * height > core.Platform.image.maxCacheSize;
|
|
1128
1172
|
}
|
|
1129
1173
|
else {
|
|
1130
1174
|
allowPaint = false;
|
|
@@ -1133,7 +1177,6 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1133
1177
|
if (allowPaint) {
|
|
1134
1178
|
canvas.save();
|
|
1135
1179
|
canvas.clip();
|
|
1136
|
-
const { data } = paint;
|
|
1137
1180
|
if (paint.blendMode)
|
|
1138
1181
|
canvas.blendMode = paint.blendMode;
|
|
1139
1182
|
if (data.opacity)
|
|
@@ -1145,7 +1188,7 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1145
1188
|
return true;
|
|
1146
1189
|
}
|
|
1147
1190
|
else {
|
|
1148
|
-
if (!paint.style) {
|
|
1191
|
+
if (!paint.style || Export$1.running) {
|
|
1149
1192
|
createPattern(ui, paint, canvas.pixelRatio);
|
|
1150
1193
|
}
|
|
1151
1194
|
else {
|
|
@@ -1164,7 +1207,7 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1164
1207
|
}
|
|
1165
1208
|
|
|
1166
1209
|
function recycleImage(attrName, data) {
|
|
1167
|
-
const paints =
|
|
1210
|
+
const paints = data['_' + attrName];
|
|
1168
1211
|
if (paints instanceof Array) {
|
|
1169
1212
|
let image, recycleMap, input, url;
|
|
1170
1213
|
for (let i = 0, len = paints.length; i < len; i++) {
|
|
@@ -1268,7 +1311,7 @@ function drawAlignStroke(align, stroke, isStrokes, ui, canvas, renderOptions) {
|
|
|
1268
1311
|
out.blendMode = align === 'outside' ? 'destination-out' : 'destination-in';
|
|
1269
1312
|
fillText(ui, out);
|
|
1270
1313
|
out.blendMode = 'normal';
|
|
1271
|
-
if (ui.
|
|
1314
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1272
1315
|
canvas.copyWorldByReset(out);
|
|
1273
1316
|
}
|
|
1274
1317
|
else {
|
|
@@ -1341,7 +1384,7 @@ function stroke(stroke, ui, canvas, renderOptions) {
|
|
|
1341
1384
|
out.stroke();
|
|
1342
1385
|
options.windingRule ? out.clip(options.windingRule) : out.clip();
|
|
1343
1386
|
out.clearWorld(ui.__layout.renderBounds);
|
|
1344
|
-
if (ui.
|
|
1387
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1345
1388
|
canvas.copyWorldByReset(out);
|
|
1346
1389
|
}
|
|
1347
1390
|
else {
|
|
@@ -1381,7 +1424,7 @@ function strokes(strokes, ui, canvas, renderOptions) {
|
|
|
1381
1424
|
drawStrokesStyle(strokes, false, ui, out);
|
|
1382
1425
|
options.windingRule ? out.clip(options.windingRule) : out.clip();
|
|
1383
1426
|
out.clearWorld(renderBounds);
|
|
1384
|
-
if (ui.
|
|
1427
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1385
1428
|
canvas.copyWorldByReset(out);
|
|
1386
1429
|
}
|
|
1387
1430
|
else {
|
|
@@ -1605,7 +1648,7 @@ function shadow(ui, current, shape, renderOptions) {
|
|
|
1605
1648
|
}
|
|
1606
1649
|
worldCanvas ? other.copyWorld(worldCanvas, __world, __world, 'destination-out') : other.copyWorld(shape.canvas, shapeBounds, bounds, 'destination-out');
|
|
1607
1650
|
}
|
|
1608
|
-
if (ui.
|
|
1651
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1609
1652
|
current.copyWorldByReset(other, copyBounds, __world, item.blendMode);
|
|
1610
1653
|
}
|
|
1611
1654
|
else {
|
|
@@ -1669,7 +1712,7 @@ function innerShadow(ui, current, shape, renderOptions) {
|
|
|
1669
1712
|
copyBounds = bounds;
|
|
1670
1713
|
}
|
|
1671
1714
|
other.fillWorld(copyBounds, item.color, 'source-in');
|
|
1672
|
-
if (ui.
|
|
1715
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1673
1716
|
current.copyWorldByReset(other, copyBounds, __world, item.blendMode);
|
|
1674
1717
|
}
|
|
1675
1718
|
else {
|
|
@@ -2117,6 +2160,7 @@ function decorationText(drawData, style) {
|
|
|
2117
2160
|
}
|
|
2118
2161
|
}
|
|
2119
2162
|
|
|
2163
|
+
const { top, right, bottom, left } = core.Direction4;
|
|
2120
2164
|
const TextConvert = {
|
|
2121
2165
|
getDrawData(content, style) {
|
|
2122
2166
|
if (typeof content !== 'string')
|
|
@@ -2124,16 +2168,15 @@ const TextConvert = {
|
|
|
2124
2168
|
let x = 0, y = 0;
|
|
2125
2169
|
let width = style.__getInput('width') || 0;
|
|
2126
2170
|
let height = style.__getInput('height') || 0;
|
|
2127
|
-
const { textDecoration, __font, padding } = style;
|
|
2171
|
+
const { textDecoration, __font, __padding: padding } = style;
|
|
2128
2172
|
if (padding) {
|
|
2129
|
-
const [top, right, bottom, left] = core.MathHelper.fourNumber(padding);
|
|
2130
2173
|
if (width) {
|
|
2131
|
-
x = left;
|
|
2132
|
-
width -= (right + left);
|
|
2174
|
+
x = padding[left];
|
|
2175
|
+
width -= (padding[right] + padding[left]);
|
|
2133
2176
|
}
|
|
2134
2177
|
if (height) {
|
|
2135
|
-
y = top;
|
|
2136
|
-
height -= (top + bottom);
|
|
2178
|
+
y = padding[top];
|
|
2179
|
+
height -= (padding[top] + padding[bottom]);
|
|
2137
2180
|
}
|
|
2138
2181
|
}
|
|
2139
2182
|
const drawData = {
|
|
@@ -2143,6 +2186,8 @@ const TextConvert = {
|
|
|
2143
2186
|
font: core.Platform.canvas.font = __font
|
|
2144
2187
|
};
|
|
2145
2188
|
createRows(drawData, content, style);
|
|
2189
|
+
if (padding)
|
|
2190
|
+
padAutoText(padding, drawData, style, width, height);
|
|
2146
2191
|
layoutText(drawData, style);
|
|
2147
2192
|
layoutChar(drawData, style, width);
|
|
2148
2193
|
if (drawData.overflow)
|
|
@@ -2152,6 +2197,32 @@ const TextConvert = {
|
|
|
2152
2197
|
return drawData;
|
|
2153
2198
|
}
|
|
2154
2199
|
};
|
|
2200
|
+
function padAutoText(padding, drawData, style, width, height) {
|
|
2201
|
+
if (!width) {
|
|
2202
|
+
switch (style.textAlign) {
|
|
2203
|
+
case 'left':
|
|
2204
|
+
offsetText(drawData, 'x', padding[left]);
|
|
2205
|
+
break;
|
|
2206
|
+
case 'right':
|
|
2207
|
+
offsetText(drawData, 'x', -padding[right]);
|
|
2208
|
+
}
|
|
2209
|
+
}
|
|
2210
|
+
if (!height) {
|
|
2211
|
+
switch (style.verticalAlign) {
|
|
2212
|
+
case 'top':
|
|
2213
|
+
offsetText(drawData, 'y', padding[top]);
|
|
2214
|
+
break;
|
|
2215
|
+
case 'bottom':
|
|
2216
|
+
offsetText(drawData, 'y', -padding[bottom]);
|
|
2217
|
+
}
|
|
2218
|
+
}
|
|
2219
|
+
}
|
|
2220
|
+
function offsetText(drawData, attrName, value) {
|
|
2221
|
+
const { bounds, rows } = drawData;
|
|
2222
|
+
bounds[attrName] += value;
|
|
2223
|
+
for (let i = 0; i < rows.length; i++)
|
|
2224
|
+
rows[i][attrName] += value;
|
|
2225
|
+
}
|
|
2155
2226
|
|
|
2156
2227
|
const ColorConvert = {
|
|
2157
2228
|
string(color, opacity) {
|
|
@@ -2167,6 +2238,7 @@ const ColorConvert = {
|
|
|
2167
2238
|
|
|
2168
2239
|
const Export = {
|
|
2169
2240
|
export(leaf, filename, options) {
|
|
2241
|
+
Export.running = true;
|
|
2170
2242
|
return addTask((success) => new Promise((resolve) => {
|
|
2171
2243
|
const { leafer } = leaf;
|
|
2172
2244
|
if (leafer) {
|
|
@@ -2204,6 +2276,7 @@ const Export = {
|
|
|
2204
2276
|
}
|
|
2205
2277
|
success({ data });
|
|
2206
2278
|
resolve();
|
|
2279
|
+
Export.running = false;
|
|
2207
2280
|
if (unreal)
|
|
2208
2281
|
canvas.recycle();
|
|
2209
2282
|
}));
|
|
@@ -2211,6 +2284,7 @@ const Export = {
|
|
|
2211
2284
|
else {
|
|
2212
2285
|
success({ data: false });
|
|
2213
2286
|
resolve();
|
|
2287
|
+
Export.running = false;
|
|
2214
2288
|
}
|
|
2215
2289
|
}));
|
|
2216
2290
|
}
|