@leafer-ui/draw 1.6.3 → 1.6.4

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/lib/draw.cjs DELETED
@@ -1,2109 +0,0 @@
1
- 'use strict';
2
-
3
- var core = require('@leafer/core');
4
-
5
- /******************************************************************************
6
- Copyright (c) Microsoft Corporation.
7
-
8
- Permission to use, copy, modify, and/or distribute this software for any
9
- purpose with or without fee is hereby granted.
10
-
11
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
12
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
13
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
14
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
15
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
16
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
17
- PERFORMANCE OF THIS SOFTWARE.
18
- ***************************************************************************** */
19
- /* global Reflect, Promise, SuppressedError, Symbol, Iterator */
20
-
21
-
22
- function __decorate(decorators, target, key, desc) {
23
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
24
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
25
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
26
- return c > 3 && r && Object.defineProperty(target, key, r), r;
27
- }
28
-
29
- typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
30
- var e = new Error(message);
31
- return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
32
- };
33
-
34
- function effectType(defaultValue) {
35
- return core.decorateLeafAttr(defaultValue, (key) => core.attr({
36
- set(value) {
37
- this.__setAttr(key, value);
38
- if (value)
39
- this.__.__useEffect = true;
40
- this.__layout.renderChanged || this.__layout.renderChange();
41
- }
42
- }));
43
- }
44
- function resizeType(defaultValue) {
45
- return core.decorateLeafAttr(defaultValue, (key) => core.attr({
46
- set(value) {
47
- this.__setAttr(key, value);
48
- this.__layout.boxChanged || this.__layout.boxChange();
49
- this.__updateSize();
50
- }
51
- }));
52
- }
53
- function zoomLayerType() {
54
- return (target, key) => {
55
- const privateKey = '_' + key;
56
- core.defineKey(target, key, {
57
- set(value) { if (this.isLeafer)
58
- this[privateKey] = value; },
59
- get() {
60
- return this.isApp
61
- ? this.tree.zoomLayer
62
- : (this.isLeafer ? (this[privateKey] || this) : this.leafer && this.leafer.zoomLayer);
63
- }
64
- });
65
- };
66
- }
67
-
68
- function hasTransparent$1(color) {
69
- if (!color || color.length === 7 || color.length === 4)
70
- return false;
71
- if (color === 'transparent')
72
- return true;
73
- const first = color[0];
74
- if (first === '#') {
75
- switch (color.length) {
76
- case 5: return color[4] !== 'f' && color[4] !== 'F';
77
- case 9: return (color[7] !== 'f' && color[7] !== 'F') || (color[8] !== 'f' && color[8] !== 'F');
78
- }
79
- }
80
- else if (first === 'r' || first === 'h') {
81
- if (color[3] === 'a') {
82
- const i = color.lastIndexOf(',');
83
- if (i > -1)
84
- return parseFloat(color.slice(i + 1)) < 1;
85
- }
86
- }
87
- return false;
88
- }
89
-
90
- const TextConvert = {};
91
- const ColorConvert = {
92
- hasTransparent: hasTransparent$1
93
- };
94
- const UnitConvert = {
95
- number(value, percentRefer) {
96
- return typeof value === 'object' ? (value.type === 'percent' ? value.value * percentRefer : value.value) : value;
97
- }
98
- };
99
- const PathArrow = {};
100
- const Paint = {};
101
- const PaintImage = {};
102
- const PaintGradient = {};
103
- const Effect = {};
104
- const Filter = {
105
- apply() { core.Plugin.need('filter'); }
106
- };
107
- const Export = {};
108
- const State = {
109
- setStyleName() { return core.Plugin.need('state'); },
110
- set() { return core.Plugin.need('state'); }
111
- };
112
- const Transition = {
113
- list: {},
114
- register(attrName, fn) { Transition.list[attrName] = fn; },
115
- get(attrName) { return Transition.list[attrName]; }
116
- };
117
-
118
- const { parse, objectToCanvasData } = core.PathConvert;
119
- const { stintSet: stintSet$1 } = core.DataHelper, { hasTransparent } = ColorConvert;
120
- const emptyPaint = {};
121
- const debug$1 = core.Debug.get('UIData');
122
- class UIData extends core.LeafData {
123
- get scale() { const { scaleX, scaleY } = this; return scaleX !== scaleY ? { x: scaleX, y: scaleY } : scaleX; }
124
- get __strokeWidth() {
125
- const { strokeWidth, strokeWidthFixed } = this;
126
- if (strokeWidthFixed) {
127
- const ui = this.__leaf;
128
- let { scaleX } = ui.__nowWorld || ui.__world;
129
- if (scaleX < 0)
130
- scaleX = -scaleX;
131
- return scaleX > 1 ? strokeWidth / scaleX : strokeWidth;
132
- }
133
- else
134
- return strokeWidth;
135
- }
136
- get __hasStroke() { return this.stroke && this.strokeWidth; }
137
- get __hasHalf() { const t = this; return (t.stroke && t.strokeAlign === 'center' && t.strokeWidth % 2) || undefined; }
138
- get __hasMultiPaint() {
139
- const t = this;
140
- if ((t.__isFills && t.fill.length > 1) || (t.__isStrokes && t.stroke.length > 1) || t.__useEffect)
141
- return true;
142
- return t.fill && this.__hasStroke;
143
- }
144
- get __clipAfterFill() { const t = this; return (t.cornerRadius || t.innerShadow || t.__pathInputed); }
145
- get __hasSurface() { const t = this; return (t.fill || t.stroke); }
146
- get __autoWidth() { return !this._width; }
147
- get __autoHeight() { return !this._height; }
148
- get __autoSide() { return !this._width || !this._height; }
149
- get __autoSize() { return !this._width && !this._height; }
150
- setVisible(value) {
151
- this._visible = value;
152
- const { leafer } = this.__leaf;
153
- if (leafer)
154
- leafer.watcher.hasVisible = true;
155
- }
156
- setWidth(value) {
157
- if (value < 0) {
158
- this._width = -value;
159
- this.__leaf.scaleX *= -1;
160
- debug$1.warn('width < 0, instead -scaleX ', this);
161
- }
162
- else
163
- this._width = value;
164
- }
165
- setHeight(value) {
166
- if (value < 0) {
167
- this._height = -value;
168
- this.__leaf.scaleY *= -1;
169
- debug$1.warn('height < 0, instead -scaleY', this);
170
- }
171
- else
172
- this._height = value;
173
- }
174
- setFill(value) {
175
- if (this.__naturalWidth)
176
- this.__removeNaturalSize();
177
- if (typeof value === 'string' || !value) {
178
- stintSet$1(this, '__isTransparentFill', hasTransparent(value));
179
- this.__isFills && this.__removePaint('fill', true);
180
- this._fill = value;
181
- }
182
- else if (typeof value === 'object') {
183
- this.__setPaint('fill', value);
184
- }
185
- }
186
- setStroke(value) {
187
- if (typeof value === 'string' || !value) {
188
- stintSet$1(this, '__isTransparentStroke', hasTransparent(value));
189
- this.__isStrokes && this.__removePaint('stroke', true);
190
- this._stroke = value;
191
- }
192
- else if (typeof value === 'object') {
193
- this.__setPaint('stroke', value);
194
- }
195
- }
196
- setPath(value) {
197
- const isString = typeof value === 'string';
198
- if (isString || (value && typeof value[0] === 'object')) {
199
- this.__setInput('path', value);
200
- this._path = isString ? parse(value) : objectToCanvasData(value);
201
- }
202
- else {
203
- if (this.__input)
204
- this.__removeInput('path');
205
- this._path = value;
206
- }
207
- }
208
- setShadow(value) {
209
- setArray(this, 'shadow', value);
210
- }
211
- setInnerShadow(value) {
212
- setArray(this, 'innerShadow', value);
213
- }
214
- setFilter(value) {
215
- setArray(this, 'filter', value);
216
- }
217
- __computePaint() {
218
- const { fill, stroke } = this.__input;
219
- if (fill)
220
- Paint.compute('fill', this.__leaf);
221
- if (stroke)
222
- Paint.compute('stroke', this.__leaf);
223
- this.__needComputePaint = undefined;
224
- }
225
- __setPaint(attrName, value) {
226
- this.__setInput(attrName, value);
227
- const layout = this.__leaf.__layout;
228
- layout.boxChanged || layout.boxChange();
229
- if (value instanceof Array && !value.length) {
230
- this.__removePaint(attrName);
231
- }
232
- else {
233
- if (attrName === 'fill')
234
- this.__isFills = true, this._fill || (this._fill = emptyPaint);
235
- else
236
- this.__isStrokes = true, this._stroke || (this._stroke = emptyPaint);
237
- }
238
- }
239
- __removePaint(attrName, removeInput) {
240
- if (removeInput)
241
- this.__removeInput(attrName);
242
- PaintImage.recycleImage(attrName, this);
243
- if (attrName === 'fill') {
244
- stintSet$1(this, '__isAlphaPixelFill', undefined);
245
- this._fill = this.__isFills = undefined;
246
- }
247
- else {
248
- stintSet$1(this, '__isAlphaPixelStroke', undefined);
249
- this._stroke = this.__isStrokes = undefined;
250
- }
251
- }
252
- }
253
- function setArray(data, key, value) {
254
- data.__setInput(key, value);
255
- if (value instanceof Array) {
256
- if (value.some((item) => item.visible === false))
257
- value = value.filter((item) => item.visible !== false);
258
- value.length || (value = undefined);
259
- }
260
- else
261
- value = value && value.visible !== false ? [value] : undefined;
262
- data['_' + key] = value;
263
- }
264
-
265
- class GroupData extends UIData {
266
- }
267
-
268
- class BoxData extends GroupData {
269
- get __boxStroke() { return !this.__pathInputed; }
270
- get __drawAfterFill() { const t = this; return (t.overflow === 'hide' && (t.__clipAfterFill || t.innerShadow) && t.__leaf.children.length); }
271
- get __clipAfterFill() { return this.__leaf.isOverflow || super.__clipAfterFill; }
272
- }
273
-
274
- class LeaferData extends GroupData {
275
- __getInputData(names, options) {
276
- const data = super.__getInputData(names, options);
277
- core.canvasSizeAttrs.forEach(key => delete data[key]);
278
- return data;
279
- }
280
- }
281
-
282
- class FrameData extends BoxData {
283
- }
284
-
285
- class LineData extends UIData {
286
- }
287
-
288
- class RectData extends UIData {
289
- get __boxStroke() { return !this.__pathInputed; }
290
- }
291
-
292
- class EllipseData extends UIData {
293
- get __boxStroke() { return !this.__pathInputed; }
294
- }
295
-
296
- class PolygonData extends UIData {
297
- }
298
-
299
- class StarData extends UIData {
300
- }
301
-
302
- class PathData extends UIData {
303
- get __pathInputed() { return 2; }
304
- }
305
-
306
- class PenData extends GroupData {
307
- }
308
-
309
- const fontWeightMap = {
310
- 'thin': 100,
311
- 'extra-light': 200,
312
- 'light': 300,
313
- 'normal': 400,
314
- 'medium': 500,
315
- 'semi-bold': 600,
316
- 'bold': 700,
317
- 'extra-bold': 800,
318
- 'black': 900
319
- };
320
- class TextData extends UIData {
321
- get __useNaturalRatio() { return false; }
322
- setFontWeight(value) {
323
- if (typeof value === 'string') {
324
- this.__setInput('fontWeight', value);
325
- value = fontWeightMap[value] || 400;
326
- }
327
- else if (this.__input)
328
- this.__removeInput('fontWeight');
329
- this._fontWeight = value;
330
- }
331
- setBoxStyle(value) {
332
- let t = this.__leaf, box = t.__box;
333
- if (value) {
334
- const { boxStyle } = this;
335
- if (box)
336
- for (let key in boxStyle)
337
- box[key] = undefined;
338
- else
339
- box = t.__box = core.UICreator.get('Rect', 0);
340
- const layout = t.__layout, boxLayout = box.__layout;
341
- if (!boxStyle)
342
- box.parent = t, box.__world = t.__world, boxLayout.boxBounds = layout.boxBounds;
343
- box.set(value);
344
- if (boxLayout.strokeChanged)
345
- layout.strokeChange();
346
- if (boxLayout.renderChanged)
347
- layout.renderChange();
348
- box.__updateChange();
349
- }
350
- else if (box) {
351
- t.__box = box.parent = null;
352
- box.destroy();
353
- }
354
- this._boxStyle = value;
355
- }
356
- }
357
-
358
- class ImageData extends RectData {
359
- setUrl(value) {
360
- this.__setImageFill(value);
361
- this._url = value;
362
- }
363
- __setImageFill(value) {
364
- this.fill = value ? { type: 'image', mode: 'stretch', url: value } : undefined;
365
- }
366
- __getData() {
367
- const data = super.__getData();
368
- delete data.fill;
369
- return data;
370
- }
371
- __getInputData(names, options) {
372
- const data = super.__getInputData(names, options);
373
- delete data.fill;
374
- return data;
375
- }
376
- }
377
-
378
- class CanvasData extends RectData {
379
- get __isCanvas() { return true; }
380
- get __drawAfterFill() { return true; }
381
- __getInputData(names, options) {
382
- const data = super.__getInputData(names, options);
383
- data.url = this.__leaf.canvas.toDataURL('image/png');
384
- return data;
385
- }
386
- }
387
-
388
- const UIBounds = {
389
- __updateStrokeSpread() {
390
- let width = 0, boxWidth = 0;
391
- const data = this.__, { strokeAlign, strokeWidth } = data, box = this.__box;
392
- if ((data.stroke || data.hitStroke === 'all') && strokeWidth && strokeAlign !== 'inside') {
393
- boxWidth = width = strokeAlign === 'center' ? strokeWidth / 2 : strokeWidth;
394
- if (!data.__boxStroke) {
395
- const miterLimitAddWidth = data.__isLinePath ? 0 : 10 * width;
396
- const storkeCapAddWidth = data.strokeCap === 'none' ? 0 : strokeWidth;
397
- width += Math.max(miterLimitAddWidth, storkeCapAddWidth);
398
- }
399
- }
400
- if (data.__useArrow)
401
- width += strokeWidth * 5;
402
- if (box) {
403
- width = Math.max(box.__layout.strokeSpread = box.__updateStrokeSpread(), width);
404
- boxWidth = box.__layout.strokeBoxSpread;
405
- }
406
- this.__layout.strokeBoxSpread = boxWidth;
407
- return width;
408
- },
409
- __updateRenderSpread() {
410
- let width = 0;
411
- const { shadow, innerShadow, blur, backgroundBlur, filter } = this.__;
412
- if (shadow)
413
- shadow.forEach(item => width = Math.max(width, Math.max(Math.abs(item.y), Math.abs(item.x)) + (item.spread > 0 ? item.spread : 0) + item.blur * 1.5));
414
- if (blur)
415
- width = Math.max(width, blur);
416
- if (filter)
417
- width += Filter.getSpread(filter);
418
- let shapeWidth = width = Math.ceil(width);
419
- if (innerShadow)
420
- innerShadow.forEach(item => shapeWidth = Math.max(shapeWidth, Math.max(Math.abs(item.y), Math.abs(item.x)) + (item.spread < 0 ? -item.spread : 0) + item.blur * 1.5));
421
- if (backgroundBlur)
422
- shapeWidth = Math.max(shapeWidth, backgroundBlur);
423
- this.__layout.renderShapeSpread = shapeWidth;
424
- width += this.__layout.strokeSpread || 0;
425
- return this.__box ? Math.max(this.__box.__updateRenderSpread(), width) : width;
426
- }
427
- };
428
-
429
- const { stintSet } = core.DataHelper;
430
- const UIRender = {
431
- __updateChange() {
432
- const data = this.__;
433
- if (data.__useEffect) {
434
- const { shadow, fill, stroke } = data, otherEffect = data.innerShadow || data.blur || data.backgroundBlur || data.filter;
435
- stintSet(data, '__isFastShadow', shadow && !otherEffect && shadow.length < 2 && !shadow[0].spread && !(shadow[0].box && data.__isTransparentFill) && fill && !(fill instanceof Array && fill.length > 1) && (this.useFastShadow || !stroke || (stroke && data.strokeAlign === 'inside')));
436
- data.__useEffect = !!(shadow || otherEffect);
437
- }
438
- stintSet(this.__world, 'half', data.__hasHalf);
439
- stintSet(data, '__fillAfterStroke', data.stroke && data.strokeAlign === 'outside' && data.fill && !data.__isTransparentFill);
440
- data.__checkSingle();
441
- stintSet(data, '__complex', data.__isFills || data.__isStrokes || data.cornerRadius || data.__useEffect);
442
- },
443
- __drawFast(canvas, options) {
444
- drawFast(this, canvas, options);
445
- },
446
- __draw(canvas, options, originCanvas) {
447
- const data = this.__;
448
- if (data.__complex) {
449
- if (data.__needComputePaint)
450
- data.__computePaint();
451
- const { fill, stroke, __drawAfterFill, __fillAfterStroke, __isFastShadow } = data;
452
- this.__drawRenderPath(canvas);
453
- if (data.__useEffect && !__isFastShadow) {
454
- const shape = Paint.shape(this, canvas, options);
455
- this.__nowWorld = this.__getNowWorld(options);
456
- const { shadow, innerShadow, filter } = data;
457
- if (shadow)
458
- Effect.shadow(this, canvas, shape);
459
- if (__fillAfterStroke)
460
- data.__isStrokes ? Paint.strokes(stroke, this, canvas) : Paint.stroke(stroke, this, canvas);
461
- if (fill)
462
- data.__isFills ? Paint.fills(fill, this, canvas) : Paint.fill(fill, this, canvas);
463
- if (__drawAfterFill)
464
- this.__drawAfterFill(canvas, options);
465
- if (innerShadow)
466
- Effect.innerShadow(this, canvas, shape);
467
- if (stroke && !__fillAfterStroke)
468
- data.__isStrokes ? Paint.strokes(stroke, this, canvas) : Paint.stroke(stroke, this, canvas);
469
- if (filter)
470
- Filter.apply(filter, this, this.__nowWorld, canvas, originCanvas, shape);
471
- if (shape.worldCanvas)
472
- shape.worldCanvas.recycle();
473
- shape.canvas.recycle();
474
- }
475
- else {
476
- if (__fillAfterStroke)
477
- data.__isStrokes ? Paint.strokes(stroke, this, canvas) : Paint.stroke(stroke, this, canvas);
478
- if (__isFastShadow) {
479
- const shadow = data.shadow[0], { scaleX, scaleY } = this.__nowWorld;
480
- canvas.save(), canvas.setWorldShadow(shadow.x * scaleX, shadow.y * scaleY, shadow.blur * scaleX, ColorConvert.string(shadow.color));
481
- }
482
- if (fill)
483
- data.__isFills ? Paint.fills(fill, this, canvas) : Paint.fill(fill, this, canvas);
484
- if (__isFastShadow)
485
- canvas.restore();
486
- if (__drawAfterFill)
487
- this.__drawAfterFill(canvas, options);
488
- if (stroke && !__fillAfterStroke)
489
- data.__isStrokes ? Paint.strokes(stroke, this, canvas) : Paint.stroke(stroke, this, canvas);
490
- }
491
- }
492
- else {
493
- if (data.__pathInputed)
494
- drawFast(this, canvas, options);
495
- else
496
- this.__drawFast(canvas, options);
497
- }
498
- },
499
- __renderShape(canvas, options, ignoreFill, ignoreStroke) {
500
- if (this.__worldOpacity) {
501
- canvas.setWorld(this.__nowWorld = this.__getNowWorld(options));
502
- const { fill, stroke } = this.__;
503
- this.__drawRenderPath(canvas);
504
- if (fill && !ignoreFill)
505
- this.__.__isAlphaPixelFill ? Paint.fills(fill, this, canvas) : Paint.fill('#000000', this, canvas);
506
- if (this.__.__isCanvas)
507
- this.__drawAfterFill(canvas, options);
508
- if (stroke && !ignoreStroke)
509
- this.__.__isAlphaPixelStroke ? Paint.strokes(stroke, this, canvas) : Paint.stroke('#000000', this, canvas);
510
- }
511
- },
512
- __drawAfterFill(canvas, options) {
513
- if (this.__.__clipAfterFill) {
514
- canvas.save();
515
- this.windingRule ? canvas.clip(this.windingRule) : canvas.clip();
516
- this.__drawContent(canvas, options);
517
- canvas.restore();
518
- }
519
- else
520
- this.__drawContent(canvas, options);
521
- }
522
- };
523
- function drawFast(ui, canvas, options) {
524
- const { fill, stroke, __drawAfterFill, __fillAfterStroke } = ui.__;
525
- ui.__drawRenderPath(canvas);
526
- if (__fillAfterStroke)
527
- Paint.stroke(stroke, ui, canvas);
528
- if (fill)
529
- Paint.fill(fill, ui, canvas);
530
- if (__drawAfterFill)
531
- ui.__drawAfterFill(canvas, options);
532
- if (stroke && !__fillAfterStroke)
533
- Paint.stroke(stroke, ui, canvas);
534
- }
535
-
536
- const RectRender = {
537
- __drawFast(canvas, options) {
538
- let { x, y, width, height } = this.__layout.boxBounds;
539
- const { fill, stroke, __drawAfterFill } = this.__;
540
- if (fill) {
541
- canvas.fillStyle = fill;
542
- canvas.fillRect(x, y, width, height);
543
- }
544
- if (__drawAfterFill)
545
- this.__drawAfterFill(canvas, options);
546
- if (stroke) {
547
- const { strokeAlign, __strokeWidth } = this.__;
548
- if (!__strokeWidth)
549
- return;
550
- canvas.setStroke(stroke, __strokeWidth, this.__);
551
- const half = __strokeWidth / 2;
552
- switch (strokeAlign) {
553
- case 'center':
554
- canvas.strokeRect(0, 0, width, height);
555
- break;
556
- case 'inside':
557
- width -= __strokeWidth, height -= __strokeWidth;
558
- if (width < 0 || height < 0) {
559
- canvas.save();
560
- this.__clip(canvas, options);
561
- canvas.strokeRect(x + half, y + half, width, height);
562
- canvas.restore();
563
- }
564
- else
565
- canvas.strokeRect(x + half, y + half, width, height);
566
- break;
567
- case 'outside':
568
- canvas.strokeRect(x - half, y - half, width + __strokeWidth, height + __strokeWidth);
569
- break;
570
- }
571
- }
572
- }
573
- };
574
-
575
- var UI_1;
576
- exports.UI = UI_1 = class UI extends core.Leaf {
577
- get app() { return this.leafer && this.leafer.app; }
578
- get isFrame() { return false; }
579
- set scale(value) { core.MathHelper.assignScale(this, value); }
580
- get scale() { return this.__.scale; }
581
- get pen() {
582
- const { path } = this.__;
583
- core.pen.set(this.path = path || []);
584
- if (!path)
585
- this.__drawPathByBox(core.pen);
586
- return core.pen;
587
- }
588
- constructor(data) {
589
- super(data);
590
- }
591
- reset(_data) { }
592
- set(data, transition) {
593
- if (data) {
594
- if (transition) {
595
- if (transition === 'temp') {
596
- this.lockNormalStyle = true;
597
- Object.assign(this, data);
598
- this.lockNormalStyle = false;
599
- }
600
- else
601
- this.animate(data, transition);
602
- }
603
- else
604
- Object.assign(this, data);
605
- }
606
- }
607
- get(name) {
608
- return typeof name === 'string' ? this.__.__getInput(name) : this.__.__getInputData(name);
609
- }
610
- createProxyData() { return undefined; }
611
- find(_condition, _options) { return core.Plugin.need('find'); }
612
- findTag(tag) { return this.find({ tag }); }
613
- findOne(_condition, _options) { return core.Plugin.need('find'); }
614
- findId(id) { return this.findOne({ id }); }
615
- getPath(curve, pathForRender) {
616
- this.__layout.update();
617
- let path = pathForRender ? this.__.__pathForRender : this.__.path;
618
- if (!path)
619
- core.pen.set(path = []), this.__drawPathByBox(core.pen);
620
- return curve ? core.PathConvert.toCanvasData(path, true) : path;
621
- }
622
- getPathString(curve, pathForRender, floatLength) {
623
- return core.PathConvert.stringify(this.getPath(curve, pathForRender), floatLength);
624
- }
625
- load() {
626
- this.__.__computePaint();
627
- }
628
- __onUpdateSize() {
629
- if (this.__.__input) {
630
- const data = this.__;
631
- (data.lazy && !this.__inLazyBounds && !Export.running) ? data.__needComputePaint = true : data.__computePaint();
632
- }
633
- }
634
- __updateRenderPath() {
635
- if (this.__.path) {
636
- const data = this.__;
637
- data.__pathForRender = data.cornerRadius ? core.PathCorner.smooth(data.path, data.cornerRadius, data.cornerSmoothing) : data.path;
638
- if (data.__useArrow)
639
- PathArrow.addArrows(this, !data.cornerRadius);
640
- }
641
- }
642
- __drawRenderPath(canvas) {
643
- canvas.beginPath();
644
- this.__drawPathByData(canvas, this.__.__pathForRender);
645
- }
646
- __drawPath(canvas) {
647
- canvas.beginPath();
648
- this.__drawPathByData(canvas, this.__.path);
649
- }
650
- __drawPathByData(drawer, data) {
651
- data ? core.PathDrawer.drawPathByData(drawer, data) : this.__drawPathByBox(drawer);
652
- }
653
- __drawPathByBox(drawer) {
654
- const { x, y, width, height } = this.__layout.boxBounds;
655
- if (this.__.cornerRadius) {
656
- const { cornerRadius } = this.__;
657
- drawer.roundRect(x, y, width, height, typeof cornerRadius === 'number' ? [cornerRadius] : cornerRadius);
658
- }
659
- else
660
- drawer.rect(x, y, width, height);
661
- }
662
- drawImagePlaceholder(canvas, _image) {
663
- Paint.fill(this.__.placeholderColor, this, canvas);
664
- }
665
- animate(_keyframe, _options, _type, _isTemp) {
666
- return core.Plugin.need('animate');
667
- }
668
- killAnimate(_type, _nextStyle) { }
669
- export(_filename, _options) {
670
- return core.Plugin.need('export');
671
- }
672
- syncExport(_filename, _options) {
673
- return core.Plugin.need('export');
674
- }
675
- clone(data) {
676
- const json = core.DataHelper.clone(this.toJSON());
677
- if (data)
678
- Object.assign(json, data);
679
- return UI_1.one(json);
680
- }
681
- static one(data, x, y, width, height) {
682
- return core.UICreator.get(data.tag || this.prototype.__tag, data, x, y, width, height);
683
- }
684
- static registerUI() {
685
- core.registerUI()(this);
686
- }
687
- static registerData(data) {
688
- core.dataProcessor(data)(this.prototype);
689
- }
690
- static setEditConfig(_config) { }
691
- static setEditOuter(_toolName) { }
692
- static setEditInner(_editorName) { }
693
- destroy() {
694
- this.fill = this.stroke = null;
695
- if (this.__animate)
696
- this.killAnimate();
697
- super.destroy();
698
- }
699
- };
700
- __decorate([
701
- core.dataProcessor(UIData)
702
- ], exports.UI.prototype, "__", void 0);
703
- __decorate([
704
- zoomLayerType()
705
- ], exports.UI.prototype, "zoomLayer", void 0);
706
- __decorate([
707
- core.dataType('')
708
- ], exports.UI.prototype, "id", void 0);
709
- __decorate([
710
- core.dataType('')
711
- ], exports.UI.prototype, "name", void 0);
712
- __decorate([
713
- core.dataType('')
714
- ], exports.UI.prototype, "className", void 0);
715
- __decorate([
716
- core.surfaceType('pass-through')
717
- ], exports.UI.prototype, "blendMode", void 0);
718
- __decorate([
719
- core.opacityType(1)
720
- ], exports.UI.prototype, "opacity", void 0);
721
- __decorate([
722
- core.visibleType(true)
723
- ], exports.UI.prototype, "visible", void 0);
724
- __decorate([
725
- core.surfaceType(false)
726
- ], exports.UI.prototype, "locked", void 0);
727
- __decorate([
728
- core.surfaceType(false)
729
- ], exports.UI.prototype, "dim", void 0);
730
- __decorate([
731
- core.surfaceType(false)
732
- ], exports.UI.prototype, "dimskip", void 0);
733
- __decorate([
734
- core.sortType(0)
735
- ], exports.UI.prototype, "zIndex", void 0);
736
- __decorate([
737
- core.maskType(false)
738
- ], exports.UI.prototype, "mask", void 0);
739
- __decorate([
740
- core.eraserType(false)
741
- ], exports.UI.prototype, "eraser", void 0);
742
- __decorate([
743
- core.positionType(0, true)
744
- ], exports.UI.prototype, "x", void 0);
745
- __decorate([
746
- core.positionType(0, true)
747
- ], exports.UI.prototype, "y", void 0);
748
- __decorate([
749
- core.boundsType(100, true)
750
- ], exports.UI.prototype, "width", void 0);
751
- __decorate([
752
- core.boundsType(100, true)
753
- ], exports.UI.prototype, "height", void 0);
754
- __decorate([
755
- core.scaleType(1, true)
756
- ], exports.UI.prototype, "scaleX", void 0);
757
- __decorate([
758
- core.scaleType(1, true)
759
- ], exports.UI.prototype, "scaleY", void 0);
760
- __decorate([
761
- core.rotationType(0, true)
762
- ], exports.UI.prototype, "rotation", void 0);
763
- __decorate([
764
- core.rotationType(0, true)
765
- ], exports.UI.prototype, "skewX", void 0);
766
- __decorate([
767
- core.rotationType(0, true)
768
- ], exports.UI.prototype, "skewY", void 0);
769
- __decorate([
770
- core.positionType(0, true)
771
- ], exports.UI.prototype, "offsetX", void 0);
772
- __decorate([
773
- core.positionType(0, true)
774
- ], exports.UI.prototype, "offsetY", void 0);
775
- __decorate([
776
- core.positionType(0, true)
777
- ], exports.UI.prototype, "scrollX", void 0);
778
- __decorate([
779
- core.positionType(0, true)
780
- ], exports.UI.prototype, "scrollY", void 0);
781
- __decorate([
782
- core.autoLayoutType()
783
- ], exports.UI.prototype, "origin", void 0);
784
- __decorate([
785
- core.autoLayoutType()
786
- ], exports.UI.prototype, "around", void 0);
787
- __decorate([
788
- core.dataType(false)
789
- ], exports.UI.prototype, "lazy", void 0);
790
- __decorate([
791
- core.naturalBoundsType(1)
792
- ], exports.UI.prototype, "pixelRatio", void 0);
793
- __decorate([
794
- core.pathInputType()
795
- ], exports.UI.prototype, "path", void 0);
796
- __decorate([
797
- core.pathType()
798
- ], exports.UI.prototype, "windingRule", void 0);
799
- __decorate([
800
- core.pathType(true)
801
- ], exports.UI.prototype, "closed", void 0);
802
- __decorate([
803
- core.boundsType(0)
804
- ], exports.UI.prototype, "padding", void 0);
805
- __decorate([
806
- core.boundsType(false)
807
- ], exports.UI.prototype, "lockRatio", void 0);
808
- __decorate([
809
- core.boundsType()
810
- ], exports.UI.prototype, "widthRange", void 0);
811
- __decorate([
812
- core.boundsType()
813
- ], exports.UI.prototype, "heightRange", void 0);
814
- __decorate([
815
- core.dataType(false)
816
- ], exports.UI.prototype, "draggable", void 0);
817
- __decorate([
818
- core.dataType()
819
- ], exports.UI.prototype, "dragBounds", void 0);
820
- __decorate([
821
- core.dataType(false)
822
- ], exports.UI.prototype, "editable", void 0);
823
- __decorate([
824
- core.hitType(true)
825
- ], exports.UI.prototype, "hittable", void 0);
826
- __decorate([
827
- core.hitType('path')
828
- ], exports.UI.prototype, "hitFill", void 0);
829
- __decorate([
830
- core.strokeType('path')
831
- ], exports.UI.prototype, "hitStroke", void 0);
832
- __decorate([
833
- core.hitType(false)
834
- ], exports.UI.prototype, "hitBox", void 0);
835
- __decorate([
836
- core.hitType(true)
837
- ], exports.UI.prototype, "hitChildren", void 0);
838
- __decorate([
839
- core.hitType(true)
840
- ], exports.UI.prototype, "hitSelf", void 0);
841
- __decorate([
842
- core.hitType()
843
- ], exports.UI.prototype, "hitRadius", void 0);
844
- __decorate([
845
- core.cursorType('')
846
- ], exports.UI.prototype, "cursor", void 0);
847
- __decorate([
848
- core.surfaceType()
849
- ], exports.UI.prototype, "fill", void 0);
850
- __decorate([
851
- core.strokeType()
852
- ], exports.UI.prototype, "stroke", void 0);
853
- __decorate([
854
- core.strokeType('inside')
855
- ], exports.UI.prototype, "strokeAlign", void 0);
856
- __decorate([
857
- core.strokeType(1)
858
- ], exports.UI.prototype, "strokeWidth", void 0);
859
- __decorate([
860
- core.strokeType(false)
861
- ], exports.UI.prototype, "strokeWidthFixed", void 0);
862
- __decorate([
863
- core.strokeType('none')
864
- ], exports.UI.prototype, "strokeCap", void 0);
865
- __decorate([
866
- core.strokeType('miter')
867
- ], exports.UI.prototype, "strokeJoin", void 0);
868
- __decorate([
869
- core.strokeType()
870
- ], exports.UI.prototype, "dashPattern", void 0);
871
- __decorate([
872
- core.strokeType(0)
873
- ], exports.UI.prototype, "dashOffset", void 0);
874
- __decorate([
875
- core.strokeType(10)
876
- ], exports.UI.prototype, "miterLimit", void 0);
877
- __decorate([
878
- core.pathType(0)
879
- ], exports.UI.prototype, "cornerRadius", void 0);
880
- __decorate([
881
- core.pathType()
882
- ], exports.UI.prototype, "cornerSmoothing", void 0);
883
- __decorate([
884
- effectType()
885
- ], exports.UI.prototype, "shadow", void 0);
886
- __decorate([
887
- effectType()
888
- ], exports.UI.prototype, "innerShadow", void 0);
889
- __decorate([
890
- effectType()
891
- ], exports.UI.prototype, "blur", void 0);
892
- __decorate([
893
- effectType()
894
- ], exports.UI.prototype, "backgroundBlur", void 0);
895
- __decorate([
896
- effectType()
897
- ], exports.UI.prototype, "grayscale", void 0);
898
- __decorate([
899
- effectType()
900
- ], exports.UI.prototype, "filter", void 0);
901
- __decorate([
902
- core.surfaceType()
903
- ], exports.UI.prototype, "placeholderColor", void 0);
904
- __decorate([
905
- core.dataType(100)
906
- ], exports.UI.prototype, "placeholderDelay", void 0);
907
- __decorate([
908
- core.dataType({})
909
- ], exports.UI.prototype, "data", void 0);
910
- __decorate([
911
- core.rewrite(core.Leaf.prototype.reset)
912
- ], exports.UI.prototype, "reset", null);
913
- exports.UI = UI_1 = __decorate([
914
- core.useModule(UIBounds),
915
- core.useModule(UIRender),
916
- core.rewriteAble()
917
- ], exports.UI);
918
-
919
- exports.Group = class Group extends exports.UI {
920
- get __tag() { return 'Group'; }
921
- get isBranch() { return true; }
922
- constructor(data) {
923
- super(data);
924
- }
925
- reset(data) {
926
- this.__setBranch();
927
- super.reset(data);
928
- }
929
- __setBranch() {
930
- if (!this.children)
931
- this.children = [];
932
- }
933
- set(data, transition) {
934
- if (data) {
935
- if (data.children) {
936
- const { children } = data;
937
- delete data.children;
938
- this.children ? this.clear() : this.__setBranch();
939
- super.set(data, transition);
940
- children.forEach(child => this.add(child));
941
- data.children = children;
942
- }
943
- else
944
- super.set(data, transition);
945
- }
946
- }
947
- toJSON(options) {
948
- const data = super.toJSON(options);
949
- data.children = this.children.map(child => child.toJSON(options));
950
- return data;
951
- }
952
- pick(_hitPoint, _options) { return undefined; }
953
- addAt(child, index) {
954
- this.add(child, index);
955
- }
956
- addAfter(child, after) {
957
- this.add(child, this.children.indexOf(after) + 1);
958
- }
959
- addBefore(child, before) {
960
- this.add(child, this.children.indexOf(before));
961
- }
962
- add(_child, _index) { }
963
- addMany(..._children) { }
964
- remove(_child, _destroy) { }
965
- removeAll(_destroy) { }
966
- clear() { }
967
- };
968
- __decorate([
969
- core.dataProcessor(GroupData)
970
- ], exports.Group.prototype, "__", void 0);
971
- __decorate([
972
- core.boundsType(0)
973
- ], exports.Group.prototype, "width", void 0);
974
- __decorate([
975
- core.boundsType(0)
976
- ], exports.Group.prototype, "height", void 0);
977
- exports.Group = __decorate([
978
- core.useModule(core.Branch),
979
- core.registerUI()
980
- ], exports.Group);
981
-
982
- var Leafer_1;
983
- const debug = core.Debug.get('Leafer');
984
- exports.Leafer = Leafer_1 = class Leafer extends exports.Group {
985
- get __tag() { return 'Leafer'; }
986
- get isApp() { return false; }
987
- get app() { return this.parent || this; }
988
- get isLeafer() { return true; }
989
- get imageReady() { return this.viewReady && core.Resource.isComplete; }
990
- get layoutLocked() { return !this.layouter.running; }
991
- get FPS() { return this.renderer ? this.renderer.FPS : 60; }
992
- get cursorPoint() { return (this.interaction && this.interaction.hoverData) || { x: this.width / 2, y: this.height / 2 }; }
993
- get clientBounds() { return (this.canvas && this.canvas.getClientBounds(true)) || core.getBoundsData(); }
994
- constructor(userConfig, data) {
995
- super(data);
996
- this.config = {
997
- start: true,
998
- hittable: true,
999
- smooth: true,
1000
- lazySpeard: 100,
1001
- };
1002
- this.leafs = 0;
1003
- this.__eventIds = [];
1004
- this.__controllers = [];
1005
- this.__readyWait = [];
1006
- this.__viewReadyWait = [];
1007
- this.__viewCompletedWait = [];
1008
- this.__nextRenderWait = [];
1009
- this.userConfig = userConfig;
1010
- if (userConfig && (userConfig.view || userConfig.width))
1011
- this.init(userConfig);
1012
- Leafer_1.list.add(this);
1013
- }
1014
- init(userConfig, parentApp) {
1015
- if (this.canvas)
1016
- return;
1017
- let start;
1018
- const { config } = this;
1019
- this.__setLeafer(this);
1020
- if (parentApp) {
1021
- this.parentApp = parentApp;
1022
- this.__bindApp(parentApp);
1023
- start = parentApp.running;
1024
- }
1025
- if (userConfig) {
1026
- this.parent = parentApp;
1027
- this.initType(userConfig.type);
1028
- this.parent = undefined;
1029
- core.DataHelper.assign(config, userConfig);
1030
- }
1031
- const canvas = this.canvas = core.Creator.canvas(config);
1032
- this.__controllers.push(this.renderer = core.Creator.renderer(this, canvas, config), this.watcher = core.Creator.watcher(this, config), this.layouter = core.Creator.layouter(this, config));
1033
- if (this.isApp)
1034
- this.__setApp();
1035
- this.__checkAutoLayout(config, parentApp);
1036
- this.view = canvas.view;
1037
- if (!parentApp) {
1038
- this.selector = core.Creator.selector(this);
1039
- this.interaction = core.Creator.interaction(this, canvas, this.selector, config);
1040
- if (this.interaction) {
1041
- this.__controllers.unshift(this.interaction);
1042
- this.hitCanvasManager = core.Creator.hitCanvasManager();
1043
- }
1044
- this.canvasManager = new core.CanvasManager();
1045
- start = config.start;
1046
- }
1047
- this.hittable = config.hittable;
1048
- this.fill = config.fill;
1049
- this.canvasManager.add(canvas);
1050
- this.__listenEvents();
1051
- if (start)
1052
- this.__startTimer = setTimeout(this.start.bind(this));
1053
- core.WaitHelper.run(this.__initWait);
1054
- this.onInit();
1055
- }
1056
- onInit() { }
1057
- initType(_type) { }
1058
- set(data, transition) {
1059
- this.waitInit(() => { super.set(data, transition); });
1060
- }
1061
- start() {
1062
- clearTimeout(this.__startTimer);
1063
- if (!this.running && this.canvas) {
1064
- this.running = true;
1065
- this.ready ? this.emitLeafer(core.LeaferEvent.RESTART) : this.emitLeafer(core.LeaferEvent.START);
1066
- this.__controllers.forEach(item => item.start());
1067
- if (!this.isApp)
1068
- this.renderer.render();
1069
- }
1070
- }
1071
- stop() {
1072
- clearTimeout(this.__startTimer);
1073
- if (this.running && this.canvas) {
1074
- this.__controllers.forEach(item => item.stop());
1075
- this.running = false;
1076
- this.emitLeafer(core.LeaferEvent.STOP);
1077
- }
1078
- }
1079
- unlockLayout() {
1080
- this.layouter.start();
1081
- this.updateLayout();
1082
- }
1083
- lockLayout() {
1084
- this.updateLayout();
1085
- this.layouter.stop();
1086
- }
1087
- resize(size) {
1088
- const data = core.DataHelper.copyAttrs({}, size, core.canvasSizeAttrs);
1089
- Object.keys(data).forEach(key => this[key] = data[key]);
1090
- }
1091
- forceRender(bounds, sync) {
1092
- const { renderer } = this;
1093
- if (renderer) {
1094
- renderer.addBlock(bounds ? new core.Bounds(bounds) : this.canvas.bounds);
1095
- if (this.viewReady)
1096
- sync ? renderer.render() : renderer.update();
1097
- }
1098
- }
1099
- requestRender(change = false) {
1100
- if (this.renderer)
1101
- this.renderer.update(change);
1102
- }
1103
- updateCursor(cursor) {
1104
- const i = this.interaction;
1105
- if (i)
1106
- cursor ? i.setCursor(cursor) : i.updateCursor();
1107
- }
1108
- updateLazyBounds() {
1109
- this.lazyBounds = this.canvas.bounds.clone().spread(this.config.lazySpeard);
1110
- }
1111
- __doResize(size) {
1112
- const { canvas } = this;
1113
- if (!canvas || canvas.isSameSize(size))
1114
- return;
1115
- const old = core.DataHelper.copyAttrs({}, this.canvas, core.canvasSizeAttrs);
1116
- canvas.resize(size);
1117
- this.updateLazyBounds();
1118
- this.__onResize(new core.ResizeEvent(size, old));
1119
- }
1120
- __onResize(event) {
1121
- this.emitEvent(event);
1122
- core.DataHelper.copyAttrs(this.__, event, core.canvasSizeAttrs);
1123
- setTimeout(() => { if (this.canvasManager)
1124
- this.canvasManager.clearRecycled(); }, 0);
1125
- }
1126
- __setApp() { }
1127
- __bindApp(app) {
1128
- this.selector = app.selector;
1129
- this.interaction = app.interaction;
1130
- this.canvasManager = app.canvasManager;
1131
- this.hitCanvasManager = app.hitCanvasManager;
1132
- }
1133
- __setLeafer(leafer) {
1134
- this.leafer = leafer;
1135
- this.__level = 1;
1136
- }
1137
- __checkAutoLayout(config, parentApp) {
1138
- if (!parentApp) {
1139
- if (!config.width || !config.height)
1140
- this.autoLayout = new core.AutoBounds(config);
1141
- this.canvas.startAutoLayout(this.autoLayout, this.__onResize.bind(this));
1142
- }
1143
- }
1144
- __setAttr(attrName, newValue) {
1145
- if (this.canvas) {
1146
- if (core.canvasSizeAttrs.includes(attrName)) {
1147
- this.__changeCanvasSize(attrName, newValue);
1148
- }
1149
- else if (attrName === 'fill') {
1150
- this.__changeFill(newValue);
1151
- }
1152
- else if (attrName === 'hittable') {
1153
- if (!this.parent)
1154
- this.canvas.hittable = newValue;
1155
- }
1156
- else if (attrName === 'zIndex') {
1157
- this.canvas.zIndex = newValue;
1158
- setTimeout(() => this.parent && this.parent.__updateSortChildren());
1159
- }
1160
- }
1161
- return super.__setAttr(attrName, newValue);
1162
- }
1163
- __getAttr(attrName) {
1164
- if (this.canvas && core.canvasSizeAttrs.includes(attrName))
1165
- return this.canvas[attrName];
1166
- return super.__getAttr(attrName);
1167
- }
1168
- __changeCanvasSize(attrName, newValue) {
1169
- const data = core.DataHelper.copyAttrs({}, this.canvas, core.canvasSizeAttrs);
1170
- data[attrName] = this.config[attrName] = newValue;
1171
- if (newValue)
1172
- this.canvas.stopAutoLayout();
1173
- this.__doResize(data);
1174
- }
1175
- __changeFill(newValue) {
1176
- this.config.fill = newValue;
1177
- if (this.canvas.allowBackgroundColor)
1178
- this.canvas.backgroundColor = newValue;
1179
- else
1180
- this.forceRender();
1181
- }
1182
- __onCreated() {
1183
- this.created = true;
1184
- }
1185
- __onReady() {
1186
- this.ready = true;
1187
- this.emitLeafer(core.LeaferEvent.BEFORE_READY);
1188
- this.emitLeafer(core.LeaferEvent.READY);
1189
- this.emitLeafer(core.LeaferEvent.AFTER_READY);
1190
- core.WaitHelper.run(this.__readyWait);
1191
- }
1192
- __onViewReady() {
1193
- if (this.viewReady)
1194
- return;
1195
- this.viewReady = true;
1196
- this.emitLeafer(core.LeaferEvent.VIEW_READY);
1197
- core.WaitHelper.run(this.__viewReadyWait);
1198
- }
1199
- __onLayoutEnd() {
1200
- const { grow, width: fixedWidth, height: fixedHeight } = this.config;
1201
- if (grow) {
1202
- let { width, height, pixelRatio } = this;
1203
- const bounds = grow === 'box' ? this.worldBoxBounds : this.__world;
1204
- if (!fixedWidth)
1205
- width = Math.max(1, bounds.x + bounds.width);
1206
- if (!fixedHeight)
1207
- height = Math.max(1, bounds.y + bounds.height);
1208
- this.__doResize({ width, height, pixelRatio });
1209
- }
1210
- if (!this.ready)
1211
- this.__onReady();
1212
- }
1213
- __onNextRender() {
1214
- if (this.viewReady) {
1215
- core.WaitHelper.run(this.__nextRenderWait);
1216
- const { imageReady } = this;
1217
- if (imageReady && !this.viewCompleted)
1218
- this.__checkViewCompleted();
1219
- if (!imageReady) {
1220
- this.viewCompleted = false;
1221
- this.requestRender();
1222
- }
1223
- }
1224
- else
1225
- this.requestRender();
1226
- }
1227
- __checkViewCompleted(emit = true) {
1228
- this.nextRender(() => {
1229
- if (this.imageReady) {
1230
- if (emit)
1231
- this.emitLeafer(core.LeaferEvent.VIEW_COMPLETED);
1232
- core.WaitHelper.run(this.__viewCompletedWait);
1233
- this.viewCompleted = true;
1234
- }
1235
- });
1236
- }
1237
- __onWatchData() {
1238
- if (this.watcher.childrenChanged && this.interaction) {
1239
- this.nextRender(() => this.interaction.updateCursor());
1240
- }
1241
- }
1242
- waitInit(item, bind) {
1243
- if (bind)
1244
- item = item.bind(bind);
1245
- if (!this.__initWait)
1246
- this.__initWait = [];
1247
- this.canvas ? item() : this.__initWait.push(item);
1248
- }
1249
- waitReady(item, bind) {
1250
- if (bind)
1251
- item = item.bind(bind);
1252
- this.ready ? item() : this.__readyWait.push(item);
1253
- }
1254
- waitViewReady(item, bind) {
1255
- if (bind)
1256
- item = item.bind(bind);
1257
- this.viewReady ? item() : this.__viewReadyWait.push(item);
1258
- }
1259
- waitViewCompleted(item, bind) {
1260
- if (bind)
1261
- item = item.bind(bind);
1262
- this.__viewCompletedWait.push(item);
1263
- if (this.viewCompleted)
1264
- this.__checkViewCompleted(false);
1265
- else if (!this.running)
1266
- this.start();
1267
- }
1268
- nextRender(item, bind, off) {
1269
- if (bind)
1270
- item = item.bind(bind);
1271
- const list = this.__nextRenderWait;
1272
- if (off) {
1273
- for (let i = 0; i < list.length; i++) {
1274
- if (list[i] === item) {
1275
- list.splice(i, 1);
1276
- break;
1277
- }
1278
- }
1279
- }
1280
- else
1281
- list.push(item);
1282
- this.requestRender();
1283
- }
1284
- zoom(_zoomType, _padding, _fixedScale, _transition) {
1285
- return core.Plugin.need('view');
1286
- }
1287
- getValidMove(moveX, moveY) { return { x: moveX, y: moveY }; }
1288
- getValidScale(changeScale) { return changeScale; }
1289
- getWorldPointByClient(clientPoint, updateClient) {
1290
- return this.interaction && this.interaction.getLocal(clientPoint, updateClient);
1291
- }
1292
- getPagePointByClient(clientPoint, updateClient) {
1293
- return this.getPagePoint(this.getWorldPointByClient(clientPoint, updateClient));
1294
- }
1295
- getClientPointByWorld(worldPoint) {
1296
- const { x, y } = this.clientBounds;
1297
- return { x: x + worldPoint.x, y: y + worldPoint.y };
1298
- }
1299
- updateClientBounds() {
1300
- this.canvas && this.canvas.updateClientBounds();
1301
- }
1302
- receiveEvent(_event) { }
1303
- emitLeafer(type) {
1304
- this.emitEvent(new core.LeaferEvent(type, this));
1305
- }
1306
- __listenEvents() {
1307
- const runId = core.Run.start('FirstCreate ' + this.innerName);
1308
- this.once([
1309
- [core.LeaferEvent.START, () => core.Run.end(runId)],
1310
- [core.LayoutEvent.START, this.updateLazyBounds, this],
1311
- [core.RenderEvent.START, this.__onCreated, this],
1312
- [core.RenderEvent.END, this.__onViewReady, this]
1313
- ]);
1314
- this.__eventIds.push(this.on_([
1315
- [core.WatchEvent.DATA, this.__onWatchData, this],
1316
- [core.LayoutEvent.END, this.__onLayoutEnd, this],
1317
- [core.RenderEvent.NEXT, this.__onNextRender, this]
1318
- ]));
1319
- }
1320
- __removeListenEvents() {
1321
- this.off_(this.__eventIds);
1322
- }
1323
- destroy(sync) {
1324
- const doDestory = () => {
1325
- if (!this.destroyed) {
1326
- Leafer_1.list.remove(this);
1327
- try {
1328
- this.stop();
1329
- this.emitEvent(new core.LeaferEvent(core.LeaferEvent.END, this));
1330
- this.__removeListenEvents();
1331
- this.__controllers.forEach(item => !(this.parent && item === this.interaction) && item.destroy());
1332
- this.__controllers.length = 0;
1333
- if (!this.parent) {
1334
- if (this.selector)
1335
- this.selector.destroy();
1336
- if (this.hitCanvasManager)
1337
- this.hitCanvasManager.destroy();
1338
- this.canvasManager.destroy();
1339
- }
1340
- this.canvas.destroy();
1341
- this.config.view = this.view = this.parentApp = null;
1342
- if (this.userConfig)
1343
- this.userConfig.view = null;
1344
- super.destroy();
1345
- setTimeout(() => { core.ImageManager.clearRecycled(); }, 100);
1346
- }
1347
- catch (e) {
1348
- debug.error(e);
1349
- }
1350
- }
1351
- };
1352
- sync ? doDestory() : setTimeout(doDestory);
1353
- }
1354
- };
1355
- exports.Leafer.list = new core.LeafList();
1356
- __decorate([
1357
- core.dataProcessor(LeaferData)
1358
- ], exports.Leafer.prototype, "__", void 0);
1359
- __decorate([
1360
- core.boundsType()
1361
- ], exports.Leafer.prototype, "pixelRatio", void 0);
1362
- exports.Leafer = Leafer_1 = __decorate([
1363
- core.registerUI()
1364
- ], exports.Leafer);
1365
-
1366
- exports.Rect = class Rect extends exports.UI {
1367
- get __tag() { return 'Rect'; }
1368
- constructor(data) {
1369
- super(data);
1370
- }
1371
- };
1372
- __decorate([
1373
- core.dataProcessor(RectData)
1374
- ], exports.Rect.prototype, "__", void 0);
1375
- exports.Rect = __decorate([
1376
- core.useModule(RectRender),
1377
- core.rewriteAble(),
1378
- core.registerUI()
1379
- ], exports.Rect);
1380
-
1381
- const { copy, add, includes: includes$1 } = core.BoundsHelper;
1382
- const rect = exports.Rect.prototype, group = exports.Group.prototype;
1383
- const childrenRenderBounds = {};
1384
- exports.Box = class Box extends exports.Group {
1385
- get __tag() { return 'Box'; }
1386
- get isBranchLeaf() { return true; }
1387
- constructor(data) {
1388
- super(data);
1389
- this.__layout.renderChanged || this.__layout.renderChange();
1390
- }
1391
- __updateStrokeSpread() { return 0; }
1392
- __updateRectRenderSpread() { return 0; }
1393
- __updateRenderSpread() { return this.__updateRectRenderSpread() || -1; }
1394
- __updateRectBoxBounds() { }
1395
- __updateBoxBounds(_secondLayout) {
1396
- const data = this.__;
1397
- if (this.children.length && !this.pathInputed) {
1398
- if (data.__autoSide) {
1399
- if (data.__hasSurface)
1400
- this.__extraUpdate();
1401
- super.__updateBoxBounds();
1402
- const { boxBounds } = this.__layout;
1403
- if (!data.__autoSize) {
1404
- if (data.__autoWidth) {
1405
- boxBounds.width += boxBounds.x, boxBounds.x = 0;
1406
- boxBounds.height = data.height, boxBounds.y = 0;
1407
- }
1408
- else {
1409
- boxBounds.height += boxBounds.y, boxBounds.y = 0;
1410
- boxBounds.width = data.width, boxBounds.x = 0;
1411
- }
1412
- }
1413
- this.__updateNaturalSize();
1414
- }
1415
- else
1416
- this.__updateRectBoxBounds();
1417
- }
1418
- else
1419
- this.__updateRectBoxBounds();
1420
- }
1421
- __updateStrokeBounds() { }
1422
- __updateRenderBounds() {
1423
- let isOverflow;
1424
- const { renderBounds } = this.__layout;
1425
- if (this.children.length) {
1426
- super.__updateRenderBounds();
1427
- copy(childrenRenderBounds, renderBounds);
1428
- this.__updateRectRenderBounds();
1429
- isOverflow = !includes$1(renderBounds, childrenRenderBounds);
1430
- if (isOverflow && this.__.overflow !== 'hide')
1431
- add(renderBounds, childrenRenderBounds);
1432
- }
1433
- else
1434
- this.__updateRectRenderBounds();
1435
- core.DataHelper.stintSet(this, 'isOverflow', isOverflow);
1436
- }
1437
- __updateRectRenderBounds() { }
1438
- __updateRectChange() { }
1439
- __updateChange() {
1440
- super.__updateChange();
1441
- this.__updateRectChange();
1442
- }
1443
- __renderRect(_canvas, _options) { }
1444
- __renderGroup(_canvas, _options) { }
1445
- __render(canvas, options) {
1446
- if (this.__.__drawAfterFill) {
1447
- this.__renderRect(canvas, options);
1448
- }
1449
- else {
1450
- this.__renderRect(canvas, options);
1451
- if (this.children.length)
1452
- this.__renderGroup(canvas, options);
1453
- }
1454
- }
1455
- __drawContent(canvas, options) {
1456
- this.__renderGroup(canvas, options);
1457
- if (this.__.__hasStroke) {
1458
- canvas.setWorld(this.__nowWorld);
1459
- this.__drawRenderPath(canvas);
1460
- }
1461
- }
1462
- };
1463
- __decorate([
1464
- core.dataProcessor(BoxData)
1465
- ], exports.Box.prototype, "__", void 0);
1466
- __decorate([
1467
- core.boundsType(100)
1468
- ], exports.Box.prototype, "width", void 0);
1469
- __decorate([
1470
- core.boundsType(100)
1471
- ], exports.Box.prototype, "height", void 0);
1472
- __decorate([
1473
- core.dataType(false)
1474
- ], exports.Box.prototype, "resizeChildren", void 0);
1475
- __decorate([
1476
- core.affectRenderBoundsType('show')
1477
- ], exports.Box.prototype, "overflow", void 0);
1478
- __decorate([
1479
- core.rewrite(rect.__updateStrokeSpread)
1480
- ], exports.Box.prototype, "__updateStrokeSpread", null);
1481
- __decorate([
1482
- core.rewrite(rect.__updateRenderSpread)
1483
- ], exports.Box.prototype, "__updateRectRenderSpread", null);
1484
- __decorate([
1485
- core.rewrite(rect.__updateBoxBounds)
1486
- ], exports.Box.prototype, "__updateRectBoxBounds", null);
1487
- __decorate([
1488
- core.rewrite(rect.__updateStrokeBounds)
1489
- ], exports.Box.prototype, "__updateStrokeBounds", null);
1490
- __decorate([
1491
- core.rewrite(rect.__updateRenderBounds)
1492
- ], exports.Box.prototype, "__updateRectRenderBounds", null);
1493
- __decorate([
1494
- core.rewrite(rect.__updateChange)
1495
- ], exports.Box.prototype, "__updateRectChange", null);
1496
- __decorate([
1497
- core.rewrite(rect.__render)
1498
- ], exports.Box.prototype, "__renderRect", null);
1499
- __decorate([
1500
- core.rewrite(group.__render)
1501
- ], exports.Box.prototype, "__renderGroup", null);
1502
- exports.Box = __decorate([
1503
- core.rewriteAble(),
1504
- core.registerUI()
1505
- ], exports.Box);
1506
-
1507
- exports.Frame = class Frame extends exports.Box {
1508
- get __tag() { return 'Frame'; }
1509
- get isFrame() { return true; }
1510
- constructor(data) {
1511
- super(data);
1512
- }
1513
- };
1514
- __decorate([
1515
- core.dataProcessor(FrameData)
1516
- ], exports.Frame.prototype, "__", void 0);
1517
- __decorate([
1518
- core.surfaceType('#FFFFFF')
1519
- ], exports.Frame.prototype, "fill", void 0);
1520
- __decorate([
1521
- core.affectRenderBoundsType('hide')
1522
- ], exports.Frame.prototype, "overflow", void 0);
1523
- exports.Frame = __decorate([
1524
- core.registerUI()
1525
- ], exports.Frame);
1526
-
1527
- const { moveTo: moveTo$3, closePath: closePath$2, ellipse } = core.PathCommandDataHelper;
1528
- exports.Ellipse = class Ellipse extends exports.UI {
1529
- get __tag() { return 'Ellipse'; }
1530
- constructor(data) {
1531
- super(data);
1532
- }
1533
- __updatePath() {
1534
- const { width, height, innerRadius, startAngle, endAngle } = this.__;
1535
- const rx = width / 2, ry = height / 2;
1536
- const path = this.__.path = [];
1537
- if (innerRadius) {
1538
- if (startAngle || endAngle) {
1539
- if (innerRadius < 1)
1540
- ellipse(path, rx, ry, rx * innerRadius, ry * innerRadius, 0, startAngle, endAngle, false);
1541
- ellipse(path, rx, ry, rx, ry, 0, endAngle, startAngle, true);
1542
- if (innerRadius < 1)
1543
- closePath$2(path);
1544
- }
1545
- else {
1546
- if (innerRadius < 1) {
1547
- ellipse(path, rx, ry, rx * innerRadius, ry * innerRadius);
1548
- moveTo$3(path, width, ry);
1549
- }
1550
- ellipse(path, rx, ry, rx, ry, 0, 360, 0, true);
1551
- }
1552
- if (core.Platform.ellipseToCurve)
1553
- this.__.path = this.getPath(true);
1554
- }
1555
- else {
1556
- if (startAngle || endAngle) {
1557
- moveTo$3(path, rx, ry);
1558
- ellipse(path, rx, ry, rx, ry, 0, startAngle, endAngle, false);
1559
- closePath$2(path);
1560
- }
1561
- else {
1562
- ellipse(path, rx, ry, rx, ry);
1563
- }
1564
- }
1565
- }
1566
- };
1567
- __decorate([
1568
- core.dataProcessor(EllipseData)
1569
- ], exports.Ellipse.prototype, "__", void 0);
1570
- __decorate([
1571
- core.pathType(0)
1572
- ], exports.Ellipse.prototype, "innerRadius", void 0);
1573
- __decorate([
1574
- core.pathType(0)
1575
- ], exports.Ellipse.prototype, "startAngle", void 0);
1576
- __decorate([
1577
- core.pathType(0)
1578
- ], exports.Ellipse.prototype, "endAngle", void 0);
1579
- exports.Ellipse = __decorate([
1580
- core.registerUI()
1581
- ], exports.Ellipse);
1582
-
1583
- const { moveTo: moveTo$2, lineTo: lineTo$2, drawPoints: drawPoints$1 } = core.PathCommandDataHelper;
1584
- const { rotate, getAngle, getDistance, defaultPoint } = core.PointHelper;
1585
- const { toBounds } = core.PathBounds;
1586
- exports.Line = class Line extends exports.UI {
1587
- get __tag() { return 'Line'; }
1588
- get toPoint() {
1589
- const { width, rotation } = this.__;
1590
- const to = core.getPointData();
1591
- if (width)
1592
- to.x = width;
1593
- if (rotation)
1594
- rotate(to, rotation);
1595
- return to;
1596
- }
1597
- set toPoint(value) {
1598
- this.width = getDistance(defaultPoint, value);
1599
- this.rotation = getAngle(defaultPoint, value);
1600
- if (this.height)
1601
- this.height = 0;
1602
- }
1603
- constructor(data) {
1604
- super(data);
1605
- }
1606
- __updatePath() {
1607
- const data = this.__;
1608
- const path = data.path = [];
1609
- if (data.points) {
1610
- drawPoints$1(path, data.points, false, data.closed);
1611
- }
1612
- else {
1613
- moveTo$2(path, 0, 0);
1614
- lineTo$2(path, this.width, 0);
1615
- }
1616
- }
1617
- __updateRenderPath() {
1618
- const data = this.__;
1619
- if (!this.pathInputed && data.points && data.curve) {
1620
- drawPoints$1(data.__pathForRender = [], data.points, data.curve, data.closed);
1621
- if (data.__useArrow)
1622
- PathArrow.addArrows(this, false);
1623
- }
1624
- else
1625
- super.__updateRenderPath();
1626
- }
1627
- __updateBoxBounds() {
1628
- if (this.points) {
1629
- toBounds(this.__.__pathForRender, this.__layout.boxBounds);
1630
- }
1631
- else
1632
- super.__updateBoxBounds();
1633
- }
1634
- };
1635
- __decorate([
1636
- core.dataProcessor(LineData)
1637
- ], exports.Line.prototype, "__", void 0);
1638
- __decorate([
1639
- core.affectStrokeBoundsType('center')
1640
- ], exports.Line.prototype, "strokeAlign", void 0);
1641
- __decorate([
1642
- core.boundsType(0)
1643
- ], exports.Line.prototype, "height", void 0);
1644
- __decorate([
1645
- core.pathType()
1646
- ], exports.Line.prototype, "points", void 0);
1647
- __decorate([
1648
- core.pathType(0)
1649
- ], exports.Line.prototype, "curve", void 0);
1650
- __decorate([
1651
- core.pathType(false)
1652
- ], exports.Line.prototype, "closed", void 0);
1653
- exports.Line = __decorate([
1654
- core.registerUI()
1655
- ], exports.Line);
1656
-
1657
- const { sin: sin$1, cos: cos$1, PI: PI$1 } = Math;
1658
- const { moveTo: moveTo$1, lineTo: lineTo$1, closePath: closePath$1, drawPoints } = core.PathCommandDataHelper;
1659
- const line = exports.Line.prototype;
1660
- exports.Polygon = class Polygon extends exports.UI {
1661
- get __tag() { return 'Polygon'; }
1662
- constructor(data) {
1663
- super(data);
1664
- }
1665
- __updatePath() {
1666
- const path = this.__.path = [];
1667
- if (this.__.points) {
1668
- drawPoints(path, this.__.points, false, true);
1669
- }
1670
- else {
1671
- const { width, height, sides } = this.__;
1672
- const rx = width / 2, ry = height / 2;
1673
- moveTo$1(path, rx, 0);
1674
- for (let i = 1; i < sides; i++) {
1675
- lineTo$1(path, rx + rx * sin$1((i * 2 * PI$1) / sides), ry - ry * cos$1((i * 2 * PI$1) / sides));
1676
- }
1677
- }
1678
- closePath$1(path);
1679
- }
1680
- __updateRenderPath() { }
1681
- __updateBoxBounds() { }
1682
- };
1683
- __decorate([
1684
- core.dataProcessor(PolygonData)
1685
- ], exports.Polygon.prototype, "__", void 0);
1686
- __decorate([
1687
- core.pathType(3)
1688
- ], exports.Polygon.prototype, "sides", void 0);
1689
- __decorate([
1690
- core.pathType()
1691
- ], exports.Polygon.prototype, "points", void 0);
1692
- __decorate([
1693
- core.pathType(0)
1694
- ], exports.Polygon.prototype, "curve", void 0);
1695
- __decorate([
1696
- core.rewrite(line.__updateRenderPath)
1697
- ], exports.Polygon.prototype, "__updateRenderPath", null);
1698
- __decorate([
1699
- core.rewrite(line.__updateBoxBounds)
1700
- ], exports.Polygon.prototype, "__updateBoxBounds", null);
1701
- exports.Polygon = __decorate([
1702
- core.rewriteAble(),
1703
- core.registerUI()
1704
- ], exports.Polygon);
1705
-
1706
- const { sin, cos, PI } = Math;
1707
- const { moveTo, lineTo, closePath } = core.PathCommandDataHelper;
1708
- exports.Star = class Star extends exports.UI {
1709
- get __tag() { return 'Star'; }
1710
- constructor(data) {
1711
- super(data);
1712
- }
1713
- __updatePath() {
1714
- const { width, height, corners, innerRadius } = this.__;
1715
- const rx = width / 2, ry = height / 2;
1716
- const path = this.__.path = [];
1717
- moveTo(path, rx, 0);
1718
- for (let i = 1; i < corners * 2; i++) {
1719
- lineTo(path, rx + (i % 2 === 0 ? rx : rx * innerRadius) * sin((i * PI) / corners), ry - (i % 2 === 0 ? ry : ry * innerRadius) * cos((i * PI) / corners));
1720
- }
1721
- closePath(path);
1722
- }
1723
- };
1724
- __decorate([
1725
- core.dataProcessor(StarData)
1726
- ], exports.Star.prototype, "__", void 0);
1727
- __decorate([
1728
- core.pathType(5)
1729
- ], exports.Star.prototype, "corners", void 0);
1730
- __decorate([
1731
- core.pathType(0.382)
1732
- ], exports.Star.prototype, "innerRadius", void 0);
1733
- exports.Star = __decorate([
1734
- core.registerUI()
1735
- ], exports.Star);
1736
-
1737
- exports.Image = class Image extends exports.Rect {
1738
- get __tag() { return 'Image'; }
1739
- get ready() { const { image } = this; return image && image.ready; }
1740
- get image() { const { fill } = this.__; return fill instanceof Array && fill[0].image; }
1741
- constructor(data) {
1742
- super(data);
1743
- }
1744
- };
1745
- __decorate([
1746
- core.dataProcessor(ImageData)
1747
- ], exports.Image.prototype, "__", void 0);
1748
- __decorate([
1749
- core.boundsType('')
1750
- ], exports.Image.prototype, "url", void 0);
1751
- exports.Image = __decorate([
1752
- core.registerUI()
1753
- ], exports.Image);
1754
- const MyImage = exports.Image;
1755
-
1756
- exports.Canvas = class Canvas extends exports.Rect {
1757
- get __tag() { return 'Canvas'; }
1758
- get context() { return this.canvas.context; }
1759
- get ready() { return !this.url; }
1760
- constructor(data) {
1761
- super(data);
1762
- this.canvas = core.Creator.canvas(this.__);
1763
- if (data && data.url)
1764
- this.drawImage(data.url);
1765
- }
1766
- drawImage(url) {
1767
- new core.LeaferImage({ url }).load((image) => {
1768
- this.context.drawImage(image.view, 0, 0);
1769
- this.url = undefined;
1770
- this.paint();
1771
- this.emitEvent(new core.ImageEvent(core.ImageEvent.LOADED, { image }));
1772
- });
1773
- }
1774
- draw(ui, offset, scale, rotation) {
1775
- const matrix = new core.Matrix(ui.worldTransform).invert();
1776
- const m = new core.Matrix();
1777
- if (offset)
1778
- m.translate(offset.x, offset.y);
1779
- if (scale)
1780
- typeof scale === 'number' ? m.scale(scale) : m.scale(scale.x, scale.y);
1781
- if (rotation)
1782
- m.rotate(rotation);
1783
- matrix.multiplyParent(m);
1784
- ui.__render(this.canvas, { matrix: matrix.withScale() });
1785
- this.paint();
1786
- }
1787
- paint() {
1788
- this.forceRender();
1789
- }
1790
- __drawContent(canvas, _options) {
1791
- const { width, height } = this.__, { view } = this.canvas;
1792
- canvas.drawImage(view, 0, 0, view.width, view.height, 0, 0, width, height);
1793
- }
1794
- __updateSize() {
1795
- const { canvas } = this;
1796
- if (canvas) {
1797
- const { smooth, safeResize } = this.__;
1798
- canvas.resize(this.__, safeResize);
1799
- if (canvas.smooth !== smooth)
1800
- canvas.smooth = smooth;
1801
- }
1802
- }
1803
- destroy() {
1804
- if (this.canvas) {
1805
- this.canvas.destroy();
1806
- this.canvas = null;
1807
- }
1808
- super.destroy();
1809
- }
1810
- };
1811
- __decorate([
1812
- core.dataProcessor(CanvasData)
1813
- ], exports.Canvas.prototype, "__", void 0);
1814
- __decorate([
1815
- resizeType(100)
1816
- ], exports.Canvas.prototype, "width", void 0);
1817
- __decorate([
1818
- resizeType(100)
1819
- ], exports.Canvas.prototype, "height", void 0);
1820
- __decorate([
1821
- resizeType(1)
1822
- ], exports.Canvas.prototype, "pixelRatio", void 0);
1823
- __decorate([
1824
- resizeType(true)
1825
- ], exports.Canvas.prototype, "smooth", void 0);
1826
- __decorate([
1827
- core.dataType(false)
1828
- ], exports.Canvas.prototype, "safeResize", void 0);
1829
- __decorate([
1830
- resizeType()
1831
- ], exports.Canvas.prototype, "contextSettings", void 0);
1832
- exports.Canvas = __decorate([
1833
- core.registerUI()
1834
- ], exports.Canvas);
1835
-
1836
- const { copyAndSpread, includes, spread, setList } = core.BoundsHelper;
1837
- exports.Text = class Text extends exports.UI {
1838
- get __tag() { return 'Text'; }
1839
- get textDrawData() { this.updateLayout(); return this.__.__textDrawData; }
1840
- constructor(data) {
1841
- super(data);
1842
- }
1843
- __updateTextDrawData() {
1844
- const data = this.__;
1845
- const { lineHeight, letterSpacing, fontFamily, fontSize, fontWeight, italic, textCase, textOverflow, padding } = data;
1846
- data.__lineHeight = UnitConvert.number(lineHeight, fontSize);
1847
- data.__letterSpacing = UnitConvert.number(letterSpacing, fontSize);
1848
- data.__padding = padding ? core.MathHelper.fourNumber(padding) : undefined;
1849
- data.__baseLine = data.__lineHeight - (data.__lineHeight - fontSize * 0.7) / 2;
1850
- data.__font = `${italic ? 'italic ' : ''}${textCase === 'small-caps' ? 'small-caps ' : ''}${fontWeight !== 'normal' ? fontWeight + ' ' : ''}${fontSize}px ${fontFamily}`;
1851
- data.__clipText = textOverflow !== 'show' && !data.__autoSize;
1852
- data.__textDrawData = TextConvert.getDrawData((data.__isPlacehold = data.placeholder && data.text === '') ? data.placeholder : data.text, this.__);
1853
- }
1854
- __updateBoxBounds() {
1855
- const data = this.__;
1856
- const layout = this.__layout;
1857
- const { fontSize, italic, padding, __autoWidth: autoWidth, __autoHeight: autoHeight } = data;
1858
- this.__updateTextDrawData();
1859
- const { bounds: contentBounds } = data.__textDrawData;
1860
- const b = layout.boxBounds;
1861
- layout.contentBounds = contentBounds;
1862
- if (data.__lineHeight < fontSize)
1863
- spread(contentBounds, fontSize / 2);
1864
- if (autoWidth || autoHeight) {
1865
- b.x = autoWidth ? contentBounds.x : 0;
1866
- b.y = autoHeight ? contentBounds.y : 0;
1867
- b.width = autoWidth ? contentBounds.width : data.width;
1868
- b.height = autoHeight ? contentBounds.height : data.height;
1869
- if (padding) {
1870
- const [top, right, bottom, left] = data.__padding;
1871
- if (autoWidth)
1872
- b.x -= left, b.width += (right + left);
1873
- if (autoHeight)
1874
- b.y -= top, b.height += (bottom + top);
1875
- }
1876
- this.__updateNaturalSize();
1877
- }
1878
- else
1879
- super.__updateBoxBounds();
1880
- if (italic)
1881
- b.width += fontSize * 0.16;
1882
- core.DataHelper.stintSet(this, 'isOverflow', !includes(b, contentBounds));
1883
- if (this.isOverflow)
1884
- setList(data.__textBoxBounds = {}, [b, contentBounds]), layout.renderChanged = true;
1885
- else
1886
- data.__textBoxBounds = b;
1887
- }
1888
- __onUpdateSize() {
1889
- if (this.__box)
1890
- this.__box.__onUpdateSize();
1891
- super.__onUpdateSize();
1892
- }
1893
- __updateRenderSpread() {
1894
- let width = super.__updateRenderSpread();
1895
- if (!width)
1896
- width = this.isOverflow ? 1 : 0;
1897
- return width;
1898
- }
1899
- __updateRenderBounds() {
1900
- const { renderBounds, renderSpread } = this.__layout;
1901
- copyAndSpread(renderBounds, this.__.__textBoxBounds, renderSpread);
1902
- if (this.__box)
1903
- this.__box.__layout.renderBounds = renderBounds;
1904
- }
1905
- __drawRenderPath(canvas) {
1906
- canvas.font = this.__.__font;
1907
- }
1908
- __draw(canvas, options, originCanvas) {
1909
- const box = this.__box;
1910
- if (box)
1911
- box.__nowWorld = this.__nowWorld, box.__draw(canvas, options, originCanvas);
1912
- if (this.textEditing && !Export.running)
1913
- return;
1914
- super.__draw(canvas, options, originCanvas);
1915
- }
1916
- destroy() {
1917
- if (this.boxStyle)
1918
- this.boxStyle = null;
1919
- super.destroy();
1920
- }
1921
- };
1922
- __decorate([
1923
- core.dataProcessor(TextData)
1924
- ], exports.Text.prototype, "__", void 0);
1925
- __decorate([
1926
- core.boundsType(0)
1927
- ], exports.Text.prototype, "width", void 0);
1928
- __decorate([
1929
- core.boundsType(0)
1930
- ], exports.Text.prototype, "height", void 0);
1931
- __decorate([
1932
- core.surfaceType()
1933
- ], exports.Text.prototype, "boxStyle", void 0);
1934
- __decorate([
1935
- core.dataType(false)
1936
- ], exports.Text.prototype, "resizeFontSize", void 0);
1937
- __decorate([
1938
- core.surfaceType('#000000')
1939
- ], exports.Text.prototype, "fill", void 0);
1940
- __decorate([
1941
- core.affectStrokeBoundsType('outside')
1942
- ], exports.Text.prototype, "strokeAlign", void 0);
1943
- __decorate([
1944
- core.hitType('all')
1945
- ], exports.Text.prototype, "hitFill", void 0);
1946
- __decorate([
1947
- core.boundsType('')
1948
- ], exports.Text.prototype, "text", void 0);
1949
- __decorate([
1950
- core.boundsType('')
1951
- ], exports.Text.prototype, "placeholder", void 0);
1952
- __decorate([
1953
- core.boundsType('caption')
1954
- ], exports.Text.prototype, "fontFamily", void 0);
1955
- __decorate([
1956
- core.boundsType(12)
1957
- ], exports.Text.prototype, "fontSize", void 0);
1958
- __decorate([
1959
- core.boundsType('normal')
1960
- ], exports.Text.prototype, "fontWeight", void 0);
1961
- __decorate([
1962
- core.boundsType(false)
1963
- ], exports.Text.prototype, "italic", void 0);
1964
- __decorate([
1965
- core.boundsType('none')
1966
- ], exports.Text.prototype, "textCase", void 0);
1967
- __decorate([
1968
- core.boundsType('none')
1969
- ], exports.Text.prototype, "textDecoration", void 0);
1970
- __decorate([
1971
- core.boundsType(0)
1972
- ], exports.Text.prototype, "letterSpacing", void 0);
1973
- __decorate([
1974
- core.boundsType({ type: 'percent', value: 1.5 })
1975
- ], exports.Text.prototype, "lineHeight", void 0);
1976
- __decorate([
1977
- core.boundsType(0)
1978
- ], exports.Text.prototype, "paraIndent", void 0);
1979
- __decorate([
1980
- core.boundsType(0)
1981
- ], exports.Text.prototype, "paraSpacing", void 0);
1982
- __decorate([
1983
- core.boundsType('x')
1984
- ], exports.Text.prototype, "writingMode", void 0);
1985
- __decorate([
1986
- core.boundsType('left')
1987
- ], exports.Text.prototype, "textAlign", void 0);
1988
- __decorate([
1989
- core.boundsType('top')
1990
- ], exports.Text.prototype, "verticalAlign", void 0);
1991
- __decorate([
1992
- core.boundsType(true)
1993
- ], exports.Text.prototype, "autoSizeAlign", void 0);
1994
- __decorate([
1995
- core.boundsType('normal')
1996
- ], exports.Text.prototype, "textWrap", void 0);
1997
- __decorate([
1998
- core.boundsType('show')
1999
- ], exports.Text.prototype, "textOverflow", void 0);
2000
- exports.Text = __decorate([
2001
- core.registerUI()
2002
- ], exports.Text);
2003
-
2004
- exports.Path = class Path extends exports.UI {
2005
- get __tag() { return 'Path'; }
2006
- constructor(data) {
2007
- super(data);
2008
- }
2009
- };
2010
- __decorate([
2011
- core.dataProcessor(PathData)
2012
- ], exports.Path.prototype, "__", void 0);
2013
- __decorate([
2014
- core.affectStrokeBoundsType('center')
2015
- ], exports.Path.prototype, "strokeAlign", void 0);
2016
- exports.Path = __decorate([
2017
- core.registerUI()
2018
- ], exports.Path);
2019
-
2020
- exports.Pen = class Pen extends exports.Group {
2021
- get __tag() { return 'Pen'; }
2022
- constructor(data) {
2023
- super(data);
2024
- }
2025
- setStyle(data) {
2026
- const path = this.pathElement = new exports.Path(data);
2027
- this.pathStyle = data;
2028
- this.__path = path.path || (path.path = []);
2029
- this.add(path);
2030
- return this;
2031
- }
2032
- beginPath() { return this; }
2033
- moveTo(_x, _y) { return this; }
2034
- lineTo(_x, _y) { return this; }
2035
- bezierCurveTo(_x1, _y1, _x2, _y2, _x, _y) { return this; }
2036
- quadraticCurveTo(_x1, _y1, _x, _y) { return this; }
2037
- closePath() { return this; }
2038
- rect(_x, _y, _width, _height) { return this; }
2039
- roundRect(_x, _y, _width, _height, _cornerRadius) { return this; }
2040
- ellipse(_x, _y, _radiusX, _radiusY, _rotation, _startAngle, _endAngle, _anticlockwise) { return this; }
2041
- arc(_x, _y, _radius, _startAngle, _endAngle, _anticlockwise) { return this; }
2042
- arcTo(_x1, _y1, _x2, _y2, _radius) { return this; }
2043
- drawEllipse(_x, _y, _radiusX, _radiusY, _rotation, _startAngle, _endAngle, _anticlockwise) { return this; }
2044
- drawArc(_x, _y, _radius, _startAngle, _endAngle, _anticlockwise) { return this; }
2045
- drawPoints(_points, _curve, _close) { return this; }
2046
- clearPath() { return this; }
2047
- paint() {
2048
- if (!this.pathElement.__layout.boxChanged)
2049
- this.pathElement.forceUpdate('path');
2050
- }
2051
- };
2052
- __decorate([
2053
- core.dataProcessor(PenData)
2054
- ], exports.Pen.prototype, "__", void 0);
2055
- __decorate([
2056
- penPathType()
2057
- ], exports.Pen.prototype, "path", void 0);
2058
- exports.Pen = __decorate([
2059
- core.useModule(core.PathCreator, ['set', 'path', 'paint']),
2060
- core.registerUI()
2061
- ], exports.Pen);
2062
- function penPathType() {
2063
- return (target, key) => {
2064
- core.defineKey(target, key, {
2065
- get() { return this.__path; }
2066
- });
2067
- };
2068
- }
2069
-
2070
- exports.BoxData = BoxData;
2071
- exports.CanvasData = CanvasData;
2072
- exports.ColorConvert = ColorConvert;
2073
- exports.Effect = Effect;
2074
- exports.EllipseData = EllipseData;
2075
- exports.Export = Export;
2076
- exports.Filter = Filter;
2077
- exports.FrameData = FrameData;
2078
- exports.GroupData = GroupData;
2079
- exports.ImageData = ImageData;
2080
- exports.LeaferData = LeaferData;
2081
- exports.LineData = LineData;
2082
- exports.MyImage = MyImage;
2083
- exports.Paint = Paint;
2084
- exports.PaintGradient = PaintGradient;
2085
- exports.PaintImage = PaintImage;
2086
- exports.PathArrow = PathArrow;
2087
- exports.PathData = PathData;
2088
- exports.PenData = PenData;
2089
- exports.PolygonData = PolygonData;
2090
- exports.RectData = RectData;
2091
- exports.RectRender = RectRender;
2092
- exports.StarData = StarData;
2093
- exports.State = State;
2094
- exports.TextConvert = TextConvert;
2095
- exports.TextData = TextData;
2096
- exports.Transition = Transition;
2097
- exports.UIBounds = UIBounds;
2098
- exports.UIData = UIData;
2099
- exports.UIRender = UIRender;
2100
- exports.UnitConvert = UnitConvert;
2101
- exports.effectType = effectType;
2102
- exports.resizeType = resizeType;
2103
- exports.zoomLayerType = zoomLayerType;
2104
- Object.keys(core).forEach(function (k) {
2105
- if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
2106
- enumerable: true,
2107
- get: function () { return core[k]; }
2108
- });
2109
- });