@leafer-ui/node 1.0.0-rc.5 → 1.0.0-rc.7
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 +330 -247
- package/dist/node.esm.js +333 -250
- package/dist/node.esm.min.js +1 -1
- package/dist/node.min.cjs +1 -1
- package/package.json +8 -7
package/dist/node.esm.js
CHANGED
|
@@ -1,16 +1,49 @@
|
|
|
1
|
-
import { LeafList, DataHelper, RenderEvent, ChildEvent, WatchEvent, PropertyEvent, LeafHelper, BranchHelper, Bounds, LeafBoundsHelper,
|
|
1
|
+
import { LeafList, DataHelper, RenderEvent, ChildEvent, WatchEvent, PropertyEvent, LeafHelper, BranchHelper, Bounds, LeafBoundsHelper, Debug, LeafLevelList, LayoutEvent, Run, ImageManager, Platform, AnimateEvent, ResizeEvent, BoundsHelper, Creator, LeaferCanvasBase, canvasPatch, LeaferImage, InteractionBase, FileHelper, MatrixHelper, ImageEvent, PointHelper, MathHelper, TaskProcessor } from '@leafer/core';
|
|
2
2
|
export * from '@leafer/core';
|
|
3
3
|
export { LeaferImage } from '@leafer/core';
|
|
4
|
-
import {
|
|
4
|
+
import { writeFileSync } from 'fs';
|
|
5
|
+
import { ColorConvert as ColorConvert$1, ImageManager as ImageManager$1, Paint, Effect, TextConvert as TextConvert$1, Export as Export$2 } from '@leafer-ui/core';
|
|
5
6
|
export * from '@leafer-ui/core';
|
|
6
7
|
|
|
8
|
+
/******************************************************************************
|
|
9
|
+
Copyright (c) Microsoft Corporation.
|
|
10
|
+
|
|
11
|
+
Permission to use, copy, modify, and/or distribute this software for any
|
|
12
|
+
purpose with or without fee is hereby granted.
|
|
13
|
+
|
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
15
|
+
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
16
|
+
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
17
|
+
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
18
|
+
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
19
|
+
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
20
|
+
PERFORMANCE OF THIS SOFTWARE.
|
|
21
|
+
***************************************************************************** */
|
|
22
|
+
/* global Reflect, Promise, SuppressedError, Symbol */
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
function __awaiter(thisArg, _arguments, P, generator) {
|
|
26
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
27
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
28
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
29
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
30
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
31
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
32
|
+
});
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
|
|
36
|
+
var e = new Error(message);
|
|
37
|
+
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
38
|
+
};
|
|
39
|
+
|
|
7
40
|
class Watcher {
|
|
8
41
|
get childrenChanged() { return this.hasAdd || this.hasRemove || this.hasVisible; }
|
|
9
42
|
get updatedList() {
|
|
10
43
|
if (this.hasRemove) {
|
|
11
44
|
const updatedList = new LeafList();
|
|
12
45
|
this.__updatedList.list.forEach(item => { if (item.leafer)
|
|
13
|
-
updatedList.
|
|
46
|
+
updatedList.add(item); });
|
|
14
47
|
return updatedList;
|
|
15
48
|
}
|
|
16
49
|
else {
|
|
@@ -45,7 +78,7 @@ class Watcher {
|
|
|
45
78
|
this.target.emit(RenderEvent.REQUEST);
|
|
46
79
|
}
|
|
47
80
|
__onAttrChange(event) {
|
|
48
|
-
this.__updatedList.
|
|
81
|
+
this.__updatedList.add(event.target);
|
|
49
82
|
this.update();
|
|
50
83
|
}
|
|
51
84
|
__onChildEvent(event) {
|
|
@@ -55,12 +88,12 @@ class Watcher {
|
|
|
55
88
|
}
|
|
56
89
|
else {
|
|
57
90
|
this.hasRemove = true;
|
|
58
|
-
this.__updatedList.
|
|
91
|
+
this.__updatedList.add(event.parent);
|
|
59
92
|
}
|
|
60
93
|
this.update();
|
|
61
94
|
}
|
|
62
95
|
__pushChild(child) {
|
|
63
|
-
this.__updatedList.
|
|
96
|
+
this.__updatedList.add(child);
|
|
64
97
|
if (child.isBranch)
|
|
65
98
|
this.__loopChildren(child);
|
|
66
99
|
}
|
|
@@ -99,7 +132,7 @@ class Watcher {
|
|
|
99
132
|
}
|
|
100
133
|
}
|
|
101
134
|
|
|
102
|
-
const {
|
|
135
|
+
const { updateAllMatrix: updateAllMatrix$1, updateBounds: updateOneBounds, updateAllWorldOpacity } = LeafHelper;
|
|
103
136
|
const { pushAllChildBranch, pushAllParent } = BranchHelper;
|
|
104
137
|
function updateMatrix(updateList, levelList) {
|
|
105
138
|
let layout;
|
|
@@ -107,14 +140,14 @@ function updateMatrix(updateList, levelList) {
|
|
|
107
140
|
layout = leaf.__layout;
|
|
108
141
|
if (levelList.without(leaf) && !layout.proxyZoom) {
|
|
109
142
|
if (layout.matrixChanged) {
|
|
110
|
-
|
|
111
|
-
levelList.
|
|
143
|
+
updateAllMatrix$1(leaf, true);
|
|
144
|
+
levelList.add(leaf);
|
|
112
145
|
if (leaf.isBranch)
|
|
113
146
|
pushAllChildBranch(leaf, levelList);
|
|
114
147
|
pushAllParent(leaf, levelList);
|
|
115
148
|
}
|
|
116
149
|
else if (layout.boundsChanged) {
|
|
117
|
-
levelList.
|
|
150
|
+
levelList.add(leaf);
|
|
118
151
|
if (leaf.isBranch)
|
|
119
152
|
leaf.__tempNumber = 0;
|
|
120
153
|
pushAllParent(leaf, levelList);
|
|
@@ -123,20 +156,21 @@ function updateMatrix(updateList, levelList) {
|
|
|
123
156
|
});
|
|
124
157
|
}
|
|
125
158
|
function updateBounds(boundsList) {
|
|
126
|
-
let
|
|
159
|
+
let list, branch, children;
|
|
127
160
|
boundsList.sort(true);
|
|
128
161
|
boundsList.levels.forEach(level => {
|
|
129
|
-
|
|
130
|
-
for (let i = 0, len =
|
|
131
|
-
branch =
|
|
162
|
+
list = boundsList.levelMap[level];
|
|
163
|
+
for (let i = 0, len = list.length; i < len; i++) {
|
|
164
|
+
branch = list[i];
|
|
132
165
|
if (branch.isBranch && branch.__tempNumber) {
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
166
|
+
children = branch.children;
|
|
167
|
+
for (let j = 0, jLen = children.length; j < jLen; j++) {
|
|
168
|
+
if (!children[j].isBranch) {
|
|
169
|
+
updateOneBounds(children[j]);
|
|
136
170
|
}
|
|
137
171
|
}
|
|
138
172
|
}
|
|
139
|
-
branch
|
|
173
|
+
updateOneBounds(branch);
|
|
140
174
|
}
|
|
141
175
|
});
|
|
142
176
|
}
|
|
@@ -149,7 +183,7 @@ function updateChange(updateList) {
|
|
|
149
183
|
}
|
|
150
184
|
|
|
151
185
|
const { worldBounds } = LeafBoundsHelper;
|
|
152
|
-
const {
|
|
186
|
+
const bigBounds = { x: 0, y: 0, width: 100000, height: 100000 };
|
|
153
187
|
class LayoutBlockData {
|
|
154
188
|
constructor(list) {
|
|
155
189
|
this.updatedBounds = new Bounds();
|
|
@@ -160,14 +194,20 @@ class LayoutBlockData {
|
|
|
160
194
|
this.updatedList = list;
|
|
161
195
|
}
|
|
162
196
|
setBefore() {
|
|
163
|
-
|
|
197
|
+
this.beforeBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
164
198
|
}
|
|
165
199
|
setAfter() {
|
|
166
|
-
|
|
167
|
-
|
|
200
|
+
const { list } = this.updatedList;
|
|
201
|
+
if (list.some(leaf => leaf.noBounds)) {
|
|
202
|
+
this.afterBounds.set(bigBounds);
|
|
203
|
+
}
|
|
204
|
+
else {
|
|
205
|
+
this.afterBounds.setListWithFn(list, worldBounds);
|
|
206
|
+
}
|
|
207
|
+
this.updatedBounds.setList([this.beforeBounds, this.afterBounds]);
|
|
168
208
|
}
|
|
169
209
|
merge(data) {
|
|
170
|
-
this.updatedList.
|
|
210
|
+
this.updatedList.addList(data.updatedList.list);
|
|
171
211
|
this.beforeBounds.add(data.beforeBounds);
|
|
172
212
|
this.afterBounds.add(data.afterBounds);
|
|
173
213
|
this.updatedBounds.add(data.updatedBounds);
|
|
@@ -177,8 +217,7 @@ class LayoutBlockData {
|
|
|
177
217
|
}
|
|
178
218
|
}
|
|
179
219
|
|
|
180
|
-
const {
|
|
181
|
-
const { pushAllBranchStack, updateWorldBoundsByBranchStack } = BranchHelper;
|
|
220
|
+
const { updateAllMatrix, updateAllChange } = LeafHelper;
|
|
182
221
|
const debug$1 = Debug.get('Layouter');
|
|
183
222
|
class Layouter {
|
|
184
223
|
constructor(target, userConfig) {
|
|
@@ -255,12 +294,15 @@ class Layouter {
|
|
|
255
294
|
const { target, __updatedList: updateList } = this;
|
|
256
295
|
const { BEFORE, LAYOUT, AFTER } = LayoutEvent;
|
|
257
296
|
const blocks = this.getBlocks(updateList);
|
|
258
|
-
blocks.forEach(item =>
|
|
297
|
+
blocks.forEach(item => item.setBefore());
|
|
259
298
|
target.emitEvent(new LayoutEvent(BEFORE, blocks, this.times));
|
|
299
|
+
this.extraBlock = null;
|
|
260
300
|
updateList.sort();
|
|
261
301
|
updateMatrix(updateList, this.__levelList);
|
|
262
302
|
updateBounds(this.__levelList);
|
|
263
303
|
updateChange(updateList);
|
|
304
|
+
if (this.extraBlock)
|
|
305
|
+
blocks.push(this.extraBlock);
|
|
264
306
|
blocks.forEach(item => item.setAfter());
|
|
265
307
|
target.emitEvent(new LayoutEvent(LAYOUT, blocks, this.times));
|
|
266
308
|
target.emitEvent(new LayoutEvent(AFTER, blocks, this.times));
|
|
@@ -283,17 +325,20 @@ class Layouter {
|
|
|
283
325
|
Run.end(t);
|
|
284
326
|
}
|
|
285
327
|
static fullLayout(target) {
|
|
286
|
-
|
|
328
|
+
updateAllMatrix(target, true);
|
|
287
329
|
if (target.isBranch) {
|
|
288
|
-
|
|
289
|
-
pushAllBranchStack(target, branchStack);
|
|
290
|
-
updateWorldBoundsByBranchStack(branchStack);
|
|
330
|
+
BranchHelper.updateBounds(target);
|
|
291
331
|
}
|
|
292
332
|
else {
|
|
293
|
-
|
|
333
|
+
LeafHelper.updateBounds(target);
|
|
294
334
|
}
|
|
295
335
|
updateAllChange(target);
|
|
296
336
|
}
|
|
337
|
+
addExtra(leaf) {
|
|
338
|
+
const block = this.extraBlock || (this.extraBlock = new LayoutBlockData([]));
|
|
339
|
+
block.updatedList.add(leaf);
|
|
340
|
+
block.beforeBounds.add(leaf.__world);
|
|
341
|
+
}
|
|
297
342
|
createBlock(data) {
|
|
298
343
|
return new LayoutBlockData(data);
|
|
299
344
|
}
|
|
@@ -321,8 +366,7 @@ class Layouter {
|
|
|
321
366
|
if (this.target) {
|
|
322
367
|
this.stop();
|
|
323
368
|
this.__removeListenEvents();
|
|
324
|
-
this.target = null;
|
|
325
|
-
this.config = null;
|
|
369
|
+
this.target = this.config = null;
|
|
326
370
|
}
|
|
327
371
|
}
|
|
328
372
|
}
|
|
@@ -433,7 +477,7 @@ class Renderer {
|
|
|
433
477
|
const { canvas } = this;
|
|
434
478
|
const bounds = block.getIntersect(canvas.bounds);
|
|
435
479
|
const includes = block.includes(this.target.__world);
|
|
436
|
-
const realBounds = new Bounds(
|
|
480
|
+
const realBounds = new Bounds(bounds);
|
|
437
481
|
canvas.save();
|
|
438
482
|
if (includes && !Debug.showRepaint) {
|
|
439
483
|
canvas.clear();
|
|
@@ -483,7 +527,7 @@ class Renderer {
|
|
|
483
527
|
const { updateBlocks: list } = this;
|
|
484
528
|
if (list) {
|
|
485
529
|
const bounds = new Bounds();
|
|
486
|
-
bounds.
|
|
530
|
+
bounds.setList(list);
|
|
487
531
|
list.length = 0;
|
|
488
532
|
list.push(bounds);
|
|
489
533
|
}
|
|
@@ -523,7 +567,7 @@ class Renderer {
|
|
|
523
567
|
empty = (!leaf.__world.width || !leaf.__world.height);
|
|
524
568
|
if (empty) {
|
|
525
569
|
if (!leaf.isLeafer)
|
|
526
|
-
debug.
|
|
570
|
+
debug.tip(leaf.innerName, ': empty');
|
|
527
571
|
empty = (!leaf.isBranch || leaf.isBranchLeaf);
|
|
528
572
|
}
|
|
529
573
|
return empty;
|
|
@@ -557,8 +601,16 @@ class Renderer {
|
|
|
557
601
|
}
|
|
558
602
|
}
|
|
559
603
|
|
|
604
|
+
var AnswerType;
|
|
605
|
+
(function (AnswerType) {
|
|
606
|
+
AnswerType[AnswerType["No"] = 0] = "No";
|
|
607
|
+
AnswerType[AnswerType["Yes"] = 1] = "Yes";
|
|
608
|
+
AnswerType[AnswerType["NoAndSkip"] = 2] = "NoAndSkip";
|
|
609
|
+
AnswerType[AnswerType["YesAndSkip"] = 3] = "YesAndSkip";
|
|
610
|
+
})(AnswerType || (AnswerType = {}));
|
|
611
|
+
|
|
560
612
|
const { hitRadiusPoint } = BoundsHelper;
|
|
561
|
-
class
|
|
613
|
+
class Pather {
|
|
562
614
|
constructor(target, selector) {
|
|
563
615
|
this.target = target;
|
|
564
616
|
this.selector = selector;
|
|
@@ -601,10 +653,10 @@ class FindPath {
|
|
|
601
653
|
getPath(leaf) {
|
|
602
654
|
const path = new LeafList();
|
|
603
655
|
while (leaf) {
|
|
604
|
-
path.
|
|
656
|
+
path.add(leaf);
|
|
605
657
|
leaf = leaf.parent;
|
|
606
658
|
}
|
|
607
|
-
path.
|
|
659
|
+
path.add(this.target);
|
|
608
660
|
return path;
|
|
609
661
|
}
|
|
610
662
|
getHitablePath(leaf) {
|
|
@@ -614,7 +666,7 @@ class FindPath {
|
|
|
614
666
|
item = path.list[i];
|
|
615
667
|
if (!item.__.hittable)
|
|
616
668
|
break;
|
|
617
|
-
hittablePath.
|
|
669
|
+
hittablePath.addAt(item, 0);
|
|
618
670
|
if (!item.__.hitChildren)
|
|
619
671
|
break;
|
|
620
672
|
}
|
|
@@ -633,7 +685,7 @@ class FindPath {
|
|
|
633
685
|
leaf = path.list[j];
|
|
634
686
|
if (nextPath && nextPath.has(leaf))
|
|
635
687
|
break;
|
|
636
|
-
throughPath.
|
|
688
|
+
throughPath.add(leaf);
|
|
637
689
|
}
|
|
638
690
|
}
|
|
639
691
|
return throughPath;
|
|
@@ -675,120 +727,113 @@ class FindPath {
|
|
|
675
727
|
}
|
|
676
728
|
}
|
|
677
729
|
|
|
730
|
+
const { Yes, NoAndSkip, YesAndSkip } = AnswerType;
|
|
678
731
|
class Selector {
|
|
679
732
|
constructor(target, userConfig) {
|
|
680
733
|
this.config = {};
|
|
681
|
-
this.
|
|
682
|
-
this.
|
|
683
|
-
this.
|
|
684
|
-
|
|
734
|
+
this.innerIdMap = {};
|
|
735
|
+
this.idMap = {};
|
|
736
|
+
this.methods = {
|
|
737
|
+
id: (leaf, name) => leaf.id === name ? (this.idMap[name] = leaf, 1) : 0,
|
|
738
|
+
innerId: (leaf, innerId) => leaf.innerId === innerId ? (this.innerIdMap[innerId] = leaf, 1) : 0,
|
|
739
|
+
className: (leaf, name) => leaf.className === name ? 1 : 0,
|
|
740
|
+
tag: (leaf, name) => leaf.__tag === name ? 1 : 0
|
|
741
|
+
};
|
|
685
742
|
this.target = target;
|
|
686
743
|
if (userConfig)
|
|
687
744
|
this.config = DataHelper.default(userConfig, this.config);
|
|
688
|
-
this.
|
|
745
|
+
this.pather = new Pather(target, this);
|
|
689
746
|
this.__listenEvents();
|
|
690
747
|
}
|
|
748
|
+
getBy(condition, branch, one, options) {
|
|
749
|
+
switch (typeof condition) {
|
|
750
|
+
case 'number':
|
|
751
|
+
const leaf = this.getByInnerId(condition, branch);
|
|
752
|
+
return one ? leaf : (leaf ? [leaf] : []);
|
|
753
|
+
case 'string':
|
|
754
|
+
switch (condition[0]) {
|
|
755
|
+
case '#':
|
|
756
|
+
const leaf = this.getById(condition.substring(1), branch);
|
|
757
|
+
return one ? leaf : (leaf ? [leaf] : []);
|
|
758
|
+
case '.':
|
|
759
|
+
return this.getByMethod(this.methods.className, branch, one, condition.substring(1));
|
|
760
|
+
default:
|
|
761
|
+
return this.getByMethod(this.methods.tag, branch, one, condition);
|
|
762
|
+
}
|
|
763
|
+
case 'function':
|
|
764
|
+
return this.getByMethod(condition, branch, one, options);
|
|
765
|
+
}
|
|
766
|
+
}
|
|
691
767
|
getByPoint(hitPoint, hitRadius, options) {
|
|
692
768
|
if (Platform.name === 'node')
|
|
693
769
|
this.target.emit(LayoutEvent.CHECK_UPDATE);
|
|
694
|
-
return this.
|
|
695
|
-
}
|
|
696
|
-
find(name, branch) {
|
|
697
|
-
if (typeof name === 'number') {
|
|
698
|
-
return this.getByInnerId(name, branch);
|
|
699
|
-
}
|
|
700
|
-
else if (name.startsWith('#')) {
|
|
701
|
-
return this.getById(name.substring(1), branch);
|
|
702
|
-
}
|
|
703
|
-
else if (name.startsWith('.')) {
|
|
704
|
-
return this.getByClassName(name.substring(1), branch);
|
|
705
|
-
}
|
|
706
|
-
else {
|
|
707
|
-
return this.getByTagName(name, branch);
|
|
708
|
-
}
|
|
770
|
+
return this.pather.getByPoint(hitPoint, hitRadius, options);
|
|
709
771
|
}
|
|
710
|
-
getByInnerId(
|
|
711
|
-
|
|
772
|
+
getByInnerId(innerId, branch) {
|
|
773
|
+
const cache = this.innerIdMap[innerId];
|
|
712
774
|
if (cache)
|
|
713
775
|
return cache;
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
let find;
|
|
717
|
-
this.loopFind(branch, (leaf) => {
|
|
718
|
-
if (leaf.innerId === name) {
|
|
719
|
-
find = leaf;
|
|
720
|
-
this.innerIdList[name] = find;
|
|
721
|
-
return true;
|
|
722
|
-
}
|
|
723
|
-
else {
|
|
724
|
-
return false;
|
|
725
|
-
}
|
|
726
|
-
});
|
|
727
|
-
return find;
|
|
776
|
+
this.eachFind(this.toChildren(branch), this.methods.innerId, null, innerId);
|
|
777
|
+
return this.findLeaf;
|
|
728
778
|
}
|
|
729
|
-
getById(
|
|
730
|
-
|
|
731
|
-
if (cache)
|
|
779
|
+
getById(id, branch) {
|
|
780
|
+
const cache = this.idMap[id];
|
|
781
|
+
if (cache && LeafHelper.hasParent(cache, branch || this.target))
|
|
732
782
|
return cache;
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
let find;
|
|
736
|
-
this.loopFind(branch, (leaf) => {
|
|
737
|
-
if (leaf.id === name) {
|
|
738
|
-
find = leaf;
|
|
739
|
-
this.idList[name] = find;
|
|
740
|
-
return true;
|
|
741
|
-
}
|
|
742
|
-
else {
|
|
743
|
-
return false;
|
|
744
|
-
}
|
|
745
|
-
});
|
|
746
|
-
return find;
|
|
747
|
-
}
|
|
748
|
-
getByClassName(name, branch) {
|
|
749
|
-
if (!branch)
|
|
750
|
-
branch = this.target;
|
|
751
|
-
let find = [];
|
|
752
|
-
this.loopFind(branch, (leaf) => {
|
|
753
|
-
if (leaf.className === name)
|
|
754
|
-
find.push(leaf);
|
|
755
|
-
return false;
|
|
756
|
-
});
|
|
757
|
-
return find;
|
|
758
|
-
}
|
|
759
|
-
getByTagName(name, branch) {
|
|
760
|
-
if (!branch)
|
|
761
|
-
branch = this.target;
|
|
762
|
-
let find = [];
|
|
763
|
-
this.loopFind(branch, (leaf) => {
|
|
764
|
-
if (leaf.__tag === name)
|
|
765
|
-
find.push(leaf);
|
|
766
|
-
return false;
|
|
767
|
-
});
|
|
768
|
-
return find;
|
|
783
|
+
this.eachFind(this.toChildren(branch), this.methods.id, null, id);
|
|
784
|
+
return this.findLeaf;
|
|
769
785
|
}
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
786
|
+
getByClassName(className, branch) {
|
|
787
|
+
return this.getByMethod(this.methods.className, branch, false, className);
|
|
788
|
+
}
|
|
789
|
+
getByTag(tag, branch) {
|
|
790
|
+
return this.getByMethod(this.methods.tag, branch, false, tag);
|
|
791
|
+
}
|
|
792
|
+
getByMethod(method, branch, one, options) {
|
|
793
|
+
const list = one ? null : [];
|
|
794
|
+
this.eachFind(this.toChildren(branch), method, list, options);
|
|
795
|
+
return list || this.findLeaf;
|
|
796
|
+
}
|
|
797
|
+
eachFind(children, method, list, options) {
|
|
798
|
+
let child, result;
|
|
774
799
|
for (let i = 0, len = children.length; i < len; i++) {
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
800
|
+
child = children[i];
|
|
801
|
+
result = method(child, options);
|
|
802
|
+
if (result === Yes || result === YesAndSkip) {
|
|
803
|
+
if (list) {
|
|
804
|
+
list.push(child);
|
|
805
|
+
}
|
|
806
|
+
else {
|
|
807
|
+
this.findLeaf = child;
|
|
808
|
+
return;
|
|
809
|
+
}
|
|
810
|
+
}
|
|
811
|
+
if (child.isBranch && result < NoAndSkip)
|
|
812
|
+
this.eachFind(child.children, method, list, options);
|
|
780
813
|
}
|
|
781
814
|
}
|
|
815
|
+
toChildren(branch) {
|
|
816
|
+
this.findLeaf = null;
|
|
817
|
+
return [branch || this.target];
|
|
818
|
+
}
|
|
782
819
|
__onRemoveChild(event) {
|
|
783
|
-
const
|
|
784
|
-
if (this.
|
|
785
|
-
this.
|
|
786
|
-
if (this.
|
|
787
|
-
this.
|
|
820
|
+
const { id, innerId } = event.child;
|
|
821
|
+
if (this.idMap[id])
|
|
822
|
+
delete this.idMap[id];
|
|
823
|
+
if (this.innerIdMap[innerId])
|
|
824
|
+
delete this.innerIdMap[innerId];
|
|
825
|
+
}
|
|
826
|
+
__checkIdChange(event) {
|
|
827
|
+
if (event.attrName === 'id') {
|
|
828
|
+
const id = event.oldValue;
|
|
829
|
+
if (this.idMap[id])
|
|
830
|
+
delete this.idMap[id];
|
|
831
|
+
}
|
|
788
832
|
}
|
|
789
833
|
__listenEvents() {
|
|
790
834
|
this.__eventIds = [
|
|
791
|
-
this.target.on_(ChildEvent.REMOVE, this.__onRemoveChild, this)
|
|
835
|
+
this.target.on_(ChildEvent.REMOVE, this.__onRemoveChild, this),
|
|
836
|
+
this.target.on_(PropertyEvent.CHANGE, this.__checkIdChange, this)
|
|
792
837
|
];
|
|
793
838
|
}
|
|
794
839
|
__removeListenEvents() {
|
|
@@ -798,11 +843,10 @@ class Selector {
|
|
|
798
843
|
destroy() {
|
|
799
844
|
if (this.__eventIds.length) {
|
|
800
845
|
this.__removeListenEvents();
|
|
801
|
-
this.
|
|
802
|
-
this.
|
|
803
|
-
this.
|
|
804
|
-
this.
|
|
805
|
-
this.tagNameList = {};
|
|
846
|
+
this.pather.destroy();
|
|
847
|
+
this.findLeaf = null;
|
|
848
|
+
this.innerIdMap = {};
|
|
849
|
+
this.idMap = {};
|
|
806
850
|
}
|
|
807
851
|
}
|
|
808
852
|
}
|
|
@@ -821,8 +865,10 @@ class LeaferCanvas extends LeaferCanvasBase {
|
|
|
821
865
|
this.__createView();
|
|
822
866
|
this.__createContext();
|
|
823
867
|
this.resize(this.config);
|
|
824
|
-
|
|
825
|
-
|
|
868
|
+
if (Platform.roundRectPatch) {
|
|
869
|
+
this.context.__proto__.roundRect = null;
|
|
870
|
+
canvasPatch(this.context.__proto__);
|
|
871
|
+
}
|
|
826
872
|
}
|
|
827
873
|
__createView() {
|
|
828
874
|
this.view = Platform.origin.createCanvas(1, 1);
|
|
@@ -835,6 +881,7 @@ class LeaferCanvas extends LeaferCanvasBase {
|
|
|
835
881
|
}
|
|
836
882
|
}
|
|
837
883
|
|
|
884
|
+
const { mineType, fileType } = FileHelper;
|
|
838
885
|
Object.assign(Creator, {
|
|
839
886
|
canvas: (options, manager) => new LeaferCanvas(options, manager),
|
|
840
887
|
image: (options) => new LeaferImage(options),
|
|
@@ -842,6 +889,7 @@ Object.assign(Creator, {
|
|
|
842
889
|
interaction: (target, canvas, selector, options) => { return new InteractionBase(target, canvas, selector, options); }
|
|
843
890
|
});
|
|
844
891
|
function useCanvas(canvasType, power) {
|
|
892
|
+
Platform.canvasType = canvasType;
|
|
845
893
|
if (!Platform.origin) {
|
|
846
894
|
if (canvasType === 'skia') {
|
|
847
895
|
const { Canvas, loadImage } = power;
|
|
@@ -852,7 +900,19 @@ function useCanvas(canvasType, power) {
|
|
|
852
900
|
canvasSaveAs: (canvas, filename, quality) => canvas.saveAs(filename, { quality }),
|
|
853
901
|
loadImage
|
|
854
902
|
};
|
|
903
|
+
Platform.roundRectPatch = true;
|
|
904
|
+
}
|
|
905
|
+
else if (canvasType === 'napi') {
|
|
906
|
+
const { Canvas, loadImage } = power;
|
|
907
|
+
Platform.origin = {
|
|
908
|
+
createCanvas: (width, height, format) => new Canvas(width, height, format),
|
|
909
|
+
canvasToDataURL: (canvas, type, quality) => canvas.toDataURL(mineType(type), quality),
|
|
910
|
+
canvasToBolb: (canvas, type, quality) => __awaiter(this, void 0, void 0, function* () { return canvas.toBuffer(mineType(type), quality); }),
|
|
911
|
+
canvasSaveAs: (canvas, filename, quality) => __awaiter(this, void 0, void 0, function* () { return writeFileSync(filename, canvas.toBuffer(mineType(fileType(filename)), quality)); }),
|
|
912
|
+
loadImage
|
|
913
|
+
};
|
|
855
914
|
}
|
|
915
|
+
Platform.ellipseToCurve = true;
|
|
856
916
|
Platform.event = {
|
|
857
917
|
stopDefault(_origin) { },
|
|
858
918
|
stopNow(_origin) { },
|
|
@@ -865,9 +925,8 @@ Platform.name = 'node';
|
|
|
865
925
|
Platform.requestRender = function (render) { setTimeout(render); };
|
|
866
926
|
Platform.devicePixelRatio = 1;
|
|
867
927
|
Platform.conicGradientSupport = true;
|
|
868
|
-
Platform.realtimeLayout = true;
|
|
869
928
|
|
|
870
|
-
const { get: get$4, rotateOfOuter: rotateOfOuter$2, translate: translate$1, scaleOfOuter: scaleOfOuter$2, scale: scaleHelper
|
|
929
|
+
const { get: get$4, rotateOfOuter: rotateOfOuter$2, translate: translate$1, scaleOfOuter: scaleOfOuter$2, scale: scaleHelper, rotate } = MatrixHelper;
|
|
871
930
|
function fillOrFitMode(data, mode, box, width, height, rotation) {
|
|
872
931
|
const transform = get$4();
|
|
873
932
|
const swap = rotation && rotation !== 180;
|
|
@@ -877,7 +936,7 @@ function fillOrFitMode(data, mode, box, width, height, rotation) {
|
|
|
877
936
|
const x = box.x + (box.width - width * scale) / 2;
|
|
878
937
|
const y = box.y + (box.height - height * scale) / 2;
|
|
879
938
|
translate$1(transform, x, y);
|
|
880
|
-
scaleHelper
|
|
939
|
+
scaleHelper(transform, scale);
|
|
881
940
|
if (rotation)
|
|
882
941
|
rotateOfOuter$2(transform, { x: box.x + box.width / 2, y: box.y + box.height / 2 }, rotation);
|
|
883
942
|
data.scaleX = data.scaleY = scale;
|
|
@@ -889,7 +948,7 @@ function clipMode(data, box, offset, scale, rotation) {
|
|
|
889
948
|
if (offset)
|
|
890
949
|
translate$1(transform, offset.x, offset.y);
|
|
891
950
|
if (scale) {
|
|
892
|
-
typeof scale === 'number' ? scaleHelper
|
|
951
|
+
typeof scale === 'number' ? scaleHelper(transform, scale) : scaleHelper(transform, scale.x, scale.y);
|
|
893
952
|
data.scaleX = transform.a;
|
|
894
953
|
data.scaleY = transform.d;
|
|
895
954
|
}
|
|
@@ -1002,6 +1061,10 @@ function hasNaturalSize(ui, attrName, image) {
|
|
|
1002
1061
|
d.__naturalWidth = image.width;
|
|
1003
1062
|
d.__naturalHeight = image.height;
|
|
1004
1063
|
if (!d.__getInput('width') || !d.__getInput('height')) {
|
|
1064
|
+
if (ui.__proxyData) {
|
|
1065
|
+
ui.setProxyAttr('width', ui.__.width);
|
|
1066
|
+
ui.setProxyAttr('height', ui.__.height);
|
|
1067
|
+
}
|
|
1005
1068
|
ui.forceUpdate('width');
|
|
1006
1069
|
return false;
|
|
1007
1070
|
}
|
|
@@ -1013,54 +1076,21 @@ function emit(type, data) {
|
|
|
1013
1076
|
data.target.emitEvent(new ImageEvent(type, data));
|
|
1014
1077
|
}
|
|
1015
1078
|
|
|
1016
|
-
|
|
1017
|
-
Copyright (c) Microsoft Corporation.
|
|
1018
|
-
|
|
1019
|
-
Permission to use, copy, modify, and/or distribute this software for any
|
|
1020
|
-
purpose with or without fee is hereby granted.
|
|
1021
|
-
|
|
1022
|
-
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
1023
|
-
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
1024
|
-
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
1025
|
-
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
1026
|
-
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
1027
|
-
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
1028
|
-
PERFORMANCE OF THIS SOFTWARE.
|
|
1029
|
-
***************************************************************************** */
|
|
1030
|
-
/* global Reflect, Promise, SuppressedError, Symbol */
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
function __awaiter(thisArg, _arguments, P, generator) {
|
|
1034
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
1035
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
1036
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
1037
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
1038
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
1039
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
1040
|
-
});
|
|
1041
|
-
}
|
|
1042
|
-
|
|
1043
|
-
typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
|
|
1044
|
-
var e = new Error(message);
|
|
1045
|
-
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
1046
|
-
};
|
|
1079
|
+
const Export$1 = {};
|
|
1047
1080
|
|
|
1048
|
-
const { get: get$2, scale
|
|
1081
|
+
const { get: get$2, scale, copy: copy$1 } = MatrixHelper;
|
|
1049
1082
|
function createPattern(ui, paint, pixelRatio) {
|
|
1050
1083
|
let { scaleX, scaleY } = ui.__world;
|
|
1051
1084
|
const id = scaleX + '-' + scaleY;
|
|
1052
1085
|
if (paint.patternId !== id && !ui.destroyed) {
|
|
1053
|
-
paint.patternId = id;
|
|
1054
1086
|
scaleX = Math.abs(scaleX);
|
|
1055
1087
|
scaleY = Math.abs(scaleY);
|
|
1056
1088
|
const { image, data } = paint;
|
|
1057
|
-
|
|
1058
|
-
const maxHeight = image.isSVG ? 4096 : Math.min(image.height, 4096);
|
|
1059
|
-
let scale, matrix, { width, height, scaleX: sx, scaleY: sy, opacity, transform, mode } = data;
|
|
1089
|
+
let imageScale, imageMatrix, { width, height, scaleX: sx, scaleY: sy, opacity, transform, mode } = data;
|
|
1060
1090
|
if (sx) {
|
|
1061
|
-
|
|
1062
|
-
copy$1(
|
|
1063
|
-
|
|
1091
|
+
imageMatrix = get$2();
|
|
1092
|
+
copy$1(imageMatrix, transform);
|
|
1093
|
+
scale(imageMatrix, 1 / sx, 1 / sy);
|
|
1064
1094
|
scaleX *= sx;
|
|
1065
1095
|
scaleY *= sy;
|
|
1066
1096
|
}
|
|
@@ -1068,38 +1098,49 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1068
1098
|
scaleY *= pixelRatio;
|
|
1069
1099
|
width *= scaleX;
|
|
1070
1100
|
height *= scaleY;
|
|
1071
|
-
|
|
1072
|
-
|
|
1101
|
+
const size = width * height;
|
|
1102
|
+
if (paint.data.mode !== 'repeat') {
|
|
1103
|
+
if (size > Platform.image.maxCacheSize)
|
|
1104
|
+
return false;
|
|
1105
|
+
}
|
|
1106
|
+
let maxSize = Platform.image.maxPatternSize;
|
|
1107
|
+
if (!image.isSVG) {
|
|
1108
|
+
const imageSize = image.width * image.height;
|
|
1109
|
+
if (maxSize > imageSize)
|
|
1110
|
+
maxSize = imageSize;
|
|
1073
1111
|
}
|
|
1074
|
-
if (
|
|
1075
|
-
|
|
1076
|
-
|
|
1077
|
-
|
|
1078
|
-
|
|
1112
|
+
if (size > maxSize)
|
|
1113
|
+
imageScale = Math.sqrt(size / maxSize);
|
|
1114
|
+
if (imageScale) {
|
|
1115
|
+
scaleX /= imageScale;
|
|
1116
|
+
scaleY /= imageScale;
|
|
1117
|
+
width /= imageScale;
|
|
1118
|
+
height /= imageScale;
|
|
1079
1119
|
}
|
|
1080
1120
|
if (sx) {
|
|
1081
1121
|
scaleX /= sx;
|
|
1082
1122
|
scaleY /= sy;
|
|
1083
1123
|
}
|
|
1084
1124
|
if (transform || scaleX !== 1 || scaleY !== 1) {
|
|
1085
|
-
if (!
|
|
1086
|
-
|
|
1125
|
+
if (!imageMatrix) {
|
|
1126
|
+
imageMatrix = get$2();
|
|
1087
1127
|
if (transform)
|
|
1088
|
-
copy$1(
|
|
1128
|
+
copy$1(imageMatrix, transform);
|
|
1089
1129
|
}
|
|
1090
|
-
|
|
1130
|
+
scale(imageMatrix, 1 / scaleX, 1 / scaleY);
|
|
1091
1131
|
}
|
|
1092
|
-
const
|
|
1132
|
+
const pattern = Platform.canvas.createPattern(image.getCanvas(width < 1 ? 1 : width, height < 1 ? 1 : height, opacity), mode === 'repeat' ? 'repeat' : (Platform.origin.noRepeat || 'no-repeat'));
|
|
1093
1133
|
try {
|
|
1094
1134
|
if (paint.transform)
|
|
1095
1135
|
paint.transform = null;
|
|
1096
|
-
if (
|
|
1097
|
-
|
|
1136
|
+
if (imageMatrix)
|
|
1137
|
+
pattern.setTransform ? pattern.setTransform(imageMatrix) : paint.transform = imageMatrix;
|
|
1098
1138
|
}
|
|
1099
1139
|
catch (_a) {
|
|
1100
|
-
paint.transform =
|
|
1140
|
+
paint.transform = imageMatrix;
|
|
1101
1141
|
}
|
|
1102
|
-
paint.style =
|
|
1142
|
+
paint.style = pattern;
|
|
1143
|
+
paint.patternId = id;
|
|
1103
1144
|
return true;
|
|
1104
1145
|
}
|
|
1105
1146
|
else {
|
|
@@ -1107,18 +1148,24 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1107
1148
|
}
|
|
1108
1149
|
}
|
|
1109
1150
|
|
|
1151
|
+
const { abs } = Math;
|
|
1110
1152
|
function checkImage(ui, canvas, paint, allowPaint) {
|
|
1111
1153
|
const { scaleX, scaleY } = ui.__world;
|
|
1112
1154
|
if (!paint.data || paint.patternId === scaleX + '-' + scaleY) {
|
|
1113
1155
|
return false;
|
|
1114
1156
|
}
|
|
1115
1157
|
else {
|
|
1158
|
+
const { data } = paint;
|
|
1116
1159
|
if (allowPaint) {
|
|
1117
|
-
if (
|
|
1118
|
-
let { width, height } =
|
|
1119
|
-
width *= scaleX * canvas.pixelRatio;
|
|
1120
|
-
height *= scaleY * canvas.pixelRatio;
|
|
1121
|
-
|
|
1160
|
+
if (data.mode !== 'repeat') {
|
|
1161
|
+
let { width, height } = data;
|
|
1162
|
+
width *= abs(scaleX) * canvas.pixelRatio;
|
|
1163
|
+
height *= abs(scaleY) * canvas.pixelRatio;
|
|
1164
|
+
if (data.scaleX) {
|
|
1165
|
+
width *= data.scaleX;
|
|
1166
|
+
height *= data.scaleY;
|
|
1167
|
+
}
|
|
1168
|
+
allowPaint = width * height > Platform.image.maxCacheSize;
|
|
1122
1169
|
}
|
|
1123
1170
|
else {
|
|
1124
1171
|
allowPaint = false;
|
|
@@ -1127,7 +1174,6 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1127
1174
|
if (allowPaint) {
|
|
1128
1175
|
canvas.save();
|
|
1129
1176
|
canvas.clip();
|
|
1130
|
-
const { data } = paint;
|
|
1131
1177
|
if (paint.blendMode)
|
|
1132
1178
|
canvas.blendMode = paint.blendMode;
|
|
1133
1179
|
if (data.opacity)
|
|
@@ -1139,15 +1185,16 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1139
1185
|
return true;
|
|
1140
1186
|
}
|
|
1141
1187
|
else {
|
|
1142
|
-
if (!paint.style) {
|
|
1188
|
+
if (!paint.style || Export$1.running) {
|
|
1143
1189
|
createPattern(ui, paint, canvas.pixelRatio);
|
|
1144
1190
|
}
|
|
1145
1191
|
else {
|
|
1146
1192
|
if (!paint.patternTask) {
|
|
1147
1193
|
paint.patternTask = ImageManager.patternTasker.add(() => __awaiter(this, void 0, void 0, function* () {
|
|
1148
1194
|
paint.patternTask = null;
|
|
1149
|
-
if (canvas.bounds.hit(ui.__world)
|
|
1150
|
-
ui.
|
|
1195
|
+
if (canvas.bounds.hit(ui.__world))
|
|
1196
|
+
createPattern(ui, paint, canvas.pixelRatio);
|
|
1197
|
+
ui.forceUpdate('surface');
|
|
1151
1198
|
}), 300);
|
|
1152
1199
|
}
|
|
1153
1200
|
}
|
|
@@ -1157,7 +1204,7 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1157
1204
|
}
|
|
1158
1205
|
|
|
1159
1206
|
function recycleImage(attrName, data) {
|
|
1160
|
-
const paints =
|
|
1207
|
+
const paints = data['_' + attrName];
|
|
1161
1208
|
if (paints instanceof Array) {
|
|
1162
1209
|
let image, recycleMap, input, url;
|
|
1163
1210
|
for (let i = 0, len = paints.length; i < len; i++) {
|
|
@@ -1261,7 +1308,7 @@ function drawAlignStroke(align, stroke, isStrokes, ui, canvas, renderOptions) {
|
|
|
1261
1308
|
out.blendMode = align === 'outside' ? 'destination-out' : 'destination-in';
|
|
1262
1309
|
fillText(ui, out);
|
|
1263
1310
|
out.blendMode = 'normal';
|
|
1264
|
-
if (ui.
|
|
1311
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1265
1312
|
canvas.copyWorldByReset(out);
|
|
1266
1313
|
}
|
|
1267
1314
|
else {
|
|
@@ -1334,7 +1381,7 @@ function stroke(stroke, ui, canvas, renderOptions) {
|
|
|
1334
1381
|
out.stroke();
|
|
1335
1382
|
options.windingRule ? out.clip(options.windingRule) : out.clip();
|
|
1336
1383
|
out.clearWorld(ui.__layout.renderBounds);
|
|
1337
|
-
if (ui.
|
|
1384
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1338
1385
|
canvas.copyWorldByReset(out);
|
|
1339
1386
|
}
|
|
1340
1387
|
else {
|
|
@@ -1374,7 +1421,7 @@ function strokes(strokes, ui, canvas, renderOptions) {
|
|
|
1374
1421
|
drawStrokesStyle(strokes, false, ui, out);
|
|
1375
1422
|
options.windingRule ? out.clip(options.windingRule) : out.clip();
|
|
1376
1423
|
out.clearWorld(renderBounds);
|
|
1377
|
-
if (ui.
|
|
1424
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1378
1425
|
canvas.copyWorldByReset(out);
|
|
1379
1426
|
}
|
|
1380
1427
|
else {
|
|
@@ -1598,7 +1645,7 @@ function shadow(ui, current, shape, renderOptions) {
|
|
|
1598
1645
|
}
|
|
1599
1646
|
worldCanvas ? other.copyWorld(worldCanvas, __world, __world, 'destination-out') : other.copyWorld(shape.canvas, shapeBounds, bounds, 'destination-out');
|
|
1600
1647
|
}
|
|
1601
|
-
if (ui.
|
|
1648
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1602
1649
|
current.copyWorldByReset(other, copyBounds, __world, item.blendMode);
|
|
1603
1650
|
}
|
|
1604
1651
|
else {
|
|
@@ -1662,7 +1709,7 @@ function innerShadow(ui, current, shape, renderOptions) {
|
|
|
1662
1709
|
copyBounds = bounds;
|
|
1663
1710
|
}
|
|
1664
1711
|
other.fillWorld(copyBounds, item.color, 'source-in');
|
|
1665
|
-
if (ui.
|
|
1712
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1666
1713
|
current.copyWorldByReset(other, copyBounds, __world, item.blendMode);
|
|
1667
1714
|
}
|
|
1668
1715
|
else {
|
|
@@ -1811,6 +1858,8 @@ function createRows(drawData, content, style) {
|
|
|
1811
1858
|
const { width, height } = bounds;
|
|
1812
1859
|
const charMode = width || height || __letterSpacing || (textCase !== 'none');
|
|
1813
1860
|
if (charMode) {
|
|
1861
|
+
const wrap = style.textWrap !== 'none';
|
|
1862
|
+
const breakAll = style.textWrap === 'break';
|
|
1814
1863
|
paraStart = true;
|
|
1815
1864
|
lastCharType = null;
|
|
1816
1865
|
startCharSize = charWidth = charSize = wordWidth = rowWidth = 0;
|
|
@@ -1837,16 +1886,23 @@ function createRows(drawData, content, style) {
|
|
|
1837
1886
|
langBreak = (charType === Single && (lastCharType === Single || lastCharType === Letter)) || (lastCharType === Single && charType !== After);
|
|
1838
1887
|
afterBreak = ((charType === Before || charType === Single) && (lastCharType === Symbol || lastCharType === After));
|
|
1839
1888
|
realWidth = paraStart && paraIndent ? width - paraIndent : width;
|
|
1840
|
-
if (width && rowWidth + wordWidth + charWidth > realWidth) {
|
|
1841
|
-
if (
|
|
1842
|
-
afterBreak = charType === Letter && lastCharType == After;
|
|
1843
|
-
if (langBreak || afterBreak || charType === Break || charType === Before || charType === Single || (wordWidth + charWidth > realWidth)) {
|
|
1889
|
+
if (wrap && (width && rowWidth + wordWidth + charWidth > realWidth)) {
|
|
1890
|
+
if (breakAll) {
|
|
1844
1891
|
if (wordWidth)
|
|
1845
1892
|
addWord();
|
|
1846
1893
|
addRow();
|
|
1847
1894
|
}
|
|
1848
1895
|
else {
|
|
1849
|
-
|
|
1896
|
+
if (!afterBreak)
|
|
1897
|
+
afterBreak = charType === Letter && lastCharType == After;
|
|
1898
|
+
if (langBreak || afterBreak || charType === Break || charType === Before || charType === Single || (wordWidth + charWidth > realWidth)) {
|
|
1899
|
+
if (wordWidth)
|
|
1900
|
+
addWord();
|
|
1901
|
+
addRow();
|
|
1902
|
+
}
|
|
1903
|
+
else {
|
|
1904
|
+
addRow();
|
|
1905
|
+
}
|
|
1850
1906
|
}
|
|
1851
1907
|
}
|
|
1852
1908
|
if (char === ' ' && paraStart !== true && (rowWidth + wordWidth) === 0) ;
|
|
@@ -1916,7 +1972,7 @@ function addRow() {
|
|
|
1916
1972
|
|
|
1917
1973
|
const CharMode = 0;
|
|
1918
1974
|
const WordMode = 1;
|
|
1919
|
-
const
|
|
1975
|
+
const TextMode = 2;
|
|
1920
1976
|
function layoutChar(drawData, style, width, _height) {
|
|
1921
1977
|
const { rows } = drawData;
|
|
1922
1978
|
const { textAlign, paraIndent, letterSpacing } = style;
|
|
@@ -1925,15 +1981,12 @@ function layoutChar(drawData, style, width, _height) {
|
|
|
1925
1981
|
if (row.words) {
|
|
1926
1982
|
indentWidth = paraIndent && row.paraStart ? paraIndent : 0;
|
|
1927
1983
|
addWordWidth = (width && textAlign === 'justify' && row.words.length > 1) ? (width - row.width - indentWidth) / (row.words.length - 1) : 0;
|
|
1928
|
-
mode = (letterSpacing || row.isOverflow) ? CharMode : (addWordWidth > 0.01 ? WordMode :
|
|
1929
|
-
if (
|
|
1930
|
-
row.
|
|
1984
|
+
mode = (letterSpacing || row.isOverflow) ? CharMode : (addWordWidth > 0.01 ? WordMode : TextMode);
|
|
1985
|
+
if (row.isOverflow && !letterSpacing)
|
|
1986
|
+
row.textMode = true;
|
|
1987
|
+
if (mode === TextMode) {
|
|
1931
1988
|
row.x += indentWidth;
|
|
1932
|
-
row
|
|
1933
|
-
word.data.forEach(char => {
|
|
1934
|
-
row.text += char.char;
|
|
1935
|
-
});
|
|
1936
|
-
});
|
|
1989
|
+
toTextChar$1(row);
|
|
1937
1990
|
}
|
|
1938
1991
|
else {
|
|
1939
1992
|
row.x += indentWidth;
|
|
@@ -1959,6 +2012,14 @@ function layoutChar(drawData, style, width, _height) {
|
|
|
1959
2012
|
}
|
|
1960
2013
|
});
|
|
1961
2014
|
}
|
|
2015
|
+
function toTextChar$1(row) {
|
|
2016
|
+
row.text = '';
|
|
2017
|
+
row.words.forEach(word => {
|
|
2018
|
+
word.data.forEach(char => {
|
|
2019
|
+
row.text += char.char;
|
|
2020
|
+
});
|
|
2021
|
+
});
|
|
2022
|
+
}
|
|
1962
2023
|
function toWordChar(data, charX, wordChar) {
|
|
1963
2024
|
data.forEach(char => {
|
|
1964
2025
|
wordChar.char += char.char;
|
|
@@ -1979,10 +2040,10 @@ function toChar(data, charX, rowData) {
|
|
|
1979
2040
|
|
|
1980
2041
|
function layoutText(drawData, style) {
|
|
1981
2042
|
const { rows, bounds } = drawData;
|
|
1982
|
-
const { __lineHeight, __baseLine, __letterSpacing, textAlign, verticalAlign, paraSpacing
|
|
2043
|
+
const { __lineHeight, __baseLine, __letterSpacing, __clipText, textAlign, verticalAlign, paraSpacing } = style;
|
|
1983
2044
|
let { x, y, width, height } = bounds, realHeight = __lineHeight * rows.length + (paraSpacing ? paraSpacing * (drawData.paraNumber - 1) : 0);
|
|
1984
2045
|
let starY = __baseLine;
|
|
1985
|
-
if (
|
|
2046
|
+
if (__clipText && realHeight > height) {
|
|
1986
2047
|
realHeight = Math.max(height, __lineHeight);
|
|
1987
2048
|
drawData.overflow = rows.length;
|
|
1988
2049
|
}
|
|
@@ -2031,39 +2092,58 @@ function layoutText(drawData, style) {
|
|
|
2031
2092
|
bounds.x = rowX;
|
|
2032
2093
|
if (rowWidth > bounds.width)
|
|
2033
2094
|
bounds.width = rowWidth;
|
|
2095
|
+
if (__clipText && width && width < rowWidth) {
|
|
2096
|
+
row.isOverflow = true;
|
|
2097
|
+
if (!drawData.overflow)
|
|
2098
|
+
drawData.overflow = rows.length;
|
|
2099
|
+
}
|
|
2034
2100
|
}
|
|
2035
2101
|
bounds.y = y;
|
|
2036
2102
|
bounds.height = realHeight;
|
|
2037
2103
|
}
|
|
2038
2104
|
|
|
2039
|
-
function clipText(drawData,
|
|
2105
|
+
function clipText(drawData, style) {
|
|
2040
2106
|
const { rows, overflow } = drawData;
|
|
2107
|
+
let { textOverflow } = style;
|
|
2041
2108
|
rows.splice(overflow);
|
|
2042
2109
|
if (textOverflow !== 'hide') {
|
|
2043
2110
|
if (textOverflow === 'ellipsis')
|
|
2044
2111
|
textOverflow = '...';
|
|
2112
|
+
let char, charRight;
|
|
2045
2113
|
const ellipsisWidth = Platform.canvas.measureText(textOverflow).width;
|
|
2046
|
-
const
|
|
2047
|
-
|
|
2048
|
-
|
|
2049
|
-
|
|
2050
|
-
|
|
2051
|
-
|
|
2052
|
-
|
|
2053
|
-
|
|
2054
|
-
|
|
2055
|
-
|
|
2056
|
-
|
|
2057
|
-
|
|
2058
|
-
|
|
2059
|
-
|
|
2114
|
+
const right = style.x + style.width - ellipsisWidth;
|
|
2115
|
+
const list = style.textWrap === 'none' ? rows : [rows[overflow - 1]];
|
|
2116
|
+
list.forEach(row => {
|
|
2117
|
+
if (row.isOverflow && row.data) {
|
|
2118
|
+
let end = row.data.length - 1;
|
|
2119
|
+
for (let i = end; i > -1; i--) {
|
|
2120
|
+
char = row.data[i];
|
|
2121
|
+
charRight = char.x + char.width;
|
|
2122
|
+
if (i === end && charRight < right) {
|
|
2123
|
+
break;
|
|
2124
|
+
}
|
|
2125
|
+
else if (charRight < right && char.char !== ' ') {
|
|
2126
|
+
row.data.splice(i + 1);
|
|
2127
|
+
row.width -= char.width;
|
|
2128
|
+
break;
|
|
2129
|
+
}
|
|
2130
|
+
row.width -= char.width;
|
|
2131
|
+
}
|
|
2132
|
+
row.width += ellipsisWidth;
|
|
2133
|
+
row.data.push({ char: textOverflow, x: charRight });
|
|
2134
|
+
if (row.textMode)
|
|
2135
|
+
toTextChar(row);
|
|
2060
2136
|
}
|
|
2061
|
-
|
|
2062
|
-
}
|
|
2063
|
-
row.width += ellipsisWidth;
|
|
2064
|
-
row.data.push({ char: textOverflow, x: charRight });
|
|
2137
|
+
});
|
|
2065
2138
|
}
|
|
2066
2139
|
}
|
|
2140
|
+
function toTextChar(row) {
|
|
2141
|
+
row.text = '';
|
|
2142
|
+
row.data.forEach(char => {
|
|
2143
|
+
row.text += char.char;
|
|
2144
|
+
});
|
|
2145
|
+
row.data = null;
|
|
2146
|
+
}
|
|
2067
2147
|
|
|
2068
2148
|
function decorationText(drawData, style) {
|
|
2069
2149
|
const { fontSize } = style;
|
|
@@ -2084,7 +2164,7 @@ const TextConvert = {
|
|
|
2084
2164
|
let x = 0, y = 0;
|
|
2085
2165
|
let width = style.__getInput('width') || 0;
|
|
2086
2166
|
let height = style.__getInput('height') || 0;
|
|
2087
|
-
const { textDecoration,
|
|
2167
|
+
const { textDecoration, __font, padding } = style;
|
|
2088
2168
|
if (padding) {
|
|
2089
2169
|
const [top, right, bottom, left] = MathHelper.fourNumber(padding);
|
|
2090
2170
|
if (width) {
|
|
@@ -2106,7 +2186,7 @@ const TextConvert = {
|
|
|
2106
2186
|
layoutText(drawData, style);
|
|
2107
2187
|
layoutChar(drawData, style, width);
|
|
2108
2188
|
if (drawData.overflow)
|
|
2109
|
-
clipText(drawData,
|
|
2189
|
+
clipText(drawData, style);
|
|
2110
2190
|
if (textDecoration !== 'none')
|
|
2111
2191
|
decorationText(drawData, style);
|
|
2112
2192
|
return drawData;
|
|
@@ -2127,6 +2207,7 @@ const ColorConvert = {
|
|
|
2127
2207
|
|
|
2128
2208
|
const Export = {
|
|
2129
2209
|
export(leaf, filename, options) {
|
|
2210
|
+
Export.running = true;
|
|
2130
2211
|
return addTask((success) => new Promise((resolve) => {
|
|
2131
2212
|
const { leafer } = leaf;
|
|
2132
2213
|
if (leafer) {
|
|
@@ -2164,6 +2245,7 @@ const Export = {
|
|
|
2164
2245
|
}
|
|
2165
2246
|
success({ data });
|
|
2166
2247
|
resolve();
|
|
2248
|
+
Export.running = false;
|
|
2167
2249
|
if (unreal)
|
|
2168
2250
|
canvas.recycle();
|
|
2169
2251
|
}));
|
|
@@ -2171,6 +2253,7 @@ const Export = {
|
|
|
2171
2253
|
else {
|
|
2172
2254
|
success({ data: false });
|
|
2173
2255
|
resolve();
|
|
2256
|
+
Export.running = false;
|
|
2174
2257
|
}
|
|
2175
2258
|
}));
|
|
2176
2259
|
}
|
|
@@ -2188,6 +2271,6 @@ Object.assign(Paint, UIPaint);
|
|
|
2188
2271
|
Object.assign(Effect, UIEffect);
|
|
2189
2272
|
Object.assign(TextConvert$1, TextConvert);
|
|
2190
2273
|
Object.assign(ColorConvert$1, ColorConvert);
|
|
2191
|
-
Object.assign(Export$
|
|
2274
|
+
Object.assign(Export$2, Export);
|
|
2192
2275
|
|
|
2193
2276
|
export { Layouter, LeaferCanvas, Renderer, Selector, Watcher, useCanvas };
|