@idraw/core 0.3.0-alpha.7 → 0.3.0-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +1 -1
- package/dist/esm/index.d.ts +4 -2
- package/dist/esm/index.js +13 -7
- package/dist/esm/lib/element.js +66 -8
- package/dist/esm/lib/helper.js +3 -3
- package/dist/esm/mixins/element.d.ts +4 -4
- package/dist/esm/mixins/element.js +22 -9
- package/dist/index.global.js +106 -28
- package/dist/index.global.min.js +1 -1
- package/package.json +6 -6
package/LICENSE
CHANGED
package/dist/esm/index.d.ts
CHANGED
|
@@ -21,10 +21,12 @@ export default class Core {
|
|
|
21
21
|
}): void;
|
|
22
22
|
getElement(uuid: string): TypeElement<keyof TypeElemDesc> | null;
|
|
23
23
|
getElementByIndex(index: number): TypeElement<keyof TypeElemDesc> | null;
|
|
24
|
-
selectElementByIndex(index: number
|
|
24
|
+
selectElementByIndex(index: number): void;
|
|
25
|
+
selectElement(uuid: string): void;
|
|
26
|
+
cancelElementByIndex(index: number, opts?: {
|
|
25
27
|
useMode?: boolean;
|
|
26
28
|
}): void;
|
|
27
|
-
|
|
29
|
+
cancelElement(uuid: string, opts?: {
|
|
28
30
|
useMode?: boolean;
|
|
29
31
|
}): void;
|
|
30
32
|
moveUpElement(uuid: string): void;
|
package/dist/esm/index.js
CHANGED
|
@@ -6,7 +6,7 @@ import is from './lib/is';
|
|
|
6
6
|
import check from './lib/check';
|
|
7
7
|
import { Element, mergeConfig, CoreEvent, parseData, TempData, diffElementResourceChangeList } from './lib';
|
|
8
8
|
import { _board, _data, _opts, _config, _renderer, _element, _tempData, _draw, _coreEvent, _emitChangeScreen, _emitChangeData, _engine } from './names';
|
|
9
|
-
import { getSelectedElements, updateElement, selectElementByIndex, getElement, getElementByIndex,
|
|
9
|
+
import { getSelectedElements, updateElement, selectElementByIndex, selectElement, cancelElementByIndex, cancelElement, getElement, getElementByIndex, moveUpElement, moveDownElement, addElement, deleteElement, insertElementBefore, insertElementBeforeIndex, insertElementAfter, insertElementAfterIndex } from './mixins/element';
|
|
10
10
|
import { Engine } from './lib/engine';
|
|
11
11
|
import { drawElementWrapper, drawAreaWrapper, drawElementListWrappers } from './lib/draw/wrapper';
|
|
12
12
|
export default class Core {
|
|
@@ -33,10 +33,10 @@ export default class Core {
|
|
|
33
33
|
drawElementListWrappers(helperCtx, helperConfig);
|
|
34
34
|
this[_board].draw();
|
|
35
35
|
};
|
|
36
|
-
this[_renderer].on('drawFrame', (
|
|
36
|
+
this[_renderer].on('drawFrame', () => {
|
|
37
37
|
drawFrame();
|
|
38
38
|
});
|
|
39
|
-
this[_renderer].on('drawFrameComplete', (
|
|
39
|
+
this[_renderer].on('drawFrameComplete', () => {
|
|
40
40
|
drawFrame();
|
|
41
41
|
});
|
|
42
42
|
this[_element] = new Element(this[_board].getContext());
|
|
@@ -77,11 +77,17 @@ export default class Core {
|
|
|
77
77
|
getElementByIndex(index) {
|
|
78
78
|
return getElementByIndex(this, index);
|
|
79
79
|
}
|
|
80
|
-
selectElementByIndex(index
|
|
81
|
-
return selectElementByIndex(this, index
|
|
80
|
+
selectElementByIndex(index) {
|
|
81
|
+
return selectElementByIndex(this, index);
|
|
82
|
+
}
|
|
83
|
+
selectElement(uuid) {
|
|
84
|
+
return selectElement(this, uuid);
|
|
85
|
+
}
|
|
86
|
+
cancelElementByIndex(index, opts) {
|
|
87
|
+
return cancelElementByIndex(this, index, opts);
|
|
82
88
|
}
|
|
83
|
-
|
|
84
|
-
return
|
|
89
|
+
cancelElement(uuid, opts) {
|
|
90
|
+
return cancelElement(this, uuid, opts);
|
|
85
91
|
}
|
|
86
92
|
moveUpElement(uuid) {
|
|
87
93
|
return moveUpElement(this, uuid);
|
package/dist/esm/lib/element.js
CHANGED
|
@@ -55,8 +55,8 @@ export class Element {
|
|
|
55
55
|
}
|
|
56
56
|
const moveX = point.x - prevPoint.x;
|
|
57
57
|
const moveY = point.y - prevPoint.y;
|
|
58
|
-
data.elements[index].x +=
|
|
59
|
-
data.elements[index].y +=
|
|
58
|
+
data.elements[index].x += moveX / scale;
|
|
59
|
+
data.elements[index].y += moveY / scale;
|
|
60
60
|
this.limitElementAttrs(data.elements[index]);
|
|
61
61
|
}
|
|
62
62
|
transformElement(data, uuid, point, prevPoint, scale, direction) {
|
|
@@ -68,12 +68,18 @@ export class Element {
|
|
|
68
68
|
if (((_b = (_a = data.elements[index]) === null || _a === void 0 ? void 0 : _a.operation) === null || _b === void 0 ? void 0 : _b.lock) === true) {
|
|
69
69
|
return null;
|
|
70
70
|
}
|
|
71
|
-
|
|
72
|
-
|
|
71
|
+
const moveX = (point.x - prevPoint.x) / scale;
|
|
72
|
+
const moveY = (point.y - prevPoint.y) / scale;
|
|
73
73
|
const elem = data.elements[index];
|
|
74
74
|
if ([
|
|
75
|
-
'top-left',
|
|
76
|
-
'
|
|
75
|
+
'top-left',
|
|
76
|
+
'top',
|
|
77
|
+
'top-right',
|
|
78
|
+
'right',
|
|
79
|
+
'bottom-right',
|
|
80
|
+
'bottom',
|
|
81
|
+
'bottom-left',
|
|
82
|
+
'left'
|
|
77
83
|
].includes(direction)) {
|
|
78
84
|
const p = calcuScaleElemPosition(elem, moveX, moveY, direction, scale);
|
|
79
85
|
elem.x = p.x;
|
|
@@ -90,7 +96,7 @@ export class Element {
|
|
|
90
96
|
return {
|
|
91
97
|
width: limitNum(elem.w),
|
|
92
98
|
height: limitNum(elem.h),
|
|
93
|
-
angle: limitAngle(elem.angle || 0)
|
|
99
|
+
angle: limitAngle(elem.angle || 0)
|
|
94
100
|
};
|
|
95
101
|
}
|
|
96
102
|
getElementIndex(data, uuid) {
|
|
@@ -112,11 +118,19 @@ export class Element {
|
|
|
112
118
|
}
|
|
113
119
|
}
|
|
114
120
|
function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
121
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
115
122
|
const p = { x: elem.x, y: elem.y, w: elem.w, h: elem.h };
|
|
116
123
|
let angle = elem.angle;
|
|
117
124
|
if (angle < 0) {
|
|
118
125
|
angle = Math.max(0, 360 + angle);
|
|
119
126
|
}
|
|
127
|
+
if (((_a = elem.operation) === null || _a === void 0 ? void 0 : _a.limitRatio) === true) {
|
|
128
|
+
if (['top-left', 'top-right', 'bottom-right', 'bottom-left'].includes(direction)) {
|
|
129
|
+
const maxDist = Math.max(Math.abs(moveX), Math.abs(moveY));
|
|
130
|
+
moveX = (moveX >= 0 ? 1 : -1) * maxDist;
|
|
131
|
+
moveY = (((moveY >= 0 ? 1 : -1) * maxDist) / elem.w) * elem.h;
|
|
132
|
+
}
|
|
133
|
+
}
|
|
120
134
|
switch (direction) {
|
|
121
135
|
case 'top-left': {
|
|
122
136
|
if (elem.w - moveX > 0 && elem.h - moveY > 0) {
|
|
@@ -132,6 +146,10 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
132
146
|
if (p.h - moveY > 0) {
|
|
133
147
|
p.y += moveY;
|
|
134
148
|
p.h -= moveY;
|
|
149
|
+
if (((_b = elem.operation) === null || _b === void 0 ? void 0 : _b.limitRatio) === true) {
|
|
150
|
+
p.x += ((moveY / elem.h) * elem.w) / 2;
|
|
151
|
+
p.w -= (moveY / elem.h) * elem.w;
|
|
152
|
+
}
|
|
135
153
|
}
|
|
136
154
|
}
|
|
137
155
|
else if (elem.angle > 0 || elem.angle < 0) {
|
|
@@ -168,6 +186,9 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
168
186
|
centerY = centerY - centerMoveDist * Math.sin(radian);
|
|
169
187
|
}
|
|
170
188
|
if (p.h + moveDist > 0) {
|
|
189
|
+
if (((_c = elem.operation) === null || _c === void 0 ? void 0 : _c.limitRatio) === true) {
|
|
190
|
+
p.w = p.w + (moveDist / elem.h) * elem.w;
|
|
191
|
+
}
|
|
171
192
|
p.h = p.h + moveDist;
|
|
172
193
|
p.x = centerX - p.w / 2;
|
|
173
194
|
p.y = centerY - p.h / 2;
|
|
@@ -177,6 +198,10 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
177
198
|
if (p.h - moveY > 0) {
|
|
178
199
|
p.y += moveY;
|
|
179
200
|
p.h -= moveY;
|
|
201
|
+
if (((_d = elem.operation) === null || _d === void 0 ? void 0 : _d.limitRatio) === true) {
|
|
202
|
+
p.x -= moveX / 2;
|
|
203
|
+
p.w += moveX;
|
|
204
|
+
}
|
|
180
205
|
}
|
|
181
206
|
}
|
|
182
207
|
break;
|
|
@@ -193,6 +218,10 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
193
218
|
if (elem.angle === 0 || Math.abs(elem.angle) < limitQbliqueAngle) {
|
|
194
219
|
if (elem.w + moveX > 0) {
|
|
195
220
|
p.w += moveX;
|
|
221
|
+
if (((_e = elem.operation) === null || _e === void 0 ? void 0 : _e.limitRatio) === true) {
|
|
222
|
+
p.y -= (moveX * elem.h) / elem.w / 2;
|
|
223
|
+
p.h += (moveX * elem.h) / elem.w;
|
|
224
|
+
}
|
|
196
225
|
}
|
|
197
226
|
}
|
|
198
227
|
else if (elem.angle > 0 || elem.angle < 0) {
|
|
@@ -230,6 +259,9 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
230
259
|
centerY = centerY - centerMoveDist * Math.cos(radian);
|
|
231
260
|
}
|
|
232
261
|
if (p.w + moveDist > 0) {
|
|
262
|
+
if (((_f = elem.operation) === null || _f === void 0 ? void 0 : _f.limitRatio) === true) {
|
|
263
|
+
p.h = p.h + (moveDist / elem.w) * elem.h;
|
|
264
|
+
}
|
|
233
265
|
p.w = p.w + moveDist;
|
|
234
266
|
p.x = centerX - p.w / 2;
|
|
235
267
|
p.y = centerY - p.h / 2;
|
|
@@ -238,6 +270,10 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
238
270
|
else {
|
|
239
271
|
if (elem.w + moveX > 0) {
|
|
240
272
|
p.w += moveX;
|
|
273
|
+
if (((_g = elem.operation) === null || _g === void 0 ? void 0 : _g.limitRatio) === true) {
|
|
274
|
+
p.h += (moveX * elem.h) / elem.w;
|
|
275
|
+
p.y -= (moveX * elem.h) / elem.w / 2;
|
|
276
|
+
}
|
|
241
277
|
}
|
|
242
278
|
}
|
|
243
279
|
break;
|
|
@@ -253,6 +289,10 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
253
289
|
if (elem.angle === 0 || Math.abs(elem.angle) < limitQbliqueAngle) {
|
|
254
290
|
if (elem.h + moveY > 0) {
|
|
255
291
|
p.h += moveY;
|
|
292
|
+
if (((_h = elem.operation) === null || _h === void 0 ? void 0 : _h.limitRatio) === true) {
|
|
293
|
+
p.x -= ((moveY / elem.h) * elem.w) / 2;
|
|
294
|
+
p.w += (moveY / elem.h) * elem.w;
|
|
295
|
+
}
|
|
256
296
|
}
|
|
257
297
|
}
|
|
258
298
|
else if (elem.angle > 0 || elem.angle < 0) {
|
|
@@ -289,6 +329,9 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
289
329
|
centerY = centerY + centerMoveDist * Math.sin(radian);
|
|
290
330
|
}
|
|
291
331
|
if (p.h + moveDist > 0) {
|
|
332
|
+
if (((_j = elem.operation) === null || _j === void 0 ? void 0 : _j.limitRatio) === true) {
|
|
333
|
+
p.w = p.w + (moveDist / elem.h) * elem.w;
|
|
334
|
+
}
|
|
292
335
|
p.h = p.h + moveDist;
|
|
293
336
|
p.x = centerX - p.w / 2;
|
|
294
337
|
p.y = centerY - p.h / 2;
|
|
@@ -297,6 +340,10 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
297
340
|
else {
|
|
298
341
|
if (elem.h + moveY > 0) {
|
|
299
342
|
p.h += moveY;
|
|
343
|
+
if (((_k = elem.operation) === null || _k === void 0 ? void 0 : _k.limitRatio) === true) {
|
|
344
|
+
p.x -= ((moveY / elem.h) * elem.w) / 2;
|
|
345
|
+
p.w += (moveY / elem.h) * elem.w;
|
|
346
|
+
}
|
|
300
347
|
}
|
|
301
348
|
}
|
|
302
349
|
break;
|
|
@@ -314,6 +361,10 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
314
361
|
if (elem.w - moveX > 0) {
|
|
315
362
|
p.x += moveX;
|
|
316
363
|
p.w -= moveX;
|
|
364
|
+
if (((_l = elem.operation) === null || _l === void 0 ? void 0 : _l.limitRatio) === true) {
|
|
365
|
+
p.h -= (moveX / elem.w) * elem.h;
|
|
366
|
+
p.y += ((moveX / elem.w) * elem.h) / 2;
|
|
367
|
+
}
|
|
317
368
|
}
|
|
318
369
|
}
|
|
319
370
|
else if (elem.angle > 0 || elem.angle < 0) {
|
|
@@ -350,6 +401,9 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
350
401
|
centerY = centerY + centerMoveDist * Math.cos(radian);
|
|
351
402
|
}
|
|
352
403
|
if (p.w + moveDist > 0) {
|
|
404
|
+
if (((_m = elem.operation) === null || _m === void 0 ? void 0 : _m.limitRatio) === true) {
|
|
405
|
+
p.h = p.h + (moveDist / elem.w) * elem.h;
|
|
406
|
+
}
|
|
353
407
|
p.w = p.w + moveDist;
|
|
354
408
|
p.x = centerX - p.w / 2;
|
|
355
409
|
p.y = centerY - p.h / 2;
|
|
@@ -359,6 +413,10 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
359
413
|
if (elem.w - moveX > 0) {
|
|
360
414
|
p.x += moveX;
|
|
361
415
|
p.w -= moveX;
|
|
416
|
+
if (((_o = elem.operation) === null || _o === void 0 ? void 0 : _o.limitRatio) === true) {
|
|
417
|
+
p.h -= (moveX / elem.w) * elem.h;
|
|
418
|
+
p.y += ((moveX / elem.w) * elem.h) / 2;
|
|
419
|
+
}
|
|
362
420
|
}
|
|
363
421
|
}
|
|
364
422
|
break;
|
|
@@ -370,7 +428,7 @@ function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
|
370
428
|
return p;
|
|
371
429
|
}
|
|
372
430
|
function parseRadian(angle) {
|
|
373
|
-
return angle * Math.PI / 180;
|
|
431
|
+
return (angle * Math.PI) / 180;
|
|
374
432
|
}
|
|
375
433
|
function calcMoveDist(moveX, moveY) {
|
|
376
434
|
return Math.sqrt(moveX * moveX + moveY * moveY);
|
package/dist/esm/lib/helper.js
CHANGED
|
@@ -55,7 +55,7 @@ export class Helper {
|
|
|
55
55
|
wrapper.controllers.bottom,
|
|
56
56
|
wrapper.controllers.bottomRight
|
|
57
57
|
];
|
|
58
|
-
|
|
58
|
+
const directionNames = [
|
|
59
59
|
'right',
|
|
60
60
|
'top-right',
|
|
61
61
|
'top',
|
|
@@ -273,7 +273,7 @@ export class Helper {
|
|
|
273
273
|
_updateSelectedElementListWrapper(data, opts) {
|
|
274
274
|
const { selectedUUIDList } = opts;
|
|
275
275
|
const wrapperList = [];
|
|
276
|
-
data.elements.forEach((elem
|
|
276
|
+
data.elements.forEach((elem) => {
|
|
277
277
|
if (selectedUUIDList === null || selectedUUIDList === void 0 ? void 0 : selectedUUIDList.includes(elem.uuid)) {
|
|
278
278
|
const wrapper = this._createSelectedElementWrapper(elem, opts);
|
|
279
279
|
wrapperList.push(wrapper);
|
|
@@ -345,7 +345,7 @@ export class Helper {
|
|
|
345
345
|
rotate: {
|
|
346
346
|
x: elem.x + elem.w / 2,
|
|
347
347
|
y: elem.y - controllerSize - (controllerSize * 2 + rotateLimit) - bw,
|
|
348
|
-
invisible: ((_l = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _l === void 0 ? void 0 : _l.
|
|
348
|
+
invisible: ((_l = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _l === void 0 ? void 0 : _l.disableRotate) === true
|
|
349
349
|
}
|
|
350
350
|
},
|
|
351
351
|
lineWidth: lineWidth,
|
|
@@ -4,10 +4,10 @@ export declare function getSelectedElements(core: Core): TypeElement<keyof TypeE
|
|
|
4
4
|
export declare function getElement(core: Core, uuid: string): TypeElement<keyof TypeElemDesc> | null;
|
|
5
5
|
export declare function getElementByIndex(core: Core, index: number): TypeElement<keyof TypeElemDesc> | null;
|
|
6
6
|
export declare function updateElement(core: Core, elem: TypeElement<keyof TypeElemDesc>): void;
|
|
7
|
-
export declare function selectElementByIndex(core: Core, index: number
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
export declare function
|
|
7
|
+
export declare function selectElementByIndex(core: Core, index: number): void;
|
|
8
|
+
export declare function selectElement(core: Core, uuid: string): void;
|
|
9
|
+
export declare function cancelElementByIndex(core: Core, index: number): void;
|
|
10
|
+
export declare function cancelElement(core: Core, uuid: string, opts?: {
|
|
11
11
|
useMode?: boolean;
|
|
12
12
|
}): void;
|
|
13
13
|
export declare function moveUpElement(core: Core, uuid: string): void;
|
|
@@ -56,15 +56,10 @@ export function updateElement(core, elem) {
|
|
|
56
56
|
core[_emitChangeData]();
|
|
57
57
|
core[_draw]({ resourceChangeUUIDs });
|
|
58
58
|
}
|
|
59
|
-
export function selectElementByIndex(core, index
|
|
59
|
+
export function selectElementByIndex(core, index) {
|
|
60
60
|
if (core[_data].elements[index]) {
|
|
61
61
|
const uuid = core[_data].elements[index].uuid;
|
|
62
|
-
|
|
63
|
-
core[_engine].temp.set('mode', Mode.SELECT_ELEMENT);
|
|
64
|
-
}
|
|
65
|
-
else {
|
|
66
|
-
core[_engine].temp.set('mode', Mode.NULL);
|
|
67
|
-
}
|
|
62
|
+
core[_engine].temp.set('mode', Mode.NULL);
|
|
68
63
|
if (typeof uuid === 'string') {
|
|
69
64
|
core[_engine].temp.set('selectedUUID', uuid);
|
|
70
65
|
core[_engine].temp.set('selectedUUIDList', []);
|
|
@@ -72,10 +67,28 @@ export function selectElementByIndex(core, index, opts) {
|
|
|
72
67
|
core[_draw]();
|
|
73
68
|
}
|
|
74
69
|
}
|
|
75
|
-
export function selectElement(core, uuid
|
|
70
|
+
export function selectElement(core, uuid) {
|
|
71
|
+
const index = core[_engine].helper.getElementIndexByUUID(uuid);
|
|
72
|
+
if (typeof index === 'number' && index >= 0) {
|
|
73
|
+
core.selectElementByIndex(index);
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
export function cancelElementByIndex(core, index) {
|
|
77
|
+
if (core[_data].elements[index]) {
|
|
78
|
+
const uuid = core[_data].elements[index].uuid;
|
|
79
|
+
const selectedUUID = core[_engine].temp.get('selectedUUID');
|
|
80
|
+
if (typeof uuid === 'string' && uuid === selectedUUID) {
|
|
81
|
+
core[_engine].temp.set('mode', Mode.NULL);
|
|
82
|
+
core[_engine].temp.set('selectedUUID', null);
|
|
83
|
+
core[_engine].temp.set('selectedUUIDList', []);
|
|
84
|
+
}
|
|
85
|
+
core[_draw]();
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
export function cancelElement(core, uuid, opts) {
|
|
76
89
|
const index = core[_engine].helper.getElementIndexByUUID(uuid);
|
|
77
90
|
if (typeof index === 'number' && index >= 0) {
|
|
78
|
-
core.
|
|
91
|
+
core.cancelElementByIndex(index, opts);
|
|
79
92
|
}
|
|
80
93
|
}
|
|
81
94
|
export function moveUpElement(core, uuid) {
|
package/dist/index.global.js
CHANGED
|
@@ -1628,7 +1628,7 @@ var iDrawCore = function() {
|
|
|
1628
1628
|
fontSize: desc.fontSize,
|
|
1629
1629
|
fontFamily: desc.fontFamily
|
|
1630
1630
|
});
|
|
1631
|
-
const descText = desc.text.replace(/\r\n/
|
|
1631
|
+
const descText = desc.text.replace(/\r\n/gi, "\n");
|
|
1632
1632
|
const fontHeight = desc.lineHeight || desc.fontSize;
|
|
1633
1633
|
const descTextList = descText.split("\n");
|
|
1634
1634
|
const lines = [];
|
|
@@ -1670,11 +1670,18 @@ var iDrawCore = function() {
|
|
|
1670
1670
|
});
|
|
1671
1671
|
}
|
|
1672
1672
|
});
|
|
1673
|
-
|
|
1674
|
-
|
|
1675
|
-
if (
|
|
1676
|
-
|
|
1673
|
+
let startY = 0;
|
|
1674
|
+
if (lines.length * fontHeight < elem.h) {
|
|
1675
|
+
if (elem.desc.verticalAlign === "top") {
|
|
1676
|
+
startY = 0;
|
|
1677
|
+
} else if (elem.desc.verticalAlign === "bottom") {
|
|
1678
|
+
startY += elem.h - lines.length * fontHeight;
|
|
1679
|
+
} else {
|
|
1680
|
+
startY += (elem.h - lines.length * fontHeight) / 2;
|
|
1677
1681
|
}
|
|
1682
|
+
}
|
|
1683
|
+
{
|
|
1684
|
+
const _y = elem.y + startY;
|
|
1678
1685
|
if (desc.textShadowColor !== void 0 && isColorStr(desc.textShadowColor)) {
|
|
1679
1686
|
ctx.setShadowColor(desc.textShadowColor);
|
|
1680
1687
|
}
|
|
@@ -1699,10 +1706,7 @@ var iDrawCore = function() {
|
|
|
1699
1706
|
clearContext$1(ctx);
|
|
1700
1707
|
}
|
|
1701
1708
|
if (isColorStr(desc.strokeColor) && desc.strokeWidth !== void 0 && desc.strokeWidth > 0) {
|
|
1702
|
-
|
|
1703
|
-
if (lines.length * fontHeight < elem.h) {
|
|
1704
|
-
_y += (elem.h - lines.length * fontHeight) / 2;
|
|
1705
|
-
}
|
|
1709
|
+
const _y = elem.y + startY;
|
|
1706
1710
|
lines.forEach((line, i) => {
|
|
1707
1711
|
let _x = elem.x;
|
|
1708
1712
|
if (desc.textAlign === "center") {
|
|
@@ -2808,8 +2812,8 @@ var iDrawCore = function() {
|
|
|
2808
2812
|
if (((_b2 = (_a2 = data.elements[index]) == null ? void 0 : _a2.operation) == null ? void 0 : _b2.lock) === true) {
|
|
2809
2813
|
return null;
|
|
2810
2814
|
}
|
|
2811
|
-
|
|
2812
|
-
|
|
2815
|
+
const moveX = (point.x - prevPoint.x) / scale;
|
|
2816
|
+
const moveY = (point.y - prevPoint.y) / scale;
|
|
2813
2817
|
const elem = data.elements[index];
|
|
2814
2818
|
if ([
|
|
2815
2819
|
"top-left",
|
|
@@ -2857,8 +2861,18 @@ var iDrawCore = function() {
|
|
|
2857
2861
|
}
|
|
2858
2862
|
}
|
|
2859
2863
|
function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
|
|
2864
|
+
var _a2, _b2, _c2, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
|
|
2860
2865
|
const p = { x: elem.x, y: elem.y, w: elem.w, h: elem.h };
|
|
2861
2866
|
elem.angle;
|
|
2867
|
+
if (((_a2 = elem.operation) == null ? void 0 : _a2.limitRatio) === true) {
|
|
2868
|
+
if (["top-left", "top-right", "bottom-right", "bottom-left"].includes(
|
|
2869
|
+
direction
|
|
2870
|
+
)) {
|
|
2871
|
+
const maxDist = Math.max(Math.abs(moveX), Math.abs(moveY));
|
|
2872
|
+
moveX = (moveX >= 0 ? 1 : -1) * maxDist;
|
|
2873
|
+
moveY = (moveY >= 0 ? 1 : -1) * maxDist / elem.w * elem.h;
|
|
2874
|
+
}
|
|
2875
|
+
}
|
|
2862
2876
|
switch (direction) {
|
|
2863
2877
|
case "top-left": {
|
|
2864
2878
|
if (elem.w - moveX > 0 && elem.h - moveY > 0) {
|
|
@@ -2874,6 +2888,10 @@ var iDrawCore = function() {
|
|
|
2874
2888
|
if (p.h - moveY > 0) {
|
|
2875
2889
|
p.y += moveY;
|
|
2876
2890
|
p.h -= moveY;
|
|
2891
|
+
if (((_b2 = elem.operation) == null ? void 0 : _b2.limitRatio) === true) {
|
|
2892
|
+
p.x += moveY / elem.h * elem.w / 2;
|
|
2893
|
+
p.w -= moveY / elem.h * elem.w;
|
|
2894
|
+
}
|
|
2877
2895
|
}
|
|
2878
2896
|
} else if (elem.angle > 0 || elem.angle < 0) {
|
|
2879
2897
|
const angle2 = elem.angle > 0 ? elem.angle : Math.max(0, elem.angle + 360);
|
|
@@ -2906,6 +2924,9 @@ var iDrawCore = function() {
|
|
|
2906
2924
|
centerY = centerY - centerMoveDist * Math.sin(radian);
|
|
2907
2925
|
}
|
|
2908
2926
|
if (p.h + moveDist > 0) {
|
|
2927
|
+
if (((_c2 = elem.operation) == null ? void 0 : _c2.limitRatio) === true) {
|
|
2928
|
+
p.w = p.w + moveDist / elem.h * elem.w;
|
|
2929
|
+
}
|
|
2909
2930
|
p.h = p.h + moveDist;
|
|
2910
2931
|
p.x = centerX - p.w / 2;
|
|
2911
2932
|
p.y = centerY - p.h / 2;
|
|
@@ -2914,6 +2935,10 @@ var iDrawCore = function() {
|
|
|
2914
2935
|
if (p.h - moveY > 0) {
|
|
2915
2936
|
p.y += moveY;
|
|
2916
2937
|
p.h -= moveY;
|
|
2938
|
+
if (((_d = elem.operation) == null ? void 0 : _d.limitRatio) === true) {
|
|
2939
|
+
p.x -= moveX / 2;
|
|
2940
|
+
p.w += moveX;
|
|
2941
|
+
}
|
|
2917
2942
|
}
|
|
2918
2943
|
}
|
|
2919
2944
|
break;
|
|
@@ -2930,6 +2955,10 @@ var iDrawCore = function() {
|
|
|
2930
2955
|
if (elem.angle === 0 || Math.abs(elem.angle) < limitQbliqueAngle$1) {
|
|
2931
2956
|
if (elem.w + moveX > 0) {
|
|
2932
2957
|
p.w += moveX;
|
|
2958
|
+
if (((_e = elem.operation) == null ? void 0 : _e.limitRatio) === true) {
|
|
2959
|
+
p.y -= moveX * elem.h / elem.w / 2;
|
|
2960
|
+
p.h += moveX * elem.h / elem.w;
|
|
2961
|
+
}
|
|
2933
2962
|
}
|
|
2934
2963
|
} else if (elem.angle > 0 || elem.angle < 0) {
|
|
2935
2964
|
const angle2 = elem.angle > 0 ? elem.angle : Math.max(0, elem.angle + 360);
|
|
@@ -2963,6 +2992,9 @@ var iDrawCore = function() {
|
|
|
2963
2992
|
centerY = centerY - centerMoveDist * Math.cos(radian);
|
|
2964
2993
|
}
|
|
2965
2994
|
if (p.w + moveDist > 0) {
|
|
2995
|
+
if (((_f = elem.operation) == null ? void 0 : _f.limitRatio) === true) {
|
|
2996
|
+
p.h = p.h + moveDist / elem.w * elem.h;
|
|
2997
|
+
}
|
|
2966
2998
|
p.w = p.w + moveDist;
|
|
2967
2999
|
p.x = centerX - p.w / 2;
|
|
2968
3000
|
p.y = centerY - p.h / 2;
|
|
@@ -2970,6 +3002,10 @@ var iDrawCore = function() {
|
|
|
2970
3002
|
} else {
|
|
2971
3003
|
if (elem.w + moveX > 0) {
|
|
2972
3004
|
p.w += moveX;
|
|
3005
|
+
if (((_g = elem.operation) == null ? void 0 : _g.limitRatio) === true) {
|
|
3006
|
+
p.h += moveX * elem.h / elem.w;
|
|
3007
|
+
p.y -= moveX * elem.h / elem.w / 2;
|
|
3008
|
+
}
|
|
2973
3009
|
}
|
|
2974
3010
|
}
|
|
2975
3011
|
break;
|
|
@@ -2985,6 +3021,10 @@ var iDrawCore = function() {
|
|
|
2985
3021
|
if (elem.angle === 0 || Math.abs(elem.angle) < limitQbliqueAngle$1) {
|
|
2986
3022
|
if (elem.h + moveY > 0) {
|
|
2987
3023
|
p.h += moveY;
|
|
3024
|
+
if (((_h = elem.operation) == null ? void 0 : _h.limitRatio) === true) {
|
|
3025
|
+
p.x -= moveY / elem.h * elem.w / 2;
|
|
3026
|
+
p.w += moveY / elem.h * elem.w;
|
|
3027
|
+
}
|
|
2988
3028
|
}
|
|
2989
3029
|
} else if (elem.angle > 0 || elem.angle < 0) {
|
|
2990
3030
|
const angle2 = elem.angle > 0 ? elem.angle : Math.max(0, elem.angle + 360);
|
|
@@ -3017,6 +3057,9 @@ var iDrawCore = function() {
|
|
|
3017
3057
|
centerY = centerY + centerMoveDist * Math.sin(radian);
|
|
3018
3058
|
}
|
|
3019
3059
|
if (p.h + moveDist > 0) {
|
|
3060
|
+
if (((_i = elem.operation) == null ? void 0 : _i.limitRatio) === true) {
|
|
3061
|
+
p.w = p.w + moveDist / elem.h * elem.w;
|
|
3062
|
+
}
|
|
3020
3063
|
p.h = p.h + moveDist;
|
|
3021
3064
|
p.x = centerX - p.w / 2;
|
|
3022
3065
|
p.y = centerY - p.h / 2;
|
|
@@ -3024,6 +3067,10 @@ var iDrawCore = function() {
|
|
|
3024
3067
|
} else {
|
|
3025
3068
|
if (elem.h + moveY > 0) {
|
|
3026
3069
|
p.h += moveY;
|
|
3070
|
+
if (((_j = elem.operation) == null ? void 0 : _j.limitRatio) === true) {
|
|
3071
|
+
p.x -= moveY / elem.h * elem.w / 2;
|
|
3072
|
+
p.w += moveY / elem.h * elem.w;
|
|
3073
|
+
}
|
|
3027
3074
|
}
|
|
3028
3075
|
}
|
|
3029
3076
|
break;
|
|
@@ -3041,6 +3088,10 @@ var iDrawCore = function() {
|
|
|
3041
3088
|
if (elem.w - moveX > 0) {
|
|
3042
3089
|
p.x += moveX;
|
|
3043
3090
|
p.w -= moveX;
|
|
3091
|
+
if (((_k = elem.operation) == null ? void 0 : _k.limitRatio) === true) {
|
|
3092
|
+
p.h -= moveX / elem.w * elem.h;
|
|
3093
|
+
p.y += moveX / elem.w * elem.h / 2;
|
|
3094
|
+
}
|
|
3044
3095
|
}
|
|
3045
3096
|
} else if (elem.angle > 0 || elem.angle < 0) {
|
|
3046
3097
|
const angle2 = elem.angle > 0 ? elem.angle : Math.max(0, elem.angle + 360);
|
|
@@ -3073,6 +3124,9 @@ var iDrawCore = function() {
|
|
|
3073
3124
|
centerY = centerY + centerMoveDist * Math.cos(radian);
|
|
3074
3125
|
}
|
|
3075
3126
|
if (p.w + moveDist > 0) {
|
|
3127
|
+
if (((_l = elem.operation) == null ? void 0 : _l.limitRatio) === true) {
|
|
3128
|
+
p.h = p.h + moveDist / elem.w * elem.h;
|
|
3129
|
+
}
|
|
3076
3130
|
p.w = p.w + moveDist;
|
|
3077
3131
|
p.x = centerX - p.w / 2;
|
|
3078
3132
|
p.y = centerY - p.h / 2;
|
|
@@ -3081,6 +3135,10 @@ var iDrawCore = function() {
|
|
|
3081
3135
|
if (elem.w - moveX > 0) {
|
|
3082
3136
|
p.x += moveX;
|
|
3083
3137
|
p.w -= moveX;
|
|
3138
|
+
if (((_m = elem.operation) == null ? void 0 : _m.limitRatio) === true) {
|
|
3139
|
+
p.h -= moveX / elem.w * elem.h;
|
|
3140
|
+
p.y += moveX / elem.w * elem.h / 2;
|
|
3141
|
+
}
|
|
3084
3142
|
}
|
|
3085
3143
|
}
|
|
3086
3144
|
break;
|
|
@@ -3150,7 +3208,7 @@ var iDrawCore = function() {
|
|
|
3150
3208
|
wrapper.controllers.bottom,
|
|
3151
3209
|
wrapper.controllers.bottomRight
|
|
3152
3210
|
];
|
|
3153
|
-
|
|
3211
|
+
const directionNames = [
|
|
3154
3212
|
"right",
|
|
3155
3213
|
"top-right",
|
|
3156
3214
|
"top",
|
|
@@ -3370,7 +3428,7 @@ var iDrawCore = function() {
|
|
|
3370
3428
|
_updateSelectedElementListWrapper(data, opts) {
|
|
3371
3429
|
const { selectedUUIDList } = opts;
|
|
3372
3430
|
const wrapperList = [];
|
|
3373
|
-
data.elements.forEach((elem
|
|
3431
|
+
data.elements.forEach((elem) => {
|
|
3374
3432
|
if (selectedUUIDList == null ? void 0 : selectedUUIDList.includes(elem.uuid)) {
|
|
3375
3433
|
const wrapper = this._createSelectedElementWrapper(elem, opts);
|
|
3376
3434
|
wrapperList.push(wrapper);
|
|
@@ -3441,7 +3499,7 @@ var iDrawCore = function() {
|
|
|
3441
3499
|
rotate: {
|
|
3442
3500
|
x: elem.x + elem.w / 2,
|
|
3443
3501
|
y: elem.y - controllerSize - (controllerSize * 2 + rotateLimit) - bw,
|
|
3444
|
-
invisible: ((_k = elem == null ? void 0 : elem.operation) == null ? void 0 : _k.
|
|
3502
|
+
invisible: ((_k = elem == null ? void 0 : elem.operation) == null ? void 0 : _k.disableRotate) === true
|
|
3445
3503
|
}
|
|
3446
3504
|
},
|
|
3447
3505
|
lineWidth,
|
|
@@ -3664,14 +3722,10 @@ var iDrawCore = function() {
|
|
|
3664
3722
|
core[_emitChangeData]();
|
|
3665
3723
|
core[_draw]({ resourceChangeUUIDs });
|
|
3666
3724
|
}
|
|
3667
|
-
function selectElementByIndex(core, index
|
|
3725
|
+
function selectElementByIndex(core, index) {
|
|
3668
3726
|
if (core[_data].elements[index]) {
|
|
3669
3727
|
const uuid = core[_data].elements[index].uuid;
|
|
3670
|
-
|
|
3671
|
-
core[_engine].temp.set("mode", Mode.SELECT_ELEMENT);
|
|
3672
|
-
} else {
|
|
3673
|
-
core[_engine].temp.set("mode", Mode.NULL);
|
|
3674
|
-
}
|
|
3728
|
+
core[_engine].temp.set("mode", Mode.NULL);
|
|
3675
3729
|
if (typeof uuid === "string") {
|
|
3676
3730
|
core[_engine].temp.set("selectedUUID", uuid);
|
|
3677
3731
|
core[_engine].temp.set("selectedUUIDList", []);
|
|
@@ -3679,10 +3733,28 @@ var iDrawCore = function() {
|
|
|
3679
3733
|
core[_draw]();
|
|
3680
3734
|
}
|
|
3681
3735
|
}
|
|
3682
|
-
function selectElement(core, uuid
|
|
3736
|
+
function selectElement(core, uuid) {
|
|
3737
|
+
const index = core[_engine].helper.getElementIndexByUUID(uuid);
|
|
3738
|
+
if (typeof index === "number" && index >= 0) {
|
|
3739
|
+
core.selectElementByIndex(index);
|
|
3740
|
+
}
|
|
3741
|
+
}
|
|
3742
|
+
function cancelElementByIndex(core, index) {
|
|
3743
|
+
if (core[_data].elements[index]) {
|
|
3744
|
+
const uuid = core[_data].elements[index].uuid;
|
|
3745
|
+
const selectedUUID = core[_engine].temp.get("selectedUUID");
|
|
3746
|
+
if (typeof uuid === "string" && uuid === selectedUUID) {
|
|
3747
|
+
core[_engine].temp.set("mode", Mode.NULL);
|
|
3748
|
+
core[_engine].temp.set("selectedUUID", null);
|
|
3749
|
+
core[_engine].temp.set("selectedUUIDList", []);
|
|
3750
|
+
}
|
|
3751
|
+
core[_draw]();
|
|
3752
|
+
}
|
|
3753
|
+
}
|
|
3754
|
+
function cancelElement(core, uuid, opts) {
|
|
3683
3755
|
const index = core[_engine].helper.getElementIndexByUUID(uuid);
|
|
3684
3756
|
if (typeof index === "number" && index >= 0) {
|
|
3685
|
-
core.
|
|
3757
|
+
core.cancelElementByIndex(index, opts);
|
|
3686
3758
|
}
|
|
3687
3759
|
}
|
|
3688
3760
|
function moveUpElement(core, uuid) {
|
|
@@ -4337,10 +4409,10 @@ var iDrawCore = function() {
|
|
|
4337
4409
|
drawElementListWrappers(helperCtx, helperConfig);
|
|
4338
4410
|
this[_board].draw();
|
|
4339
4411
|
};
|
|
4340
|
-
this[_renderer].on("drawFrame", (
|
|
4412
|
+
this[_renderer].on("drawFrame", () => {
|
|
4341
4413
|
drawFrame();
|
|
4342
4414
|
});
|
|
4343
|
-
this[_renderer].on("drawFrameComplete", (
|
|
4415
|
+
this[_renderer].on("drawFrameComplete", () => {
|
|
4344
4416
|
drawFrame();
|
|
4345
4417
|
});
|
|
4346
4418
|
this[_element] = new Element(this[_board].getContext());
|
|
@@ -4381,11 +4453,17 @@ var iDrawCore = function() {
|
|
|
4381
4453
|
getElementByIndex(index) {
|
|
4382
4454
|
return getElementByIndex(this, index);
|
|
4383
4455
|
}
|
|
4384
|
-
selectElementByIndex(index
|
|
4385
|
-
return selectElementByIndex(this, index
|
|
4456
|
+
selectElementByIndex(index) {
|
|
4457
|
+
return selectElementByIndex(this, index);
|
|
4458
|
+
}
|
|
4459
|
+
selectElement(uuid) {
|
|
4460
|
+
return selectElement(this, uuid);
|
|
4461
|
+
}
|
|
4462
|
+
cancelElementByIndex(index, opts) {
|
|
4463
|
+
return cancelElementByIndex(this, index);
|
|
4386
4464
|
}
|
|
4387
|
-
|
|
4388
|
-
return
|
|
4465
|
+
cancelElement(uuid, opts) {
|
|
4466
|
+
return cancelElement(this, uuid, opts);
|
|
4389
4467
|
}
|
|
4390
4468
|
moveUpElement(uuid) {
|
|
4391
4469
|
return moveUpElement(this, uuid);
|
package/dist/index.global.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var iDrawCore=function(){"use strict";function t(t,e){let i=-1;return function(...n){i>0||(i=setTimeout((()=>{t(...n),i=-1}),e))}}function e(t){return"string"==typeof t&&/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)}function i(){function t(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return`${t()}${t()}-${t()}-${t()}-${t()}-${t()}${t()}${t()}`}function n(t){return function t(e){const i=(n=e,Object.prototype.toString.call(n).replace(/[\]|\[]{1,1}/gi,"").split(" ")[1]);var n;if(["Null","Number","String","Boolean","Undefined"].indexOf(i)>=0)return e;if("Array"===i){const i=[];return e.forEach((e=>{i.push(t(e))})),i}if("Object"===i){const i={};return Object.keys(e).forEach((n=>{i[n]=t(e[n])})),i}}(t)}function s(t){return(Object.prototype.toString.call(t)||"").replace(/(\[object|\])/gi,"").trim()}const o={type(t,e){const i=s(t);return!0===e?i.toLocaleLowerCase():i},array:t=>"Array"===s(t),json:t=>"Object"===s(t),function:t=>"Function"===s(t),asyncFunction:t=>"AsyncFunction"===s(t),string:t=>"String"===s(t),number:t=>"Number"===s(t),undefined:t=>"Undefined"===s(t),null:t=>"Null"===s(t),promise:t=>"Promise"===s(t)};var r=globalThis&&globalThis.__awaiter||function(t,e,i,n){return new(i||(i=Promise))((function(s,o){function r(t){try{a(n.next(t))}catch(t){o(t)}}function l(t){try{a(n.throw(t))}catch(t){o(t)}}function a(t){var e;t.done?s(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(r,l)}a((n=n.apply(t,e||[])).next())}))};const{Image:l}=window;function a(t){return new Promise(((e,i)=>{const n=new l;n.crossOrigin="anonymous",n.onload=function(){e(n)},n.onabort=i,n.onerror=i,n.src=t}))}function h(t){return r(this,void 0,void 0,(function*(){const e=yield function(t){return new Promise(((e,i)=>{const n=new Blob([t],{type:"image/svg+xml;charset=utf-8"}),s=new FileReader;s.readAsDataURL(n),s.onload=function(t){var i;const n=null===(i=null==t?void 0:t.target)||void 0===i?void 0:i.result;e(n)},s.onerror=function(t){i(t)}}))}(t);return yield a(e)}))}function c(t,e){return r(this,void 0,void 0,(function*(){t=t.replace(/\&/gi,"&");const i=yield function(t,e){const{width:i,height:n}=e;return new Promise(((e,s)=>{const o=new Blob([`\n <svg xmlns="http://www.w3.org/2000/svg" width="${i||""}" height = "${n||""}">\n <foreignObject width="100%" height="100%">\n <div xmlns = "http://www.w3.org/1999/xhtml">\n ${t}\n </div>\n </foreignObject>\n </svg>\n `],{type:"image/svg+xml;charset=utf-8"}),r=new FileReader;r.readAsDataURL(o),r.onload=function(t){var i;const n=null===(i=null==t?void 0:t.target)||void 0===i?void 0:i.result;e(n)},r.onerror=function(t){s(t)}}))}(t,e);return yield a(i)}))}let d=class{constructor(t,e){this._opts=e,this._ctx=t,this._transform={scale:1,scrollX:0,scrollY:0}}getContext(){return this._ctx}resetSize(t){this._opts=Object.assign(Object.assign({},this._opts),t)}calcDeviceNum(t){return t*this._opts.devicePixelRatio}calcScreenNum(t){return t/this._opts.devicePixelRatio}getSize(){return{width:this._opts.width,height:this._opts.height,contextWidth:this._opts.contextWidth,contextHeight:this._opts.contextHeight,devicePixelRatio:this._opts.devicePixelRatio}}setTransform(t){this._transform=Object.assign(Object.assign({},this._transform),t)}getTransform(){return{scale:this._transform.scale,scrollX:this._transform.scrollX,scrollY:this._transform.scrollY}}setFillStyle(t){this._ctx.fillStyle=t}fill(t){return this._ctx.fill(t||"nonzero")}arc(t,e,i,n,s,o){return this._ctx.arc(this._doSize(t),this._doSize(e),this._doSize(i),n,s,o)}rect(t,e,i,n){return this._ctx.rect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(n))}fillRect(t,e,i,n){return this._ctx.fillRect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(n))}clearRect(t,e,i,n){return this._ctx.clearRect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(n))}beginPath(){return this._ctx.beginPath()}closePath(){return this._ctx.closePath()}lineTo(t,e){return this._ctx.lineTo(this._doSize(t),this._doSize(e))}moveTo(t,e){return this._ctx.moveTo(this._doSize(t),this._doSize(e))}arcTo(t,e,i,n,s){return this._ctx.arcTo(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(n),this._doSize(s))}setLineWidth(t){return this._ctx.lineWidth=this._doSize(t)}setLineDash(t){return this._ctx.setLineDash(t.map((t=>this._doSize(t))))}isPointInPath(t,e){return this._ctx.isPointInPath(this._doX(t),this._doY(e))}isPointInPathWithoutScroll(t,e){return this._ctx.isPointInPath(this._doSize(t),this._doSize(e))}setStrokeStyle(t){this._ctx.strokeStyle=t}stroke(){return this._ctx.stroke()}translate(t,e){return this._ctx.translate(this._doSize(t),this._doSize(e))}rotate(t){return this._ctx.rotate(t)}drawImage(...t){const e=t[0],i=t[1],n=t[2],s=t[3],o=t[4],r=t[t.length-4],l=t[t.length-3],a=t[t.length-2],h=t[t.length-1];return 9===t.length?this._ctx.drawImage(e,this._doSize(i),this._doSize(n),this._doSize(s),this._doSize(o),this._doSize(r),this._doSize(l),this._doSize(a),this._doSize(h)):this._ctx.drawImage(e,this._doSize(r),this._doSize(l),this._doSize(a),this._doSize(h))}createPattern(t,e){return this._ctx.createPattern(t,e)}measureText(t){return this._ctx.measureText(t)}setTextAlign(t){this._ctx.textAlign=t}fillText(t,e,i,n){return void 0!==n?this._ctx.fillText(t,this._doSize(e),this._doSize(i),this._doSize(n)):this._ctx.fillText(t,this._doSize(e),this._doSize(i))}strokeText(t,e,i,n){return void 0!==n?this._ctx.strokeText(t,this._doSize(e),this._doSize(i),this._doSize(n)):this._ctx.strokeText(t,this._doSize(e),this._doSize(i))}setFont(t){const e=[];"bold"===t.fontWeight&&e.push(`${t.fontWeight}`),e.push(`${this._doSize(t.fontSize||12)}px`),e.push(`${t.fontFamily||"sans-serif"}`),this._ctx.font=`${e.join(" ")}`}setTextBaseline(t){this._ctx.textBaseline=t}setGlobalAlpha(t){this._ctx.globalAlpha=t}save(){this._ctx.save()}restore(){this._ctx.restore()}scale(t,e){this._ctx.scale(t,e)}setShadowColor(t){this._ctx.shadowColor=t}setShadowOffsetX(t){this._ctx.shadowOffsetX=this._doSize(t)}setShadowOffsetY(t){this._ctx.shadowOffsetY=this._doSize(t)}setShadowBlur(t){this._ctx.shadowBlur=this._doSize(t)}ellipse(t,e,i,n,s,o,r,l){this._ctx.ellipse(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(n),s,o,r,l)}_doSize(t){return this._opts.devicePixelRatio*t}_doX(t){const{scale:e,scrollX:i}=this._transform,n=(t-i)/e;return this._doSize(n)}_doY(t){const{scale:e,scrollY:i}=this._transform,n=(t-i)/e;return this._doSize(n)}};function u(t){return"number"==typeof t&&(t>0||t<=0)}function g(t){return"number"==typeof t&&t>=0}function m(t){return"string"==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${t}`)}function f(t){return"string"==typeof t&&/^(data:image\/)/.test(`${t}`)}const p={x:function(t){return u(t)},y:function(t){return u(t)},w:g,h:function(t){return"number"==typeof t&&t>=0},angle:function(t){return"number"==typeof t&&t>=-360&&t<=360},number:u,borderWidth:function(t){return g(t)},borderRadius:function(t){return u(t)&&t>=0},color:function(t){return e(t)},imageSrc:function(t){return f(t)||m(t)},imageURL:m,imageBase64:f,svg:function(t){return"string"==typeof t&&/^(<svg[\s]{1,}|<svg>)/i.test(`${t}`.trim())&&/<\/[\s]{0,}svg>$/i.test(`${t}`.trim())},html:function(t){let e=!1;if("string"==typeof t){let i=document.createElement("div");i.innerHTML=t,i.children.length>0&&(e=!0),i=null}return e},text:function(t){return"string"==typeof t},fontSize:function(t){return u(t)&&t>0},lineHeight:function(t){return u(t)&&t>0},textAlign:function(t){return["center","left","right"].includes(t)},fontFamily:function(t){return"string"==typeof t&&t.length>0},fontWeight:function(t){return["bold"].includes(t)},strokeWidth:function(t){return u(t)&&t>0}};function _(t={}){const{borderColor:e,borderRadius:i,borderWidth:n}=t;return!(t.hasOwnProperty("borderColor")&&!p.color(e))&&(!(t.hasOwnProperty("borderRadius")&&!p.number(i))&&!(t.hasOwnProperty("borderWidth")&&!p.number(n)))}const v={attrs:function(t){const{x:e,y:i,w:n,h:s,angle:o}=t;return!!(p.x(e)&&p.y(i)&&p.w(n)&&p.h(s)&&p.angle(o))&&(o>=-360&&o<=360)},textDesc:function(t){const{text:e,color:i,fontSize:n,lineHeight:s,fontFamily:o,textAlign:r,fontWeight:l,bgColor:a,strokeWidth:h,strokeColor:c}=t;return!!p.text(e)&&(!!p.color(i)&&(!!p.fontSize(n)&&(!(t.hasOwnProperty("bgColor")&&!p.color(a))&&(!(t.hasOwnProperty("fontWeight")&&!p.fontWeight(l))&&(!(t.hasOwnProperty("lineHeight")&&!p.lineHeight(s))&&(!(t.hasOwnProperty("fontFamily")&&!p.fontFamily(o))&&(!(t.hasOwnProperty("textAlign")&&!p.textAlign(r))&&(!(t.hasOwnProperty("strokeWidth")&&!p.strokeWidth(h))&&(!(t.hasOwnProperty("strokeColor")&&!p.color(c))&&!!_(t))))))))))},rectDesc:function(t){const{bgColor:e}=t;return!(t.hasOwnProperty("bgColor")&&!p.color(e))&&!!_(t)},circleDesc:function(t){const{bgColor:e,borderColor:i,borderWidth:n}=t;return!(t.hasOwnProperty("bgColor")&&!p.color(e))&&(!(t.hasOwnProperty("borderColor")&&!p.color(i))&&!(t.hasOwnProperty("borderWidth")&&!p.number(n)))},imageDesc:function(t){const{src:e}=t;return!!p.imageSrc(e)},svgDesc:function(t){const{svg:e}=t;return!!p.svg(e)},htmlDesc:function(t){const{html:e}=t;return!!p.html(e)}},x={is:p,check:v,delay:function(t){return new Promise((e=>{setTimeout((()=>{e()}),t)}))},compose:function(t){return function(e,i){return function n(s){let o=t[s];s===t.length&&i&&(o=i);if(!o)return Promise.resolve();try{return Promise.resolve(o(e,n.bind(null,s+1)))}catch(t){return Promise.reject(t)}}(0)}},throttle:t,loadImage:a,loadSVG:h,loadHTML:c,downloadImageFromCanvas:function(t,e){const{filename:i,type:n="image/jpeg"}=e,s=t.toDataURL(n),o=document.createElement("a");o.href=s,o.download=i;const r=document.createEvent("MouseEvents");r.initEvent("click",!0,!1),o.dispatchEvent(r)},toColorHexStr:function(t){return"#"+t.toString(16)},toColorHexNum:function(t){return parseInt(t.replace(/^\#/,"0x"))},isColorStr:e,createUUID:i,istype:o,deepClone:n,Context:d};class S{constructor(){this._listeners=new Map}on(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);null==i||i.push(e),this._listeners.set(t,i||[])}else this._listeners.set(t,[e])}off(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);if(Array.isArray(i))for(let t=0;t<(null==i?void 0:i.length);t++)if(i[t]===e){i.splice(t,1);break}this._listeners.set(t,i||[])}}trigger(t,e){const i=this._listeners.get(t);return!!Array.isArray(i)&&(i.forEach((t=>{t(e)})),!0)}has(t){if(this._listeners.has(t)){const e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1}}class y{constructor(t,e){this._isMoving=!1,this._temp=new class{constructor(){this._temp={prevClickPoint:null,isHoverCanvas:!1,isDragCanvas:!1,statusMap:{canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}}}set(t,e){this._temp[t]=e}get(t){return this._temp[t]}clear(){this._temp={prevClickPoint:null,isHoverCanvas:!1,isDragCanvas:!1,statusMap:{canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}}}},this._container=window,this._canvas=t,this._isMoving=!1,this._initEvent(),this._event=new S}setStatusMap(t){this._temp.set("statusMap",t)}on(t,e){this._event.on(t,e)}off(t,e){this._event.off(t,e)}_initEvent(){const t=this._canvas,e=this._container;e.addEventListener("mousemove",this._listenWindowMove.bind(this),!1),e.addEventListener("mouseup",this._listenWindowMoveEnd.bind(this),!1),t.addEventListener("mousemove",this._listenHover.bind(this),!1),t.addEventListener("mousedown",this._listenMoveStart.bind(this),!1),t.addEventListener("mousemove",this._listenMove.bind(this),!1),t.addEventListener("mouseup",this._listenMoveEnd.bind(this),!1),t.addEventListener("click",this._listenCanvasClick.bind(this),!1),t.addEventListener("wheel",this._listenCanvasWheel.bind(this),!1),t.addEventListener("mousedown",this._listenCanvasMoveStart.bind(this),!0),t.addEventListener("mouseup",this._listenCanvasMoveEnd.bind(this),!0),t.addEventListener("mouseover",this._listenCanvasMoveOver.bind(this),!0),t.addEventListener("mouseleave",this._listenCanvasMoveLeave.bind(this),!0),this._initParentEvent()}_initParentEvent(){try{let t=window;const e=t.origin;for(;t.self!==t.top&&(t.self!==t.parent&&t.origin===e&&t.parent.window.addEventListener("mousemove",this._listSameOriginParentWindow.bind(this),!1),t=t.parent,t););}catch(t){console.warn(t)}}_listenHover(t){t.preventDefault();const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.has("hover")&&this._event.trigger("hover",e),this._isMoving=!0}_listenMoveStart(t){t.preventDefault();const e=this._getPosition(t);this._isVaildPoint(e)&&(this._event.has("point")&&this._event.trigger("point",e),this._event.has("moveStart")&&this._event.trigger("moveStart",e)),this._isMoving=!0}_listenMove(t){if(t.preventDefault(),t.stopPropagation(),this._event.has("move")&&!0===this._isMoving){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("move",e)}}_listenMoveEnd(t){if(t.preventDefault(),this._event.has("moveEnd")){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("moveEnd",e)}this._isMoving=!1}_listSameOriginParentWindow(){this._temp.get("isHoverCanvas")&&this._event.has("leave")&&this._event.trigger("leave",void 0),this._temp.get("isDragCanvas")&&this._event.has("moveEnd")&&this._event.trigger("moveEnd",{x:NaN,y:NaN}),this._isMoving=!1,this._temp.set("isDragCanvas",!1),this._temp.set("isHoverCanvas",!1)}_listenCanvasMoveStart(){this._temp.get("isHoverCanvas")&&this._temp.set("isDragCanvas",!0)}_listenCanvasMoveEnd(){this._temp.set("isDragCanvas",!1)}_listenCanvasMoveOver(){this._temp.set("isHoverCanvas",!0)}_listenCanvasMoveLeave(){this._temp.set("isHoverCanvas",!1),this._event.has("leave")&&this._event.trigger("leave",void 0)}_listenWindowMove(t){if(!0===this._temp.get("isDragCanvas")&&(t.preventDefault(),t.stopPropagation(),this._event.has("move")&&!0===this._isMoving)){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("move",e)}}_listenWindowMoveEnd(t){if(!0!=!this._temp.get("isDragCanvas")){if(t.preventDefault(),this._event.has("moveEnd")){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("moveEnd",e)}this._temp.set("isDragCanvas",!1),this._isMoving=!1}}_listenCanvasWheel(t){this._event.has("wheelX")&&(t.deltaX>0||t.deltaX<0)&&this._event.trigger("wheelX",t.deltaX),this._event.has("wheelY")&&(t.deltaY>0||t.deltaY<0)&&this._event.trigger("wheelY",t.deltaY);const{canScrollYNext:e,canScrollYPrev:i}=this._temp.get("statusMap");(t.deltaX>0&&t.deltaX<0||t.deltaY>0&&!0===e||t.deltaY<0&&!0===i)&&t.preventDefault()}_listenCanvasClick(t){t.preventDefault();const e=this._getPosition(t),i=Date.now();if(this._isVaildPoint(e)){const t=this._temp.get("prevClickPoint");t&&i-t.t<=500&&Math.abs(t.x-e.x)<=5&&Math.abs(t.y-e.y)<=5?this._event.has("doubleClick")&&this._event.trigger("doubleClick",{x:e.x,y:e.y}):this._temp.set("prevClickPoint",{x:e.x,y:e.y,t:i})}}_getPosition(t){const e=this._canvas;let i=0,n=0;if(t&&t.touches&&t.touches.length>0){const e=t.touches[0];e&&(i=e.clientX,n=e.clientY)}else i=t.clientX,n=t.clientY;return{x:i-e.getBoundingClientRect().left,y:n-e.getBoundingClientRect().top,t:Date.now()}}_isVaildPoint(t){return b(t.x)&&b(t.y)}}function b(t){return t>0||t<0||0===t}const w={lineWidth:12,color:"#a0a0a0"};class E{constructor(t,e){this._displayCtx=t,this._opts=this._getOpts(e)}draw(t){const{width:e,height:i}=this._opts,n=this.calc(t),s=this._displayCtx;n.xSize>0&&(s.globalAlpha=.2,s.fillStyle=n.color,s.fillRect(0,this._doSize(i-n.lineSize),this._doSize(e),this._doSize(n.lineSize)),s.globalAlpha=1,C(s,{x:this._doSize(n.translateX),y:this._doSize(i-n.lineSize),w:this._doSize(n.xSize),h:this._doSize(n.lineSize),r:this._doSize(n.lineSize/2),color:n.color})),n.ySize>0&&(s.globalAlpha=.2,s.fillStyle=n.color,s.fillRect(this._doSize(e-n.lineSize),0,this._doSize(n.lineSize),this._doSize(i)),s.globalAlpha=1,C(s,{x:this._doSize(e-n.lineSize),y:this._doSize(n.translateY),w:this._doSize(n.lineSize),h:this._doSize(n.ySize),r:this._doSize(n.lineSize/2),color:n.color})),s.globalAlpha=1}resetSize(t){this._opts=Object.assign(Object.assign({},this._opts),t)}isPointAtScrollY(t){const{width:e,height:i,scrollConfig:n}=this._opts,s=this._displayCtx;return s.beginPath(),s.rect(this._doSize(e-n.lineWidth),0,this._doSize(n.lineWidth),this._doSize(i)),s.closePath(),!!s.isPointInPath(this._doSize(t.x),this._doSize(t.y))}isPointAtScrollX(t){const{width:e,height:i,scrollConfig:n}=this._opts,s=this._displayCtx;return s.beginPath(),s.rect(0,this._doSize(i-n.lineWidth),this._doSize(e-n.lineWidth),this._doSize(n.lineWidth)),s.closePath(),!!s.isPointInPath(this._doSize(t.x),this._doSize(t.y))}getLineWidth(){return this._opts.scrollConfig.lineWidth}calc(t){const{width:e,height:i,scrollConfig:n}=this._opts,s=2.5*n.lineWidth,o=n.lineWidth;let r=0,l=0;t.left<=0&&t.right<=0&&(r=Math.max(s,e-(Math.abs(t.left)+Math.abs(t.right))),r>=e&&(r=0)),(t.top<=0||t.bottom<=0)&&(l=Math.max(s,i-(Math.abs(t.top)+Math.abs(t.bottom))),l>=i&&(l=0));let a=0;r>0&&(a=r/2+(e-r)*Math.abs(t.left)/(Math.abs(t.left)+Math.abs(t.right)),a=Math.min(Math.max(0,a-r/2),e-r));let h=0;l>0&&(h=l/2+(i-l)*Math.abs(t.top)/(Math.abs(t.top)+Math.abs(t.bottom)),h=Math.min(Math.max(0,h-l/2),i-l));return{lineSize:o,xSize:r,ySize:l,translateY:h,translateX:a,color:this._opts.scrollConfig.color}}_doSize(t){return t*this._opts.devicePixelRatio}_getOpts(t){const i=Object.assign({scrollConfig:w},t);return i.scrollConfig||(i.scrollConfig=w),i.scrollConfig.lineWidth>0||(i.scrollConfig.lineWidth=w.lineWidth),i.scrollConfig.lineWidth=Math.max(i.scrollConfig.lineWidth,w.lineWidth),!0!==e(i.scrollConfig.color)&&(i.scrollConfig.color=i.scrollConfig.color),i}}function C(t,e){const{x:i,y:n,w:s,h:o,color:r}=e;let l=e.r;l=Math.min(l,s/2,o/2),(s<2*l||o<2*l)&&(l=0),t.beginPath(),t.moveTo(i+l,n),t.arcTo(i+s,n,i+s,n+o,l),t.arcTo(i+s,n+o,i,n+o,l),t.arcTo(i,n+o,i,n,l),t.arcTo(i,n,i+s,n,l),t.closePath(),t.fillStyle=r,t.fill()}const P=Symbol("_opts"),L=Symbol("_ctx");class D{constructor(t,e){this[P]=e,this[L]=t}resetSize(t){this[P]=Object.assign(Object.assign({},this[P]),t)}calcScreen(){const t=this[L].getTransform().scale,{width:e,height:i,contextWidth:n,contextHeight:s,devicePixelRatio:o}=this[P];let r=!0,l=!0,a=!0,h=!0;n*t<=e&&(this[L].setTransform({scrollX:(e-n*t)/2}),r=!1,l=!1),s*t<=i&&(this[L].setTransform({scrollY:(i-s*t)/2}),a=!1,h=!1),n*t>=e&&this[L].getTransform().scrollX>0&&(this[L].setTransform({scrollX:0}),r=!1),s*t>=i&&this[L].getTransform().scrollY>0&&(this[L].setTransform({scrollY:0}),a=!1);const{scrollX:c,scrollY:d}=this[L].getTransform();c<0&&Math.abs(c)>Math.abs(n*t-e)&&(this[L].setTransform({scrollX:0-Math.abs(n*t-e)}),l=!1),d<0&&Math.abs(d)>Math.abs(s*t-i)&&(this[L].setTransform({scrollY:0-Math.abs(s*t-i)}),h=!1);const{scrollX:u,scrollY:g}=this[L].getTransform();return{size:{x:u*t,y:g*t,w:n*t,h:s*t},position:{top:g,bottom:i-(s*t+g),left:u,right:e-(n*t+u)},deviceSize:{x:u*o,y:g*o,w:n*o*t,h:s*o*t},width:this[P].width,height:this[P].height,devicePixelRatio:this[P].devicePixelRatio,canScrollYPrev:a,canScrollYNext:h,canScrollXPrev:r,canScrollXNext:l}}calcScreenScroll(t,e,i,n,s){let o=t,r=n-i;t<=0&&e<=0&&(r=Math.abs(t)+Math.abs(e));let l=1;return r>0&&(l=r/(n-i)),o=0-l*s,o}}const M=Symbol("_canvas"),z=Symbol("_displayCanvas"),I=Symbol("_helperCanvas"),T=Symbol("_mount"),k=Symbol("_opts"),W=Symbol("_hasRendered"),U=Symbol("_ctx"),R=Symbol("_helperCtx"),O=Symbol("_watcher"),A=Symbol("_render"),F=Symbol("_parsePrivateOptions"),Y=Symbol("_scroller"),N=Symbol("_initEvent"),X=Symbol("_doScrollX"),H=Symbol("_doScrollY"),B=Symbol("_doMoveScroll"),j=Symbol("_resetContext"),$=Symbol("_screen");var G;const{throttle:Q,Context:V}=x;class Z{constructor(t,e){this[G]=!1,this[T]=t,this[M]=document.createElement("canvas"),this[I]=document.createElement("canvas"),this[z]=document.createElement("canvas"),this[T].appendChild(this[z]),this[k]=this[F](e);const i=this[M].getContext("2d"),n=this[z].getContext("2d"),s=this[I].getContext("2d");this[U]=new V(i,this[k]),this[R]=new V(s,this[k]),this[$]=new D(this[U],this[k]),this[O]=new y(this[z],this[U]),this[Y]=new E(n,{width:e.width,height:e.height,devicePixelRatio:e.devicePixelRatio||1,scrollConfig:e.scrollConfig}),this[A]()}getDisplayContext2D(){return this[z].getContext("2d")}getOriginContext2D(){return this[U].getContext()}getHelperContext2D(){return this[R].getContext()}getContext(){return this[U]}getHelperContext(){return this[R]}scale(t){t>0&&(this[U].setTransform({scale:t}),this[R].setTransform({scale:t}));const{position:e,size:i}=this[$].calcScreen();return{position:e,size:i}}scrollX(t){this[O].setStatusMap({canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}),(t>=0||t<0)&&(this[U].setTransform({scrollX:t}),this[R].setTransform({scrollX:t}));const{position:e,size:i,canScrollXNext:n,canScrollYNext:s,canScrollXPrev:o,canScrollYPrev:r}=this[$].calcScreen();return this[O].setStatusMap({canScrollYPrev:r,canScrollYNext:s,canScrollXPrev:o,canScrollXNext:n}),{position:e,size:i}}scrollY(t){this[O].setStatusMap({canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}),(t>=0||t<0)&&(this[U].setTransform({scrollY:t}),this[R].setTransform({scrollY:t}));const{position:e,size:i,canScrollXNext:n,canScrollYNext:s,canScrollXPrev:o,canScrollYPrev:r}=this[$].calcScreen();return this[O].setStatusMap({canScrollYPrev:r,canScrollYNext:s,canScrollXPrev:o,canScrollXNext:n}),{position:e,size:i}}getTransform(){return this[U].getTransform()}draw(){this.clear();const{position:t,deviceSize:e,size:i}=this[$].calcScreen(),n=this[z].getContext("2d");return null==n||n.drawImage(this[M],e.x,e.y,e.w,e.h),null==n||n.drawImage(this[I],e.x,e.y,e.w,e.h),!0===this[k].canScroll&&this[Y].draw(t),{position:t,size:i}}clear(){const t=this[z].getContext("2d");null==t||t.clearRect(0,0,this[z].width,this[z].height)}on(t,e){this[O].on(t,e)}off(t,e){this[O].off(t,e)}getScreenInfo(){return this[$].calcScreen()}setCursor(t){this[z].style.cursor=t}resetCursor(){this[z].style.cursor="auto"}resetSize(t){this[k]=Object.assign(Object.assign({},this[k]),t),this[j](),this[U].resetSize(t),this[R].resetSize(t),this[$].resetSize(t),this[Y].resetSize({width:this[k].width,height:this[k].height,devicePixelRatio:this[k].devicePixelRatio}),this.draw()}getScrollLineWidth(){let t=0;return!0===this[k].canScroll&&(t=this[Y].getLineWidth()),t}pointScreenToContext(t){const{scrollX:e,scrollY:i,scale:n}=this.getTransform();return{x:(t.x-e)/n,y:(t.y-i)/n}}pointContextToScreen(t){const{scrollX:e,scrollY:i,scale:n}=this.getTransform();return{x:t.x*n+e,y:t.y*n+i}}[(G=W,A)](){!0!==this[W]&&(this[j](),this[N](),this[W]=!0)}[j](){const{width:t,height:e,contextWidth:i,contextHeight:n,devicePixelRatio:s}=this[k];this[M].width=i*s,this[M].height=n*s,this[I].width=i*s,this[I].height=n*s,this[z].width=t*s,this[z].height=e*s,function(t,e){const i=function(t){const e={};return(t.getAttribute("style")||"").split(";").forEach((t=>{const i=t.split(":");i[0]&&"string"==typeof i[0]&&(e[i[0]]=i[1]||"")})),e}(t),n=Object.assign(Object.assign({},i),e),s=Object.keys(n);let o="";s.forEach((t=>{o+=`${t}:${n[t]||""};`})),t.setAttribute("style",o)}(this[z],{width:`${t}px`,height:`${e}px`})}[F](t){return Object.assign(Object.assign({},{devicePixelRatio:1}),t)}[N](){if(!0!==this[W]&&!0===this[k].canScroll){this.on("wheelX",Q((t=>{this[X](t)}),16)),this.on("wheelY",Q((t=>{this[H](t)}),16));let t=null;this.on("moveStart",Q((e=>{this[Y].isPointAtScrollX(e)?t="x":this[Y].isPointAtScrollY(e)&&(t="y")}),16)),this.on("move",Q((e=>{t&&this[B](t,e)}),16)),this.on("moveEnd",Q((e=>{t&&this[B](t,e),t=null}),16))}}[X](t,e){const{width:i}=this[k];let n=e;"number"==typeof n&&(n>0||n<=0)||(n=this[U].getTransform().scrollX);const{position:s}=this[$].calcScreen(),{xSize:o}=this[Y].calc(s),r=this[$].calcScreenScroll(s.left,s.right,o,i,t);this.scrollX(n+r),this.draw()}[H](t,e){const{height:i}=this[k];let n=e;"number"==typeof n&&(n>0||n<=0)||(n=this[U].getTransform().scrollY);const{position:s}=this[$].calcScreen(),{ySize:o}=this[Y].calc(s),r=this[$].calcScreenScroll(s.top,s.bottom,o,i,t);this.scrollY(n+r),this.draw()}[B](t,e){if(!t)return;const{position:i}=this[$].calcScreen(),{xSize:n,ySize:s}=this[Y].calc(i);"x"===t?this[X](e.x-n/2,0):"y"===t&&this[H](e.y-s/2,0)}}function q(t,e,i){const n=function(t){return{x:t.x+t.w/2,y:t.y+t.h/2}}(e);return function(t,e,i,n){e&&(i>0||i<0)&&(t.translate(e.x,e.y),t.rotate(i),t.translate(-e.x,-e.y));n(t),e&&(i>0||i<0)&&(t.translate(e.x,e.y),t.rotate(-i),t.translate(-e.x,-e.y))}(t,n,(e.angle||0)/180*Math.PI||0,i)}function J(t){t.setFillStyle("#000000"),t.setStrokeStyle("#000000"),t.setLineDash([]),t.setGlobalAlpha(1),t.setShadowColor("#00000000"),t.setShadowOffsetX(0),t.setShadowOffsetY(0),t.setShadowBlur(0)}function K(t,i,n){J(t),function(t,i){J(t),q(t,i,(()=>{if(!(i.desc.borderWidth&&i.desc.borderWidth>0))return;const n=i.desc.borderWidth;let s="#000000";!0===e(i.desc.borderColor)&&(s=i.desc.borderColor);const o=i.x-n/2,r=i.y-n/2,l=i.w+n,a=i.h+n;let h=i.desc.borderRadius||0;h=Math.min(h,l/2,a/2),h<l/2&&h<a/2&&(h+=n/2);const{desc:c}=i;void 0!==c.shadowColor&&e(c.shadowColor)&&t.setShadowColor(c.shadowColor),void 0!==c.shadowOffsetX&&p.number(c.shadowOffsetX)&&t.setShadowOffsetX(c.shadowOffsetX),void 0!==c.shadowOffsetY&&p.number(c.shadowOffsetY)&&t.setShadowOffsetY(c.shadowOffsetY),void 0!==c.shadowBlur&&p.number(c.shadowBlur)&&t.setShadowBlur(c.shadowBlur),t.beginPath(),t.setLineWidth(n),t.setStrokeStyle(s),t.moveTo(o+h,r),t.arcTo(o+l,r,o+l,r+a,h),t.arcTo(o+l,r+a,o,r+a,h),t.arcTo(o,r+a,o,r,h),t.arcTo(o,r,o+l,r,h),t.closePath(),t.stroke()}))}(t,i),J(t),q(t,i,(()=>{const{x:e,y:s,w:r,h:l}=i;let a=i.desc.borderRadius||0;a=Math.min(a,r/2,l/2),(r<2*a||l<2*a)&&(a=0),t.beginPath(),t.moveTo(e+a,s),t.arcTo(e+r,s,e+r,s+l,a),t.arcTo(e+r,s+l,e,s+l,a),t.arcTo(e,s+l,e,s,a),t.arcTo(e,s,e+r,s,a),t.closePath(),("string"==typeof n||["CanvasPattern"].includes(o.type(n)))&&t.setFillStyle(n),t.fill()}))}function tt(t,e){K(t,e,e.desc.bgColor)}function et(t,e,i){const n=i.getContent(e.uuid);q(t,e,(()=>{n&&t.drawImage(n,e.x,e.y,e.w,e.h)}))}function it(t,e,i){const n=i.getContent(e.uuid);q(t,e,(()=>{n&&t.drawImage(n,e.x,e.y,e.w,e.h)}))}function nt(t,e,i){const n=i.getContent(e.uuid);q(t,e,(()=>{n&&t.drawImage(n,e.x,e.y,e.w,e.h)}))}function st(t,i,n){J(t),K(t,i,i.desc.bgColor||"transparent"),q(t,i,(()=>{const n=Object.assign({fontSize:12,fontFamily:"sans-serif",textAlign:"center"},i.desc);t.setFillStyle(i.desc.color),t.setTextBaseline("top"),t.setFont({fontWeight:n.fontWeight,fontSize:n.fontSize,fontFamily:n.fontFamily});const s=n.text.replace(/\r\n/gi,"\n"),o=n.lineHeight||n.fontSize,r=s.split("\n"),l=[];let a=0;r.forEach(((e,n)=>{let s="";if(e.length>0){for(let h=0;h<e.length&&(t.measureText(s+(e[h]||"")).width<t.calcDeviceNum(i.w)?s+=e[h]||"":(l.push({text:s,width:t.calcScreenNum(t.measureText(s).width)}),s=e[h]||"",a++),!((a+1)*o>i.h));h++)if(e.length-1===h&&(a+1)*o<i.h){l.push({text:s,width:t.calcScreenNum(t.measureText(s).width)}),n<r.length-1&&a++;break}}else l.push({text:"",width:0})}));{let s=i.y;l.length*o<i.h&&(s+=(i.h-l.length*o)/2),void 0!==n.textShadowColor&&e(n.textShadowColor)&&t.setShadowColor(n.textShadowColor),void 0!==n.textShadowOffsetX&&p.number(n.textShadowOffsetX)&&t.setShadowOffsetX(n.textShadowOffsetX),void 0!==n.textShadowOffsetY&&p.number(n.textShadowOffsetY)&&t.setShadowOffsetY(n.textShadowOffsetY),void 0!==n.textShadowBlur&&p.number(n.textShadowBlur)&&t.setShadowBlur(n.textShadowBlur),l.forEach(((e,r)=>{let l=i.x;"center"===n.textAlign?l=i.x+(i.w-e.width)/2:"right"===n.textAlign&&(l=i.x+(i.w-e.width)),t.fillText(e.text,l,s+o*r)})),J(t)}if(e(n.strokeColor)&&void 0!==n.strokeWidth&&n.strokeWidth>0){let e=i.y;l.length*o<i.h&&(e+=(i.h-l.length*o)/2),l.forEach(((s,r)=>{let l=i.x;"center"===n.textAlign?l=i.x+(i.w-s.width)/2:"right"===n.textAlign&&(l=i.x+(i.w-s.width)),void 0!==n.strokeColor&&t.setStrokeStyle(n.strokeColor),void 0!==n.strokeWidth&&n.strokeWidth>0&&t.setLineWidth(n.strokeWidth),t.strokeText(s.text,l,e+o*r)}))}}))}function ot(t,e){J(t),q(t,e,(t=>{const{x:i,y:n,w:s,h:o,desc:r}=e,{bgColor:l="#000000",borderColor:a="#000000",borderWidth:h=0}=r,c=s/2,d=o/2,u=i+c,g=n+d;if(h&&h>0){const e=h/2+c,i=h/2+d;t.beginPath(),t.setStrokeStyle(a),t.setLineWidth(h),t.ellipse(u,g,e,i,0,0,2*Math.PI),t.closePath(),t.stroke()}t.beginPath(),t.setFillStyle(l),t.ellipse(u,g,c,d,0,0,2*Math.PI),t.closePath(),t.fill()}))}function rt(t,i,n){var s;J(t);const o=t.getSize();if(t.clearRect(0,0,o.contextWidth,o.contextHeight),"string"==typeof i.bgColor&&e(i.bgColor)&&function(t,e){const i=t.getSize();t.setFillStyle(e),t.fillRect(0,0,i.contextWidth,i.contextHeight)}(t,i.bgColor),i.elements.length>0)for(let e=0;e<i.elements.length;e++){const o=i.elements[e];if(!0!==(null===(s=null==o?void 0:o.operation)||void 0===s?void 0:s.invisible))switch(o.type){case"rect":tt(t,o);break;case"text":st(t,o);break;case"image":et(t,o,n);break;case"svg":it(t,o,n);break;case"html":nt(t,o,n);break;case"circle":ot(t,o)}}}class lt{constructor(){this._listeners=new Map}on(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);null==i||i.push(e),this._listeners.set(t,i||[])}else this._listeners.set(t,[e])}off(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);if(Array.isArray(i))for(let t=0;t<(null==i?void 0:i.length);t++)if(i[t]===e){i.splice(t,1);break}this._listeners.set(t,i||[])}}trigger(t,e){const i=this._listeners.get(t);return!!Array.isArray(i)&&(i.forEach((t=>{t(e)})),!0)}has(t){if(this._listeners.has(t)){const e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1}}var at,ht,ct=globalThis&&globalThis.__awaiter||function(t,e,i,n){return new(i||(i=Promise))((function(s,o){function r(t){try{a(n.next(t))}catch(t){o(t)}}function l(t){try{a(n.throw(t))}catch(t){o(t)}}function a(t){var e;t.done?s(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(r,l)}a((n=n.apply(t,e||[])).next())}))};(ht=at||(at={})).FREE="free",ht.LOADING="loading",ht.COMPLETE="complete";class dt{constructor(t){this._currentLoadData={},this._currentUUIDQueue=[],this._storageLoadData={},this._status=at.FREE,this._waitingLoadQueue=[],this._opts=t,this._event=new lt,this._waitingLoadQueue=[]}load(t,e){const[i,n]=this._resetLoadData(t,e);this._status===at.FREE||this._status===at.COMPLETE?(this._currentUUIDQueue=i,this._currentLoadData=n,this._loadTask()):this._status===at.LOADING&&i.length>0&&this._waitingLoadQueue.push({uuidQueue:i,loadData:n})}on(t,e){this._event.on(t,e)}off(t,e){this._event.off(t,e)}isComplete(){return this._status===at.COMPLETE}getContent(t){var e;return"loaded"===(null===(e=this._storageLoadData[t])||void 0===e?void 0:e.status)?this._storageLoadData[t].content:null}_resetLoadData(t,e){const i={},n=[],s=this._storageLoadData;for(let o=t.elements.length-1;o>=0;o--){const r=t.elements[o];["image","svg","html"].includes(r.type)&&(s[r.uuid]?e.includes(r.uuid)&&(i[r.uuid]=this._createEmptyLoadItem(r),n.push(r.uuid)):(i[r.uuid]=this._createEmptyLoadItem(r),n.push(r.uuid)))}return[n,i]}_createEmptyLoadItem(t){let e="";const i=t.type;let s=t.w,o=t.h;if("image"===t.type){e=t.desc.src||""}else if("svg"===t.type){e=t.desc.svg||""}else if("html"===t.type){const i=t;e=(i.desc.html||"").replace(/<script[\s\S]*?<\/script>/gi,""),s=i.desc.width||t.w,o=i.desc.height||t.h}return{uuid:t.uuid,type:i,status:"null",content:null,source:e,elemW:s,elemH:o,element:n(t)}}_loadTask(){if(this._status===at.LOADING)return;if(this._status=at.LOADING,0===this._currentUUIDQueue.length){if(0===this._waitingLoadQueue.length)return this._status=at.COMPLETE,void this._event.trigger("complete",void 0);{const t=this._waitingLoadQueue.shift();if(t){const{uuidQueue:e,loadData:i}=t;this._currentLoadData=i,this._currentUUIDQueue=e}}}const{maxParallelNum:t}=this._opts,e=this._currentUUIDQueue.splice(0,t);e.forEach(((t,e)=>{}));const i=[],n=()=>{if(i.length>=t)return!1;if(0===e.length)return!0;for(let s=i.length;s<t;s++){const t=e.shift();if(void 0===t)break;i.push(t),this._loadElementSource(this._currentLoadData[t]).then((s=>{var o,r;i.splice(i.indexOf(t),1);const l=n();this._storageLoadData[t]={uuid:t,type:this._currentLoadData[t].type,status:"loaded",content:s,source:this._currentLoadData[t].source,elemW:this._currentLoadData[t].elemW,elemH:this._currentLoadData[t].elemH,element:this._currentLoadData[t].element},0===i.length&&0===e.length&&!0===l&&(this._status=at.FREE,this._loadTask()),this._event.trigger("load",{uuid:null===(o=this._storageLoadData[t])||void 0===o?void 0:o.uuid,type:this._storageLoadData[t].type,status:this._storageLoadData[t].status,content:this._storageLoadData[t].content,source:this._storageLoadData[t].source,elemW:this._storageLoadData[t].elemW,elemH:this._storageLoadData[t].elemH,element:null===(r=this._storageLoadData[t])||void 0===r?void 0:r.element})})).catch((s=>{var o,r,l,a,h,c,d,u,g,m,f,p;console.warn(s),i.splice(i.indexOf(t),1);const _=n();this._currentLoadData[t]&&(this._storageLoadData[t]={uuid:t,type:null===(o=this._currentLoadData[t])||void 0===o?void 0:o.type,status:"fail",content:null,error:s,source:null===(r=this._currentLoadData[t])||void 0===r?void 0:r.source,elemW:null===(l=this._currentLoadData[t])||void 0===l?void 0:l.elemW,elemH:null===(a=this._currentLoadData[t])||void 0===a?void 0:a.elemH,element:null===(h=this._currentLoadData[t])||void 0===h?void 0:h.element}),0===i.length&&0===e.length&&!0===_&&(this._status=at.FREE,this._loadTask()),this._currentLoadData[t]&&this._event.trigger("error",{uuid:t,type:null===(c=this._storageLoadData[t])||void 0===c?void 0:c.type,status:null===(d=this._storageLoadData[t])||void 0===d?void 0:d.status,content:null===(u=this._storageLoadData[t])||void 0===u?void 0:u.content,source:null===(g=this._storageLoadData[t])||void 0===g?void 0:g.source,elemW:null===(m=this._storageLoadData[t])||void 0===m?void 0:m.elemW,elemH:null===(f=this._storageLoadData[t])||void 0===f?void 0:f.elemH,element:null===(p=this._storageLoadData[t])||void 0===p?void 0:p.element})}))}return!1};n()}_loadElementSource(t){return ct(this,void 0,void 0,(function*(){if(t&&"image"===t.type){return yield a(t.source)}if(t&&"svg"===t.type){return yield h(t.source)}if(t&&"html"===t.type){return yield c(t.source,{width:t.elemW,height:t.elemH})}throw Error("Element's source is not support!")}))}}class ut{constructor(){this._listeners=new Map}on(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);null==i||i.push(e),this._listeners.set(t,i||[])}else this._listeners.set(t,[e])}off(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);if(Array.isArray(i))for(let t=0;t<(null==i?void 0:i.length);t++)if(i[t]===e){i.splice(t,1);break}this._listeners.set(t,i||[])}}trigger(t,e){const i=this._listeners.get(t);return!!Array.isArray(i)&&(i.forEach((t=>{t(e)})),!0)}has(t){if(this._listeners.has(t)){const e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1}}const gt=Symbol("_queue"),mt=Symbol("_ctx"),ft=Symbol("_status"),pt=Symbol("_loader"),_t=Symbol("_opts"),vt=Symbol("_freeze"),xt=Symbol("_drawFrame"),St=Symbol("_retainQueueOneItem");var yt,bt,wt;const{requestAnimationFrame:Et}=window;var Ct,Pt;(Pt=Ct||(Ct={})).NULL="null",Pt.FREE="free",Pt.DRAWING="drawing",Pt.FREEZE="freeze";class Lt extends ut{constructor(t){super(),this[yt]=[],this[bt]=null,this[wt]=Ct.NULL,this[_t]=t,this[pt]=new dt({maxParallelNum:6}),this[pt].on("load",(t=>{this[xt](),this.trigger("load",{element:t.element})})),this[pt].on("error",(t=>{this.trigger("error",{element:t.element,error:t.error})})),this[pt].on("complete",(()=>{this.trigger("loadComplete",{t:Date.now()})}))}render(t,e,s){const{changeResourceUUIDs:o=[]}=s||{};this[ft]=Ct.FREE;const r=n(e);if(Array.isArray(r.elements)&&r.elements.forEach((t=>{"string"==typeof t.uuid&&t.uuid||(t.uuid=i())})),!this[mt])if(this[_t]&&"[object HTMLCanvasElement]"===Object.prototype.toString.call(t)){const{width:e,height:i,contextWidth:n,contextHeight:s,devicePixelRatio:o}=this[_t],r=t;r.width=e*o,r.height=i*o;const l=r.getContext("2d");this[mt]=new d(l,{width:e,height:i,contextWidth:n||e,contextHeight:s||i,devicePixelRatio:o})}else t&&(this[mt]=t);if([Ct.FREEZE].includes(this[ft]))return;const l=n({data:r});this[gt].push(l),this[xt](),this[pt].load(r,o||[])}getContext(){return this[mt]}thaw(){this[ft]=Ct.FREE}[(yt=gt,bt=mt,wt=ft,vt)](){this[ft]=Ct.FREEZE}[xt](){this[ft]!==Ct.FREEZE&&Et((()=>{if(this[ft]===Ct.FREEZE)return;const t=this[mt];let e=this[gt][0],i=!1;this[gt].length>1?e=this[gt].shift():i=!0,!0!==this[pt].isComplete()?(this[xt](),e&&t&&rt(t,e.data,this[pt])):e&&t?(rt(t,e.data,this[pt]),this[St](),i?this[ft]=Ct.FREE:this[xt]()):this[ft]=Ct.FREE,this.trigger("drawFrame",{t:Date.now()}),!0===this[pt].isComplete()&&1===this[gt].length&&this[ft]===Ct.FREE&&(t&&this[gt][0]&&this[gt][0].data&&rt(t,this[gt][0].data,this[pt]),this.trigger("drawFrameComplete",{t:Date.now()}),this[vt]())}))}[St](){if(this[gt].length<=1)return;const t=n(this[gt][this[gt].length-1]);this[gt]=[t]}}function Dt(t){return"number"==typeof t&&(t>0||t<=0)}function Mt(t){return"number"==typeof t&&t>=0}function zt(t){return"string"==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${t}`)}function It(t){return"string"==typeof t&&/^(data:image\/)/.test(`${t}`)}const Tt={x:function(t){return Dt(t)},y:function(t){return Dt(t)},w:Mt,h:function(t){return"number"==typeof t&&t>=0},angle:function(t){return"number"==typeof t&&t>=-360&&t<=360},number:Dt,borderWidth:function(t){return Mt(t)},borderRadius:function(t){return Dt(t)&&t>=0},color:function(t){return e(t)},imageSrc:function(t){return It(t)||zt(t)},imageURL:zt,imageBase64:It,svg:function(t){return"string"==typeof t&&/^(<svg[\s]{1,}|<svg>)/i.test(`${t}`.trim())&&/<\/[\s]{0,}svg>$/i.test(`${t}`.trim())},html:function(t){let e=!1;if("string"==typeof t){let i=document.createElement("div");i.innerHTML=t,i.children.length>0&&(e=!0),i=null}return e},text:function(t){return"string"==typeof t},fontSize:function(t){return Dt(t)&&t>0},lineHeight:function(t){return Dt(t)&&t>0},textAlign:function(t){return["center","left","right"].includes(t)},fontFamily:function(t){return"string"==typeof t&&t.length>0},fontWeight:function(t){return["bold"].includes(t)},strokeWidth:function(t){return Dt(t)&&t>0}};function kt(t={}){const{borderColor:e,borderRadius:i,borderWidth:n}=t;return!(t.hasOwnProperty("borderColor")&&!Tt.color(e))&&(!(t.hasOwnProperty("borderRadius")&&!Tt.number(i))&&!(t.hasOwnProperty("borderWidth")&&!Tt.number(n)))}const Wt={attrs:function(t){const{x:e,y:i,w:n,h:s,angle:o}=t;return!!(Tt.x(e)&&Tt.y(i)&&Tt.w(n)&&Tt.h(s)&&Tt.angle(o))&&(o>=-360&&o<=360)},textDesc:function(t){const{text:e,color:i,fontSize:n,lineHeight:s,fontFamily:o,textAlign:r,fontWeight:l,bgColor:a,strokeWidth:h,strokeColor:c}=t;return!!Tt.text(e)&&(!!Tt.color(i)&&(!!Tt.fontSize(n)&&(!(t.hasOwnProperty("bgColor")&&!Tt.color(a))&&(!(t.hasOwnProperty("fontWeight")&&!Tt.fontWeight(l))&&(!(t.hasOwnProperty("lineHeight")&&!Tt.lineHeight(s))&&(!(t.hasOwnProperty("fontFamily")&&!Tt.fontFamily(o))&&(!(t.hasOwnProperty("textAlign")&&!Tt.textAlign(r))&&(!(t.hasOwnProperty("strokeWidth")&&!Tt.strokeWidth(h))&&(!(t.hasOwnProperty("strokeColor")&&!Tt.color(c))&&!!kt(t))))))))))},rectDesc:function(t){const{bgColor:e}=t;return!(t.hasOwnProperty("bgColor")&&!Tt.color(e))&&!!kt(t)},circleDesc:function(t){const{bgColor:e,borderColor:i,borderWidth:n}=t;return!(t.hasOwnProperty("bgColor")&&!Tt.color(e))&&(!(t.hasOwnProperty("borderColor")&&!Tt.color(i))&&!(t.hasOwnProperty("borderWidth")&&!Tt.number(n)))},imageDesc:function(t){const{src:e}=t;return!!Tt.imageSrc(e)},svgDesc:function(t){const{svg:e}=t;return!!Tt.svg(e)},htmlDesc:function(t){const{html:e}=t;return!!Tt.html(e)}};function Ut(t){return t/180*Math.PI}function Rt(t){return{x:t.x+t.w/2,y:t.y+t.h/2}}function Ot(t,e){const i=e.x-t.x,n=t.y-e.y;if(0===i){if(n<0)return Math.PI/2;if(n>0)return 1.5*Math.PI}else if(0===n){if(i<0)return Math.PI;if(i>0)return 0}return i>0&&n<0?Math.atan(Math.abs(n)/Math.abs(i)):i<0&&n<0?Math.PI-Math.atan(Math.abs(n)/Math.abs(i)):i<0&&n>0?Math.PI+Math.atan(Math.abs(n)/Math.abs(i)):i>0&&n>0?2*Math.PI-Math.atan(Math.abs(n)/Math.abs(i)):null}const At={elementWrapper:{color:"#2ab6f1",lockColor:"#aaaaaa",controllerSize:6,lineWidth:1,lineDash:[4,3]}};class Ft{constructor(){this._listeners=new Map}on(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);null==i||i.push(e),this._listeners.set(t,i||[])}else this._listeners.set(t,[e])}off(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);if(Array.isArray(i))for(let t=0;t<(null==i?void 0:i.length);t++)if(i[t]===e){i.splice(t,1);break}this._listeners.set(t,i||[])}}trigger(t,e){const i=this._listeners.get(t);return!!Array.isArray(i)&&(i.forEach((t=>{t(e)})),!0)}has(t){if(this._listeners.has(t)){const e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1}}function Yt(t,e){var i,n;return(null==(i=null==t?void 0:t.desc)?void 0:i.src)!==(null==(n=null==e?void 0:e.desc)?void 0:n.src)}function Nt(t,e){var i,n;return(null==(i=null==t?void 0:t.desc)?void 0:i.svg)!==(null==(n=null==e?void 0:e.desc)?void 0:n.svg)}function Xt(t,e){var i,n,s,o,r,l;return(null==(i=null==t?void 0:t.desc)?void 0:i.html)!==(null==(n=null==e?void 0:e.desc)?void 0:n.html)||(null==(s=null==t?void 0:t.desc)?void 0:s.width)!==(null==(o=null==e?void 0:e.desc)?void 0:o.width)||(null==(r=null==t?void 0:t.desc)?void 0:r.height)!==(null==(l=null==e?void 0:e.desc)?void 0:l.height)}function Ht(t,e){let i=null,n=!1;switch(e.type){case"image":n=Yt(t,e);break;case"svg":n=Nt(t,e);break;case"html":n=Xt(t,e)}return!0===n&&(i=e.uuid),i}function Bt(t){const e={};return t.elements.forEach((t=>{e[t.uuid]=t})),e}function jt(t,e,i){return $t(t,Rt(e),Ut(e.angle||0)||0,i)}function $t(t,e,i,n){e&&(i>0||i<0)&&(t.translate(e.x,e.y),t.rotate(i),t.translate(-e.x,-e.y)),n(t),e&&(i>0||i<0)&&(t.translate(e.x,e.y),t.rotate(-i),t.translate(-e.x,-e.y))}function Gt(t){const e=t.toFixed(2);return parseFloat(e)}function Qt(t){return Gt(t%360)}const Vt=Object.keys({text:{},rect:{},image:{},svg:{},circle:{},html:{}}),Zt=15;class qt{constructor(t){this._ctx=t}initData(t){return t.elements.forEach((t=>{t.uuid&&"string"==typeof t.uuid||(t.uuid=i())})),t}isPointInElement(t,e){var i,n;const s=this._ctx;let o=-1,r=null;for(let l=e.elements.length-1;l>=0;l--){const a=e.elements[l];if(!0===(null==(i=a.operation)?void 0:i.invisible))continue;let h=0;if((null==(n=a.desc)?void 0:n.borderWidth)>0&&(h=a.desc.borderWidth),jt(s,a,(()=>{s.beginPath(),s.moveTo(a.x-h,a.y-h),s.lineTo(a.x+a.w+h,a.y-h),s.lineTo(a.x+a.w+h,a.y+a.h+h),s.lineTo(a.x-h,a.y+a.h+h),s.lineTo(a.x-h,a.y-h),s.closePath(),s.isPointInPath(t.x,t.y)&&(o=l,r=a.uuid)})),o>=0)break}return[o,r]}dragElement(t,e,i,n,s){const o=this.getElementIndex(t,e);if(!t.elements[o])return;const r=i.x-n.x,l=i.y-n.y;t.elements[o].x+=r/s,t.elements[o].y+=l/s,this.limitElementAttrs(t.elements[o])}transformElement(t,e,i,n,s,o){var r,l;const a=this.getElementIndex(t,e);if(!t.elements[a])return null;if(!0===(null==(l=null==(r=t.elements[a])?void 0:r.operation)?void 0:l.lock))return null;let h=(i.x-n.x)/s,c=(i.y-n.y)/s;const d=t.elements[a];if(["top-left","top","top-right","right","bottom-right","bottom","bottom-left","left"].includes(o)){const t=function(t,e,i,n,s){const o={x:t.x,y:t.y,w:t.w,h:t.h};switch(t.angle,n){case"top-left":t.w-e>0&&t.h-i>0&&(o.x+=e,o.y+=i,o.w-=e,o.h-=i);break;case"top":if(0===t.angle||Math.abs(t.angle)<Zt)o.h-i>0&&(o.y+=i,o.h-=i);else if(t.angle>0||t.angle<0){const n=t.angle>0?t.angle:Math.max(0,t.angle+360);let s=Kt(e,i),r=o.x+t.w/2,l=o.y+t.h/2;if(n<90){s=0-te(s,i);const t=Jt(n),e=s/2;r+=e*Math.sin(t),l-=e*Math.cos(t)}else if(n<180){s=te(s,e);const t=Jt(n-90),i=s/2;r+=i*Math.cos(t),l+=i*Math.sin(t)}else if(n<270){s=te(s,i);const t=Jt(n-180),e=s/2;r-=e*Math.sin(t),l+=e*Math.cos(t)}else if(n<360){s=0-te(s,e);const t=Jt(n-270),i=s/2;r-=i*Math.cos(t),l-=i*Math.sin(t)}o.h+s>0&&(o.h=o.h+s,o.x=r-o.w/2,o.y=l-o.h/2)}else o.h-i>0&&(o.y+=i,o.h-=i);break;case"top-right":o.h-i>0&&o.w+e>0&&(o.y+=i,o.w+=e,o.h-=i);break;case"right":if(0===t.angle||Math.abs(t.angle)<Zt)t.w+e>0&&(o.w+=e);else if(t.angle>0||t.angle<0){const n=t.angle>0?t.angle:Math.max(0,t.angle+360);let s=Kt(e,i),r=o.x+t.w/2,l=o.y+t.h/2;if(n<90){s=te(s,i);const t=Jt(n),e=s/2;r+=e*Math.cos(t),l+=e*Math.sin(t)}else if(n<180){s=te(s,i);const t=Jt(n-90),e=s/2;r-=e*Math.sin(t),l+=e*Math.cos(t)}else if(n<270){s=te(s,i);const t=Jt(n-180),e=s/2;r+=e*Math.cos(t),l+=e*Math.sin(t),s=0-s}else if(n<360){s=te(s,e);const t=Jt(n-270),i=s/2;r+=i*Math.sin(t),l-=i*Math.cos(t)}o.w+s>0&&(o.w=o.w+s,o.x=r-o.w/2,o.y=l-o.h/2)}else t.w+e>0&&(o.w+=e);break;case"bottom-right":t.w+e>0&&t.h+i>0&&(o.w+=e,o.h+=i);break;case"bottom":if(0===t.angle||Math.abs(t.angle)<Zt)t.h+i>0&&(o.h+=i);else if(t.angle>0||t.angle<0){const n=t.angle>0?t.angle:Math.max(0,t.angle+360);let s=Kt(e,i),r=o.x+t.w/2,l=o.y+t.h/2;if(n<90){s=te(s,i);const t=Jt(n),e=s/2;r-=e*Math.sin(t),l+=e*Math.cos(t)}else if(n<180){s=0-te(s,e);const t=Jt(n-90),i=s/2;r-=i*Math.cos(t),l-=i*Math.sin(t)}else if(n<270){s=te(s,e);const t=Jt(n-180),i=s/2;r+=i*Math.sin(t),l-=i*Math.cos(t)}else if(n<360){s=te(s,e);const t=Jt(n-270),i=s/2;r+=i*Math.cos(t),l+=i*Math.sin(t)}o.h+s>0&&(o.h=o.h+s,o.x=r-o.w/2,o.y=l-o.h/2)}else t.h+i>0&&(o.h+=i);break;case"bottom-left":t.w-e>0&&t.h+i>0&&(o.x+=e,o.w-=e,o.h+=i);break;case"left":if(0===t.angle||Math.abs(t.angle)<Zt)t.w-e>0&&(o.x+=e,o.w-=e);else if(t.angle>0||t.angle<0){const n=t.angle>0?t.angle:Math.max(0,t.angle+360);let s=Kt(e,i),r=o.x+t.w/2,l=o.y+t.h/2;if(n<90){s=0-te(s,e);const t=Jt(n),i=s/2;r-=i*Math.cos(t),l-=i*Math.sin(t)}else if(n<180){s=te(s,e);const t=Jt(n-90),i=s/2;r+=i*Math.sin(t),l-=i*Math.cos(t)}else if(n<270){s=te(s,i);const t=Jt(n-180),e=s/2;r+=e*Math.cos(t),l+=e*Math.sin(t)}else if(n<360){s=te(s,i);const t=Jt(n-270),e=s/2;r-=e*Math.sin(t),l+=e*Math.cos(t)}o.w+s>0&&(o.w=o.w+s,o.x=r-o.w/2,o.y=l-o.h/2)}else t.w-e>0&&(o.x+=e,o.w-=e)}return o}(d,h,c,o);d.x=t.x,d.y=t.y,d.w=t.w,d.h=t.h}else if("rotate"===o){const t=function(t,e,i){const n=Ot(t,e),s=Ot(t,i);return null!==s&&null!==n?n>3*Math.PI/2&&s<Math.PI/2?s+(2*Math.PI-n):s>3*Math.PI/2&&n<Math.PI/2?n+(2*Math.PI-s):s-n:0}(Rt(d),n,i);d.angle=(d.angle||0)+function(t){return t/Math.PI*180}(t)}return this.limitElementAttrs(d),{width:Gt(d.w),height:Gt(d.h),angle:Qt(d.angle||0)}}getElementIndex(t,e){let i=-1;for(let n=0;n<t.elements.length;n++)if(t.elements[n].uuid===e){i=n;break}return i}limitElementAttrs(t){t.x=Gt(t.x),t.y=Gt(t.y),t.w=Gt(t.w),t.h=Gt(t.h),t.angle=Qt(t.angle||0)}}function Jt(t){return t*Math.PI/180}function Kt(t,e){return Math.sqrt(t*t+e*e)}function te(t,e){return e>0?Math.abs(t):0-Math.abs(t)}class ee{constructor(t,e){this._areaStart={x:0,y:0},this._areaEnd={x:0,y:0},this._board=t,this._ctx=this._board.getContext(),this._coreConfig=e,this._helperConfig={elementIndexMap:{}}}updateConfig(t,e){this._updateElementIndex(t),this._updateSelectedElementWrapper(t,e),this._updateSelectedElementListWrapper(t,e)}getConfig(){return n(this._helperConfig)}getElementIndexByUUID(t){const e=this._helperConfig.elementIndexMap[t];return e>=0?e:null}isPointInElementWrapperController(t,e){var i,s;const o=this._ctx,r=(null==(s=null==(i=this._helperConfig)?void 0:i.selectedElementWrapper)?void 0:s.uuid)||null;let l=null,a=null,h=null;if(!this._helperConfig.selectedElementWrapper)return{uuid:r,selectedControllerDirection:a,directIndex:l,hoverControllerDirection:h};const c=this._helperConfig.selectedElementWrapper,d=[c.controllers.right,c.controllers.topRight,c.controllers.top,c.controllers.topLeft,c.controllers.left,c.controllers.bottomLeft,c.controllers.bottom,c.controllers.bottomRight];let u=["right","top-right","top","top-left","left","bottom-left","bottom","bottom-right"],g=n(u),m=0;if(e&&r){const t=this.getElementIndexByUUID(r);if(null!==t&&t>=0){let i=e.elements[t].angle;i<0&&(i+=360),i<45?m=0:i<90?m=1:i<135?m=2:i<180?m=3:i<225?m=4:i<270?m=5:i<315&&(m=6)}}if(m>0&&(g=g.slice(-m).concat(g.slice(0,-m))),$t(o,c.translate,c.radian||0,(()=>{for(let e=0;e<d.length;e++){const i=d[e];if(!0!==i.invisible&&(o.beginPath(),o.arc(i.x,i.y,c.controllerSize,0,2*Math.PI),o.closePath(),o.isPointInPath(t.x,t.y)&&(a=u[e],h=g[e]),a)){l=e;break}}})),null===a){const e=c.controllers.rotate;!0!==e.invisible&&$t(o,c.translate,c.radian||0,(()=>{o.beginPath(),o.arc(e.x,e.y,c.controllerSize,0,2*Math.PI),o.closePath(),o.isPointInPath(t.x,t.y)&&(a="rotate",h="rotate")}))}return{uuid:r,selectedControllerDirection:a,hoverControllerDirection:h,directIndex:l}}isPointInElementList(t,e){var i,n,s;const o=this._ctx;let r=-1,l=null;const a=(null==(i=this._helperConfig)?void 0:i.selectedElementListWrappers)||[];for(let i=0;i<a.length;i++){const h=a[i],c=this._helperConfig.elementIndexMap[h.uuid],d=e.elements[c];if(!d)continue;if(!0===(null==(n=d.operation)?void 0:n.invisible))continue;let u=0;if((null==(s=d.desc)?void 0:s.borderWidth)>0&&(u=d.desc.borderWidth),jt(o,d,(()=>{o.beginPath(),o.moveTo(d.x-u,d.y-u),o.lineTo(d.x+d.w+u,d.y-u),o.lineTo(d.x+d.w+u,d.y+d.h+u),o.lineTo(d.x-u,d.y+d.h+u),o.lineTo(d.x-u,d.y-u),o.closePath(),o.isPointInPath(t.x,t.y)&&(r=i,l=d.uuid)})),r>=0)break}return!!(l&&r>=0)}startSelectArea(t){this._areaStart=t,this._areaEnd=t}changeSelectArea(t){this._areaEnd=t,this._calcSelectedArea()}clearSelectedArea(){this._areaStart={x:0,y:0},this._areaEnd={x:0,y:0},this._calcSelectedArea()}calcSelectedElements(t){const e=this._ctx.getTransform(),{scale:i=1,scrollX:n=0,scrollY:s=0}=e,o=this._areaStart,r=this._areaEnd,l=(Math.min(o.x,r.x)-n)/i,a=(Math.min(o.y,r.y)-s)/i,h=Math.abs(r.x-o.x)/i,c=Math.abs(r.y-o.y)/i,d=[],u=this._ctx;return u.beginPath(),u.moveTo(l,a),u.lineTo(l+h,a),u.lineTo(l+h,a+c),u.lineTo(l,a+c),u.lineTo(l,a),u.closePath(),t.elements.forEach((t=>{var e;if(!0!==(null==(e=null==t?void 0:t.operation)?void 0:e.invisible)){const e=t.x+t.w/2,i=t.y+t.h/2;u.isPointInPathWithoutScroll(e,i)&&d.push(t.uuid)}})),d}_calcSelectedArea(){const t=this._areaStart,e=this._areaEnd,i=this._ctx.getTransform(),{scale:n=1,scrollX:s=0,scrollY:o=0}=i,r=this._coreConfig.elementWrapper,l=r.lineWidth/n,a=r.lineDash.map((t=>t/n));this._helperConfig.selectedAreaWrapper={x:(Math.min(t.x,e.x)-s)/n,y:(Math.min(t.y,e.y)-o)/n,w:Math.abs(e.x-t.x)/n,h:Math.abs(e.y-t.y)/n,startPoint:{x:t.x,y:t.y},endPoint:{x:e.x,y:e.y},lineWidth:l,lineDash:a,color:r.color}}_updateElementIndex(t){this._helperConfig.elementIndexMap={},t.elements.forEach(((t,e)=>{this._helperConfig.elementIndexMap[t.uuid]=e}))}_updateSelectedElementWrapper(t,e){var i;const{selectedUUID:n}=e;if(!("string"==typeof n&&this._helperConfig.elementIndexMap[n]>=0))return void delete this._helperConfig.selectedElementWrapper;const s=this._helperConfig.elementIndexMap[n],o=t.elements[s];if(!0===(null==(i=null==o?void 0:o.operation)?void 0:i.invisible))return;const r=this._createSelectedElementWrapper(o,e);this._helperConfig.selectedElementWrapper=r}_updateSelectedElementListWrapper(t,e){const{selectedUUIDList:i}=e,n=[];t.elements.forEach(((t,s)=>{if(null==i?void 0:i.includes(t.uuid)){const i=this._createSelectedElementWrapper(t,e);n.push(i)}})),this._helperConfig.selectedElementListWrappers=n}_createSelectedElementWrapper(t,e){var i,n,s,o,r,l,a,h,c,d,u,g;const{scale:m}=e,f=this._coreConfig.elementWrapper,p=f.controllerSize/m,_=f.lineWidth/m,v=f.lineDash.map((t=>t/m)),x=(null==(i=t.desc)?void 0:i.borderWidth)||0;let S=!1;"number"==typeof t.angle&&Math.abs(t.angle)>15&&(S=!0);const y=_,b={uuid:t.uuid,controllerSize:p,controllerOffset:y,lock:!0===(null==(n=null==t?void 0:t.operation)?void 0:n.lock),controllers:{topLeft:{x:t.x-y-x,y:t.y-y-x,invisible:S||!0===(null==(s=null==t?void 0:t.operation)?void 0:s.disableScale)},top:{x:t.x+t.w/2,y:t.y-y-x,invisible:!0===(null==(o=null==t?void 0:t.operation)?void 0:o.disableScale)},topRight:{x:t.x+t.w+y+x,y:t.y-y-x,invisible:S||!0===(null==(r=null==t?void 0:t.operation)?void 0:r.disableScale)},right:{x:t.x+t.w+y+x,y:t.y+t.h/2,invisible:!0===(null==(l=null==t?void 0:t.operation)?void 0:l.disableScale)},bottomRight:{x:t.x+t.w+y+x,y:t.y+t.h+y+x,invisible:S||!0===(null==(a=null==t?void 0:t.operation)?void 0:a.disableScale)},bottom:{x:t.x+t.w/2,y:t.y+t.h+y+x,invisible:!0===(null==(h=null==t?void 0:t.operation)?void 0:h.disableScale)},bottomLeft:{x:t.x-y-x,y:t.y+t.h+y+x,invisible:S||!0===(null==(c=null==t?void 0:t.operation)?void 0:c.disableScale)},left:{x:t.x-y-x,y:t.y+t.h/2,invisible:!0===(null==(d=null==t?void 0:t.operation)?void 0:d.disableScale)},rotate:{x:t.x+t.w/2,y:t.y-p-(2*p+12)-x,invisible:!0===(null==(u=null==t?void 0:t.operation)?void 0:u.disbaleRotate)}},lineWidth:_,lineDash:v,color:!0===(null==(g=null==t?void 0:t.operation)?void 0:g.lock)?f.lockColor:f.color};return"number"==typeof t.angle&&(t.angle>0||t.angle<0)&&(b.radian=Ut(t.angle),b.translate=Rt(t)),b}}const ie=Symbol("_displayCtx"),ne=Symbol("_helper"),se=Symbol("_element"),oe=Symbol("_opts");class re{constructor(t){this[oe]=t,this[ie]=this[oe].board,this[se]=this[oe].element,this[ne]=this[oe].helper}isEffectivePoint(t){const e=this[ie].getScrollLineWidth(),i=this[ie].getScreenInfo();return t.x<=i.width-e&&t.y<=i.height-e}judgePointCursor(t,e){let i="auto",n=null;if(!this.isEffectivePoint(t))return{cursor:i,elementUUID:n};const{uuid:s,hoverControllerDirection:o}=this[ne].isPointInElementWrapperController(t,e);if(s&&o){switch(o){case"top-right":i="ne-resize";break;case"top-left":i="nw-resize";break;case"top":i="n-resize";break;case"right":i="e-resize";break;case"bottom-right":i="se-resize";break;case"bottom":i="s-resize";break;case"bottom-left":i="sw-resize";break;case"left":i="w-resize";break;case"rotate":i="grab"}s&&(n=s)}else{const[s,o]=this[se].isPointInElement(t,e);s>=0&&(i="move"),o&&(n=o)}return{cursor:i,elementUUID:n}}}function le(t){const e={elements:[]};return Array.isArray(null==t?void 0:t.elements)&&(null==t||t.elements.forEach(((t={})=>{(function(t){if(!(ae(t.x)&&ae(t.y)&&ae(t.w)&&ae(t.h)))return!1;if("string"!=typeof t.type||!Vt.includes(t.type))return!1;return!0})(t)&&e.elements.push(t)}))),"string"==typeof t.bgColor&&(e.bgColor=t.bgColor),e}function ae(t){return t>=0||t<0}const he=Symbol("_board"),ce=Symbol("_data"),de=Symbol("_opts"),ue=Symbol("_config"),ge=Symbol("_renderer"),me=Symbol("_element"),fe=Symbol("_tempData"),pe=Symbol("_draw"),_e=Symbol("_coreEvent"),ve=Symbol("_emitChangeScreen"),xe=Symbol("_emitChangeData"),Se=Symbol("_engine");var ye,be,we=(t=>(t.NULL="null",t.SELECT_ELEMENT="select-element",t.SELECT_ELEMENT_LIST="select-element-list",t.SELECT_ELEMENT_WRAPPER_CONTROLLER="select-element-wrapper-controller",t.SELECT_AREA="select-area",t))(we||{}),Ee=(t=>(t.DRAGGING="dragging",t.NULL="null",t))(Ee||{});function Ce(){return{hasInited:!1,mode:we.NULL,cursorStatus:Ee.NULL,selectedUUID:null,selectedUUIDList:[],hoverUUID:null,selectedControllerDirection:null,hoverControllerDirection:null,prevPoint:null,hasChangedElement:!1}}class Pe{constructor(){this._temp=Ce()}set(t,e){this._temp[t]=e}get(t){return this._temp[t]}clear(){this._temp=Ce()}}class Le{constructor(t){this._plugins=[];const{board:e,config:i,element:n}=t,s=new ee(e,i);this._opts=t,this.temp=new Pe,this.helper=s,this._mapper=new re({board:e,helper:s,element:n})}addPlugin(t){this._plugins.push(t)}getHelperConfig(){return this.helper.getConfig()}updateHelperConfig(t){var e;const{board:i,getDataFeekback:n,config:s}=this._opts,o=n(),r=i.getTransform();this.helper.updateConfig(o,{width:t.width,height:t.height,devicePixelRatio:t.devicePixelRatio,canScroll:!0===(null==(e=null==s?void 0:s.scrollWrapper)?void 0:e.use),selectedUUID:this.temp.get("selectedUUID"),selectedUUIDList:this.temp.get("selectedUUIDList"),scale:r.scale,scrollX:r.scrollX,scrollY:r.scrollY})}init(){this._initEvent()}_initEvent(){if(!0===this.temp.get("hasInited"))return;const{board:e}=this._opts;e.on("hover",t(this._handleHover.bind(this),32)),e.on("leave",t(this._handleLeave.bind(this),32)),e.on("point",t(this._handleClick.bind(this),16)),e.on("doubleClick",this._handleDoubleClick.bind(this)),e.on("point",this._handlePoint.bind(this)),e.on("moveStart",this._handleMoveStart.bind(this)),e.on("move",t(this._handleMove.bind(this),16)),e.on("moveEnd",this._handleMoveEnd.bind(this))}_handleDoubleClick(t){var e,i,s;const{element:o,getDataFeekback:r,drawFeekback:l,coreEvent:a}=this._opts,h=r(),[c,d]=o.isPointInElement(t,h);if(c>=0&&d){const t=n(null==(e=h.elements)?void 0:e[c]);!0!==(null==(i=null==t?void 0:t.operation)?void 0:i.invisible)&&a.trigger("screenDoubleClickElement",{index:c,uuid:d,element:n(null==(s=h.elements)?void 0:s[c])})}l()}_handlePoint(t){var e,i,s;if(!this._mapper.isEffectivePoint(t))return;const{element:o,getDataFeekback:r,selectElementByIndex:l,coreEvent:a,emitChangeScreen:h,drawFeekback:c}=this._opts,d=this.helper,u=r();if(d.isPointInElementList(t,u))this.temp.set("mode",we.SELECT_ELEMENT_LIST);else{const{uuid:r,selectedControllerDirection:c}=d.isPointInElementWrapperController(t,u);if(r&&c)this.temp.set("mode",we.SELECT_ELEMENT_WRAPPER_CONTROLLER),this.temp.set("selectedControllerDirection",c),this.temp.set("selectedUUID",r);else{const[r,c]=o.isPointInElement(t,u);r>=0&&!0!==(null==(i=null==(e=u.elements[r])?void 0:e.operation)?void 0:i.invisible)?(l(r,{useMode:!0}),"string"==typeof c&&a.has("screenSelectElement")&&(a.trigger("screenSelectElement",{index:r,uuid:c,element:n(null==(s=u.elements)?void 0:s[r])}),h()),this.temp.set("mode",we.SELECT_ELEMENT)):(this.temp.set("selectedUUIDList",[]),this.temp.set("selectedUUID",null),this.temp.set("mode",we.SELECT_AREA))}}c()}_handleClick(t){var e;const{element:i,getDataFeekback:s,coreEvent:o,drawFeekback:r}=this._opts,l=s(),[a,h]=i.isPointInElement(t,l);a>=0&&h&&o.trigger("screenClickElement",{index:a,uuid:h,element:n(null==(e=l.elements)?void 0:e[a])}),r()}_handleMoveStart(t){const{element:e,getDataFeekback:i,coreEvent:n}=this._opts,s=i(),o=this.helper;this.temp.set("prevPoint",t);const r=this.temp.get("selectedUUID");this.temp.get("mode")===we.SELECT_ELEMENT_LIST||(this.temp.get("mode")===we.SELECT_ELEMENT?"string"==typeof r&&n.has("screenMoveElementStart")&&n.trigger("screenMoveElementStart",{index:e.getElementIndex(s,r),uuid:r,x:t.x,y:t.y}):this.temp.get("mode")===we.SELECT_AREA&&o.startSelectArea(t))}_handleMove(t){const{drawFeekback:e}=this._opts,i=this.helper;this.temp.get("mode")===we.SELECT_ELEMENT_LIST?(this.temp.set("hasChangedElement",!0),this._dragElements(this.temp.get("selectedUUIDList"),t,this.temp.get("prevPoint")),e(),this.temp.set("cursorStatus",Ee.DRAGGING)):"string"==typeof this.temp.get("selectedUUID")?this.temp.get("mode")===we.SELECT_ELEMENT?(this.temp.set("hasChangedElement",!0),this._dragElements([this.temp.get("selectedUUID")],t,this.temp.get("prevPoint")),e(),this.temp.set("cursorStatus",Ee.DRAGGING)):this.temp.get("mode")===we.SELECT_ELEMENT_WRAPPER_CONTROLLER&&this.temp.get("selectedControllerDirection")&&(this._transfromElement(this.temp.get("selectedUUID"),t,this.temp.get("prevPoint"),this.temp.get("selectedControllerDirection")),this.temp.set("cursorStatus",Ee.DRAGGING)):this.temp.get("mode")===we.SELECT_AREA&&(i.changeSelectArea(t),e()),this.temp.set("prevPoint",t)}_dragElements(t,e,i){if(!i)return;const{board:n,element:s,getDataFeekback:o,drawFeekback:r}=this._opts,l=o(),a=this.helper;t.forEach((t=>{var o,r;const h=a.getElementIndexByUUID(t);if(null===h)return;const c=l.elements[h];!0!==(null==(o=null==c?void 0:c.operation)?void 0:o.lock)&&!0!==(null==(r=null==c?void 0:c.operation)?void 0:r.invisible)&&s.dragElement(l,t,e,i,n.getContext().getTransform().scale)})),r()}_transfromElement(t,e,i,n){if(!i)return null;const{board:s,element:o,getDataFeekback:r,drawFeekback:l}=this._opts,a=r(),h=o.transformElement(a,t,e,i,s.getContext().getTransform().scale,n);return l(),h}_handleMoveEnd(t){const{element:e,getDataFeekback:i,coreEvent:n,drawFeekback:s,emitChangeData:o}=this._opts,r=i(),l=this.helper,a=this.temp.get("selectedUUID");if("string"==typeof a){const i=e.getElementIndex(r,a),s=r.elements[i];s&&(n.has("screenMoveElementEnd")&&n.trigger("screenMoveElementEnd",{index:i,uuid:a,x:t.x,y:t.y}),n.has("screenChangeElement")&&n.trigger("screenChangeElement",{index:i,uuid:a,width:s.w,height:s.h,angle:s.angle||0}))}else if(this.temp.get("mode")===we.SELECT_AREA){const t=l.calcSelectedElements(r);t.length>0?(this.temp.set("selectedUUIDList",t),this.temp.set("selectedUUID",null)):this.temp.set("mode",we.NULL),l.clearSelectedArea(),s()}this.temp.get("mode")!==we.SELECT_ELEMENT&&this.temp.set("selectedUUID",null),this.temp.set("cursorStatus",Ee.NULL),this.temp.set("mode",we.NULL),!0===this.temp.get("hasChangedElement")&&(o(),this.temp.set("hasChangedElement",!1))}_handleHover(t){var e,i;let n=!1;const{board:s,getDataFeekback:o,coreEvent:r}=this._opts,l=o(),a=this.helper,h=this._mapper;if(this.temp.get("mode")===we.SELECT_AREA)s.resetCursor();else if(this.temp.get("cursorStatus")===Ee.NULL){const{cursor:o,elementUUID:c}=h.judgePointCursor(t,l);if(s.setCursor(o),c){const t=a.getElementIndexByUUID(c);if(null!==t&&t>=0){const o=l.elements[t];if(!0===(null==(e=null==o?void 0:o.operation)?void 0:e.lock)||!0===(null==(i=null==o?void 0:o.operation)?void 0:i.invisible))return void s.resetCursor();if(this.temp.get("hoverUUID")!==o.uuid){const t=a.getElementIndexByUUID(this.temp.get("hoverUUID")||"");null!==t&&l.elements[t]&&r.trigger("mouseLeaveElement",{uuid:this.temp.get("hoverUUID"),index:t,element:l.elements[t]})}o&&(r.trigger("mouseOverElement",{uuid:o.uuid,index:t,element:o}),this.temp.set("hoverUUID",o.uuid),n=!0)}}}if(!0!==n&&null!==this.temp.get("hoverUUID")){const t=this.temp.get("hoverUUID"),e=a.getElementIndexByUUID(t||"");null!==e&&r.trigger("mouseLeaveElement",{uuid:t,index:e,element:l.elements[e]}),this.temp.set("hoverUUID",null)}r.has("mouseOverScreen")&&r.trigger("mouseOverScreen",t)}_handleLeave(){const{coreEvent:t}=this._opts;t.has("mouseLeaveScreen")&&t.trigger("mouseLeaveScreen",void 0)}}function De(t){t.setFillStyle("#000000"),t.setStrokeStyle("#000000"),t.setLineDash([]),t.setGlobalAlpha(1),t.setShadowColor("#00000000"),t.setShadowOffsetX(0),t.setShadowOffsetY(0),t.setShadowBlur(0)}class Me{constructor(t,e,i){var s,o,r;this[ye]=new Ft,this[be]=new class{constructor(){this._temp={hasInited:!1}}set(t,e){this._temp[t]=e}get(t){return this._temp[t]}clear(){this._temp={hasInited:!1}}},this[ce]={elements:[]},this[de]=e,this[ue]=function(t){const e=n(At);return t&&t.elementWrapper&&(e.elementWrapper={...e.elementWrapper,...t.elementWrapper}),e}(i||{}),this[he]=new Z(t,{...this[de],canScroll:null==(s=null==i?void 0:i.scrollWrapper)?void 0:s.use,scrollConfig:{color:(null==(o=null==i?void 0:i.scrollWrapper)?void 0:o.color)||"#a0a0a0",lineWidth:(null==(r=null==i?void 0:i.scrollWrapper)?void 0:r.lineWidth)||12}}),this[ge]=new Lt;const l=()=>{const t=this[he].getHelperContext(),e=this[Se].getHelperConfig();this[he].clear();const{contextWidth:i,contextHeight:n,devicePixelRatio:s}=this[de];t.clearRect(0,0,i*s,n*s),function(t,e){if(!(null==e?void 0:e.selectedElementWrapper))return;const i=e.selectedElementWrapper;De(t),$t(t,i.translate,i.radian||0,(()=>{t.beginPath(),t.setLineDash(i.lineDash),t.setLineWidth(i.lineWidth),t.setStrokeStyle(i.color),t.moveTo(i.controllers.topLeft.x,i.controllers.topLeft.y),t.lineTo(i.controllers.topRight.x,i.controllers.topRight.y),t.lineTo(i.controllers.bottomRight.x,i.controllers.bottomRight.y),t.lineTo(i.controllers.bottomLeft.x,i.controllers.bottomLeft.y),t.lineTo(i.controllers.topLeft.x,i.controllers.topLeft.y-i.lineWidth/2),t.stroke(),t.closePath(),!0!==i.lock?(!0!==i.controllers.rotate.invisible&&(t.beginPath(),t.moveTo(i.controllers.top.x,i.controllers.top.y),t.lineTo(i.controllers.rotate.x,i.controllers.rotate.y+i.controllerSize),t.stroke(),t.closePath(),t.beginPath(),t.setLineDash([]),t.setLineWidth(i.controllerSize/2),t.arc(i.controllers.rotate.x,i.controllers.rotate.y,.8*i.controllerSize,Math.PI/6,2*Math.PI),t.stroke(),t.closePath()),t.setFillStyle(i.color),[i.controllers.topLeft,i.controllers.top,i.controllers.topRight,i.controllers.right,i.controllers.bottomRight,i.controllers.bottom,i.controllers.bottomLeft,i.controllers.left].forEach((e=>{!0!==e.invisible&&(t.beginPath(),t.arc(e.x,e.y,i.controllerSize,0,2*Math.PI),t.fill(),t.closePath())}))):(De(t),t.setStrokeStyle(i.color),[i.controllers.topLeft,i.controllers.top,i.controllers.topRight,i.controllers.right,i.controllers.bottomRight,i.controllers.bottom,i.controllers.bottomLeft,i.controllers.left].forEach((e=>{t.beginPath(),t.moveTo(e.x-i.controllerSize/2,e.y-i.controllerSize/2),t.lineTo(e.x+i.controllerSize/2,e.y+i.controllerSize/2),t.stroke(),t.closePath(),t.beginPath(),t.moveTo(e.x+i.controllerSize/2,e.y-i.controllerSize/2),t.lineTo(e.x-i.controllerSize/2,e.y+i.controllerSize/2),t.stroke(),t.closePath()})))}))}(t,e),function(t,e){if(!(null==e?void 0:e.selectedAreaWrapper))return;const i=e.selectedAreaWrapper;i&&i.w>0&&i.h>0&&(De(t),t.setGlobalAlpha(.3),t.setFillStyle(i.color),t.fillRect(i.x,i.y,i.w,i.h),De(t),t.beginPath(),t.setLineDash(i.lineDash),t.setLineWidth(i.lineWidth),t.setStrokeStyle(i.color),t.moveTo(i.x,i.y),t.lineTo(i.x+i.w,i.y),t.lineTo(i.x+i.w,i.y+i.h),t.lineTo(i.x,i.y+i.h),t.lineTo(i.x,i.y),t.stroke(),t.closePath())}(t,e),function(t,e){if(!Array.isArray(null==e?void 0:e.selectedElementListWrappers))return;const i=e.selectedElementListWrappers;null==i||i.forEach((e=>{De(t),$t(t,e.translate,e.radian||0,(()=>{De(t),t.setGlobalAlpha(.05),t.setFillStyle(e.color),t.fillRect(e.controllers.topLeft.x,e.controllers.topLeft.y,e.controllers.bottomRight.x-e.controllers.topLeft.x,e.controllers.bottomRight.y-e.controllers.topLeft.y),De(t),t.beginPath(),t.setLineDash(e.lineDash),t.setLineWidth(e.lineWidth),t.setStrokeStyle(e.color),t.moveTo(e.controllers.topLeft.x,e.controllers.topLeft.y),t.lineTo(e.controllers.topRight.x,e.controllers.topRight.y),t.lineTo(e.controllers.bottomRight.x,e.controllers.bottomRight.y),t.lineTo(e.controllers.bottomLeft.x,e.controllers.bottomLeft.y),t.lineTo(e.controllers.topLeft.x,e.controllers.topLeft.y-e.lineWidth/2),t.stroke(),t.closePath(),!0===e.lock&&(De(t),t.setStrokeStyle(e.color),[e.controllers.topLeft,e.controllers.top,e.controllers.topRight,e.controllers.right,e.controllers.bottomRight,e.controllers.bottom,e.controllers.bottomLeft,e.controllers.left].forEach((i=>{t.beginPath(),t.moveTo(i.x-e.controllerSize/2,i.y-e.controllerSize/2),t.lineTo(i.x+e.controllerSize/2,i.y+e.controllerSize/2),t.stroke(),t.closePath(),t.beginPath(),t.moveTo(i.x+e.controllerSize/2,i.y-e.controllerSize/2),t.lineTo(i.x-e.controllerSize/2,i.y+e.controllerSize/2),t.stroke(),t.closePath()})))}))}))}(t,e),this[he].draw()};this[ge].on("drawFrame",(t=>{l()})),this[ge].on("drawFrameComplete",(t=>{l()})),this[me]=new qt(this[he].getContext()),this[Se]=new Le({coreEvent:this[_e],board:this[he],element:this[me],config:this[ue],drawFeekback:this[pe].bind(this),getDataFeekback:()=>this[ce],selectElementByIndex:this.selectElementByIndex.bind(this),emitChangeScreen:this[ve].bind(this),emitChangeData:this[xe].bind(this)}),this[Se].init(),this[ge].on("drawFrame",(()=>{this[_e].trigger("drawFrame",void 0)})),this[ge].on("drawFrameComplete",(()=>{this[_e].trigger("drawFrameComplete",void 0)})),this[fe].set("hasInited",!0)}[(ye=_e,be=fe,pe)](t){this[Se].updateHelperConfig({width:this[de].width,height:this[de].height,devicePixelRatio:this[de].devicePixelRatio}),this[ge].thaw(),this[ge].render(this[he].getContext(),this[ce],{changeResourceUUIDs:(null==t?void 0:t.resourceChangeUUIDs)||[]})}getElement(t){return function(t,e){let i=null;const s=t[Se].helper.getElementIndexByUUID(e);return null!==s&&t[ce].elements[s]&&(i=n(t[ce].elements[s])),i}(this,t)}getElementByIndex(t){return function(t,e){let i=null;return e>=0&&t[ce].elements[e]&&(i=n(t[ce].elements[e])),i}(this,t)}selectElementByIndex(t,e){return function(t,e,i){if(t[ce].elements[e]){const n=t[ce].elements[e].uuid;!0===(null==i?void 0:i.useMode)?t[Se].temp.set("mode",we.SELECT_ELEMENT):t[Se].temp.set("mode",we.NULL),"string"==typeof n&&(t[Se].temp.set("selectedUUID",n),t[Se].temp.set("selectedUUIDList",[])),t[pe]()}}(this,t,e)}selectElement(t,e){return function(t,e,i){const n=t[Se].helper.getElementIndexByUUID(e);"number"==typeof n&&n>=0&&t.selectElementByIndex(n,i)}(this,t,e)}moveUpElement(t){return function(t,e){const i=t[Se].helper.getElementIndexByUUID(e);if("number"==typeof i&&i>=0&&i<t[ce].elements.length-1){const e=t[ce].elements[i];t[ce].elements[i]=t[ce].elements[i+1],t[ce].elements[i+1]=e}t[xe](),t[pe]()}(this,t)}moveDownElement(t){return function(t,e){const i=t[Se].helper.getElementIndexByUUID(e);if("number"==typeof i&&i>0&&i<t[ce].elements.length){const e=t[ce].elements[i];t[ce].elements[i]=t[ce].elements[i-1],t[ce].elements[i-1]=e}t[xe](),t[pe]()}(this,t)}updateElement(t){return function(t,e){var i;const s=n(e),o=t[ce],r=[];for(let t=0;t<o.elements.length;t++)if(s.uuid===(null==(i=o.elements[t])?void 0:i.uuid)){const e=Ht(o.elements[t],s);"string"==typeof e&&r.push(e),o.elements[t]=s;break}t[xe](),t[pe]({resourceChangeUUIDs:r})}(this,t)}addElement(t){return function(t,e){const s=n(e);return s.uuid=i(),t[ce].elements.push(s),t[xe](),t[pe](),s.uuid}(this,t)}deleteElement(t){return function(t,e){const i=t[me].getElementIndex(t[ce],e);i>=0&&(t[ce].elements.splice(i,1),t[xe](),t[pe]())}(this,t)}insertElementBefore(t,e){return function(t,e,i){const n=t[Se].helper.getElementIndexByUUID(i);return null!==n?t.insertElementBeforeIndex(e,n):null}(this,t,e)}insertElementBeforeIndex(t,e){return function(t,e,s){const o=n(e);return o.uuid=i(),s>=0?(t[ce].elements.splice(s,0,o),t[xe](),t[pe](),o.uuid):null}(this,t,e)}getSelectedElements(){return function(t){const e=[];let i=[];const s=t[Se].temp.get("selectedUUID");return"string"==typeof s&&s?i.push(s):i=t[Se].temp.get("selectedUUIDList"),i.forEach((i=>{var n;const s=t[Se].helper.getElementIndexByUUID(i);if(null!==s&&s>=0){const i=null==(n=t[ce])?void 0:n.elements[s];i&&e.push(i)}})),n(e)}(this)}insertElementAfter(t,e){return function(t,e,i){const n=t[Se].helper.getElementIndexByUUID(i);return null!==n?t.insertElementAfterIndex(e,n):null}(this,t,e)}insertElementAfterIndex(t,e){return function(t,e,s){const o=n(e);return o.uuid=i(),s>=0?(t[ce].elements.splice(s+1,0,o),t[xe](),t[pe](),o.uuid):null}(this,t,e)}resetSize(t){this[de]={...this[de],...t},this[he].resetSize(t),this[pe]()}scale(t){const e=this[he].scale(t);return this[pe](),this[ve](),e}scrollLeft(t){const e=this[he].scrollX(0-t);return this[pe](),this[ve](),e}scrollTop(t){const e=this[he].scrollY(0-t);return this[pe](),this[ve](),e}getScreenTransform(){const t=this[he].getTransform();return{scale:t.scale,scrollTop:Math.max(0,0-t.scrollY),scrollLeft:Math.max(0,0-t.scrollX)}}getData(){return n(this[ce])}setData(t,e){const i=function(t,e){var i;const n=[],s=Bt(t),o=Bt(e);for(const t in o)if(!0===["image","svg","html"].includes(null==(i=o[t])?void 0:i.type))if(s[t]){let e=!1;switch(s[t].type){case"image":e=Yt(s[t],o[t]);break;case"svg":e=Nt(s[t],o[t]);break;case"html":e=Xt(s[t],o[t])}!0===e&&n.push(t)}else n.push(t);return n}(this[ce],t);this[ce]=this[me].initData(n(le(t))),e&&!0===e.triggerChangeEvent&&this[xe](),this[pe]({resourceChangeUUIDs:i})}clearOperation(){this[fe].clear(),this[pe]()}on(t,e){this[_e].on(t,e)}off(t,e){this[_e].off(t,e)}pointScreenToContext(t){return this[he].pointScreenToContext(t)}pointContextToScreen(t){return this[he].pointContextToScreen(t)}__getBoardContext(){return this[he].getContext()}__getDisplayContext2D(){return this[he].getDisplayContext2D()}__getOriginContext2D(){return this[he].getOriginContext2D()}[ve](){this[_e].has("changeScreen")&&this[_e].trigger("changeScreen",{...this.getScreenTransform()})}[xe](){this[_e].has("changeData")&&this[_e].trigger("changeData",n(this[ce]))}}return Me.is=Tt,Me.check=Wt,Me}();
|
|
1
|
+
var iDrawCore=function(){"use strict";function t(t,e){let i=-1;return function(...n){i>0||(i=setTimeout((()=>{t(...n),i=-1}),e))}}function e(t){return"string"==typeof t&&/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)}function i(){function t(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return`${t()}${t()}-${t()}-${t()}-${t()}-${t()}${t()}${t()}`}function n(t){return function t(e){const i=(n=e,Object.prototype.toString.call(n).replace(/[\]|\[]{1,1}/gi,"").split(" ")[1]);var n;if(["Null","Number","String","Boolean","Undefined"].indexOf(i)>=0)return e;if("Array"===i){const i=[];return e.forEach((e=>{i.push(t(e))})),i}if("Object"===i){const i={};return Object.keys(e).forEach((n=>{i[n]=t(e[n])})),i}}(t)}function s(t){return(Object.prototype.toString.call(t)||"").replace(/(\[object|\])/gi,"").trim()}const o={type(t,e){const i=s(t);return!0===e?i.toLocaleLowerCase():i},array:t=>"Array"===s(t),json:t=>"Object"===s(t),function:t=>"Function"===s(t),asyncFunction:t=>"AsyncFunction"===s(t),string:t=>"String"===s(t),number:t=>"Number"===s(t),undefined:t=>"Undefined"===s(t),null:t=>"Null"===s(t),promise:t=>"Promise"===s(t)};var r=globalThis&&globalThis.__awaiter||function(t,e,i,n){return new(i||(i=Promise))((function(s,o){function r(t){try{a(n.next(t))}catch(t){o(t)}}function l(t){try{a(n.throw(t))}catch(t){o(t)}}function a(t){var e;t.done?s(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(r,l)}a((n=n.apply(t,e||[])).next())}))};const{Image:l}=window;function a(t){return new Promise(((e,i)=>{const n=new l;n.crossOrigin="anonymous",n.onload=function(){e(n)},n.onabort=i,n.onerror=i,n.src=t}))}function h(t){return r(this,void 0,void 0,(function*(){const e=yield function(t){return new Promise(((e,i)=>{const n=new Blob([t],{type:"image/svg+xml;charset=utf-8"}),s=new FileReader;s.readAsDataURL(n),s.onload=function(t){var i;const n=null===(i=null==t?void 0:t.target)||void 0===i?void 0:i.result;e(n)},s.onerror=function(t){i(t)}}))}(t);return yield a(e)}))}function c(t,e){return r(this,void 0,void 0,(function*(){t=t.replace(/\&/gi,"&");const i=yield function(t,e){const{width:i,height:n}=e;return new Promise(((e,s)=>{const o=new Blob([`\n <svg xmlns="http://www.w3.org/2000/svg" width="${i||""}" height = "${n||""}">\n <foreignObject width="100%" height="100%">\n <div xmlns = "http://www.w3.org/1999/xhtml">\n ${t}\n </div>\n </foreignObject>\n </svg>\n `],{type:"image/svg+xml;charset=utf-8"}),r=new FileReader;r.readAsDataURL(o),r.onload=function(t){var i;const n=null===(i=null==t?void 0:t.target)||void 0===i?void 0:i.result;e(n)},r.onerror=function(t){s(t)}}))}(t,e);return yield a(i)}))}let d=class{constructor(t,e){this._opts=e,this._ctx=t,this._transform={scale:1,scrollX:0,scrollY:0}}getContext(){return this._ctx}resetSize(t){this._opts=Object.assign(Object.assign({},this._opts),t)}calcDeviceNum(t){return t*this._opts.devicePixelRatio}calcScreenNum(t){return t/this._opts.devicePixelRatio}getSize(){return{width:this._opts.width,height:this._opts.height,contextWidth:this._opts.contextWidth,contextHeight:this._opts.contextHeight,devicePixelRatio:this._opts.devicePixelRatio}}setTransform(t){this._transform=Object.assign(Object.assign({},this._transform),t)}getTransform(){return{scale:this._transform.scale,scrollX:this._transform.scrollX,scrollY:this._transform.scrollY}}setFillStyle(t){this._ctx.fillStyle=t}fill(t){return this._ctx.fill(t||"nonzero")}arc(t,e,i,n,s,o){return this._ctx.arc(this._doSize(t),this._doSize(e),this._doSize(i),n,s,o)}rect(t,e,i,n){return this._ctx.rect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(n))}fillRect(t,e,i,n){return this._ctx.fillRect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(n))}clearRect(t,e,i,n){return this._ctx.clearRect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(n))}beginPath(){return this._ctx.beginPath()}closePath(){return this._ctx.closePath()}lineTo(t,e){return this._ctx.lineTo(this._doSize(t),this._doSize(e))}moveTo(t,e){return this._ctx.moveTo(this._doSize(t),this._doSize(e))}arcTo(t,e,i,n,s){return this._ctx.arcTo(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(n),this._doSize(s))}setLineWidth(t){return this._ctx.lineWidth=this._doSize(t)}setLineDash(t){return this._ctx.setLineDash(t.map((t=>this._doSize(t))))}isPointInPath(t,e){return this._ctx.isPointInPath(this._doX(t),this._doY(e))}isPointInPathWithoutScroll(t,e){return this._ctx.isPointInPath(this._doSize(t),this._doSize(e))}setStrokeStyle(t){this._ctx.strokeStyle=t}stroke(){return this._ctx.stroke()}translate(t,e){return this._ctx.translate(this._doSize(t),this._doSize(e))}rotate(t){return this._ctx.rotate(t)}drawImage(...t){const e=t[0],i=t[1],n=t[2],s=t[3],o=t[4],r=t[t.length-4],l=t[t.length-3],a=t[t.length-2],h=t[t.length-1];return 9===t.length?this._ctx.drawImage(e,this._doSize(i),this._doSize(n),this._doSize(s),this._doSize(o),this._doSize(r),this._doSize(l),this._doSize(a),this._doSize(h)):this._ctx.drawImage(e,this._doSize(r),this._doSize(l),this._doSize(a),this._doSize(h))}createPattern(t,e){return this._ctx.createPattern(t,e)}measureText(t){return this._ctx.measureText(t)}setTextAlign(t){this._ctx.textAlign=t}fillText(t,e,i,n){return void 0!==n?this._ctx.fillText(t,this._doSize(e),this._doSize(i),this._doSize(n)):this._ctx.fillText(t,this._doSize(e),this._doSize(i))}strokeText(t,e,i,n){return void 0!==n?this._ctx.strokeText(t,this._doSize(e),this._doSize(i),this._doSize(n)):this._ctx.strokeText(t,this._doSize(e),this._doSize(i))}setFont(t){const e=[];"bold"===t.fontWeight&&e.push(`${t.fontWeight}`),e.push(`${this._doSize(t.fontSize||12)}px`),e.push(`${t.fontFamily||"sans-serif"}`),this._ctx.font=`${e.join(" ")}`}setTextBaseline(t){this._ctx.textBaseline=t}setGlobalAlpha(t){this._ctx.globalAlpha=t}save(){this._ctx.save()}restore(){this._ctx.restore()}scale(t,e){this._ctx.scale(t,e)}setShadowColor(t){this._ctx.shadowColor=t}setShadowOffsetX(t){this._ctx.shadowOffsetX=this._doSize(t)}setShadowOffsetY(t){this._ctx.shadowOffsetY=this._doSize(t)}setShadowBlur(t){this._ctx.shadowBlur=this._doSize(t)}ellipse(t,e,i,n,s,o,r,l){this._ctx.ellipse(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(n),s,o,r,l)}_doSize(t){return this._opts.devicePixelRatio*t}_doX(t){const{scale:e,scrollX:i}=this._transform,n=(t-i)/e;return this._doSize(n)}_doY(t){const{scale:e,scrollY:i}=this._transform,n=(t-i)/e;return this._doSize(n)}};function u(t){return"number"==typeof t&&(t>0||t<=0)}function g(t){return"number"==typeof t&&t>=0}function m(t){return"string"==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${t}`)}function f(t){return"string"==typeof t&&/^(data:image\/)/.test(`${t}`)}const p={x:function(t){return u(t)},y:function(t){return u(t)},w:g,h:function(t){return"number"==typeof t&&t>=0},angle:function(t){return"number"==typeof t&&t>=-360&&t<=360},number:u,borderWidth:function(t){return g(t)},borderRadius:function(t){return u(t)&&t>=0},color:function(t){return e(t)},imageSrc:function(t){return f(t)||m(t)},imageURL:m,imageBase64:f,svg:function(t){return"string"==typeof t&&/^(<svg[\s]{1,}|<svg>)/i.test(`${t}`.trim())&&/<\/[\s]{0,}svg>$/i.test(`${t}`.trim())},html:function(t){let e=!1;if("string"==typeof t){let i=document.createElement("div");i.innerHTML=t,i.children.length>0&&(e=!0),i=null}return e},text:function(t){return"string"==typeof t},fontSize:function(t){return u(t)&&t>0},lineHeight:function(t){return u(t)&&t>0},textAlign:function(t){return["center","left","right"].includes(t)},fontFamily:function(t){return"string"==typeof t&&t.length>0},fontWeight:function(t){return["bold"].includes(t)},strokeWidth:function(t){return u(t)&&t>0}};function _(t={}){const{borderColor:e,borderRadius:i,borderWidth:n}=t;return!(t.hasOwnProperty("borderColor")&&!p.color(e))&&(!(t.hasOwnProperty("borderRadius")&&!p.number(i))&&!(t.hasOwnProperty("borderWidth")&&!p.number(n)))}const v={attrs:function(t){const{x:e,y:i,w:n,h:s,angle:o}=t;return!!(p.x(e)&&p.y(i)&&p.w(n)&&p.h(s)&&p.angle(o))&&(o>=-360&&o<=360)},textDesc:function(t){const{text:e,color:i,fontSize:n,lineHeight:s,fontFamily:o,textAlign:r,fontWeight:l,bgColor:a,strokeWidth:h,strokeColor:c}=t;return!!p.text(e)&&(!!p.color(i)&&(!!p.fontSize(n)&&(!(t.hasOwnProperty("bgColor")&&!p.color(a))&&(!(t.hasOwnProperty("fontWeight")&&!p.fontWeight(l))&&(!(t.hasOwnProperty("lineHeight")&&!p.lineHeight(s))&&(!(t.hasOwnProperty("fontFamily")&&!p.fontFamily(o))&&(!(t.hasOwnProperty("textAlign")&&!p.textAlign(r))&&(!(t.hasOwnProperty("strokeWidth")&&!p.strokeWidth(h))&&(!(t.hasOwnProperty("strokeColor")&&!p.color(c))&&!!_(t))))))))))},rectDesc:function(t){const{bgColor:e}=t;return!(t.hasOwnProperty("bgColor")&&!p.color(e))&&!!_(t)},circleDesc:function(t){const{bgColor:e,borderColor:i,borderWidth:n}=t;return!(t.hasOwnProperty("bgColor")&&!p.color(e))&&(!(t.hasOwnProperty("borderColor")&&!p.color(i))&&!(t.hasOwnProperty("borderWidth")&&!p.number(n)))},imageDesc:function(t){const{src:e}=t;return!!p.imageSrc(e)},svgDesc:function(t){const{svg:e}=t;return!!p.svg(e)},htmlDesc:function(t){const{html:e}=t;return!!p.html(e)}},x={is:p,check:v,delay:function(t){return new Promise((e=>{setTimeout((()=>{e()}),t)}))},compose:function(t){return function(e,i){return function n(s){let o=t[s];s===t.length&&i&&(o=i);if(!o)return Promise.resolve();try{return Promise.resolve(o(e,n.bind(null,s+1)))}catch(t){return Promise.reject(t)}}(0)}},throttle:t,loadImage:a,loadSVG:h,loadHTML:c,downloadImageFromCanvas:function(t,e){const{filename:i,type:n="image/jpeg"}=e,s=t.toDataURL(n),o=document.createElement("a");o.href=s,o.download=i;const r=document.createEvent("MouseEvents");r.initEvent("click",!0,!1),o.dispatchEvent(r)},toColorHexStr:function(t){return"#"+t.toString(16)},toColorHexNum:function(t){return parseInt(t.replace(/^\#/,"0x"))},isColorStr:e,createUUID:i,istype:o,deepClone:n,Context:d};class S{constructor(){this._listeners=new Map}on(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);null==i||i.push(e),this._listeners.set(t,i||[])}else this._listeners.set(t,[e])}off(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);if(Array.isArray(i))for(let t=0;t<(null==i?void 0:i.length);t++)if(i[t]===e){i.splice(t,1);break}this._listeners.set(t,i||[])}}trigger(t,e){const i=this._listeners.get(t);return!!Array.isArray(i)&&(i.forEach((t=>{t(e)})),!0)}has(t){if(this._listeners.has(t)){const e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1}}class y{constructor(t,e){this._isMoving=!1,this._temp=new class{constructor(){this._temp={prevClickPoint:null,isHoverCanvas:!1,isDragCanvas:!1,statusMap:{canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}}}set(t,e){this._temp[t]=e}get(t){return this._temp[t]}clear(){this._temp={prevClickPoint:null,isHoverCanvas:!1,isDragCanvas:!1,statusMap:{canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}}}},this._container=window,this._canvas=t,this._isMoving=!1,this._initEvent(),this._event=new S}setStatusMap(t){this._temp.set("statusMap",t)}on(t,e){this._event.on(t,e)}off(t,e){this._event.off(t,e)}_initEvent(){const t=this._canvas,e=this._container;e.addEventListener("mousemove",this._listenWindowMove.bind(this),!1),e.addEventListener("mouseup",this._listenWindowMoveEnd.bind(this),!1),t.addEventListener("mousemove",this._listenHover.bind(this),!1),t.addEventListener("mousedown",this._listenMoveStart.bind(this),!1),t.addEventListener("mousemove",this._listenMove.bind(this),!1),t.addEventListener("mouseup",this._listenMoveEnd.bind(this),!1),t.addEventListener("click",this._listenCanvasClick.bind(this),!1),t.addEventListener("wheel",this._listenCanvasWheel.bind(this),!1),t.addEventListener("mousedown",this._listenCanvasMoveStart.bind(this),!0),t.addEventListener("mouseup",this._listenCanvasMoveEnd.bind(this),!0),t.addEventListener("mouseover",this._listenCanvasMoveOver.bind(this),!0),t.addEventListener("mouseleave",this._listenCanvasMoveLeave.bind(this),!0),this._initParentEvent()}_initParentEvent(){try{let t=window;const e=t.origin;for(;t.self!==t.top&&(t.self!==t.parent&&t.origin===e&&t.parent.window.addEventListener("mousemove",this._listSameOriginParentWindow.bind(this),!1),t=t.parent,t););}catch(t){console.warn(t)}}_listenHover(t){t.preventDefault();const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.has("hover")&&this._event.trigger("hover",e),this._isMoving=!0}_listenMoveStart(t){t.preventDefault();const e=this._getPosition(t);this._isVaildPoint(e)&&(this._event.has("point")&&this._event.trigger("point",e),this._event.has("moveStart")&&this._event.trigger("moveStart",e)),this._isMoving=!0}_listenMove(t){if(t.preventDefault(),t.stopPropagation(),this._event.has("move")&&!0===this._isMoving){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("move",e)}}_listenMoveEnd(t){if(t.preventDefault(),this._event.has("moveEnd")){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("moveEnd",e)}this._isMoving=!1}_listSameOriginParentWindow(){this._temp.get("isHoverCanvas")&&this._event.has("leave")&&this._event.trigger("leave",void 0),this._temp.get("isDragCanvas")&&this._event.has("moveEnd")&&this._event.trigger("moveEnd",{x:NaN,y:NaN}),this._isMoving=!1,this._temp.set("isDragCanvas",!1),this._temp.set("isHoverCanvas",!1)}_listenCanvasMoveStart(){this._temp.get("isHoverCanvas")&&this._temp.set("isDragCanvas",!0)}_listenCanvasMoveEnd(){this._temp.set("isDragCanvas",!1)}_listenCanvasMoveOver(){this._temp.set("isHoverCanvas",!0)}_listenCanvasMoveLeave(){this._temp.set("isHoverCanvas",!1),this._event.has("leave")&&this._event.trigger("leave",void 0)}_listenWindowMove(t){if(!0===this._temp.get("isDragCanvas")&&(t.preventDefault(),t.stopPropagation(),this._event.has("move")&&!0===this._isMoving)){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("move",e)}}_listenWindowMoveEnd(t){if(!0!=!this._temp.get("isDragCanvas")){if(t.preventDefault(),this._event.has("moveEnd")){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("moveEnd",e)}this._temp.set("isDragCanvas",!1),this._isMoving=!1}}_listenCanvasWheel(t){this._event.has("wheelX")&&(t.deltaX>0||t.deltaX<0)&&this._event.trigger("wheelX",t.deltaX),this._event.has("wheelY")&&(t.deltaY>0||t.deltaY<0)&&this._event.trigger("wheelY",t.deltaY);const{canScrollYNext:e,canScrollYPrev:i}=this._temp.get("statusMap");(t.deltaX>0&&t.deltaX<0||t.deltaY>0&&!0===e||t.deltaY<0&&!0===i)&&t.preventDefault()}_listenCanvasClick(t){t.preventDefault();const e=this._getPosition(t),i=Date.now();if(this._isVaildPoint(e)){const t=this._temp.get("prevClickPoint");t&&i-t.t<=500&&Math.abs(t.x-e.x)<=5&&Math.abs(t.y-e.y)<=5?this._event.has("doubleClick")&&this._event.trigger("doubleClick",{x:e.x,y:e.y}):this._temp.set("prevClickPoint",{x:e.x,y:e.y,t:i})}}_getPosition(t){const e=this._canvas;let i=0,n=0;if(t&&t.touches&&t.touches.length>0){const e=t.touches[0];e&&(i=e.clientX,n=e.clientY)}else i=t.clientX,n=t.clientY;return{x:i-e.getBoundingClientRect().left,y:n-e.getBoundingClientRect().top,t:Date.now()}}_isVaildPoint(t){return b(t.x)&&b(t.y)}}function b(t){return t>0||t<0||0===t}const w={lineWidth:12,color:"#a0a0a0"};class E{constructor(t,e){this._displayCtx=t,this._opts=this._getOpts(e)}draw(t){const{width:e,height:i}=this._opts,n=this.calc(t),s=this._displayCtx;n.xSize>0&&(s.globalAlpha=.2,s.fillStyle=n.color,s.fillRect(0,this._doSize(i-n.lineSize),this._doSize(e),this._doSize(n.lineSize)),s.globalAlpha=1,C(s,{x:this._doSize(n.translateX),y:this._doSize(i-n.lineSize),w:this._doSize(n.xSize),h:this._doSize(n.lineSize),r:this._doSize(n.lineSize/2),color:n.color})),n.ySize>0&&(s.globalAlpha=.2,s.fillStyle=n.color,s.fillRect(this._doSize(e-n.lineSize),0,this._doSize(n.lineSize),this._doSize(i)),s.globalAlpha=1,C(s,{x:this._doSize(e-n.lineSize),y:this._doSize(n.translateY),w:this._doSize(n.lineSize),h:this._doSize(n.ySize),r:this._doSize(n.lineSize/2),color:n.color})),s.globalAlpha=1}resetSize(t){this._opts=Object.assign(Object.assign({},this._opts),t)}isPointAtScrollY(t){const{width:e,height:i,scrollConfig:n}=this._opts,s=this._displayCtx;return s.beginPath(),s.rect(this._doSize(e-n.lineWidth),0,this._doSize(n.lineWidth),this._doSize(i)),s.closePath(),!!s.isPointInPath(this._doSize(t.x),this._doSize(t.y))}isPointAtScrollX(t){const{width:e,height:i,scrollConfig:n}=this._opts,s=this._displayCtx;return s.beginPath(),s.rect(0,this._doSize(i-n.lineWidth),this._doSize(e-n.lineWidth),this._doSize(n.lineWidth)),s.closePath(),!!s.isPointInPath(this._doSize(t.x),this._doSize(t.y))}getLineWidth(){return this._opts.scrollConfig.lineWidth}calc(t){const{width:e,height:i,scrollConfig:n}=this._opts,s=2.5*n.lineWidth,o=n.lineWidth;let r=0,l=0;t.left<=0&&t.right<=0&&(r=Math.max(s,e-(Math.abs(t.left)+Math.abs(t.right))),r>=e&&(r=0)),(t.top<=0||t.bottom<=0)&&(l=Math.max(s,i-(Math.abs(t.top)+Math.abs(t.bottom))),l>=i&&(l=0));let a=0;r>0&&(a=r/2+(e-r)*Math.abs(t.left)/(Math.abs(t.left)+Math.abs(t.right)),a=Math.min(Math.max(0,a-r/2),e-r));let h=0;l>0&&(h=l/2+(i-l)*Math.abs(t.top)/(Math.abs(t.top)+Math.abs(t.bottom)),h=Math.min(Math.max(0,h-l/2),i-l));return{lineSize:o,xSize:r,ySize:l,translateY:h,translateX:a,color:this._opts.scrollConfig.color}}_doSize(t){return t*this._opts.devicePixelRatio}_getOpts(t){const i=Object.assign({scrollConfig:w},t);return i.scrollConfig||(i.scrollConfig=w),i.scrollConfig.lineWidth>0||(i.scrollConfig.lineWidth=w.lineWidth),i.scrollConfig.lineWidth=Math.max(i.scrollConfig.lineWidth,w.lineWidth),!0!==e(i.scrollConfig.color)&&(i.scrollConfig.color=i.scrollConfig.color),i}}function C(t,e){const{x:i,y:n,w:s,h:o,color:r}=e;let l=e.r;l=Math.min(l,s/2,o/2),(s<2*l||o<2*l)&&(l=0),t.beginPath(),t.moveTo(i+l,n),t.arcTo(i+s,n,i+s,n+o,l),t.arcTo(i+s,n+o,i,n+o,l),t.arcTo(i,n+o,i,n,l),t.arcTo(i,n,i+s,n,l),t.closePath(),t.fillStyle=r,t.fill()}const P=Symbol("_opts"),L=Symbol("_ctx");class D{constructor(t,e){this[P]=e,this[L]=t}resetSize(t){this[P]=Object.assign(Object.assign({},this[P]),t)}calcScreen(){const t=this[L].getTransform().scale,{width:e,height:i,contextWidth:n,contextHeight:s,devicePixelRatio:o}=this[P];let r=!0,l=!0,a=!0,h=!0;n*t<=e&&(this[L].setTransform({scrollX:(e-n*t)/2}),r=!1,l=!1),s*t<=i&&(this[L].setTransform({scrollY:(i-s*t)/2}),a=!1,h=!1),n*t>=e&&this[L].getTransform().scrollX>0&&(this[L].setTransform({scrollX:0}),r=!1),s*t>=i&&this[L].getTransform().scrollY>0&&(this[L].setTransform({scrollY:0}),a=!1);const{scrollX:c,scrollY:d}=this[L].getTransform();c<0&&Math.abs(c)>Math.abs(n*t-e)&&(this[L].setTransform({scrollX:0-Math.abs(n*t-e)}),l=!1),d<0&&Math.abs(d)>Math.abs(s*t-i)&&(this[L].setTransform({scrollY:0-Math.abs(s*t-i)}),h=!1);const{scrollX:u,scrollY:g}=this[L].getTransform();return{size:{x:u*t,y:g*t,w:n*t,h:s*t},position:{top:g,bottom:i-(s*t+g),left:u,right:e-(n*t+u)},deviceSize:{x:u*o,y:g*o,w:n*o*t,h:s*o*t},width:this[P].width,height:this[P].height,devicePixelRatio:this[P].devicePixelRatio,canScrollYPrev:a,canScrollYNext:h,canScrollXPrev:r,canScrollXNext:l}}calcScreenScroll(t,e,i,n,s){let o=t,r=n-i;t<=0&&e<=0&&(r=Math.abs(t)+Math.abs(e));let l=1;return r>0&&(l=r/(n-i)),o=0-l*s,o}}const M=Symbol("_canvas"),I=Symbol("_displayCanvas"),z=Symbol("_helperCanvas"),T=Symbol("_mount"),k=Symbol("_opts"),W=Symbol("_hasRendered"),U=Symbol("_ctx"),R=Symbol("_helperCtx"),A=Symbol("_watcher"),O=Symbol("_render"),F=Symbol("_parsePrivateOptions"),Y=Symbol("_scroller"),N=Symbol("_initEvent"),X=Symbol("_doScrollX"),H=Symbol("_doScrollY"),B=Symbol("_doMoveScroll"),j=Symbol("_resetContext"),$=Symbol("_screen");var G;const{throttle:Q,Context:V}=x;class Z{constructor(t,e){this[G]=!1,this[T]=t,this[M]=document.createElement("canvas"),this[z]=document.createElement("canvas"),this[I]=document.createElement("canvas"),this[T].appendChild(this[I]),this[k]=this[F](e);const i=this[M].getContext("2d"),n=this[I].getContext("2d"),s=this[z].getContext("2d");this[U]=new V(i,this[k]),this[R]=new V(s,this[k]),this[$]=new D(this[U],this[k]),this[A]=new y(this[I],this[U]),this[Y]=new E(n,{width:e.width,height:e.height,devicePixelRatio:e.devicePixelRatio||1,scrollConfig:e.scrollConfig}),this[O]()}getDisplayContext2D(){return this[I].getContext("2d")}getOriginContext2D(){return this[U].getContext()}getHelperContext2D(){return this[R].getContext()}getContext(){return this[U]}getHelperContext(){return this[R]}scale(t){t>0&&(this[U].setTransform({scale:t}),this[R].setTransform({scale:t}));const{position:e,size:i}=this[$].calcScreen();return{position:e,size:i}}scrollX(t){this[A].setStatusMap({canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}),(t>=0||t<0)&&(this[U].setTransform({scrollX:t}),this[R].setTransform({scrollX:t}));const{position:e,size:i,canScrollXNext:n,canScrollYNext:s,canScrollXPrev:o,canScrollYPrev:r}=this[$].calcScreen();return this[A].setStatusMap({canScrollYPrev:r,canScrollYNext:s,canScrollXPrev:o,canScrollXNext:n}),{position:e,size:i}}scrollY(t){this[A].setStatusMap({canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}),(t>=0||t<0)&&(this[U].setTransform({scrollY:t}),this[R].setTransform({scrollY:t}));const{position:e,size:i,canScrollXNext:n,canScrollYNext:s,canScrollXPrev:o,canScrollYPrev:r}=this[$].calcScreen();return this[A].setStatusMap({canScrollYPrev:r,canScrollYNext:s,canScrollXPrev:o,canScrollXNext:n}),{position:e,size:i}}getTransform(){return this[U].getTransform()}draw(){this.clear();const{position:t,deviceSize:e,size:i}=this[$].calcScreen(),n=this[I].getContext("2d");return null==n||n.drawImage(this[M],e.x,e.y,e.w,e.h),null==n||n.drawImage(this[z],e.x,e.y,e.w,e.h),!0===this[k].canScroll&&this[Y].draw(t),{position:t,size:i}}clear(){const t=this[I].getContext("2d");null==t||t.clearRect(0,0,this[I].width,this[I].height)}on(t,e){this[A].on(t,e)}off(t,e){this[A].off(t,e)}getScreenInfo(){return this[$].calcScreen()}setCursor(t){this[I].style.cursor=t}resetCursor(){this[I].style.cursor="auto"}resetSize(t){this[k]=Object.assign(Object.assign({},this[k]),t),this[j](),this[U].resetSize(t),this[R].resetSize(t),this[$].resetSize(t),this[Y].resetSize({width:this[k].width,height:this[k].height,devicePixelRatio:this[k].devicePixelRatio}),this.draw()}getScrollLineWidth(){let t=0;return!0===this[k].canScroll&&(t=this[Y].getLineWidth()),t}pointScreenToContext(t){const{scrollX:e,scrollY:i,scale:n}=this.getTransform();return{x:(t.x-e)/n,y:(t.y-i)/n}}pointContextToScreen(t){const{scrollX:e,scrollY:i,scale:n}=this.getTransform();return{x:t.x*n+e,y:t.y*n+i}}[(G=W,O)](){!0!==this[W]&&(this[j](),this[N](),this[W]=!0)}[j](){const{width:t,height:e,contextWidth:i,contextHeight:n,devicePixelRatio:s}=this[k];this[M].width=i*s,this[M].height=n*s,this[z].width=i*s,this[z].height=n*s,this[I].width=t*s,this[I].height=e*s,function(t,e){const i=function(t){const e={};return(t.getAttribute("style")||"").split(";").forEach((t=>{const i=t.split(":");i[0]&&"string"==typeof i[0]&&(e[i[0]]=i[1]||"")})),e}(t),n=Object.assign(Object.assign({},i),e),s=Object.keys(n);let o="";s.forEach((t=>{o+=`${t}:${n[t]||""};`})),t.setAttribute("style",o)}(this[I],{width:`${t}px`,height:`${e}px`})}[F](t){return Object.assign(Object.assign({},{devicePixelRatio:1}),t)}[N](){if(!0!==this[W]&&!0===this[k].canScroll){this.on("wheelX",Q((t=>{this[X](t)}),16)),this.on("wheelY",Q((t=>{this[H](t)}),16));let t=null;this.on("moveStart",Q((e=>{this[Y].isPointAtScrollX(e)?t="x":this[Y].isPointAtScrollY(e)&&(t="y")}),16)),this.on("move",Q((e=>{t&&this[B](t,e)}),16)),this.on("moveEnd",Q((e=>{t&&this[B](t,e),t=null}),16))}}[X](t,e){const{width:i}=this[k];let n=e;"number"==typeof n&&(n>0||n<=0)||(n=this[U].getTransform().scrollX);const{position:s}=this[$].calcScreen(),{xSize:o}=this[Y].calc(s),r=this[$].calcScreenScroll(s.left,s.right,o,i,t);this.scrollX(n+r),this.draw()}[H](t,e){const{height:i}=this[k];let n=e;"number"==typeof n&&(n>0||n<=0)||(n=this[U].getTransform().scrollY);const{position:s}=this[$].calcScreen(),{ySize:o}=this[Y].calc(s),r=this[$].calcScreenScroll(s.top,s.bottom,o,i,t);this.scrollY(n+r),this.draw()}[B](t,e){if(!t)return;const{position:i}=this[$].calcScreen(),{xSize:n,ySize:s}=this[Y].calc(i);"x"===t?this[X](e.x-n/2,0):"y"===t&&this[H](e.y-s/2,0)}}function q(t,e,i){const n=function(t){return{x:t.x+t.w/2,y:t.y+t.h/2}}(e);return function(t,e,i,n){e&&(i>0||i<0)&&(t.translate(e.x,e.y),t.rotate(i),t.translate(-e.x,-e.y));n(t),e&&(i>0||i<0)&&(t.translate(e.x,e.y),t.rotate(-i),t.translate(-e.x,-e.y))}(t,n,(e.angle||0)/180*Math.PI||0,i)}function J(t){t.setFillStyle("#000000"),t.setStrokeStyle("#000000"),t.setLineDash([]),t.setGlobalAlpha(1),t.setShadowColor("#00000000"),t.setShadowOffsetX(0),t.setShadowOffsetY(0),t.setShadowBlur(0)}function K(t,i,n){J(t),function(t,i){J(t),q(t,i,(()=>{if(!(i.desc.borderWidth&&i.desc.borderWidth>0))return;const n=i.desc.borderWidth;let s="#000000";!0===e(i.desc.borderColor)&&(s=i.desc.borderColor);const o=i.x-n/2,r=i.y-n/2,l=i.w+n,a=i.h+n;let h=i.desc.borderRadius||0;h=Math.min(h,l/2,a/2),h<l/2&&h<a/2&&(h+=n/2);const{desc:c}=i;void 0!==c.shadowColor&&e(c.shadowColor)&&t.setShadowColor(c.shadowColor),void 0!==c.shadowOffsetX&&p.number(c.shadowOffsetX)&&t.setShadowOffsetX(c.shadowOffsetX),void 0!==c.shadowOffsetY&&p.number(c.shadowOffsetY)&&t.setShadowOffsetY(c.shadowOffsetY),void 0!==c.shadowBlur&&p.number(c.shadowBlur)&&t.setShadowBlur(c.shadowBlur),t.beginPath(),t.setLineWidth(n),t.setStrokeStyle(s),t.moveTo(o+h,r),t.arcTo(o+l,r,o+l,r+a,h),t.arcTo(o+l,r+a,o,r+a,h),t.arcTo(o,r+a,o,r,h),t.arcTo(o,r,o+l,r,h),t.closePath(),t.stroke()}))}(t,i),J(t),q(t,i,(()=>{const{x:e,y:s,w:r,h:l}=i;let a=i.desc.borderRadius||0;a=Math.min(a,r/2,l/2),(r<2*a||l<2*a)&&(a=0),t.beginPath(),t.moveTo(e+a,s),t.arcTo(e+r,s,e+r,s+l,a),t.arcTo(e+r,s+l,e,s+l,a),t.arcTo(e,s+l,e,s,a),t.arcTo(e,s,e+r,s,a),t.closePath(),("string"==typeof n||["CanvasPattern"].includes(o.type(n)))&&t.setFillStyle(n),t.fill()}))}function tt(t,e){K(t,e,e.desc.bgColor)}function et(t,e,i){const n=i.getContent(e.uuid);q(t,e,(()=>{n&&t.drawImage(n,e.x,e.y,e.w,e.h)}))}function it(t,e,i){const n=i.getContent(e.uuid);q(t,e,(()=>{n&&t.drawImage(n,e.x,e.y,e.w,e.h)}))}function nt(t,e,i){const n=i.getContent(e.uuid);q(t,e,(()=>{n&&t.drawImage(n,e.x,e.y,e.w,e.h)}))}function st(t,i,n){J(t),K(t,i,i.desc.bgColor||"transparent"),q(t,i,(()=>{const n=Object.assign({fontSize:12,fontFamily:"sans-serif",textAlign:"center"},i.desc);t.setFillStyle(i.desc.color),t.setTextBaseline("top"),t.setFont({fontWeight:n.fontWeight,fontSize:n.fontSize,fontFamily:n.fontFamily});const s=n.text.replace(/\r\n/gi,"\n"),o=n.lineHeight||n.fontSize,r=s.split("\n"),l=[];let a=0;r.forEach(((e,n)=>{let s="";if(e.length>0){for(let h=0;h<e.length&&(t.measureText(s+(e[h]||"")).width<t.calcDeviceNum(i.w)?s+=e[h]||"":(l.push({text:s,width:t.calcScreenNum(t.measureText(s).width)}),s=e[h]||"",a++),!((a+1)*o>i.h));h++)if(e.length-1===h&&(a+1)*o<i.h){l.push({text:s,width:t.calcScreenNum(t.measureText(s).width)}),n<r.length-1&&a++;break}}else l.push({text:"",width:0})}));let h=0;l.length*o<i.h&&("top"===i.desc.verticalAlign?h=0:"bottom"===i.desc.verticalAlign?h+=i.h-l.length*o:h+=(i.h-l.length*o)/2);{const s=i.y+h;void 0!==n.textShadowColor&&e(n.textShadowColor)&&t.setShadowColor(n.textShadowColor),void 0!==n.textShadowOffsetX&&p.number(n.textShadowOffsetX)&&t.setShadowOffsetX(n.textShadowOffsetX),void 0!==n.textShadowOffsetY&&p.number(n.textShadowOffsetY)&&t.setShadowOffsetY(n.textShadowOffsetY),void 0!==n.textShadowBlur&&p.number(n.textShadowBlur)&&t.setShadowBlur(n.textShadowBlur),l.forEach(((e,r)=>{let l=i.x;"center"===n.textAlign?l=i.x+(i.w-e.width)/2:"right"===n.textAlign&&(l=i.x+(i.w-e.width)),t.fillText(e.text,l,s+o*r)})),J(t)}if(e(n.strokeColor)&&void 0!==n.strokeWidth&&n.strokeWidth>0){const e=i.y+h;l.forEach(((s,r)=>{let l=i.x;"center"===n.textAlign?l=i.x+(i.w-s.width)/2:"right"===n.textAlign&&(l=i.x+(i.w-s.width)),void 0!==n.strokeColor&&t.setStrokeStyle(n.strokeColor),void 0!==n.strokeWidth&&n.strokeWidth>0&&t.setLineWidth(n.strokeWidth),t.strokeText(s.text,l,e+o*r)}))}}))}function ot(t,e){J(t),q(t,e,(t=>{const{x:i,y:n,w:s,h:o,desc:r}=e,{bgColor:l="#000000",borderColor:a="#000000",borderWidth:h=0}=r,c=s/2,d=o/2,u=i+c,g=n+d;if(h&&h>0){const e=h/2+c,i=h/2+d;t.beginPath(),t.setStrokeStyle(a),t.setLineWidth(h),t.ellipse(u,g,e,i,0,0,2*Math.PI),t.closePath(),t.stroke()}t.beginPath(),t.setFillStyle(l),t.ellipse(u,g,c,d,0,0,2*Math.PI),t.closePath(),t.fill()}))}function rt(t,i,n){var s;J(t);const o=t.getSize();if(t.clearRect(0,0,o.contextWidth,o.contextHeight),"string"==typeof i.bgColor&&e(i.bgColor)&&function(t,e){const i=t.getSize();t.setFillStyle(e),t.fillRect(0,0,i.contextWidth,i.contextHeight)}(t,i.bgColor),i.elements.length>0)for(let e=0;e<i.elements.length;e++){const o=i.elements[e];if(!0!==(null===(s=null==o?void 0:o.operation)||void 0===s?void 0:s.invisible))switch(o.type){case"rect":tt(t,o);break;case"text":st(t,o);break;case"image":et(t,o,n);break;case"svg":it(t,o,n);break;case"html":nt(t,o,n);break;case"circle":ot(t,o)}}}class lt{constructor(){this._listeners=new Map}on(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);null==i||i.push(e),this._listeners.set(t,i||[])}else this._listeners.set(t,[e])}off(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);if(Array.isArray(i))for(let t=0;t<(null==i?void 0:i.length);t++)if(i[t]===e){i.splice(t,1);break}this._listeners.set(t,i||[])}}trigger(t,e){const i=this._listeners.get(t);return!!Array.isArray(i)&&(i.forEach((t=>{t(e)})),!0)}has(t){if(this._listeners.has(t)){const e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1}}var at,ht,ct=globalThis&&globalThis.__awaiter||function(t,e,i,n){return new(i||(i=Promise))((function(s,o){function r(t){try{a(n.next(t))}catch(t){o(t)}}function l(t){try{a(n.throw(t))}catch(t){o(t)}}function a(t){var e;t.done?s(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(r,l)}a((n=n.apply(t,e||[])).next())}))};(ht=at||(at={})).FREE="free",ht.LOADING="loading",ht.COMPLETE="complete";class dt{constructor(t){this._currentLoadData={},this._currentUUIDQueue=[],this._storageLoadData={},this._status=at.FREE,this._waitingLoadQueue=[],this._opts=t,this._event=new lt,this._waitingLoadQueue=[]}load(t,e){const[i,n]=this._resetLoadData(t,e);this._status===at.FREE||this._status===at.COMPLETE?(this._currentUUIDQueue=i,this._currentLoadData=n,this._loadTask()):this._status===at.LOADING&&i.length>0&&this._waitingLoadQueue.push({uuidQueue:i,loadData:n})}on(t,e){this._event.on(t,e)}off(t,e){this._event.off(t,e)}isComplete(){return this._status===at.COMPLETE}getContent(t){var e;return"loaded"===(null===(e=this._storageLoadData[t])||void 0===e?void 0:e.status)?this._storageLoadData[t].content:null}_resetLoadData(t,e){const i={},n=[],s=this._storageLoadData;for(let o=t.elements.length-1;o>=0;o--){const r=t.elements[o];["image","svg","html"].includes(r.type)&&(s[r.uuid]?e.includes(r.uuid)&&(i[r.uuid]=this._createEmptyLoadItem(r),n.push(r.uuid)):(i[r.uuid]=this._createEmptyLoadItem(r),n.push(r.uuid)))}return[n,i]}_createEmptyLoadItem(t){let e="";const i=t.type;let s=t.w,o=t.h;if("image"===t.type){e=t.desc.src||""}else if("svg"===t.type){e=t.desc.svg||""}else if("html"===t.type){const i=t;e=(i.desc.html||"").replace(/<script[\s\S]*?<\/script>/gi,""),s=i.desc.width||t.w,o=i.desc.height||t.h}return{uuid:t.uuid,type:i,status:"null",content:null,source:e,elemW:s,elemH:o,element:n(t)}}_loadTask(){if(this._status===at.LOADING)return;if(this._status=at.LOADING,0===this._currentUUIDQueue.length){if(0===this._waitingLoadQueue.length)return this._status=at.COMPLETE,void this._event.trigger("complete",void 0);{const t=this._waitingLoadQueue.shift();if(t){const{uuidQueue:e,loadData:i}=t;this._currentLoadData=i,this._currentUUIDQueue=e}}}const{maxParallelNum:t}=this._opts,e=this._currentUUIDQueue.splice(0,t);e.forEach(((t,e)=>{}));const i=[],n=()=>{if(i.length>=t)return!1;if(0===e.length)return!0;for(let s=i.length;s<t;s++){const t=e.shift();if(void 0===t)break;i.push(t),this._loadElementSource(this._currentLoadData[t]).then((s=>{var o,r;i.splice(i.indexOf(t),1);const l=n();this._storageLoadData[t]={uuid:t,type:this._currentLoadData[t].type,status:"loaded",content:s,source:this._currentLoadData[t].source,elemW:this._currentLoadData[t].elemW,elemH:this._currentLoadData[t].elemH,element:this._currentLoadData[t].element},0===i.length&&0===e.length&&!0===l&&(this._status=at.FREE,this._loadTask()),this._event.trigger("load",{uuid:null===(o=this._storageLoadData[t])||void 0===o?void 0:o.uuid,type:this._storageLoadData[t].type,status:this._storageLoadData[t].status,content:this._storageLoadData[t].content,source:this._storageLoadData[t].source,elemW:this._storageLoadData[t].elemW,elemH:this._storageLoadData[t].elemH,element:null===(r=this._storageLoadData[t])||void 0===r?void 0:r.element})})).catch((s=>{var o,r,l,a,h,c,d,u,g,m,f,p;console.warn(s),i.splice(i.indexOf(t),1);const _=n();this._currentLoadData[t]&&(this._storageLoadData[t]={uuid:t,type:null===(o=this._currentLoadData[t])||void 0===o?void 0:o.type,status:"fail",content:null,error:s,source:null===(r=this._currentLoadData[t])||void 0===r?void 0:r.source,elemW:null===(l=this._currentLoadData[t])||void 0===l?void 0:l.elemW,elemH:null===(a=this._currentLoadData[t])||void 0===a?void 0:a.elemH,element:null===(h=this._currentLoadData[t])||void 0===h?void 0:h.element}),0===i.length&&0===e.length&&!0===_&&(this._status=at.FREE,this._loadTask()),this._currentLoadData[t]&&this._event.trigger("error",{uuid:t,type:null===(c=this._storageLoadData[t])||void 0===c?void 0:c.type,status:null===(d=this._storageLoadData[t])||void 0===d?void 0:d.status,content:null===(u=this._storageLoadData[t])||void 0===u?void 0:u.content,source:null===(g=this._storageLoadData[t])||void 0===g?void 0:g.source,elemW:null===(m=this._storageLoadData[t])||void 0===m?void 0:m.elemW,elemH:null===(f=this._storageLoadData[t])||void 0===f?void 0:f.elemH,element:null===(p=this._storageLoadData[t])||void 0===p?void 0:p.element})}))}return!1};n()}_loadElementSource(t){return ct(this,void 0,void 0,(function*(){if(t&&"image"===t.type){return yield a(t.source)}if(t&&"svg"===t.type){return yield h(t.source)}if(t&&"html"===t.type){return yield c(t.source,{width:t.elemW,height:t.elemH})}throw Error("Element's source is not support!")}))}}class ut{constructor(){this._listeners=new Map}on(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);null==i||i.push(e),this._listeners.set(t,i||[])}else this._listeners.set(t,[e])}off(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);if(Array.isArray(i))for(let t=0;t<(null==i?void 0:i.length);t++)if(i[t]===e){i.splice(t,1);break}this._listeners.set(t,i||[])}}trigger(t,e){const i=this._listeners.get(t);return!!Array.isArray(i)&&(i.forEach((t=>{t(e)})),!0)}has(t){if(this._listeners.has(t)){const e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1}}const gt=Symbol("_queue"),mt=Symbol("_ctx"),ft=Symbol("_status"),pt=Symbol("_loader"),_t=Symbol("_opts"),vt=Symbol("_freeze"),xt=Symbol("_drawFrame"),St=Symbol("_retainQueueOneItem");var yt,bt,wt;const{requestAnimationFrame:Et}=window;var Ct,Pt;(Pt=Ct||(Ct={})).NULL="null",Pt.FREE="free",Pt.DRAWING="drawing",Pt.FREEZE="freeze";class Lt extends ut{constructor(t){super(),this[yt]=[],this[bt]=null,this[wt]=Ct.NULL,this[_t]=t,this[pt]=new dt({maxParallelNum:6}),this[pt].on("load",(t=>{this[xt](),this.trigger("load",{element:t.element})})),this[pt].on("error",(t=>{this.trigger("error",{element:t.element,error:t.error})})),this[pt].on("complete",(()=>{this.trigger("loadComplete",{t:Date.now()})}))}render(t,e,s){const{changeResourceUUIDs:o=[]}=s||{};this[ft]=Ct.FREE;const r=n(e);if(Array.isArray(r.elements)&&r.elements.forEach((t=>{"string"==typeof t.uuid&&t.uuid||(t.uuid=i())})),!this[mt])if(this[_t]&&"[object HTMLCanvasElement]"===Object.prototype.toString.call(t)){const{width:e,height:i,contextWidth:n,contextHeight:s,devicePixelRatio:o}=this[_t],r=t;r.width=e*o,r.height=i*o;const l=r.getContext("2d");this[mt]=new d(l,{width:e,height:i,contextWidth:n||e,contextHeight:s||i,devicePixelRatio:o})}else t&&(this[mt]=t);if([Ct.FREEZE].includes(this[ft]))return;const l=n({data:r});this[gt].push(l),this[xt](),this[pt].load(r,o||[])}getContext(){return this[mt]}thaw(){this[ft]=Ct.FREE}[(yt=gt,bt=mt,wt=ft,vt)](){this[ft]=Ct.FREEZE}[xt](){this[ft]!==Ct.FREEZE&&Et((()=>{if(this[ft]===Ct.FREEZE)return;const t=this[mt];let e=this[gt][0],i=!1;this[gt].length>1?e=this[gt].shift():i=!0,!0!==this[pt].isComplete()?(this[xt](),e&&t&&rt(t,e.data,this[pt])):e&&t?(rt(t,e.data,this[pt]),this[St](),i?this[ft]=Ct.FREE:this[xt]()):this[ft]=Ct.FREE,this.trigger("drawFrame",{t:Date.now()}),!0===this[pt].isComplete()&&1===this[gt].length&&this[ft]===Ct.FREE&&(t&&this[gt][0]&&this[gt][0].data&&rt(t,this[gt][0].data,this[pt]),this.trigger("drawFrameComplete",{t:Date.now()}),this[vt]())}))}[St](){if(this[gt].length<=1)return;const t=n(this[gt][this[gt].length-1]);this[gt]=[t]}}function Dt(t){return"number"==typeof t&&(t>0||t<=0)}function Mt(t){return"number"==typeof t&&t>=0}function It(t){return"string"==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${t}`)}function zt(t){return"string"==typeof t&&/^(data:image\/)/.test(`${t}`)}const Tt={x:function(t){return Dt(t)},y:function(t){return Dt(t)},w:Mt,h:function(t){return"number"==typeof t&&t>=0},angle:function(t){return"number"==typeof t&&t>=-360&&t<=360},number:Dt,borderWidth:function(t){return Mt(t)},borderRadius:function(t){return Dt(t)&&t>=0},color:function(t){return e(t)},imageSrc:function(t){return zt(t)||It(t)},imageURL:It,imageBase64:zt,svg:function(t){return"string"==typeof t&&/^(<svg[\s]{1,}|<svg>)/i.test(`${t}`.trim())&&/<\/[\s]{0,}svg>$/i.test(`${t}`.trim())},html:function(t){let e=!1;if("string"==typeof t){let i=document.createElement("div");i.innerHTML=t,i.children.length>0&&(e=!0),i=null}return e},text:function(t){return"string"==typeof t},fontSize:function(t){return Dt(t)&&t>0},lineHeight:function(t){return Dt(t)&&t>0},textAlign:function(t){return["center","left","right"].includes(t)},fontFamily:function(t){return"string"==typeof t&&t.length>0},fontWeight:function(t){return["bold"].includes(t)},strokeWidth:function(t){return Dt(t)&&t>0}};function kt(t={}){const{borderColor:e,borderRadius:i,borderWidth:n}=t;return!(t.hasOwnProperty("borderColor")&&!Tt.color(e))&&(!(t.hasOwnProperty("borderRadius")&&!Tt.number(i))&&!(t.hasOwnProperty("borderWidth")&&!Tt.number(n)))}const Wt={attrs:function(t){const{x:e,y:i,w:n,h:s,angle:o}=t;return!!(Tt.x(e)&&Tt.y(i)&&Tt.w(n)&&Tt.h(s)&&Tt.angle(o))&&(o>=-360&&o<=360)},textDesc:function(t){const{text:e,color:i,fontSize:n,lineHeight:s,fontFamily:o,textAlign:r,fontWeight:l,bgColor:a,strokeWidth:h,strokeColor:c}=t;return!!Tt.text(e)&&(!!Tt.color(i)&&(!!Tt.fontSize(n)&&(!(t.hasOwnProperty("bgColor")&&!Tt.color(a))&&(!(t.hasOwnProperty("fontWeight")&&!Tt.fontWeight(l))&&(!(t.hasOwnProperty("lineHeight")&&!Tt.lineHeight(s))&&(!(t.hasOwnProperty("fontFamily")&&!Tt.fontFamily(o))&&(!(t.hasOwnProperty("textAlign")&&!Tt.textAlign(r))&&(!(t.hasOwnProperty("strokeWidth")&&!Tt.strokeWidth(h))&&(!(t.hasOwnProperty("strokeColor")&&!Tt.color(c))&&!!kt(t))))))))))},rectDesc:function(t){const{bgColor:e}=t;return!(t.hasOwnProperty("bgColor")&&!Tt.color(e))&&!!kt(t)},circleDesc:function(t){const{bgColor:e,borderColor:i,borderWidth:n}=t;return!(t.hasOwnProperty("bgColor")&&!Tt.color(e))&&(!(t.hasOwnProperty("borderColor")&&!Tt.color(i))&&!(t.hasOwnProperty("borderWidth")&&!Tt.number(n)))},imageDesc:function(t){const{src:e}=t;return!!Tt.imageSrc(e)},svgDesc:function(t){const{svg:e}=t;return!!Tt.svg(e)},htmlDesc:function(t){const{html:e}=t;return!!Tt.html(e)}};function Ut(t){return t/180*Math.PI}function Rt(t){return{x:t.x+t.w/2,y:t.y+t.h/2}}function At(t,e){const i=e.x-t.x,n=t.y-e.y;if(0===i){if(n<0)return Math.PI/2;if(n>0)return 1.5*Math.PI}else if(0===n){if(i<0)return Math.PI;if(i>0)return 0}return i>0&&n<0?Math.atan(Math.abs(n)/Math.abs(i)):i<0&&n<0?Math.PI-Math.atan(Math.abs(n)/Math.abs(i)):i<0&&n>0?Math.PI+Math.atan(Math.abs(n)/Math.abs(i)):i>0&&n>0?2*Math.PI-Math.atan(Math.abs(n)/Math.abs(i)):null}const Ot={elementWrapper:{color:"#2ab6f1",lockColor:"#aaaaaa",controllerSize:6,lineWidth:1,lineDash:[4,3]}};class Ft{constructor(){this._listeners=new Map}on(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);null==i||i.push(e),this._listeners.set(t,i||[])}else this._listeners.set(t,[e])}off(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);if(Array.isArray(i))for(let t=0;t<(null==i?void 0:i.length);t++)if(i[t]===e){i.splice(t,1);break}this._listeners.set(t,i||[])}}trigger(t,e){const i=this._listeners.get(t);return!!Array.isArray(i)&&(i.forEach((t=>{t(e)})),!0)}has(t){if(this._listeners.has(t)){const e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1}}function Yt(t,e){var i,n;return(null==(i=null==t?void 0:t.desc)?void 0:i.src)!==(null==(n=null==e?void 0:e.desc)?void 0:n.src)}function Nt(t,e){var i,n;return(null==(i=null==t?void 0:t.desc)?void 0:i.svg)!==(null==(n=null==e?void 0:e.desc)?void 0:n.svg)}function Xt(t,e){var i,n,s,o,r,l;return(null==(i=null==t?void 0:t.desc)?void 0:i.html)!==(null==(n=null==e?void 0:e.desc)?void 0:n.html)||(null==(s=null==t?void 0:t.desc)?void 0:s.width)!==(null==(o=null==e?void 0:e.desc)?void 0:o.width)||(null==(r=null==t?void 0:t.desc)?void 0:r.height)!==(null==(l=null==e?void 0:e.desc)?void 0:l.height)}function Ht(t,e){let i=null,n=!1;switch(e.type){case"image":n=Yt(t,e);break;case"svg":n=Nt(t,e);break;case"html":n=Xt(t,e)}return!0===n&&(i=e.uuid),i}function Bt(t){const e={};return t.elements.forEach((t=>{e[t.uuid]=t})),e}function jt(t,e,i){return $t(t,Rt(e),Ut(e.angle||0)||0,i)}function $t(t,e,i,n){e&&(i>0||i<0)&&(t.translate(e.x,e.y),t.rotate(i),t.translate(-e.x,-e.y)),n(t),e&&(i>0||i<0)&&(t.translate(e.x,e.y),t.rotate(-i),t.translate(-e.x,-e.y))}function Gt(t){const e=t.toFixed(2);return parseFloat(e)}function Qt(t){return Gt(t%360)}const Vt=Object.keys({text:{},rect:{},image:{},svg:{},circle:{},html:{}}),Zt=15;class qt{constructor(t){this._ctx=t}initData(t){return t.elements.forEach((t=>{t.uuid&&"string"==typeof t.uuid||(t.uuid=i())})),t}isPointInElement(t,e){var i,n;const s=this._ctx;let o=-1,r=null;for(let l=e.elements.length-1;l>=0;l--){const a=e.elements[l];if(!0===(null==(i=a.operation)?void 0:i.invisible))continue;let h=0;if((null==(n=a.desc)?void 0:n.borderWidth)>0&&(h=a.desc.borderWidth),jt(s,a,(()=>{s.beginPath(),s.moveTo(a.x-h,a.y-h),s.lineTo(a.x+a.w+h,a.y-h),s.lineTo(a.x+a.w+h,a.y+a.h+h),s.lineTo(a.x-h,a.y+a.h+h),s.lineTo(a.x-h,a.y-h),s.closePath(),s.isPointInPath(t.x,t.y)&&(o=l,r=a.uuid)})),o>=0)break}return[o,r]}dragElement(t,e,i,n,s){const o=this.getElementIndex(t,e);if(!t.elements[o])return;const r=i.x-n.x,l=i.y-n.y;t.elements[o].x+=r/s,t.elements[o].y+=l/s,this.limitElementAttrs(t.elements[o])}transformElement(t,e,i,n,s,o){var r,l;const a=this.getElementIndex(t,e);if(!t.elements[a])return null;if(!0===(null==(l=null==(r=t.elements[a])?void 0:r.operation)?void 0:l.lock))return null;const h=(i.x-n.x)/s,c=(i.y-n.y)/s,d=t.elements[a];if(["top-left","top","top-right","right","bottom-right","bottom","bottom-left","left"].includes(o)){const t=function(t,e,i,n,s){var o,r,l,a,h,c,d,u,g,m,f,p,_;const v={x:t.x,y:t.y,w:t.w,h:t.h};if(t.angle,!0===(null==(o=t.operation)?void 0:o.limitRatio)&&["top-left","top-right","bottom-right","bottom-left"].includes(n)){const n=Math.max(Math.abs(e),Math.abs(i));e=(e>=0?1:-1)*n,i=(i>=0?1:-1)*n/t.w*t.h}switch(n){case"top-left":t.w-e>0&&t.h-i>0&&(v.x+=e,v.y+=i,v.w-=e,v.h-=i);break;case"top":if(0===t.angle||Math.abs(t.angle)<Zt)v.h-i>0&&(v.y+=i,v.h-=i,!0===(null==(r=t.operation)?void 0:r.limitRatio)&&(v.x+=i/t.h*t.w/2,v.w-=i/t.h*t.w));else if(t.angle>0||t.angle<0){const n=t.angle>0?t.angle:Math.max(0,t.angle+360);let s=Kt(e,i),o=v.x+t.w/2,r=v.y+t.h/2;if(n<90){s=0-te(s,i);const t=Jt(n),e=s/2;o+=e*Math.sin(t),r-=e*Math.cos(t)}else if(n<180){s=te(s,e);const t=Jt(n-90),i=s/2;o+=i*Math.cos(t),r+=i*Math.sin(t)}else if(n<270){s=te(s,i);const t=Jt(n-180),e=s/2;o-=e*Math.sin(t),r+=e*Math.cos(t)}else if(n<360){s=0-te(s,e);const t=Jt(n-270),i=s/2;o-=i*Math.cos(t),r-=i*Math.sin(t)}v.h+s>0&&(!0===(null==(l=t.operation)?void 0:l.limitRatio)&&(v.w=v.w+s/t.h*t.w),v.h=v.h+s,v.x=o-v.w/2,v.y=r-v.h/2)}else v.h-i>0&&(v.y+=i,v.h-=i,!0===(null==(a=t.operation)?void 0:a.limitRatio)&&(v.x-=e/2,v.w+=e));break;case"top-right":v.h-i>0&&v.w+e>0&&(v.y+=i,v.w+=e,v.h-=i);break;case"right":if(0===t.angle||Math.abs(t.angle)<Zt)t.w+e>0&&(v.w+=e,!0===(null==(h=t.operation)?void 0:h.limitRatio)&&(v.y-=e*t.h/t.w/2,v.h+=e*t.h/t.w));else if(t.angle>0||t.angle<0){const n=t.angle>0?t.angle:Math.max(0,t.angle+360);let s=Kt(e,i),o=v.x+t.w/2,r=v.y+t.h/2;if(n<90){s=te(s,i);const t=Jt(n),e=s/2;o+=e*Math.cos(t),r+=e*Math.sin(t)}else if(n<180){s=te(s,i);const t=Jt(n-90),e=s/2;o-=e*Math.sin(t),r+=e*Math.cos(t)}else if(n<270){s=te(s,i);const t=Jt(n-180),e=s/2;o+=e*Math.cos(t),r+=e*Math.sin(t),s=0-s}else if(n<360){s=te(s,e);const t=Jt(n-270),i=s/2;o+=i*Math.sin(t),r-=i*Math.cos(t)}v.w+s>0&&(!0===(null==(c=t.operation)?void 0:c.limitRatio)&&(v.h=v.h+s/t.w*t.h),v.w=v.w+s,v.x=o-v.w/2,v.y=r-v.h/2)}else t.w+e>0&&(v.w+=e,!0===(null==(d=t.operation)?void 0:d.limitRatio)&&(v.h+=e*t.h/t.w,v.y-=e*t.h/t.w/2));break;case"bottom-right":t.w+e>0&&t.h+i>0&&(v.w+=e,v.h+=i);break;case"bottom":if(0===t.angle||Math.abs(t.angle)<Zt)t.h+i>0&&(v.h+=i,!0===(null==(u=t.operation)?void 0:u.limitRatio)&&(v.x-=i/t.h*t.w/2,v.w+=i/t.h*t.w));else if(t.angle>0||t.angle<0){const n=t.angle>0?t.angle:Math.max(0,t.angle+360);let s=Kt(e,i),o=v.x+t.w/2,r=v.y+t.h/2;if(n<90){s=te(s,i);const t=Jt(n),e=s/2;o-=e*Math.sin(t),r+=e*Math.cos(t)}else if(n<180){s=0-te(s,e);const t=Jt(n-90),i=s/2;o-=i*Math.cos(t),r-=i*Math.sin(t)}else if(n<270){s=te(s,e);const t=Jt(n-180),i=s/2;o+=i*Math.sin(t),r-=i*Math.cos(t)}else if(n<360){s=te(s,e);const t=Jt(n-270),i=s/2;o+=i*Math.cos(t),r+=i*Math.sin(t)}v.h+s>0&&(!0===(null==(g=t.operation)?void 0:g.limitRatio)&&(v.w=v.w+s/t.h*t.w),v.h=v.h+s,v.x=o-v.w/2,v.y=r-v.h/2)}else t.h+i>0&&(v.h+=i,!0===(null==(m=t.operation)?void 0:m.limitRatio)&&(v.x-=i/t.h*t.w/2,v.w+=i/t.h*t.w));break;case"bottom-left":t.w-e>0&&t.h+i>0&&(v.x+=e,v.w-=e,v.h+=i);break;case"left":if(0===t.angle||Math.abs(t.angle)<Zt)t.w-e>0&&(v.x+=e,v.w-=e,!0===(null==(f=t.operation)?void 0:f.limitRatio)&&(v.h-=e/t.w*t.h,v.y+=e/t.w*t.h/2));else if(t.angle>0||t.angle<0){const n=t.angle>0?t.angle:Math.max(0,t.angle+360);let s=Kt(e,i),o=v.x+t.w/2,r=v.y+t.h/2;if(n<90){s=0-te(s,e);const t=Jt(n),i=s/2;o-=i*Math.cos(t),r-=i*Math.sin(t)}else if(n<180){s=te(s,e);const t=Jt(n-90),i=s/2;o+=i*Math.sin(t),r-=i*Math.cos(t)}else if(n<270){s=te(s,i);const t=Jt(n-180),e=s/2;o+=e*Math.cos(t),r+=e*Math.sin(t)}else if(n<360){s=te(s,i);const t=Jt(n-270),e=s/2;o-=e*Math.sin(t),r+=e*Math.cos(t)}v.w+s>0&&(!0===(null==(p=t.operation)?void 0:p.limitRatio)&&(v.h=v.h+s/t.w*t.h),v.w=v.w+s,v.x=o-v.w/2,v.y=r-v.h/2)}else t.w-e>0&&(v.x+=e,v.w-=e,!0===(null==(_=t.operation)?void 0:_.limitRatio)&&(v.h-=e/t.w*t.h,v.y+=e/t.w*t.h/2))}return v}(d,h,c,o);d.x=t.x,d.y=t.y,d.w=t.w,d.h=t.h}else if("rotate"===o){const t=function(t,e,i){const n=At(t,e),s=At(t,i);return null!==s&&null!==n?n>3*Math.PI/2&&s<Math.PI/2?s+(2*Math.PI-n):s>3*Math.PI/2&&n<Math.PI/2?n+(2*Math.PI-s):s-n:0}(Rt(d),n,i);d.angle=(d.angle||0)+function(t){return t/Math.PI*180}(t)}return this.limitElementAttrs(d),{width:Gt(d.w),height:Gt(d.h),angle:Qt(d.angle||0)}}getElementIndex(t,e){let i=-1;for(let n=0;n<t.elements.length;n++)if(t.elements[n].uuid===e){i=n;break}return i}limitElementAttrs(t){t.x=Gt(t.x),t.y=Gt(t.y),t.w=Gt(t.w),t.h=Gt(t.h),t.angle=Qt(t.angle||0)}}function Jt(t){return t*Math.PI/180}function Kt(t,e){return Math.sqrt(t*t+e*e)}function te(t,e){return e>0?Math.abs(t):0-Math.abs(t)}class ee{constructor(t,e){this._areaStart={x:0,y:0},this._areaEnd={x:0,y:0},this._board=t,this._ctx=this._board.getContext(),this._coreConfig=e,this._helperConfig={elementIndexMap:{}}}updateConfig(t,e){this._updateElementIndex(t),this._updateSelectedElementWrapper(t,e),this._updateSelectedElementListWrapper(t,e)}getConfig(){return n(this._helperConfig)}getElementIndexByUUID(t){const e=this._helperConfig.elementIndexMap[t];return e>=0?e:null}isPointInElementWrapperController(t,e){var i,s;const o=this._ctx,r=(null==(s=null==(i=this._helperConfig)?void 0:i.selectedElementWrapper)?void 0:s.uuid)||null;let l=null,a=null,h=null;if(!this._helperConfig.selectedElementWrapper)return{uuid:r,selectedControllerDirection:a,directIndex:l,hoverControllerDirection:h};const c=this._helperConfig.selectedElementWrapper,d=[c.controllers.right,c.controllers.topRight,c.controllers.top,c.controllers.topLeft,c.controllers.left,c.controllers.bottomLeft,c.controllers.bottom,c.controllers.bottomRight],u=["right","top-right","top","top-left","left","bottom-left","bottom","bottom-right"];let g=n(u),m=0;if(e&&r){const t=this.getElementIndexByUUID(r);if(null!==t&&t>=0){let i=e.elements[t].angle;i<0&&(i+=360),i<45?m=0:i<90?m=1:i<135?m=2:i<180?m=3:i<225?m=4:i<270?m=5:i<315&&(m=6)}}if(m>0&&(g=g.slice(-m).concat(g.slice(0,-m))),$t(o,c.translate,c.radian||0,(()=>{for(let e=0;e<d.length;e++){const i=d[e];if(!0!==i.invisible&&(o.beginPath(),o.arc(i.x,i.y,c.controllerSize,0,2*Math.PI),o.closePath(),o.isPointInPath(t.x,t.y)&&(a=u[e],h=g[e]),a)){l=e;break}}})),null===a){const e=c.controllers.rotate;!0!==e.invisible&&$t(o,c.translate,c.radian||0,(()=>{o.beginPath(),o.arc(e.x,e.y,c.controllerSize,0,2*Math.PI),o.closePath(),o.isPointInPath(t.x,t.y)&&(a="rotate",h="rotate")}))}return{uuid:r,selectedControllerDirection:a,hoverControllerDirection:h,directIndex:l}}isPointInElementList(t,e){var i,n,s;const o=this._ctx;let r=-1,l=null;const a=(null==(i=this._helperConfig)?void 0:i.selectedElementListWrappers)||[];for(let i=0;i<a.length;i++){const h=a[i],c=this._helperConfig.elementIndexMap[h.uuid],d=e.elements[c];if(!d)continue;if(!0===(null==(n=d.operation)?void 0:n.invisible))continue;let u=0;if((null==(s=d.desc)?void 0:s.borderWidth)>0&&(u=d.desc.borderWidth),jt(o,d,(()=>{o.beginPath(),o.moveTo(d.x-u,d.y-u),o.lineTo(d.x+d.w+u,d.y-u),o.lineTo(d.x+d.w+u,d.y+d.h+u),o.lineTo(d.x-u,d.y+d.h+u),o.lineTo(d.x-u,d.y-u),o.closePath(),o.isPointInPath(t.x,t.y)&&(r=i,l=d.uuid)})),r>=0)break}return!!(l&&r>=0)}startSelectArea(t){this._areaStart=t,this._areaEnd=t}changeSelectArea(t){this._areaEnd=t,this._calcSelectedArea()}clearSelectedArea(){this._areaStart={x:0,y:0},this._areaEnd={x:0,y:0},this._calcSelectedArea()}calcSelectedElements(t){const e=this._ctx.getTransform(),{scale:i=1,scrollX:n=0,scrollY:s=0}=e,o=this._areaStart,r=this._areaEnd,l=(Math.min(o.x,r.x)-n)/i,a=(Math.min(o.y,r.y)-s)/i,h=Math.abs(r.x-o.x)/i,c=Math.abs(r.y-o.y)/i,d=[],u=this._ctx;return u.beginPath(),u.moveTo(l,a),u.lineTo(l+h,a),u.lineTo(l+h,a+c),u.lineTo(l,a+c),u.lineTo(l,a),u.closePath(),t.elements.forEach((t=>{var e;if(!0!==(null==(e=null==t?void 0:t.operation)?void 0:e.invisible)){const e=t.x+t.w/2,i=t.y+t.h/2;u.isPointInPathWithoutScroll(e,i)&&d.push(t.uuid)}})),d}_calcSelectedArea(){const t=this._areaStart,e=this._areaEnd,i=this._ctx.getTransform(),{scale:n=1,scrollX:s=0,scrollY:o=0}=i,r=this._coreConfig.elementWrapper,l=r.lineWidth/n,a=r.lineDash.map((t=>t/n));this._helperConfig.selectedAreaWrapper={x:(Math.min(t.x,e.x)-s)/n,y:(Math.min(t.y,e.y)-o)/n,w:Math.abs(e.x-t.x)/n,h:Math.abs(e.y-t.y)/n,startPoint:{x:t.x,y:t.y},endPoint:{x:e.x,y:e.y},lineWidth:l,lineDash:a,color:r.color}}_updateElementIndex(t){this._helperConfig.elementIndexMap={},t.elements.forEach(((t,e)=>{this._helperConfig.elementIndexMap[t.uuid]=e}))}_updateSelectedElementWrapper(t,e){var i;const{selectedUUID:n}=e;if(!("string"==typeof n&&this._helperConfig.elementIndexMap[n]>=0))return void delete this._helperConfig.selectedElementWrapper;const s=this._helperConfig.elementIndexMap[n],o=t.elements[s];if(!0===(null==(i=null==o?void 0:o.operation)?void 0:i.invisible))return;const r=this._createSelectedElementWrapper(o,e);this._helperConfig.selectedElementWrapper=r}_updateSelectedElementListWrapper(t,e){const{selectedUUIDList:i}=e,n=[];t.elements.forEach((t=>{if(null==i?void 0:i.includes(t.uuid)){const i=this._createSelectedElementWrapper(t,e);n.push(i)}})),this._helperConfig.selectedElementListWrappers=n}_createSelectedElementWrapper(t,e){var i,n,s,o,r,l,a,h,c,d,u,g;const{scale:m}=e,f=this._coreConfig.elementWrapper,p=f.controllerSize/m,_=f.lineWidth/m,v=f.lineDash.map((t=>t/m)),x=(null==(i=t.desc)?void 0:i.borderWidth)||0;let S=!1;"number"==typeof t.angle&&Math.abs(t.angle)>15&&(S=!0);const y=_,b={uuid:t.uuid,controllerSize:p,controllerOffset:y,lock:!0===(null==(n=null==t?void 0:t.operation)?void 0:n.lock),controllers:{topLeft:{x:t.x-y-x,y:t.y-y-x,invisible:S||!0===(null==(s=null==t?void 0:t.operation)?void 0:s.disableScale)},top:{x:t.x+t.w/2,y:t.y-y-x,invisible:!0===(null==(o=null==t?void 0:t.operation)?void 0:o.disableScale)},topRight:{x:t.x+t.w+y+x,y:t.y-y-x,invisible:S||!0===(null==(r=null==t?void 0:t.operation)?void 0:r.disableScale)},right:{x:t.x+t.w+y+x,y:t.y+t.h/2,invisible:!0===(null==(l=null==t?void 0:t.operation)?void 0:l.disableScale)},bottomRight:{x:t.x+t.w+y+x,y:t.y+t.h+y+x,invisible:S||!0===(null==(a=null==t?void 0:t.operation)?void 0:a.disableScale)},bottom:{x:t.x+t.w/2,y:t.y+t.h+y+x,invisible:!0===(null==(h=null==t?void 0:t.operation)?void 0:h.disableScale)},bottomLeft:{x:t.x-y-x,y:t.y+t.h+y+x,invisible:S||!0===(null==(c=null==t?void 0:t.operation)?void 0:c.disableScale)},left:{x:t.x-y-x,y:t.y+t.h/2,invisible:!0===(null==(d=null==t?void 0:t.operation)?void 0:d.disableScale)},rotate:{x:t.x+t.w/2,y:t.y-p-(2*p+12)-x,invisible:!0===(null==(u=null==t?void 0:t.operation)?void 0:u.disableRotate)}},lineWidth:_,lineDash:v,color:!0===(null==(g=null==t?void 0:t.operation)?void 0:g.lock)?f.lockColor:f.color};return"number"==typeof t.angle&&(t.angle>0||t.angle<0)&&(b.radian=Ut(t.angle),b.translate=Rt(t)),b}}const ie=Symbol("_displayCtx"),ne=Symbol("_helper"),se=Symbol("_element"),oe=Symbol("_opts");class re{constructor(t){this[oe]=t,this[ie]=this[oe].board,this[se]=this[oe].element,this[ne]=this[oe].helper}isEffectivePoint(t){const e=this[ie].getScrollLineWidth(),i=this[ie].getScreenInfo();return t.x<=i.width-e&&t.y<=i.height-e}judgePointCursor(t,e){let i="auto",n=null;if(!this.isEffectivePoint(t))return{cursor:i,elementUUID:n};const{uuid:s,hoverControllerDirection:o}=this[ne].isPointInElementWrapperController(t,e);if(s&&o){switch(o){case"top-right":i="ne-resize";break;case"top-left":i="nw-resize";break;case"top":i="n-resize";break;case"right":i="e-resize";break;case"bottom-right":i="se-resize";break;case"bottom":i="s-resize";break;case"bottom-left":i="sw-resize";break;case"left":i="w-resize";break;case"rotate":i="grab"}s&&(n=s)}else{const[s,o]=this[se].isPointInElement(t,e);s>=0&&(i="move"),o&&(n=o)}return{cursor:i,elementUUID:n}}}function le(t){const e={elements:[]};return Array.isArray(null==t?void 0:t.elements)&&(null==t||t.elements.forEach(((t={})=>{(function(t){if(!(ae(t.x)&&ae(t.y)&&ae(t.w)&&ae(t.h)))return!1;if("string"!=typeof t.type||!Vt.includes(t.type))return!1;return!0})(t)&&e.elements.push(t)}))),"string"==typeof t.bgColor&&(e.bgColor=t.bgColor),e}function ae(t){return t>=0||t<0}const he=Symbol("_board"),ce=Symbol("_data"),de=Symbol("_opts"),ue=Symbol("_config"),ge=Symbol("_renderer"),me=Symbol("_element"),fe=Symbol("_tempData"),pe=Symbol("_draw"),_e=Symbol("_coreEvent"),ve=Symbol("_emitChangeScreen"),xe=Symbol("_emitChangeData"),Se=Symbol("_engine");var ye,be,we=(t=>(t.NULL="null",t.SELECT_ELEMENT="select-element",t.SELECT_ELEMENT_LIST="select-element-list",t.SELECT_ELEMENT_WRAPPER_CONTROLLER="select-element-wrapper-controller",t.SELECT_AREA="select-area",t))(we||{}),Ee=(t=>(t.DRAGGING="dragging",t.NULL="null",t))(Ee||{});function Ce(){return{hasInited:!1,mode:we.NULL,cursorStatus:Ee.NULL,selectedUUID:null,selectedUUIDList:[],hoverUUID:null,selectedControllerDirection:null,hoverControllerDirection:null,prevPoint:null,hasChangedElement:!1}}class Pe{constructor(){this._temp=Ce()}set(t,e){this._temp[t]=e}get(t){return this._temp[t]}clear(){this._temp=Ce()}}class Le{constructor(t){this._plugins=[];const{board:e,config:i,element:n}=t,s=new ee(e,i);this._opts=t,this.temp=new Pe,this.helper=s,this._mapper=new re({board:e,helper:s,element:n})}addPlugin(t){this._plugins.push(t)}getHelperConfig(){return this.helper.getConfig()}updateHelperConfig(t){var e;const{board:i,getDataFeekback:n,config:s}=this._opts,o=n(),r=i.getTransform();this.helper.updateConfig(o,{width:t.width,height:t.height,devicePixelRatio:t.devicePixelRatio,canScroll:!0===(null==(e=null==s?void 0:s.scrollWrapper)?void 0:e.use),selectedUUID:this.temp.get("selectedUUID"),selectedUUIDList:this.temp.get("selectedUUIDList"),scale:r.scale,scrollX:r.scrollX,scrollY:r.scrollY})}init(){this._initEvent()}_initEvent(){if(!0===this.temp.get("hasInited"))return;const{board:e}=this._opts;e.on("hover",t(this._handleHover.bind(this),32)),e.on("leave",t(this._handleLeave.bind(this),32)),e.on("point",t(this._handleClick.bind(this),16)),e.on("doubleClick",this._handleDoubleClick.bind(this)),e.on("point",this._handlePoint.bind(this)),e.on("moveStart",this._handleMoveStart.bind(this)),e.on("move",t(this._handleMove.bind(this),16)),e.on("moveEnd",this._handleMoveEnd.bind(this))}_handleDoubleClick(t){var e,i,s;const{element:o,getDataFeekback:r,drawFeekback:l,coreEvent:a}=this._opts,h=r(),[c,d]=o.isPointInElement(t,h);if(c>=0&&d){const t=n(null==(e=h.elements)?void 0:e[c]);!0!==(null==(i=null==t?void 0:t.operation)?void 0:i.invisible)&&a.trigger("screenDoubleClickElement",{index:c,uuid:d,element:n(null==(s=h.elements)?void 0:s[c])})}l()}_handlePoint(t){var e,i,s;if(!this._mapper.isEffectivePoint(t))return;const{element:o,getDataFeekback:r,selectElementByIndex:l,coreEvent:a,emitChangeScreen:h,drawFeekback:c}=this._opts,d=this.helper,u=r();if(d.isPointInElementList(t,u))this.temp.set("mode",we.SELECT_ELEMENT_LIST);else{const{uuid:r,selectedControllerDirection:c}=d.isPointInElementWrapperController(t,u);if(r&&c)this.temp.set("mode",we.SELECT_ELEMENT_WRAPPER_CONTROLLER),this.temp.set("selectedControllerDirection",c),this.temp.set("selectedUUID",r);else{const[r,c]=o.isPointInElement(t,u);r>=0&&!0!==(null==(i=null==(e=u.elements[r])?void 0:e.operation)?void 0:i.invisible)?(l(r,{useMode:!0}),"string"==typeof c&&a.has("screenSelectElement")&&(a.trigger("screenSelectElement",{index:r,uuid:c,element:n(null==(s=u.elements)?void 0:s[r])}),h()),this.temp.set("mode",we.SELECT_ELEMENT)):(this.temp.set("selectedUUIDList",[]),this.temp.set("selectedUUID",null),this.temp.set("mode",we.SELECT_AREA))}}c()}_handleClick(t){var e;const{element:i,getDataFeekback:s,coreEvent:o,drawFeekback:r}=this._opts,l=s(),[a,h]=i.isPointInElement(t,l);a>=0&&h&&o.trigger("screenClickElement",{index:a,uuid:h,element:n(null==(e=l.elements)?void 0:e[a])}),r()}_handleMoveStart(t){const{element:e,getDataFeekback:i,coreEvent:n}=this._opts,s=i(),o=this.helper;this.temp.set("prevPoint",t);const r=this.temp.get("selectedUUID");this.temp.get("mode")===we.SELECT_ELEMENT_LIST||(this.temp.get("mode")===we.SELECT_ELEMENT?"string"==typeof r&&n.has("screenMoveElementStart")&&n.trigger("screenMoveElementStart",{index:e.getElementIndex(s,r),uuid:r,x:t.x,y:t.y}):this.temp.get("mode")===we.SELECT_AREA&&o.startSelectArea(t))}_handleMove(t){const{drawFeekback:e}=this._opts,i=this.helper;this.temp.get("mode")===we.SELECT_ELEMENT_LIST?(this.temp.set("hasChangedElement",!0),this._dragElements(this.temp.get("selectedUUIDList"),t,this.temp.get("prevPoint")),e(),this.temp.set("cursorStatus",Ee.DRAGGING)):"string"==typeof this.temp.get("selectedUUID")?this.temp.get("mode")===we.SELECT_ELEMENT?(this.temp.set("hasChangedElement",!0),this._dragElements([this.temp.get("selectedUUID")],t,this.temp.get("prevPoint")),e(),this.temp.set("cursorStatus",Ee.DRAGGING)):this.temp.get("mode")===we.SELECT_ELEMENT_WRAPPER_CONTROLLER&&this.temp.get("selectedControllerDirection")&&(this._transfromElement(this.temp.get("selectedUUID"),t,this.temp.get("prevPoint"),this.temp.get("selectedControllerDirection")),this.temp.set("cursorStatus",Ee.DRAGGING)):this.temp.get("mode")===we.SELECT_AREA&&(i.changeSelectArea(t),e()),this.temp.set("prevPoint",t)}_dragElements(t,e,i){if(!i)return;const{board:n,element:s,getDataFeekback:o,drawFeekback:r}=this._opts,l=o(),a=this.helper;t.forEach((t=>{var o,r;const h=a.getElementIndexByUUID(t);if(null===h)return;const c=l.elements[h];!0!==(null==(o=null==c?void 0:c.operation)?void 0:o.lock)&&!0!==(null==(r=null==c?void 0:c.operation)?void 0:r.invisible)&&s.dragElement(l,t,e,i,n.getContext().getTransform().scale)})),r()}_transfromElement(t,e,i,n){if(!i)return null;const{board:s,element:o,getDataFeekback:r,drawFeekback:l}=this._opts,a=r(),h=o.transformElement(a,t,e,i,s.getContext().getTransform().scale,n);return l(),h}_handleMoveEnd(t){const{element:e,getDataFeekback:i,coreEvent:n,drawFeekback:s,emitChangeData:o}=this._opts,r=i(),l=this.helper,a=this.temp.get("selectedUUID");if("string"==typeof a){const i=e.getElementIndex(r,a),s=r.elements[i];s&&(n.has("screenMoveElementEnd")&&n.trigger("screenMoveElementEnd",{index:i,uuid:a,x:t.x,y:t.y}),n.has("screenChangeElement")&&n.trigger("screenChangeElement",{index:i,uuid:a,width:s.w,height:s.h,angle:s.angle||0}))}else if(this.temp.get("mode")===we.SELECT_AREA){const t=l.calcSelectedElements(r);t.length>0?(this.temp.set("selectedUUIDList",t),this.temp.set("selectedUUID",null)):this.temp.set("mode",we.NULL),l.clearSelectedArea(),s()}this.temp.get("mode")!==we.SELECT_ELEMENT&&this.temp.set("selectedUUID",null),this.temp.set("cursorStatus",Ee.NULL),this.temp.set("mode",we.NULL),!0===this.temp.get("hasChangedElement")&&(o(),this.temp.set("hasChangedElement",!1))}_handleHover(t){var e,i;let n=!1;const{board:s,getDataFeekback:o,coreEvent:r}=this._opts,l=o(),a=this.helper,h=this._mapper;if(this.temp.get("mode")===we.SELECT_AREA)s.resetCursor();else if(this.temp.get("cursorStatus")===Ee.NULL){const{cursor:o,elementUUID:c}=h.judgePointCursor(t,l);if(s.setCursor(o),c){const t=a.getElementIndexByUUID(c);if(null!==t&&t>=0){const o=l.elements[t];if(!0===(null==(e=null==o?void 0:o.operation)?void 0:e.lock)||!0===(null==(i=null==o?void 0:o.operation)?void 0:i.invisible))return void s.resetCursor();if(this.temp.get("hoverUUID")!==o.uuid){const t=a.getElementIndexByUUID(this.temp.get("hoverUUID")||"");null!==t&&l.elements[t]&&r.trigger("mouseLeaveElement",{uuid:this.temp.get("hoverUUID"),index:t,element:l.elements[t]})}o&&(r.trigger("mouseOverElement",{uuid:o.uuid,index:t,element:o}),this.temp.set("hoverUUID",o.uuid),n=!0)}}}if(!0!==n&&null!==this.temp.get("hoverUUID")){const t=this.temp.get("hoverUUID"),e=a.getElementIndexByUUID(t||"");null!==e&&r.trigger("mouseLeaveElement",{uuid:t,index:e,element:l.elements[e]}),this.temp.set("hoverUUID",null)}r.has("mouseOverScreen")&&r.trigger("mouseOverScreen",t)}_handleLeave(){const{coreEvent:t}=this._opts;t.has("mouseLeaveScreen")&&t.trigger("mouseLeaveScreen",void 0)}}function De(t){t.setFillStyle("#000000"),t.setStrokeStyle("#000000"),t.setLineDash([]),t.setGlobalAlpha(1),t.setShadowColor("#00000000"),t.setShadowOffsetX(0),t.setShadowOffsetY(0),t.setShadowBlur(0)}class Me{constructor(t,e,i){var s,o,r;this[ye]=new Ft,this[be]=new class{constructor(){this._temp={hasInited:!1}}set(t,e){this._temp[t]=e}get(t){return this._temp[t]}clear(){this._temp={hasInited:!1}}},this[ce]={elements:[]},this[de]=e,this[ue]=function(t){const e=n(Ot);return t&&t.elementWrapper&&(e.elementWrapper={...e.elementWrapper,...t.elementWrapper}),e}(i||{}),this[he]=new Z(t,{...this[de],canScroll:null==(s=null==i?void 0:i.scrollWrapper)?void 0:s.use,scrollConfig:{color:(null==(o=null==i?void 0:i.scrollWrapper)?void 0:o.color)||"#a0a0a0",lineWidth:(null==(r=null==i?void 0:i.scrollWrapper)?void 0:r.lineWidth)||12}}),this[ge]=new Lt;const l=()=>{const t=this[he].getHelperContext(),e=this[Se].getHelperConfig();this[he].clear();const{contextWidth:i,contextHeight:n,devicePixelRatio:s}=this[de];t.clearRect(0,0,i*s,n*s),function(t,e){if(!(null==e?void 0:e.selectedElementWrapper))return;const i=e.selectedElementWrapper;De(t),$t(t,i.translate,i.radian||0,(()=>{t.beginPath(),t.setLineDash(i.lineDash),t.setLineWidth(i.lineWidth),t.setStrokeStyle(i.color),t.moveTo(i.controllers.topLeft.x,i.controllers.topLeft.y),t.lineTo(i.controllers.topRight.x,i.controllers.topRight.y),t.lineTo(i.controllers.bottomRight.x,i.controllers.bottomRight.y),t.lineTo(i.controllers.bottomLeft.x,i.controllers.bottomLeft.y),t.lineTo(i.controllers.topLeft.x,i.controllers.topLeft.y-i.lineWidth/2),t.stroke(),t.closePath(),!0!==i.lock?(!0!==i.controllers.rotate.invisible&&(t.beginPath(),t.moveTo(i.controllers.top.x,i.controllers.top.y),t.lineTo(i.controllers.rotate.x,i.controllers.rotate.y+i.controllerSize),t.stroke(),t.closePath(),t.beginPath(),t.setLineDash([]),t.setLineWidth(i.controllerSize/2),t.arc(i.controllers.rotate.x,i.controllers.rotate.y,.8*i.controllerSize,Math.PI/6,2*Math.PI),t.stroke(),t.closePath()),t.setFillStyle(i.color),[i.controllers.topLeft,i.controllers.top,i.controllers.topRight,i.controllers.right,i.controllers.bottomRight,i.controllers.bottom,i.controllers.bottomLeft,i.controllers.left].forEach((e=>{!0!==e.invisible&&(t.beginPath(),t.arc(e.x,e.y,i.controllerSize,0,2*Math.PI),t.fill(),t.closePath())}))):(De(t),t.setStrokeStyle(i.color),[i.controllers.topLeft,i.controllers.top,i.controllers.topRight,i.controllers.right,i.controllers.bottomRight,i.controllers.bottom,i.controllers.bottomLeft,i.controllers.left].forEach((e=>{t.beginPath(),t.moveTo(e.x-i.controllerSize/2,e.y-i.controllerSize/2),t.lineTo(e.x+i.controllerSize/2,e.y+i.controllerSize/2),t.stroke(),t.closePath(),t.beginPath(),t.moveTo(e.x+i.controllerSize/2,e.y-i.controllerSize/2),t.lineTo(e.x-i.controllerSize/2,e.y+i.controllerSize/2),t.stroke(),t.closePath()})))}))}(t,e),function(t,e){if(!(null==e?void 0:e.selectedAreaWrapper))return;const i=e.selectedAreaWrapper;i&&i.w>0&&i.h>0&&(De(t),t.setGlobalAlpha(.3),t.setFillStyle(i.color),t.fillRect(i.x,i.y,i.w,i.h),De(t),t.beginPath(),t.setLineDash(i.lineDash),t.setLineWidth(i.lineWidth),t.setStrokeStyle(i.color),t.moveTo(i.x,i.y),t.lineTo(i.x+i.w,i.y),t.lineTo(i.x+i.w,i.y+i.h),t.lineTo(i.x,i.y+i.h),t.lineTo(i.x,i.y),t.stroke(),t.closePath())}(t,e),function(t,e){if(!Array.isArray(null==e?void 0:e.selectedElementListWrappers))return;const i=e.selectedElementListWrappers;null==i||i.forEach((e=>{De(t),$t(t,e.translate,e.radian||0,(()=>{De(t),t.setGlobalAlpha(.05),t.setFillStyle(e.color),t.fillRect(e.controllers.topLeft.x,e.controllers.topLeft.y,e.controllers.bottomRight.x-e.controllers.topLeft.x,e.controllers.bottomRight.y-e.controllers.topLeft.y),De(t),t.beginPath(),t.setLineDash(e.lineDash),t.setLineWidth(e.lineWidth),t.setStrokeStyle(e.color),t.moveTo(e.controllers.topLeft.x,e.controllers.topLeft.y),t.lineTo(e.controllers.topRight.x,e.controllers.topRight.y),t.lineTo(e.controllers.bottomRight.x,e.controllers.bottomRight.y),t.lineTo(e.controllers.bottomLeft.x,e.controllers.bottomLeft.y),t.lineTo(e.controllers.topLeft.x,e.controllers.topLeft.y-e.lineWidth/2),t.stroke(),t.closePath(),!0===e.lock&&(De(t),t.setStrokeStyle(e.color),[e.controllers.topLeft,e.controllers.top,e.controllers.topRight,e.controllers.right,e.controllers.bottomRight,e.controllers.bottom,e.controllers.bottomLeft,e.controllers.left].forEach((i=>{t.beginPath(),t.moveTo(i.x-e.controllerSize/2,i.y-e.controllerSize/2),t.lineTo(i.x+e.controllerSize/2,i.y+e.controllerSize/2),t.stroke(),t.closePath(),t.beginPath(),t.moveTo(i.x+e.controllerSize/2,i.y-e.controllerSize/2),t.lineTo(i.x-e.controllerSize/2,i.y+e.controllerSize/2),t.stroke(),t.closePath()})))}))}))}(t,e),this[he].draw()};this[ge].on("drawFrame",(()=>{l()})),this[ge].on("drawFrameComplete",(()=>{l()})),this[me]=new qt(this[he].getContext()),this[Se]=new Le({coreEvent:this[_e],board:this[he],element:this[me],config:this[ue],drawFeekback:this[pe].bind(this),getDataFeekback:()=>this[ce],selectElementByIndex:this.selectElementByIndex.bind(this),emitChangeScreen:this[ve].bind(this),emitChangeData:this[xe].bind(this)}),this[Se].init(),this[ge].on("drawFrame",(()=>{this[_e].trigger("drawFrame",void 0)})),this[ge].on("drawFrameComplete",(()=>{this[_e].trigger("drawFrameComplete",void 0)})),this[fe].set("hasInited",!0)}[(ye=_e,be=fe,pe)](t){this[Se].updateHelperConfig({width:this[de].width,height:this[de].height,devicePixelRatio:this[de].devicePixelRatio}),this[ge].thaw(),this[ge].render(this[he].getContext(),this[ce],{changeResourceUUIDs:(null==t?void 0:t.resourceChangeUUIDs)||[]})}getElement(t){return function(t,e){let i=null;const s=t[Se].helper.getElementIndexByUUID(e);return null!==s&&t[ce].elements[s]&&(i=n(t[ce].elements[s])),i}(this,t)}getElementByIndex(t){return function(t,e){let i=null;return e>=0&&t[ce].elements[e]&&(i=n(t[ce].elements[e])),i}(this,t)}selectElementByIndex(t){return function(t,e){if(t[ce].elements[e]){const i=t[ce].elements[e].uuid;t[Se].temp.set("mode",we.NULL),"string"==typeof i&&(t[Se].temp.set("selectedUUID",i),t[Se].temp.set("selectedUUIDList",[])),t[pe]()}}(this,t)}selectElement(t){return function(t,e){const i=t[Se].helper.getElementIndexByUUID(e);"number"==typeof i&&i>=0&&t.selectElementByIndex(i)}(this,t)}cancelElementByIndex(t,e){return function(t,e){if(t[ce].elements[e]){const i=t[ce].elements[e].uuid,n=t[Se].temp.get("selectedUUID");"string"==typeof i&&i===n&&(t[Se].temp.set("mode",we.NULL),t[Se].temp.set("selectedUUID",null),t[Se].temp.set("selectedUUIDList",[])),t[pe]()}}(this,t)}cancelElement(t,e){return function(t,e,i){const n=t[Se].helper.getElementIndexByUUID(e);"number"==typeof n&&n>=0&&t.cancelElementByIndex(n,i)}(this,t,e)}moveUpElement(t){return function(t,e){const i=t[Se].helper.getElementIndexByUUID(e);if("number"==typeof i&&i>=0&&i<t[ce].elements.length-1){const e=t[ce].elements[i];t[ce].elements[i]=t[ce].elements[i+1],t[ce].elements[i+1]=e}t[xe](),t[pe]()}(this,t)}moveDownElement(t){return function(t,e){const i=t[Se].helper.getElementIndexByUUID(e);if("number"==typeof i&&i>0&&i<t[ce].elements.length){const e=t[ce].elements[i];t[ce].elements[i]=t[ce].elements[i-1],t[ce].elements[i-1]=e}t[xe](),t[pe]()}(this,t)}updateElement(t){return function(t,e){var i;const s=n(e),o=t[ce],r=[];for(let t=0;t<o.elements.length;t++)if(s.uuid===(null==(i=o.elements[t])?void 0:i.uuid)){const e=Ht(o.elements[t],s);"string"==typeof e&&r.push(e),o.elements[t]=s;break}t[xe](),t[pe]({resourceChangeUUIDs:r})}(this,t)}addElement(t){return function(t,e){const s=n(e);return s.uuid=i(),t[ce].elements.push(s),t[xe](),t[pe](),s.uuid}(this,t)}deleteElement(t){return function(t,e){const i=t[me].getElementIndex(t[ce],e);i>=0&&(t[ce].elements.splice(i,1),t[xe](),t[pe]())}(this,t)}insertElementBefore(t,e){return function(t,e,i){const n=t[Se].helper.getElementIndexByUUID(i);return null!==n?t.insertElementBeforeIndex(e,n):null}(this,t,e)}insertElementBeforeIndex(t,e){return function(t,e,s){const o=n(e);return o.uuid=i(),s>=0?(t[ce].elements.splice(s,0,o),t[xe](),t[pe](),o.uuid):null}(this,t,e)}getSelectedElements(){return function(t){const e=[];let i=[];const s=t[Se].temp.get("selectedUUID");return"string"==typeof s&&s?i.push(s):i=t[Se].temp.get("selectedUUIDList"),i.forEach((i=>{var n;const s=t[Se].helper.getElementIndexByUUID(i);if(null!==s&&s>=0){const i=null==(n=t[ce])?void 0:n.elements[s];i&&e.push(i)}})),n(e)}(this)}insertElementAfter(t,e){return function(t,e,i){const n=t[Se].helper.getElementIndexByUUID(i);return null!==n?t.insertElementAfterIndex(e,n):null}(this,t,e)}insertElementAfterIndex(t,e){return function(t,e,s){const o=n(e);return o.uuid=i(),s>=0?(t[ce].elements.splice(s+1,0,o),t[xe](),t[pe](),o.uuid):null}(this,t,e)}resetSize(t){this[de]={...this[de],...t},this[he].resetSize(t),this[pe]()}scale(t){const e=this[he].scale(t);return this[pe](),this[ve](),e}scrollLeft(t){const e=this[he].scrollX(0-t);return this[pe](),this[ve](),e}scrollTop(t){const e=this[he].scrollY(0-t);return this[pe](),this[ve](),e}getScreenTransform(){const t=this[he].getTransform();return{scale:t.scale,scrollTop:Math.max(0,0-t.scrollY),scrollLeft:Math.max(0,0-t.scrollX)}}getData(){return n(this[ce])}setData(t,e){const i=function(t,e){var i;const n=[],s=Bt(t),o=Bt(e);for(const t in o)if(!0===["image","svg","html"].includes(null==(i=o[t])?void 0:i.type))if(s[t]){let e=!1;switch(s[t].type){case"image":e=Yt(s[t],o[t]);break;case"svg":e=Nt(s[t],o[t]);break;case"html":e=Xt(s[t],o[t])}!0===e&&n.push(t)}else n.push(t);return n}(this[ce],t);this[ce]=this[me].initData(n(le(t))),e&&!0===e.triggerChangeEvent&&this[xe](),this[pe]({resourceChangeUUIDs:i})}clearOperation(){this[fe].clear(),this[pe]()}on(t,e){this[_e].on(t,e)}off(t,e){this[_e].off(t,e)}pointScreenToContext(t){return this[he].pointScreenToContext(t)}pointContextToScreen(t){return this[he].pointContextToScreen(t)}__getBoardContext(){return this[he].getContext()}__getDisplayContext2D(){return this[he].getDisplayContext2D()}__getOriginContext2D(){return this[he].getOriginContext2D()}[ve](){this[_e].has("changeScreen")&&this[_e].trigger("changeScreen",{...this.getScreenTransform()})}[xe](){this[_e].has("changeData")&&this[_e].trigger("changeData",n(this[ce]))}}return Me.is=Tt,Me.check=Wt,Me}();
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@idraw/core",
|
|
3
|
-
"version": "0.3.0-
|
|
3
|
+
"version": "0.3.0-beta.1",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "dist/esm/index.js",
|
|
6
6
|
"module": "dist/esm/index.js",
|
|
@@ -21,15 +21,15 @@
|
|
|
21
21
|
"author": "chenshenhai",
|
|
22
22
|
"license": "MIT",
|
|
23
23
|
"devDependencies": {
|
|
24
|
-
"@idraw/types": "^0.3.0-
|
|
24
|
+
"@idraw/types": "^0.3.0-beta.1"
|
|
25
25
|
},
|
|
26
26
|
"dependencies": {
|
|
27
|
-
"@idraw/board": "^0.3.0-
|
|
28
|
-
"@idraw/renderer": "^0.3.0-
|
|
29
|
-
"@idraw/util": "^0.3.0-
|
|
27
|
+
"@idraw/board": "^0.3.0-beta.1",
|
|
28
|
+
"@idraw/renderer": "^0.3.0-beta.1",
|
|
29
|
+
"@idraw/util": "^0.3.0-beta.1"
|
|
30
30
|
},
|
|
31
31
|
"publishConfig": {
|
|
32
32
|
"access": "public"
|
|
33
33
|
},
|
|
34
|
-
"gitHead": "
|
|
34
|
+
"gitHead": "fe4d50d1d413f5b7b82de935566573c72cc2d187"
|
|
35
35
|
}
|