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