@idraw/core 0.2.0-alpha.16 → 0.2.0-alpha.22

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.
@@ -1,4490 +1 @@
1
- var iDrawCore = (function () {
2
- 'use strict';
3
-
4
- var extendStatics = function(d, b) {
5
- extendStatics = Object.setPrototypeOf ||
6
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
7
- function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
8
- return extendStatics(d, b);
9
- };
10
- function __extends(d, b) {
11
- if (typeof b !== "function" && b !== null)
12
- throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
13
- extendStatics(d, b);
14
- function __() { this.constructor = d; }
15
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
16
- }
17
- var __assign$1 = function() {
18
- __assign$1 = Object.assign || function __assign(t) {
19
- for (var s, i = 1, n = arguments.length; i < n; i++) {
20
- s = arguments[i];
21
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
22
- }
23
- return t;
24
- };
25
- return __assign$1.apply(this, arguments);
26
- };
27
- function __awaiter$2(thisArg, _arguments, P, generator) {
28
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
29
- return new (P || (P = Promise))(function (resolve, reject) {
30
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
31
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
32
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
33
- step((generator = generator.apply(thisArg, _arguments || [])).next());
34
- });
35
- }
36
- function __generator$2(thisArg, body) {
37
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
38
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
39
- function verb(n) { return function (v) { return step([n, v]); }; }
40
- function step(op) {
41
- if (f) throw new TypeError("Generator is already executing.");
42
- while (_) try {
43
- if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
44
- if (y = 0, t) op = [op[0] & 2, t.value];
45
- switch (op[0]) {
46
- case 0: case 1: t = op; break;
47
- case 4: _.label++; return { value: op[1], done: false };
48
- case 5: _.label++; y = op[1]; op = [0]; continue;
49
- case 7: op = _.ops.pop(); _.trys.pop(); continue;
50
- default:
51
- if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
52
- if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
53
- if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
54
- if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
55
- if (t[2]) _.ops.pop();
56
- _.trys.pop(); continue;
57
- }
58
- op = body.call(thisArg, _);
59
- } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
60
- if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
61
- }
62
- }
63
-
64
- var __assign = function() {
65
- __assign = Object.assign || function __assign(t) {
66
- for (var s, i = 1, n = arguments.length; i < n; i++) {
67
- s = arguments[i];
68
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
69
- }
70
- return t;
71
- };
72
- return __assign.apply(this, arguments);
73
- };
74
- function compose$1(middleware) {
75
- return function (context, next) {
76
- return dispatch(0);
77
- function dispatch(i) {
78
- var fn = middleware[i];
79
- if (i === middleware.length && next) {
80
- fn = next;
81
- }
82
- if (!fn)
83
- return Promise.resolve();
84
- try {
85
- return Promise.resolve(fn(context, dispatch.bind(null, i + 1)));
86
- }
87
- catch (err) {
88
- return Promise.reject(err);
89
- }
90
- }
91
- };
92
- }
93
- function delay$1(time) {
94
- return new Promise(function (resolve) {
95
- setTimeout(function () {
96
- resolve();
97
- }, time);
98
- });
99
- }
100
- function throttle$1(fn, timeout) {
101
- var timer = -1;
102
- return function () {
103
- var args = [];
104
- for (var _i = 0; _i < arguments.length; _i++) {
105
- args[_i] = arguments[_i];
106
- }
107
- if (timer > 0) {
108
- return;
109
- }
110
- timer = setTimeout(function () {
111
- fn.apply(void 0, args);
112
- timer = -1;
113
- }, timeout);
114
- };
115
- }
116
- function downloadImageFromCanvas$1(canvas, opts) {
117
- var filename = opts.filename, _a = opts.type, type = _a === void 0 ? 'image/jpeg' : _a;
118
- var stream = canvas.toDataURL(type);
119
- var downloadLink = document.createElement('a');
120
- downloadLink.href = stream;
121
- downloadLink.download = filename;
122
- var downloadClickEvent = document.createEvent('MouseEvents');
123
- downloadClickEvent.initEvent('click', true, false);
124
- downloadLink.dispatchEvent(downloadClickEvent);
125
- }
126
- function toColorHexNum$1(color) {
127
- return parseInt(color.replace(/^\#/, '0x'));
128
- }
129
- function toColorHexStr$1(color) {
130
- return '#' + color.toString(16);
131
- }
132
- function isColorStr$3(color) {
133
- return typeof color === 'string' && /^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(color);
134
- }
135
- function createUUID$3() {
136
- function str4() {
137
- return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
138
- }
139
- return "" + str4() + str4() + "-" + str4() + "-" + str4() + "-" + str4() + "-" + str4() + str4() + str4();
140
- }
141
- function deepClone$6(target) {
142
- function _clone(t) {
143
- var type = is$2(t);
144
- if (['Null', 'Number', 'String', 'Boolean', 'Undefined'].indexOf(type) >= 0) {
145
- return t;
146
- }
147
- else if (type === 'Array') {
148
- var arr_1 = [];
149
- t.forEach(function (item) {
150
- arr_1.push(_clone(item));
151
- });
152
- return arr_1;
153
- }
154
- else if (type === 'Object') {
155
- var obj_1 = {};
156
- var keys = Object.keys(t);
157
- keys.forEach(function (key) {
158
- obj_1[key] = _clone(t[key]);
159
- });
160
- return obj_1;
161
- }
162
- }
163
- return _clone(target);
164
- }
165
- function is$2(data) {
166
- return Object.prototype.toString.call(data).replace(/[\]|\[]{1,1}/ig, '').split(' ')[1];
167
- }
168
- function parsePrototype$1(data) {
169
- var typeStr = Object.prototype.toString.call(data) || '';
170
- var result = typeStr.replace(/(\[object|\])/ig, '').trim();
171
- return result;
172
- }
173
- var istype$2 = {
174
- type: function (data, lowerCase) {
175
- var result = parsePrototype$1(data);
176
- return lowerCase === true ? result.toLocaleLowerCase() : result;
177
- },
178
- array: function (data) {
179
- return parsePrototype$1(data) === 'Array';
180
- },
181
- json: function (data) {
182
- return parsePrototype$1(data) === 'Object';
183
- },
184
- function: function (data) {
185
- return parsePrototype$1(data) === 'Function';
186
- },
187
- asyncFunction: function (data) {
188
- return parsePrototype$1(data) === 'AsyncFunction';
189
- },
190
- string: function (data) {
191
- return parsePrototype$1(data) === 'String';
192
- },
193
- number: function (data) {
194
- return parsePrototype$1(data) === 'Number';
195
- },
196
- undefined: function (data) {
197
- return parsePrototype$1(data) === 'Undefined';
198
- },
199
- null: function (data) {
200
- return parsePrototype$1(data) === 'Null';
201
- },
202
- promise: function (data) {
203
- return parsePrototype$1(data) === 'Promise';
204
- },
205
- };
206
- function __awaiter$1(thisArg, _arguments, P, generator) {
207
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
208
- return new (P || (P = Promise))(function (resolve, reject) {
209
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
210
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
211
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
212
- step((generator = generator.apply(thisArg, _arguments || [])).next());
213
- });
214
- }
215
- function __generator$1(thisArg, body) {
216
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
217
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
218
- function verb(n) { return function (v) { return step([n, v]); }; }
219
- function step(op) {
220
- if (f) throw new TypeError("Generator is already executing.");
221
- while (_) try {
222
- if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
223
- if (y = 0, t) op = [op[0] & 2, t.value];
224
- switch (op[0]) {
225
- case 0: case 1: t = op; break;
226
- case 4: _.label++; return { value: op[1], done: false };
227
- case 5: _.label++; y = op[1]; op = [0]; continue;
228
- case 7: op = _.ops.pop(); _.trys.pop(); continue;
229
- default:
230
- if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
231
- if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
232
- if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
233
- if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
234
- if (t[2]) _.ops.pop();
235
- _.trys.pop(); continue;
236
- }
237
- op = body.call(thisArg, _);
238
- } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
239
- if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
240
- }
241
- }
242
- function parseHTMLToDataURL$1(html, opts) {
243
- var width = opts.width, height = opts.height;
244
- return new Promise(function (resolve, reject) {
245
- var _svg = "\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"" + (width || '') + "\" height = \"" + (height || '') + "\">\n <foreignObject width=\"100%\" height=\"100%\">\n <div xmlns = \"http://www.w3.org/1999/xhtml\">\n " + html + "\n </div>\n </foreignObject>\n </svg>\n ";
246
- var blob = new Blob([_svg], { type: 'image/svg+xml;charset=utf-8' });
247
- var reader = new FileReader();
248
- reader.readAsDataURL(blob);
249
- reader.onload = function (event) {
250
- var _a;
251
- var base64 = (_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.result;
252
- resolve(base64);
253
- };
254
- reader.onerror = function (err) {
255
- reject(err);
256
- };
257
- });
258
- }
259
- function parseSVGToDataURL$1(svg) {
260
- return new Promise(function (resolve, reject) {
261
- var _svg = svg;
262
- var blob = new Blob([_svg], { type: 'image/svg+xml;charset=utf-8' });
263
- var reader = new FileReader();
264
- reader.readAsDataURL(blob);
265
- reader.onload = function (event) {
266
- var _a;
267
- var base64 = (_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.result;
268
- resolve(base64);
269
- };
270
- reader.onerror = function (err) {
271
- reject(err);
272
- };
273
- });
274
- }
275
- var Image$1 = window.Image;
276
- function loadImage$2(src) {
277
- return new Promise(function (resolve, reject) {
278
- var img = new Image$1;
279
- img.onload = function () {
280
- resolve(img);
281
- };
282
- img.onabort = reject;
283
- img.onerror = reject;
284
- img.src = src;
285
- });
286
- }
287
- function loadSVG$2(svg) {
288
- return __awaiter$1(this, void 0, void 0, function () {
289
- var dataURL, image;
290
- return __generator$1(this, function (_a) {
291
- switch (_a.label) {
292
- case 0: return [4, parseSVGToDataURL$1(svg)];
293
- case 1:
294
- dataURL = _a.sent();
295
- return [4, loadImage$2(dataURL)];
296
- case 2:
297
- image = _a.sent();
298
- return [2, image];
299
- }
300
- });
301
- });
302
- }
303
- function loadHTML$2(html, opts) {
304
- return __awaiter$1(this, void 0, void 0, function () {
305
- var dataURL, image;
306
- return __generator$1(this, function (_a) {
307
- switch (_a.label) {
308
- case 0: return [4, parseHTMLToDataURL$1(html, opts)];
309
- case 1:
310
- dataURL = _a.sent();
311
- return [4, loadImage$2(dataURL)];
312
- case 2:
313
- image = _a.sent();
314
- return [2, image];
315
- }
316
- });
317
- });
318
- }
319
- var index$1 = {
320
- time: {
321
- delay: delay$1,
322
- compose: compose$1,
323
- throttle: throttle$1,
324
- },
325
- loader: {
326
- loadImage: loadImage$2,
327
- loadSVG: loadSVG$2,
328
- loadHTML: loadHTML$2,
329
- },
330
- file: {
331
- downloadImageFromCanvas: downloadImageFromCanvas$1,
332
- },
333
- color: {
334
- toColorHexStr: toColorHexStr$1,
335
- toColorHexNum: toColorHexNum$1,
336
- isColorStr: isColorStr$3,
337
- },
338
- uuid: {
339
- createUUID: createUUID$3
340
- },
341
- istype: istype$2,
342
- data: {
343
- deepClone: deepClone$6,
344
- }
345
- };
346
- var BoardEvent = (function () {
347
- function BoardEvent() {
348
- this._listeners = new Map();
349
- }
350
- BoardEvent.prototype.on = function (eventKey, callback) {
351
- if (this._listeners.has(eventKey)) {
352
- var callbacks = this._listeners.get(eventKey);
353
- callbacks === null || callbacks === void 0 ? void 0 : callbacks.push(callback);
354
- this._listeners.set(eventKey, callbacks || []);
355
- }
356
- else {
357
- this._listeners.set(eventKey, [callback]);
358
- }
359
- };
360
- BoardEvent.prototype.off = function (eventKey, callback) {
361
- if (this._listeners.has(eventKey)) {
362
- var callbacks = this._listeners.get(eventKey);
363
- if (Array.isArray(callbacks)) {
364
- for (var i = 0; i < (callbacks === null || callbacks === void 0 ? void 0 : callbacks.length); i++) {
365
- if (callbacks[i] === callback) {
366
- callbacks.splice(i, 1);
367
- break;
368
- }
369
- }
370
- }
371
- this._listeners.set(eventKey, callbacks || []);
372
- }
373
- };
374
- BoardEvent.prototype.trigger = function (eventKey, arg) {
375
- var callbacks = this._listeners.get(eventKey);
376
- if (Array.isArray(callbacks)) {
377
- callbacks.forEach(function (cb) {
378
- cb(arg);
379
- });
380
- return true;
381
- }
382
- else {
383
- return false;
384
- }
385
- };
386
- BoardEvent.prototype.has = function (name) {
387
- if (this._listeners.has(name)) {
388
- var list = this._listeners.get(name);
389
- if (Array.isArray(list) && list.length > 0) {
390
- return true;
391
- }
392
- }
393
- return false;
394
- };
395
- return BoardEvent;
396
- }());
397
- function createTempData() {
398
- return {
399
- prevClickPoint: null,
400
- isHoverCanvas: false,
401
- isDragCanvas: false,
402
- statusMap: {
403
- canScrollYPrev: true,
404
- canScrollYNext: true,
405
- canScrollXPrev: true,
406
- canScrollXNext: true,
407
- }
408
- };
409
- }
410
- var TempData$1 = (function () {
411
- function TempData() {
412
- this._temp = createTempData();
413
- }
414
- TempData.prototype.set = function (name, value) {
415
- this._temp[name] = value;
416
- };
417
- TempData.prototype.get = function (name) {
418
- return this._temp[name];
419
- };
420
- TempData.prototype.clear = function () {
421
- this._temp = createTempData();
422
- };
423
- return TempData;
424
- }());
425
- var ScreenWatcher = (function () {
426
- function ScreenWatcher(canvas, ctx) {
427
- this._isMoving = false;
428
- this._temp = new TempData$1;
429
- this._container = window;
430
- this._canvas = canvas;
431
- this._isMoving = false;
432
- this._initEvent();
433
- this._event = new BoardEvent;
434
- }
435
- ScreenWatcher.prototype.setStatusMap = function (statusMap) {
436
- this._temp.set('statusMap', statusMap);
437
- };
438
- ScreenWatcher.prototype.on = function (name, callback) {
439
- this._event.on(name, callback);
440
- };
441
- ScreenWatcher.prototype.off = function (name, callback) {
442
- this._event.off(name, callback);
443
- };
444
- ScreenWatcher.prototype._initEvent = function () {
445
- var canvas = this._canvas;
446
- var container = this._container;
447
- container.addEventListener('mousemove', this._listenWindowMove.bind(this), false);
448
- container.addEventListener('mouseup', this._listenWindowMoveEnd.bind(this), false);
449
- canvas.addEventListener('mousemove', this._listenHover.bind(this), false);
450
- canvas.addEventListener('mousedown', this._listenMoveStart.bind(this), false);
451
- canvas.addEventListener('mousemove', this._listenMove.bind(this), false);
452
- canvas.addEventListener('mouseup', this._listenMoveEnd.bind(this), false);
453
- canvas.addEventListener('click', this._listenCanvasClick.bind(this), false);
454
- canvas.addEventListener('wheel', this._listenCanvasWheel.bind(this), false);
455
- canvas.addEventListener('mousedown', this._listenCanvasMoveStart.bind(this), true);
456
- canvas.addEventListener('mouseup', this._listenCanvasMoveEnd.bind(this), true);
457
- canvas.addEventListener('mouseover', this._listenCanvasMoveOver.bind(this), true);
458
- canvas.addEventListener('mouseleave', this._listenCanvasMoveLeave.bind(this), true);
459
- this._initParentEvent();
460
- };
461
- ScreenWatcher.prototype._initParentEvent = function () {
462
- var target = window;
463
- var targetOrigin = target.origin;
464
- while (target.self !== target.top) {
465
- if (target.self !== target.parent) {
466
- if (target.origin === targetOrigin) {
467
- target.parent.window.addEventListener('mousemove', this._listSameOriginParentWindow.bind(this), false);
468
- }
469
- }
470
- target = target.parent;
471
- if (!target) {
472
- break;
473
- }
474
- }
475
- };
476
- ScreenWatcher.prototype._listenHover = function (e) {
477
- e.preventDefault();
478
- var p = this._getPosition(e);
479
- if (this._isVaildPoint(p)) {
480
- if (this._event.has('hover')) {
481
- this._event.trigger('hover', p);
482
- }
483
- }
484
- this._isMoving = true;
485
- };
486
- ScreenWatcher.prototype._listenMoveStart = function (e) {
487
- e.preventDefault();
488
- var p = this._getPosition(e);
489
- if (this._isVaildPoint(p)) {
490
- if (this._event.has('point')) {
491
- this._event.trigger('point', p);
492
- }
493
- if (this._event.has('moveStart')) {
494
- this._event.trigger('moveStart', p);
495
- }
496
- }
497
- this._isMoving = true;
498
- };
499
- ScreenWatcher.prototype._listenMove = function (e) {
500
- e.preventDefault();
501
- e.stopPropagation();
502
- if (this._event.has('move') && this._isMoving === true) {
503
- var p = this._getPosition(e);
504
- if (this._isVaildPoint(p)) {
505
- this._event.trigger('move', p);
506
- }
507
- }
508
- };
509
- ScreenWatcher.prototype._listenMoveEnd = function (e) {
510
- e.preventDefault();
511
- if (this._event.has('moveEnd')) {
512
- var p = this._getPosition(e);
513
- if (this._isVaildPoint(p)) {
514
- this._event.trigger('moveEnd', p);
515
- }
516
- }
517
- this._isMoving = false;
518
- };
519
- ScreenWatcher.prototype._listSameOriginParentWindow = function () {
520
- if (this._temp.get('isHoverCanvas')) {
521
- if (this._event.has('leave')) {
522
- this._event.trigger('leave', undefined);
523
- }
524
- }
525
- if (this._temp.get('isDragCanvas')) {
526
- if (this._event.has('moveEnd')) {
527
- this._event.trigger('moveEnd', { x: NaN, y: NaN });
528
- }
529
- }
530
- this._isMoving = false;
531
- this._temp.set('isDragCanvas', false);
532
- this._temp.set('isHoverCanvas', false);
533
- };
534
- ScreenWatcher.prototype._listenCanvasMoveStart = function () {
535
- if (this._temp.get('isHoverCanvas')) {
536
- this._temp.set('isDragCanvas', true);
537
- }
538
- };
539
- ScreenWatcher.prototype._listenCanvasMoveEnd = function () {
540
- this._temp.set('isDragCanvas', false);
541
- };
542
- ScreenWatcher.prototype._listenCanvasMoveOver = function () {
543
- this._temp.set('isHoverCanvas', true);
544
- };
545
- ScreenWatcher.prototype._listenCanvasMoveLeave = function () {
546
- this._temp.set('isHoverCanvas', false);
547
- if (this._event.has('leave')) {
548
- this._event.trigger('leave', undefined);
549
- }
550
- };
551
- ScreenWatcher.prototype._listenWindowMove = function (e) {
552
- if (this._temp.get('isDragCanvas') !== true) {
553
- return;
554
- }
555
- e.preventDefault();
556
- e.stopPropagation();
557
- if (this._event.has('move') && this._isMoving === true) {
558
- var p = this._getPosition(e);
559
- if (this._isVaildPoint(p)) {
560
- this._event.trigger('move', p);
561
- }
562
- }
563
- };
564
- ScreenWatcher.prototype._listenWindowMoveEnd = function (e) {
565
- if (!this._temp.get('isDragCanvas') === true) {
566
- return;
567
- }
568
- e.preventDefault();
569
- if (this._event.has('moveEnd')) {
570
- var p = this._getPosition(e);
571
- if (this._isVaildPoint(p)) {
572
- this._event.trigger('moveEnd', p);
573
- }
574
- }
575
- this._temp.set('isDragCanvas', false);
576
- this._isMoving = false;
577
- };
578
- ScreenWatcher.prototype._listenCanvasWheel = function (e) {
579
- if (this._event.has('wheelX') && (e.deltaX > 0 || e.deltaX < 0)) {
580
- this._event.trigger('wheelX', e.deltaX);
581
- }
582
- if (this._event.has('wheelY') && (e.deltaY > 0 || e.deltaY < 0)) {
583
- this._event.trigger('wheelY', e.deltaY);
584
- }
585
- var _a = this._temp.get('statusMap'), canScrollYNext = _a.canScrollYNext, canScrollYPrev = _a.canScrollYPrev;
586
- if (e.deltaX > 0 && e.deltaX < 0) {
587
- e.preventDefault();
588
- }
589
- else if (e.deltaY > 0 && canScrollYNext === true) {
590
- e.preventDefault();
591
- }
592
- else if (e.deltaY < 0 && canScrollYPrev === true) {
593
- e.preventDefault();
594
- }
595
- };
596
- ScreenWatcher.prototype._listenCanvasClick = function (e) {
597
- e.preventDefault();
598
- var maxLimitTime = 500;
599
- var p = this._getPosition(e);
600
- var t = Date.now();
601
- if (this._isVaildPoint(p)) {
602
- var preClickPoint = this._temp.get('prevClickPoint');
603
- if (preClickPoint && (t - preClickPoint.t <= maxLimitTime)
604
- && Math.abs(preClickPoint.x - p.x) <= 5
605
- && Math.abs(preClickPoint.y - p.y) <= 5) {
606
- if (this._event.has('doubleClick')) {
607
- this._event.trigger('doubleClick', { x: p.x, y: p.y });
608
- }
609
- }
610
- else {
611
- this._temp.set('prevClickPoint', { x: p.x, y: p.y, t: t, });
612
- }
613
- }
614
- };
615
- ScreenWatcher.prototype._getPosition = function (e) {
616
- var canvas = this._canvas;
617
- var x = 0;
618
- var y = 0;
619
- if (e && e.touches && e.touches.length > 0) {
620
- var touch = e.touches[0];
621
- if (touch) {
622
- x = touch.clientX;
623
- y = touch.clientY;
624
- }
625
- }
626
- else {
627
- x = e.clientX;
628
- y = e.clientY;
629
- }
630
- var p = {
631
- x: x - canvas.getBoundingClientRect().left,
632
- y: y - canvas.getBoundingClientRect().top,
633
- t: Date.now(),
634
- };
635
- return p;
636
- };
637
- ScreenWatcher.prototype._isVaildPoint = function (p) {
638
- return isAvailableNum(p.x) && isAvailableNum(p.y);
639
- };
640
- return ScreenWatcher;
641
- }());
642
- function isAvailableNum(num) {
643
- return (num > 0 || num < 0 || num === 0);
644
- }
645
- function setStyle(dom, style) {
646
- var originStyle = getStyle(dom);
647
- var _style = __assign(__assign({}, originStyle), style);
648
- var keys = Object.keys(_style);
649
- var styleStr = '';
650
- keys.forEach(function (key) {
651
- styleStr += key + ":" + (_style[key] || '') + ";";
652
- });
653
- dom.setAttribute('style', styleStr);
654
- }
655
- function getStyle(dom) {
656
- var styleObj = {};
657
- var style = dom.getAttribute('style') || '';
658
- var styleList = style.split(';');
659
- styleList.forEach(function (item) {
660
- var dataList = item.split(':');
661
- if (dataList[0] && typeof dataList[0] === 'string') {
662
- styleObj[dataList[0]] = dataList[1] || '';
663
- }
664
- });
665
- return styleObj;
666
- }
667
- var Context = (function () {
668
- function Context(ctx, opts) {
669
- this._opts = opts;
670
- this._ctx = ctx;
671
- this._transform = {
672
- scale: 1,
673
- scrollX: 0,
674
- scrollY: 0,
675
- };
676
- }
677
- Context.prototype.resetSize = function (opts) {
678
- this._opts = __assign(__assign({}, this._opts), opts);
679
- };
680
- Context.prototype.calcDeviceNum = function (num) {
681
- return num * this._opts.devicePixelRatio;
682
- };
683
- Context.prototype.calcScreenNum = function (num) {
684
- return num / this._opts.devicePixelRatio;
685
- };
686
- Context.prototype.getSize = function () {
687
- return {
688
- width: this._opts.width,
689
- height: this._opts.height,
690
- contextWidth: this._opts.contextWidth,
691
- contextHeight: this._opts.contextHeight,
692
- devicePixelRatio: this._opts.devicePixelRatio,
693
- };
694
- };
695
- Context.prototype.setTransform = function (config) {
696
- this._transform = __assign(__assign({}, this._transform), config);
697
- };
698
- Context.prototype.getTransform = function () {
699
- return {
700
- scale: this._transform.scale,
701
- scrollX: this._transform.scrollX,
702
- scrollY: this._transform.scrollY,
703
- };
704
- };
705
- Context.prototype.setFillStyle = function (color) {
706
- this._ctx.fillStyle = color;
707
- };
708
- Context.prototype.fill = function (fillRule) {
709
- return this._ctx.fill(fillRule || 'nonzero');
710
- };
711
- Context.prototype.arc = function (x, y, radius, startAngle, endAngle, anticlockwise) {
712
- return this._ctx.arc(this._doSize(x), this._doSize(y), this._doSize(radius), startAngle, endAngle, anticlockwise);
713
- };
714
- Context.prototype.rect = function (x, y, w, h) {
715
- return this._ctx.rect(this._doSize(x), this._doSize(y), this._doSize(w), this._doSize(h));
716
- };
717
- Context.prototype.fillRect = function (x, y, w, h) {
718
- return this._ctx.fillRect(this._doSize(x), this._doSize(y), this._doSize(w), this._doSize(h));
719
- };
720
- Context.prototype.clearRect = function (x, y, w, h) {
721
- return this._ctx.clearRect(this._doSize(x), this._doSize(y), this._doSize(w), this._doSize(h));
722
- };
723
- Context.prototype.beginPath = function () {
724
- return this._ctx.beginPath();
725
- };
726
- Context.prototype.closePath = function () {
727
- return this._ctx.closePath();
728
- };
729
- Context.prototype.lineTo = function (x, y) {
730
- return this._ctx.lineTo(this._doSize(x), this._doSize(y));
731
- };
732
- Context.prototype.moveTo = function (x, y) {
733
- return this._ctx.moveTo(this._doSize(x), this._doSize(y));
734
- };
735
- Context.prototype.arcTo = function (x1, y1, x2, y2, radius) {
736
- return this._ctx.arcTo(this._doSize(x1), this._doSize(y1), this._doSize(x2), this._doSize(y2), this._doSize(radius));
737
- };
738
- Context.prototype.setLineWidth = function (w) {
739
- return this._ctx.lineWidth = this._doSize(w);
740
- };
741
- Context.prototype.setLineDash = function (nums) {
742
- var _this = this;
743
- return this._ctx.setLineDash(nums.map(function (n) { return _this._doSize(n); }));
744
- };
745
- Context.prototype.isPointInPath = function (x, y) {
746
- return this._ctx.isPointInPath(this._doX(x), this._doY(y));
747
- };
748
- Context.prototype.isPointInPathWithoutScroll = function (x, y) {
749
- return this._ctx.isPointInPath(this._doSize(x), this._doSize(y));
750
- };
751
- Context.prototype.setStrokeStyle = function (color) {
752
- this._ctx.strokeStyle = color;
753
- };
754
- Context.prototype.stroke = function () {
755
- return this._ctx.stroke();
756
- };
757
- Context.prototype.translate = function (x, y) {
758
- return this._ctx.translate(this._doSize(x), this._doSize(y));
759
- };
760
- Context.prototype.rotate = function (angle) {
761
- return this._ctx.rotate(angle);
762
- };
763
- Context.prototype.drawImage = function () {
764
- var args = [];
765
- for (var _i = 0; _i < arguments.length; _i++) {
766
- args[_i] = arguments[_i];
767
- }
768
- var image = args[0];
769
- var sx = args[1];
770
- var sy = args[2];
771
- var sw = args[3];
772
- var sh = args[4];
773
- var dx = args[args.length - 4];
774
- var dy = args[args.length - 3];
775
- var dw = args[args.length - 2];
776
- var dh = args[args.length - 1];
777
- if (args.length === 9) {
778
- return this._ctx.drawImage(image, this._doSize(sx), this._doSize(sy), this._doSize(sw), this._doSize(sh), this._doSize(dx), this._doSize(dy), this._doSize(dw), this._doSize(dh));
779
- }
780
- else {
781
- return this._ctx.drawImage(image, this._doSize(dx), this._doSize(dy), this._doSize(dw), this._doSize(dh));
782
- }
783
- };
784
- Context.prototype.createPattern = function (image, repetition) {
785
- return this._ctx.createPattern(image, repetition);
786
- };
787
- Context.prototype.measureText = function (text) {
788
- return this._ctx.measureText(text);
789
- };
790
- Context.prototype.setTextAlign = function (align) {
791
- this._ctx.textAlign = align;
792
- };
793
- Context.prototype.fillText = function (text, x, y, maxWidth) {
794
- if (maxWidth !== undefined) {
795
- return this._ctx.fillText(text, this._doSize(x), this._doSize(y), this._doSize(maxWidth));
796
- }
797
- else {
798
- return this._ctx.fillText(text, this._doSize(x), this._doSize(y));
799
- }
800
- };
801
- Context.prototype.strokeText = function (text, x, y, maxWidth) {
802
- if (maxWidth !== undefined) {
803
- return this._ctx.strokeText(text, this._doSize(x), this._doSize(y), this._doSize(maxWidth));
804
- }
805
- else {
806
- return this._ctx.strokeText(text, this._doSize(x), this._doSize(y));
807
- }
808
- };
809
- Context.prototype.setFont = function (opts) {
810
- var strList = [];
811
- if (opts.fontWeight === 'bold') {
812
- strList.push("" + opts.fontWeight);
813
- }
814
- strList.push(this._doSize(opts.fontSize || 12) + "px");
815
- strList.push("" + (opts.fontFamily || 'sans-serif'));
816
- this._ctx.font = "" + strList.join(' ');
817
- };
818
- Context.prototype.setTextBaseline = function (baseline) {
819
- this._ctx.textBaseline = baseline;
820
- };
821
- Context.prototype.setGlobalAlpha = function (alpha) {
822
- this._ctx.globalAlpha = alpha;
823
- };
824
- Context.prototype.save = function () {
825
- this._ctx.save();
826
- };
827
- Context.prototype.restore = function () {
828
- this._ctx.restore();
829
- };
830
- Context.prototype.scale = function (ratioX, ratioY) {
831
- this._ctx.scale(ratioX, ratioY);
832
- };
833
- Context.prototype.setShadowColor = function (color) {
834
- this._ctx.shadowColor = color;
835
- };
836
- Context.prototype.setShadowOffsetX = function (offsetX) {
837
- this._ctx.shadowOffsetX = this._doSize(offsetX);
838
- };
839
- Context.prototype.setShadowOffsetY = function (offsetY) {
840
- this._ctx.shadowOffsetY = this._doSize(offsetY);
841
- };
842
- Context.prototype.setShadowBlur = function (blur) {
843
- this._ctx.shadowBlur = this._doSize(blur);
844
- };
845
- Context.prototype.ellipse = function (x, y, radiusX, radiusY, rotation, startAngle, endAngle, counterclockwise) {
846
- this._ctx.ellipse(this._doSize(x), this._doSize(y), this._doSize(radiusX), this._doSize(radiusY), rotation, startAngle, endAngle, counterclockwise);
847
- };
848
- Context.prototype._doSize = function (num) {
849
- return this._opts.devicePixelRatio * num;
850
- };
851
- Context.prototype._doX = function (x) {
852
- var _a = this._transform, scale = _a.scale, scrollX = _a.scrollX;
853
- var _x = (x - scrollX) / scale;
854
- return this._doSize(_x);
855
- };
856
- Context.prototype._doY = function (y) {
857
- var _a = this._transform, scale = _a.scale, scrollY = _a.scrollY;
858
- var _y = (y - scrollY) / scale;
859
- return this._doSize(_y);
860
- };
861
- return Context;
862
- }());
863
- var defaultScrollConfig = {
864
- lineWidth: 12,
865
- color: '#a0a0a0'
866
- };
867
- var Scroller = (function () {
868
- function Scroller(ctx, opts) {
869
- this._displayCtx = ctx;
870
- this._opts = this._getOpts(opts);
871
- }
872
- Scroller.prototype.draw = function (position) {
873
- var _a = this._opts, width = _a.width, height = _a.height;
874
- var wrapper = this.calc(position);
875
- var ctx = this._displayCtx;
876
- if (wrapper.xSize > 0) {
877
- ctx.globalAlpha = 0.2;
878
- ctx.fillStyle = wrapper.color;
879
- ctx.fillRect(0, this._doSize(height - wrapper.lineSize), this._doSize(width), this._doSize(wrapper.lineSize));
880
- ctx.globalAlpha = 1;
881
- drawBox$1(ctx, {
882
- x: this._doSize(wrapper.translateX),
883
- y: this._doSize(height - wrapper.lineSize),
884
- w: this._doSize(wrapper.xSize),
885
- h: this._doSize(wrapper.lineSize),
886
- r: this._doSize(wrapper.lineSize / 2),
887
- color: wrapper.color,
888
- });
889
- }
890
- if (wrapper.ySize > 0) {
891
- ctx.globalAlpha = 0.2;
892
- ctx.fillStyle = wrapper.color;
893
- ctx.fillRect(this._doSize(width - wrapper.lineSize), 0, this._doSize(wrapper.lineSize), this._doSize(height));
894
- ctx.globalAlpha = 1;
895
- drawBox$1(ctx, {
896
- x: this._doSize(width - wrapper.lineSize),
897
- y: this._doSize(wrapper.translateY),
898
- w: this._doSize(wrapper.lineSize),
899
- h: this._doSize(wrapper.ySize),
900
- r: this._doSize(wrapper.lineSize / 2),
901
- color: wrapper.color,
902
- });
903
- }
904
- ctx.globalAlpha = 1;
905
- };
906
- Scroller.prototype.resetSize = function (opts) {
907
- this._opts = __assign(__assign({}, this._opts), opts);
908
- };
909
- Scroller.prototype.isPointAtScrollY = function (p) {
910
- var _a = this._opts, width = _a.width, height = _a.height, scrollConfig = _a.scrollConfig;
911
- var ctx = this._displayCtx;
912
- ctx.beginPath();
913
- ctx.rect(this._doSize(width - scrollConfig.lineWidth), 0, this._doSize(scrollConfig.lineWidth), this._doSize(height));
914
- ctx.closePath();
915
- if (ctx.isPointInPath(this._doSize(p.x), this._doSize(p.y))) {
916
- return true;
917
- }
918
- return false;
919
- };
920
- Scroller.prototype.isPointAtScrollX = function (p) {
921
- var _a = this._opts, width = _a.width, height = _a.height, scrollConfig = _a.scrollConfig;
922
- var ctx = this._displayCtx;
923
- ctx.beginPath();
924
- ctx.rect(0, this._doSize(height - scrollConfig.lineWidth), this._doSize(width - scrollConfig.lineWidth), this._doSize(scrollConfig.lineWidth));
925
- ctx.closePath();
926
- if (ctx.isPointInPath(this._doSize(p.x), this._doSize(p.y))) {
927
- return true;
928
- }
929
- return false;
930
- };
931
- Scroller.prototype.getLineWidth = function () {
932
- var lineWidth = this._opts.scrollConfig.lineWidth;
933
- return lineWidth;
934
- };
935
- Scroller.prototype.calc = function (position) {
936
- var _a = this._opts, width = _a.width, height = _a.height, scrollConfig = _a.scrollConfig;
937
- var sliderMinSize = scrollConfig.lineWidth * 2.5;
938
- var lineSize = scrollConfig.lineWidth;
939
- var xSize = 0;
940
- var ySize = 0;
941
- if (position.left <= 0 && position.right <= 0) {
942
- xSize = Math.max(sliderMinSize, width - (Math.abs(position.left) + Math.abs(position.right)));
943
- if (xSize >= width)
944
- xSize = 0;
945
- }
946
- if (position.top <= 0 || position.bottom <= 0) {
947
- ySize = Math.max(sliderMinSize, height - (Math.abs(position.top) + Math.abs(position.bottom)));
948
- if (ySize >= height)
949
- ySize = 0;
950
- }
951
- var translateX = 0;
952
- if (xSize > 0) {
953
- translateX = xSize / 2 + (width - xSize) * Math.abs(position.left) / (Math.abs(position.left) + Math.abs(position.right));
954
- translateX = Math.min(Math.max(0, translateX - xSize / 2), width - xSize);
955
- }
956
- var translateY = 0;
957
- if (ySize > 0) {
958
- translateY = ySize / 2 + (height - ySize) * Math.abs(position.top) / (Math.abs(position.top) + Math.abs(position.bottom));
959
- translateY = Math.min(Math.max(0, translateY - ySize / 2), height - ySize);
960
- }
961
- var scrollWrapper = {
962
- lineSize: lineSize,
963
- xSize: xSize,
964
- ySize: ySize,
965
- translateY: translateY,
966
- translateX: translateX,
967
- color: this._opts.scrollConfig.color
968
- };
969
- return scrollWrapper;
970
- };
971
- Scroller.prototype._doSize = function (num) {
972
- return num * this._opts.devicePixelRatio;
973
- };
974
- Scroller.prototype._getOpts = function (opts) {
975
- var options = __assign({ scrollConfig: defaultScrollConfig }, opts);
976
- if (!options.scrollConfig) {
977
- options.scrollConfig = defaultScrollConfig;
978
- }
979
- if (!(options.scrollConfig.lineWidth > 0)) {
980
- options.scrollConfig.lineWidth = defaultScrollConfig.lineWidth;
981
- }
982
- options.scrollConfig.lineWidth = Math.max(options.scrollConfig.lineWidth, defaultScrollConfig.lineWidth);
983
- if (index$1.color.isColorStr(options.scrollConfig.color) !== true) {
984
- options.scrollConfig.color = options.scrollConfig.color;
985
- }
986
- return options;
987
- };
988
- return Scroller;
989
- }());
990
- function drawBox$1(ctx, opts) {
991
- var x = opts.x, y = opts.y, w = opts.w, h = opts.h, color = opts.color;
992
- var r = opts.r;
993
- r = Math.min(r, w / 2, h / 2);
994
- if (w < r * 2 || h < r * 2) {
995
- r = 0;
996
- }
997
- ctx.beginPath();
998
- ctx.moveTo(x + r, y);
999
- ctx.arcTo(x + w, y, x + w, y + h, r);
1000
- ctx.arcTo(x + w, y + h, x, y + h, r);
1001
- ctx.arcTo(x, y + h, x, y, r);
1002
- ctx.arcTo(x, y, x + w, y, r);
1003
- ctx.closePath();
1004
- ctx.fillStyle = color;
1005
- ctx.fill();
1006
- }
1007
- var _opts$1$1 = Symbol('_opts');
1008
- var _ctx$1 = Symbol('_ctx');
1009
- var Screen = (function () {
1010
- function Screen(ctx, opts) {
1011
- this[_opts$1$1] = opts;
1012
- this[_ctx$1] = ctx;
1013
- }
1014
- Screen.prototype.resetSize = function (opts) {
1015
- this[_opts$1$1] = __assign(__assign({}, this[_opts$1$1]), opts);
1016
- };
1017
- Screen.prototype.calcScreen = function () {
1018
- var scaleRatio = this[_ctx$1].getTransform().scale;
1019
- var _a = this[_opts$1$1], width = _a.width, height = _a.height, contextWidth = _a.contextWidth, contextHeight = _a.contextHeight, pxRatio = _a.devicePixelRatio;
1020
- var canScrollXPrev = true;
1021
- var canScrollXNext = true;
1022
- var canScrollYPrev = true;
1023
- var canScrollYNext = true;
1024
- if (contextWidth * scaleRatio <= width) {
1025
- this[_ctx$1].setTransform({
1026
- scrollX: (width - contextWidth * scaleRatio) / 2,
1027
- });
1028
- canScrollXPrev = false;
1029
- canScrollXNext = false;
1030
- }
1031
- if (contextHeight * scaleRatio <= height) {
1032
- this[_ctx$1].setTransform({
1033
- scrollY: (height - contextHeight * scaleRatio) / 2,
1034
- });
1035
- canScrollYPrev = false;
1036
- canScrollYNext = false;
1037
- }
1038
- if (contextWidth * scaleRatio >= width && this[_ctx$1].getTransform().scrollX > 0) {
1039
- this[_ctx$1].setTransform({
1040
- scrollX: 0,
1041
- });
1042
- canScrollXPrev = false;
1043
- }
1044
- if (contextHeight * scaleRatio >= height && this[_ctx$1].getTransform().scrollY > 0) {
1045
- this[_ctx$1].setTransform({
1046
- scrollY: 0,
1047
- });
1048
- canScrollYPrev = false;
1049
- }
1050
- var _b = this[_ctx$1].getTransform(), _scrollX = _b.scrollX, _scrollY = _b.scrollY;
1051
- if (_scrollX < 0 && Math.abs(_scrollX) > Math.abs(contextWidth * scaleRatio - width)) {
1052
- this[_ctx$1].setTransform({
1053
- scrollX: 0 - Math.abs(contextWidth * scaleRatio - width)
1054
- });
1055
- canScrollXNext = false;
1056
- }
1057
- if (_scrollY < 0 && Math.abs(_scrollY) > Math.abs(contextHeight * scaleRatio - height)) {
1058
- this[_ctx$1].setTransform({
1059
- scrollY: 0 - Math.abs(contextHeight * scaleRatio - height)
1060
- });
1061
- canScrollYNext = false;
1062
- }
1063
- var _c = this[_ctx$1].getTransform(), scrollX = _c.scrollX, scrollY = _c.scrollY;
1064
- var size = {
1065
- x: scrollX * scaleRatio,
1066
- y: scrollY * scaleRatio,
1067
- w: contextWidth * scaleRatio,
1068
- h: contextHeight * scaleRatio,
1069
- };
1070
- var deviceSize = {
1071
- x: scrollX * pxRatio,
1072
- y: scrollY * pxRatio,
1073
- w: contextWidth * pxRatio * scaleRatio,
1074
- h: contextHeight * pxRatio * scaleRatio,
1075
- };
1076
- var position = {
1077
- top: scrollY,
1078
- bottom: height - (contextHeight * scaleRatio + scrollY),
1079
- left: scrollX,
1080
- right: width - (contextWidth * scaleRatio + scrollX),
1081
- };
1082
- return {
1083
- size: size,
1084
- position: position,
1085
- deviceSize: deviceSize,
1086
- width: this[_opts$1$1].width,
1087
- height: this[_opts$1$1].height,
1088
- devicePixelRatio: this[_opts$1$1].devicePixelRatio,
1089
- canScrollYPrev: canScrollYPrev,
1090
- canScrollYNext: canScrollYNext,
1091
- canScrollXPrev: canScrollXPrev,
1092
- canScrollXNext: canScrollXNext,
1093
- };
1094
- };
1095
- Screen.prototype.calcScreenScroll = function (start, end, sliderSize, limitLen, moveDistance) {
1096
- var scrollDistance = start;
1097
- var scrollLen = limitLen - sliderSize;
1098
- if (start <= 0 && end <= 0) {
1099
- scrollLen = Math.abs(start) + Math.abs(end);
1100
- }
1101
- var unit = 1;
1102
- if (scrollLen > 0) {
1103
- unit = scrollLen / (limitLen - sliderSize);
1104
- }
1105
- scrollDistance = 0 - unit * moveDistance;
1106
- return scrollDistance;
1107
- };
1108
- return Screen;
1109
- }());
1110
- var _canvas = Symbol('_canvas');
1111
- var _displayCanvas = Symbol('_displayCanvas');
1112
- var _mount = Symbol('_mount');
1113
- var _opts$2 = Symbol('_opts');
1114
- var _hasRendered = Symbol('_hasRendered');
1115
- var _ctx = Symbol('_ctx');
1116
- var _displayCtx = Symbol('_displayCtx');
1117
- var _originCtx = Symbol('_originCtx');
1118
- var _watcher = Symbol('_watcher');
1119
- var _render = Symbol('_render');
1120
- var _parsePrivateOptions = Symbol('_parsePrivateOptions');
1121
- var _scroller = Symbol('_scroller');
1122
- var _initEvent = Symbol('_initEvent');
1123
- var _doScrollX = Symbol('_doScrollX');
1124
- var _doScrollY = Symbol('_doScrollY');
1125
- var _doMoveScroll = Symbol('_doMoveScroll');
1126
- var _resetContext = Symbol('_resetContext');
1127
- var _screen = Symbol('_screen');
1128
- var _a$1;
1129
- var throttle$2 = index$1.time.throttle;
1130
- var Board = (function () {
1131
- function Board(mount, opts) {
1132
- this[_a$1] = false;
1133
- this[_mount] = mount;
1134
- this[_canvas] = document.createElement('canvas');
1135
- this[_displayCanvas] = document.createElement('canvas');
1136
- this[_mount].appendChild(this[_displayCanvas]);
1137
- this[_opts$2] = this[_parsePrivateOptions](opts);
1138
- this[_originCtx] = this[_canvas].getContext('2d');
1139
- this[_displayCtx] = this[_displayCanvas].getContext('2d');
1140
- this[_ctx] = new Context(this[_originCtx], this[_opts$2]);
1141
- this[_screen] = new Screen(this[_ctx], this[_opts$2]);
1142
- this[_watcher] = new ScreenWatcher(this[_displayCanvas], this[_ctx]);
1143
- this[_scroller] = new Scroller(this[_displayCtx], {
1144
- width: opts.width,
1145
- height: opts.height,
1146
- devicePixelRatio: opts.devicePixelRatio || 1,
1147
- scrollConfig: opts.scrollConfig,
1148
- });
1149
- this[_render]();
1150
- }
1151
- Board.prototype.getDisplayContext = function () {
1152
- return this[_displayCtx];
1153
- };
1154
- Board.prototype.getOriginContext = function () {
1155
- return this[_originCtx];
1156
- };
1157
- Board.prototype.getContext = function () {
1158
- return this[_ctx];
1159
- };
1160
- Board.prototype.scale = function (scaleRatio) {
1161
- if (scaleRatio > 0) {
1162
- this[_ctx].setTransform({ scale: scaleRatio });
1163
- }
1164
- var _b = this[_screen].calcScreen(), position = _b.position, size = _b.size;
1165
- return { position: position, size: size };
1166
- };
1167
- Board.prototype.scrollX = function (x) {
1168
- this[_watcher].setStatusMap({
1169
- canScrollYPrev: true,
1170
- canScrollYNext: true,
1171
- canScrollXPrev: true,
1172
- canScrollXNext: true,
1173
- });
1174
- if (x >= 0 || x < 0) {
1175
- this[_ctx].setTransform({ scrollX: x });
1176
- }
1177
- var _b = this[_screen].calcScreen(), position = _b.position, size = _b.size, canScrollXNext = _b.canScrollXNext, canScrollYNext = _b.canScrollYNext, canScrollXPrev = _b.canScrollXPrev, canScrollYPrev = _b.canScrollYPrev;
1178
- this[_watcher].setStatusMap({
1179
- canScrollYPrev: canScrollYPrev,
1180
- canScrollYNext: canScrollYNext,
1181
- canScrollXPrev: canScrollXPrev,
1182
- canScrollXNext: canScrollXNext,
1183
- });
1184
- return { position: position, size: size };
1185
- };
1186
- Board.prototype.scrollY = function (y) {
1187
- this[_watcher].setStatusMap({
1188
- canScrollYPrev: true,
1189
- canScrollYNext: true,
1190
- canScrollXPrev: true,
1191
- canScrollXNext: true,
1192
- });
1193
- if (y >= 0 || y < 0) {
1194
- this[_ctx].setTransform({ scrollY: y });
1195
- }
1196
- var _b = this[_screen].calcScreen(), position = _b.position, size = _b.size, canScrollXNext = _b.canScrollXNext, canScrollYNext = _b.canScrollYNext, canScrollXPrev = _b.canScrollXPrev, canScrollYPrev = _b.canScrollYPrev;
1197
- this[_watcher].setStatusMap({
1198
- canScrollYPrev: canScrollYPrev,
1199
- canScrollYNext: canScrollYNext,
1200
- canScrollXPrev: canScrollXPrev,
1201
- canScrollXNext: canScrollXNext,
1202
- });
1203
- return { position: position, size: size };
1204
- };
1205
- Board.prototype.getTransform = function () {
1206
- return this[_ctx].getTransform();
1207
- };
1208
- Board.prototype.draw = function () {
1209
- this.clear();
1210
- var _b = this[_screen].calcScreen(), position = _b.position, deviceSize = _b.deviceSize, size = _b.size;
1211
- this[_displayCtx].drawImage(this[_canvas], deviceSize.x, deviceSize.y, deviceSize.w, deviceSize.h);
1212
- if (this[_opts$2].canScroll === true) {
1213
- this[_scroller].draw(position);
1214
- }
1215
- return { position: position, size: size };
1216
- };
1217
- Board.prototype.clear = function () {
1218
- this[_displayCtx].clearRect(0, 0, this[_displayCanvas].width, this[_displayCanvas].height);
1219
- };
1220
- Board.prototype.on = function (name, callback) {
1221
- this[_watcher].on(name, callback);
1222
- };
1223
- Board.prototype.off = function (name, callback) {
1224
- this[_watcher].off(name, callback);
1225
- };
1226
- Board.prototype.getScreenInfo = function () {
1227
- return this[_screen].calcScreen();
1228
- };
1229
- Board.prototype.setCursor = function (cursor) {
1230
- this[_displayCanvas].style.cursor = cursor;
1231
- };
1232
- Board.prototype.resetCursor = function () {
1233
- this[_displayCanvas].style.cursor = 'auto';
1234
- };
1235
- Board.prototype.resetSize = function (opts) {
1236
- this[_opts$2] = __assign(__assign({}, this[_opts$2]), opts);
1237
- this[_resetContext]();
1238
- this[_ctx].resetSize(opts);
1239
- this[_screen].resetSize(opts);
1240
- this[_scroller].resetSize({
1241
- width: this[_opts$2].width,
1242
- height: this[_opts$2].height,
1243
- devicePixelRatio: this[_opts$2].devicePixelRatio
1244
- });
1245
- this.draw();
1246
- };
1247
- Board.prototype.getScrollLineWidth = function () {
1248
- var lineWidth = 0;
1249
- if (this[_opts$2].canScroll === true) {
1250
- lineWidth = this[_scroller].getLineWidth();
1251
- }
1252
- return lineWidth;
1253
- };
1254
- Board.prototype.pointScreenToContext = function (screenPoint) {
1255
- var _b = this.getTransform(), scrollX = _b.scrollX, scrollY = _b.scrollY, scale = _b.scale;
1256
- var ctxPoint = {
1257
- x: (screenPoint.x - scrollX) / scale,
1258
- y: (screenPoint.y - scrollY) / scale,
1259
- };
1260
- return ctxPoint;
1261
- };
1262
- Board.prototype.pointContextToScreen = function (ctxPoint) {
1263
- var _b = this.getTransform(), scrollX = _b.scrollX, scrollY = _b.scrollY, scale = _b.scale;
1264
- var screenPoint = {
1265
- x: ctxPoint.x * scale + scrollX,
1266
- y: ctxPoint.y * scale + scrollY,
1267
- };
1268
- return screenPoint;
1269
- };
1270
- Board.prototype[(_a$1 = _hasRendered, _render)] = function () {
1271
- if (this[_hasRendered] === true) {
1272
- return;
1273
- }
1274
- this[_resetContext]();
1275
- this[_initEvent]();
1276
- this[_hasRendered] = true;
1277
- };
1278
- Board.prototype[_resetContext] = function () {
1279
- var _b = this[_opts$2], width = _b.width, height = _b.height, contextWidth = _b.contextWidth, contextHeight = _b.contextHeight, devicePixelRatio = _b.devicePixelRatio;
1280
- this[_canvas].width = contextWidth * devicePixelRatio;
1281
- this[_canvas].height = contextHeight * devicePixelRatio;
1282
- this[_displayCanvas].width = width * devicePixelRatio;
1283
- this[_displayCanvas].height = height * devicePixelRatio;
1284
- setStyle(this[_displayCanvas], {
1285
- width: width + "px",
1286
- height: height + "px",
1287
- });
1288
- };
1289
- Board.prototype[_parsePrivateOptions] = function (opts) {
1290
- var defaultOpts = {
1291
- devicePixelRatio: 1,
1292
- };
1293
- return __assign(__assign({}, defaultOpts), opts);
1294
- };
1295
- Board.prototype[_initEvent] = function () {
1296
- var _this = this;
1297
- if (this[_hasRendered] === true) {
1298
- return;
1299
- }
1300
- if (this[_opts$2].canScroll === true) {
1301
- this.on('wheelX', throttle$2(function (deltaX) {
1302
- _this[_doScrollX](deltaX);
1303
- }, 16));
1304
- this.on('wheelY', throttle$2(function (deltaY) {
1305
- _this[_doScrollY](deltaY);
1306
- }, 16));
1307
- var scrollType_1 = null;
1308
- this.on('moveStart', throttle$2(function (p) {
1309
- if (_this[_scroller].isPointAtScrollX(p)) {
1310
- scrollType_1 = 'x';
1311
- }
1312
- else if (_this[_scroller].isPointAtScrollY(p)) {
1313
- scrollType_1 = 'y';
1314
- }
1315
- }, 16));
1316
- this.on('move', throttle$2(function (p) {
1317
- if (scrollType_1) {
1318
- _this[_doMoveScroll](scrollType_1, p);
1319
- }
1320
- }, 16));
1321
- this.on('moveEnd', throttle$2(function (p) {
1322
- if (scrollType_1) {
1323
- _this[_doMoveScroll](scrollType_1, p);
1324
- }
1325
- scrollType_1 = null;
1326
- }, 16));
1327
- }
1328
- };
1329
- Board.prototype[_doScrollX] = function (dx, prevScrollX) {
1330
- var width = this[_opts$2].width;
1331
- var scrollX = prevScrollX;
1332
- if (!(typeof scrollX === 'number' && (scrollX > 0 || scrollX <= 0))) {
1333
- scrollX = this[_ctx].getTransform().scrollX;
1334
- }
1335
- var position = this[_screen].calcScreen().position;
1336
- var xSize = this[_scroller].calc(position).xSize;
1337
- var moveX = this[_screen].calcScreenScroll(position.left, position.right, xSize, width, dx);
1338
- this.scrollX(scrollX + moveX);
1339
- this.draw();
1340
- };
1341
- Board.prototype[_doScrollY] = function (dy, prevScrollY) {
1342
- var height = this[_opts$2].height;
1343
- var scrollY = prevScrollY;
1344
- if (!(typeof scrollY === 'number' && (scrollY > 0 || scrollY <= 0))) {
1345
- scrollY = this[_ctx].getTransform().scrollY;
1346
- }
1347
- var position = this[_screen].calcScreen().position;
1348
- var ySize = this[_scroller].calc(position).ySize;
1349
- var moveY = this[_screen].calcScreenScroll(position.top, position.bottom, ySize, height, dy);
1350
- this.scrollY(scrollY + moveY);
1351
- this.draw();
1352
- };
1353
- Board.prototype[_doMoveScroll] = function (scrollType, point) {
1354
- if (!scrollType) {
1355
- return;
1356
- }
1357
- var position = this[_screen].calcScreen().position;
1358
- var _b = this[_scroller].calc(position), xSize = _b.xSize, ySize = _b.ySize;
1359
- if (scrollType === 'x') {
1360
- this[_doScrollX](point.x - xSize / 2, 0);
1361
- }
1362
- else if (scrollType === 'y') {
1363
- this[_doScrollY](point.y - ySize / 2, 0);
1364
- }
1365
- };
1366
- return Board;
1367
- }());
1368
-
1369
- function compose(middleware) {
1370
- return function (context, next) {
1371
- return dispatch(0);
1372
- function dispatch(i) {
1373
- var fn = middleware[i];
1374
- if (i === middleware.length && next) {
1375
- fn = next;
1376
- }
1377
- if (!fn)
1378
- return Promise.resolve();
1379
- try {
1380
- return Promise.resolve(fn(context, dispatch.bind(null, i + 1)));
1381
- }
1382
- catch (err) {
1383
- return Promise.reject(err);
1384
- }
1385
- }
1386
- };
1387
- }
1388
- function delay(time) {
1389
- return new Promise(function (resolve) {
1390
- setTimeout(function () {
1391
- resolve();
1392
- }, time);
1393
- });
1394
- }
1395
- function throttle(fn, timeout) {
1396
- var timer = -1;
1397
- return function () {
1398
- var args = [];
1399
- for (var _i = 0; _i < arguments.length; _i++) {
1400
- args[_i] = arguments[_i];
1401
- }
1402
- if (timer > 0) {
1403
- return;
1404
- }
1405
- timer = setTimeout(function () {
1406
- fn.apply(void 0, args);
1407
- timer = -1;
1408
- }, timeout);
1409
- };
1410
- }
1411
- function downloadImageFromCanvas(canvas, opts) {
1412
- var filename = opts.filename, _a = opts.type, type = _a === void 0 ? 'image/jpeg' : _a;
1413
- var stream = canvas.toDataURL(type);
1414
- var downloadLink = document.createElement('a');
1415
- downloadLink.href = stream;
1416
- downloadLink.download = filename;
1417
- var downloadClickEvent = document.createEvent('MouseEvents');
1418
- downloadClickEvent.initEvent('click', true, false);
1419
- downloadLink.dispatchEvent(downloadClickEvent);
1420
- }
1421
- function toColorHexNum(color) {
1422
- return parseInt(color.replace(/^\#/, '0x'));
1423
- }
1424
- function toColorHexStr(color) {
1425
- return '#' + color.toString(16);
1426
- }
1427
- function isColorStr$2(color) {
1428
- return typeof color === 'string' && /^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(color);
1429
- }
1430
- function createUUID$2() {
1431
- function str4() {
1432
- return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
1433
- }
1434
- return "" + str4() + str4() + "-" + str4() + "-" + str4() + "-" + str4() + "-" + str4() + str4() + str4();
1435
- }
1436
- function deepClone$5(target) {
1437
- function _clone(t) {
1438
- var type = is$1(t);
1439
- if (['Null', 'Number', 'String', 'Boolean', 'Undefined'].indexOf(type) >= 0) {
1440
- return t;
1441
- }
1442
- else if (type === 'Array') {
1443
- var arr_1 = [];
1444
- t.forEach(function (item) {
1445
- arr_1.push(_clone(item));
1446
- });
1447
- return arr_1;
1448
- }
1449
- else if (type === 'Object') {
1450
- var obj_1 = {};
1451
- var keys = Object.keys(t);
1452
- keys.forEach(function (key) {
1453
- obj_1[key] = _clone(t[key]);
1454
- });
1455
- return obj_1;
1456
- }
1457
- }
1458
- return _clone(target);
1459
- }
1460
- function is$1(data) {
1461
- return Object.prototype.toString.call(data).replace(/[\]|\[]{1,1}/ig, '').split(' ')[1];
1462
- }
1463
- function parsePrototype(data) {
1464
- var typeStr = Object.prototype.toString.call(data) || '';
1465
- var result = typeStr.replace(/(\[object|\])/ig, '').trim();
1466
- return result;
1467
- }
1468
- var istype$1 = {
1469
- type: function (data, lowerCase) {
1470
- var result = parsePrototype(data);
1471
- return lowerCase === true ? result.toLocaleLowerCase() : result;
1472
- },
1473
- array: function (data) {
1474
- return parsePrototype(data) === 'Array';
1475
- },
1476
- json: function (data) {
1477
- return parsePrototype(data) === 'Object';
1478
- },
1479
- function: function (data) {
1480
- return parsePrototype(data) === 'Function';
1481
- },
1482
- asyncFunction: function (data) {
1483
- return parsePrototype(data) === 'AsyncFunction';
1484
- },
1485
- string: function (data) {
1486
- return parsePrototype(data) === 'String';
1487
- },
1488
- number: function (data) {
1489
- return parsePrototype(data) === 'Number';
1490
- },
1491
- undefined: function (data) {
1492
- return parsePrototype(data) === 'Undefined';
1493
- },
1494
- null: function (data) {
1495
- return parsePrototype(data) === 'Null';
1496
- },
1497
- promise: function (data) {
1498
- return parsePrototype(data) === 'Promise';
1499
- },
1500
- };
1501
- function __awaiter(thisArg, _arguments, P, generator) {
1502
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
1503
- return new (P || (P = Promise))(function (resolve, reject) {
1504
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
1505
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
1506
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
1507
- step((generator = generator.apply(thisArg, _arguments || [])).next());
1508
- });
1509
- }
1510
- function __generator(thisArg, body) {
1511
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
1512
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
1513
- function verb(n) { return function (v) { return step([n, v]); }; }
1514
- function step(op) {
1515
- if (f) throw new TypeError("Generator is already executing.");
1516
- while (_) try {
1517
- if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
1518
- if (y = 0, t) op = [op[0] & 2, t.value];
1519
- switch (op[0]) {
1520
- case 0: case 1: t = op; break;
1521
- case 4: _.label++; return { value: op[1], done: false };
1522
- case 5: _.label++; y = op[1]; op = [0]; continue;
1523
- case 7: op = _.ops.pop(); _.trys.pop(); continue;
1524
- default:
1525
- if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
1526
- if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
1527
- if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
1528
- if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
1529
- if (t[2]) _.ops.pop();
1530
- _.trys.pop(); continue;
1531
- }
1532
- op = body.call(thisArg, _);
1533
- } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
1534
- if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
1535
- }
1536
- }
1537
- function parseHTMLToDataURL(html, opts) {
1538
- var width = opts.width, height = opts.height;
1539
- return new Promise(function (resolve, reject) {
1540
- var _svg = "\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"" + (width || '') + "\" height = \"" + (height || '') + "\">\n <foreignObject width=\"100%\" height=\"100%\">\n <div xmlns = \"http://www.w3.org/1999/xhtml\">\n " + html + "\n </div>\n </foreignObject>\n </svg>\n ";
1541
- var blob = new Blob([_svg], { type: 'image/svg+xml;charset=utf-8' });
1542
- var reader = new FileReader();
1543
- reader.readAsDataURL(blob);
1544
- reader.onload = function (event) {
1545
- var _a;
1546
- var base64 = (_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.result;
1547
- resolve(base64);
1548
- };
1549
- reader.onerror = function (err) {
1550
- reject(err);
1551
- };
1552
- });
1553
- }
1554
- function parseSVGToDataURL(svg) {
1555
- return new Promise(function (resolve, reject) {
1556
- var _svg = svg;
1557
- var blob = new Blob([_svg], { type: 'image/svg+xml;charset=utf-8' });
1558
- var reader = new FileReader();
1559
- reader.readAsDataURL(blob);
1560
- reader.onload = function (event) {
1561
- var _a;
1562
- var base64 = (_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.result;
1563
- resolve(base64);
1564
- };
1565
- reader.onerror = function (err) {
1566
- reject(err);
1567
- };
1568
- });
1569
- }
1570
- var Image = window.Image;
1571
- function loadImage$1(src) {
1572
- return new Promise(function (resolve, reject) {
1573
- var img = new Image;
1574
- img.onload = function () {
1575
- resolve(img);
1576
- };
1577
- img.onabort = reject;
1578
- img.onerror = reject;
1579
- img.src = src;
1580
- });
1581
- }
1582
- function loadSVG$1(svg) {
1583
- return __awaiter(this, void 0, void 0, function () {
1584
- var dataURL, image;
1585
- return __generator(this, function (_a) {
1586
- switch (_a.label) {
1587
- case 0: return [4, parseSVGToDataURL(svg)];
1588
- case 1:
1589
- dataURL = _a.sent();
1590
- return [4, loadImage$1(dataURL)];
1591
- case 2:
1592
- image = _a.sent();
1593
- return [2, image];
1594
- }
1595
- });
1596
- });
1597
- }
1598
- function loadHTML$1(html, opts) {
1599
- return __awaiter(this, void 0, void 0, function () {
1600
- var dataURL, image;
1601
- return __generator(this, function (_a) {
1602
- switch (_a.label) {
1603
- case 0: return [4, parseHTMLToDataURL(html, opts)];
1604
- case 1:
1605
- dataURL = _a.sent();
1606
- return [4, loadImage$1(dataURL)];
1607
- case 2:
1608
- image = _a.sent();
1609
- return [2, image];
1610
- }
1611
- });
1612
- });
1613
- }
1614
- var index = {
1615
- time: {
1616
- delay: delay,
1617
- compose: compose,
1618
- throttle: throttle,
1619
- },
1620
- loader: {
1621
- loadImage: loadImage$1,
1622
- loadSVG: loadSVG$1,
1623
- loadHTML: loadHTML$1,
1624
- },
1625
- file: {
1626
- downloadImageFromCanvas: downloadImageFromCanvas,
1627
- },
1628
- color: {
1629
- toColorHexStr: toColorHexStr,
1630
- toColorHexNum: toColorHexNum,
1631
- isColorStr: isColorStr$2,
1632
- },
1633
- uuid: {
1634
- createUUID: createUUID$2
1635
- },
1636
- istype: istype$1,
1637
- data: {
1638
- deepClone: deepClone$5,
1639
- }
1640
- };
1641
-
1642
- var isColorStr$1 = index.color.isColorStr;
1643
- function number(value) {
1644
- return (typeof value === 'number' && (value > 0 || value <= 0));
1645
- }
1646
- function x(value) {
1647
- return number(value);
1648
- }
1649
- function y(value) {
1650
- return number(value);
1651
- }
1652
- function w(value) {
1653
- return (typeof value === 'number' && value >= 0);
1654
- }
1655
- function h(value) {
1656
- return (typeof value === 'number' && value >= 0);
1657
- }
1658
- function angle(value) {
1659
- return (typeof value === 'number' && value >= -360 && value <= 360);
1660
- }
1661
- function borderWidth(value) {
1662
- return w(value);
1663
- }
1664
- function borderRadius(value) {
1665
- return number(value) && value >= 0;
1666
- }
1667
- function color$1(value) {
1668
- return isColorStr$1(value);
1669
- }
1670
- function imageURL(value) {
1671
- return (typeof value === 'string' && /^(http:\/\/|https:\/\/|\.\/|\/)/.test("" + value));
1672
- }
1673
- function imageBase64(value) {
1674
- return (typeof value === 'string' && /^(data:image\/)/.test("" + value));
1675
- }
1676
- function imageSrc(value) {
1677
- return (imageBase64(value) || imageURL(value));
1678
- }
1679
- function svg(value) {
1680
- return (typeof value === 'string' && /^(<svg[\s]{1,}|<svg>)/i.test(("" + value).trim()) && /<\/[\s]{0,}svg>$/i.test(("" + value).trim()));
1681
- }
1682
- function html(value) {
1683
- var result = false;
1684
- if (typeof value === 'string') {
1685
- var div = document.createElement('div');
1686
- div.innerHTML = value;
1687
- if (div.children.length > 0) {
1688
- result = true;
1689
- }
1690
- div = null;
1691
- }
1692
- return result;
1693
- }
1694
- function text(value) {
1695
- return typeof value === 'string';
1696
- }
1697
- function fontSize(value) {
1698
- return number(value) && value > 0;
1699
- }
1700
- function lineHeight(value) {
1701
- return number(value) && value > 0;
1702
- }
1703
- function strokeWidth(value) {
1704
- return number(value) && value > 0;
1705
- }
1706
- function textAlign(value) {
1707
- return ['center', 'left', 'right'].includes(value);
1708
- }
1709
- function fontFamily(value) {
1710
- return typeof value === 'string' && value.length > 0;
1711
- }
1712
- function fontWeight(value) {
1713
- return ['bold'].includes(value);
1714
- }
1715
- var is = {
1716
- x: x,
1717
- y: y,
1718
- w: w,
1719
- h: h,
1720
- angle: angle,
1721
- number: number,
1722
- borderWidth: borderWidth,
1723
- borderRadius: borderRadius,
1724
- color: color$1,
1725
- imageSrc: imageSrc,
1726
- imageURL: imageURL,
1727
- imageBase64: imageBase64,
1728
- svg: svg,
1729
- html: html,
1730
- text: text,
1731
- fontSize: fontSize,
1732
- lineHeight: lineHeight,
1733
- textAlign: textAlign,
1734
- fontFamily: fontFamily,
1735
- fontWeight: fontWeight,
1736
- strokeWidth: strokeWidth,
1737
- };
1738
-
1739
- function attrs(attrs) {
1740
- var x = attrs.x, y = attrs.y, w = attrs.w, h = attrs.h, angle = attrs.angle;
1741
- if (!(is.x(x) && is.y(y) && is.w(w) && is.h(h) && is.angle(angle))) {
1742
- return false;
1743
- }
1744
- if (!(angle >= -360 && angle <= 360)) {
1745
- return false;
1746
- }
1747
- return true;
1748
- }
1749
- function box(desc) {
1750
- if (desc === void 0) { desc = {}; }
1751
- var borderColor = desc.borderColor, borderRadius = desc.borderRadius, borderWidth = desc.borderWidth;
1752
- if (desc.hasOwnProperty('borderColor') && !is.color(borderColor)) {
1753
- return false;
1754
- }
1755
- if (desc.hasOwnProperty('borderRadius') && !is.number(borderRadius)) {
1756
- return false;
1757
- }
1758
- if (desc.hasOwnProperty('borderWidth') && !is.number(borderWidth)) {
1759
- return false;
1760
- }
1761
- return true;
1762
- }
1763
- function rectDesc(desc) {
1764
- var bgColor = desc.bgColor;
1765
- if (desc.hasOwnProperty('bgColor') && !is.color(bgColor)) {
1766
- return false;
1767
- }
1768
- if (!box(desc)) {
1769
- return false;
1770
- }
1771
- return true;
1772
- }
1773
- function circleDesc(desc) {
1774
- var bgColor = desc.bgColor, borderColor = desc.borderColor, borderWidth = desc.borderWidth;
1775
- if (desc.hasOwnProperty('bgColor') && !is.color(bgColor)) {
1776
- return false;
1777
- }
1778
- if (desc.hasOwnProperty('borderColor') && !is.color(borderColor)) {
1779
- return false;
1780
- }
1781
- if (desc.hasOwnProperty('borderWidth') && !is.number(borderWidth)) {
1782
- return false;
1783
- }
1784
- return true;
1785
- }
1786
- function imageDesc(desc) {
1787
- var src = desc.src;
1788
- if (!is.imageSrc(src)) {
1789
- return false;
1790
- }
1791
- return true;
1792
- }
1793
- function svgDesc(desc) {
1794
- var svg = desc.svg;
1795
- if (!is.svg(svg)) {
1796
- return false;
1797
- }
1798
- return true;
1799
- }
1800
- function htmlDesc(desc) {
1801
- var html = desc.html;
1802
- if (!is.html(html)) {
1803
- return false;
1804
- }
1805
- return true;
1806
- }
1807
- function textDesc(desc) {
1808
- var text = desc.text, color = desc.color, fontSize = desc.fontSize, lineHeight = desc.lineHeight, fontFamily = desc.fontFamily, textAlign = desc.textAlign, fontWeight = desc.fontWeight, bgColor = desc.bgColor, strokeWidth = desc.strokeWidth, strokeColor = desc.strokeColor;
1809
- if (!is.text(text)) {
1810
- return false;
1811
- }
1812
- if (!is.color(color)) {
1813
- return false;
1814
- }
1815
- if (!is.fontSize(fontSize)) {
1816
- return false;
1817
- }
1818
- if (desc.hasOwnProperty('bgColor') && !is.color(bgColor)) {
1819
- return false;
1820
- }
1821
- if (desc.hasOwnProperty('fontWeight') && !is.fontWeight(fontWeight)) {
1822
- return false;
1823
- }
1824
- if (desc.hasOwnProperty('lineHeight') && !is.lineHeight(lineHeight)) {
1825
- return false;
1826
- }
1827
- if (desc.hasOwnProperty('fontFamily') && !is.fontFamily(fontFamily)) {
1828
- return false;
1829
- }
1830
- if (desc.hasOwnProperty('textAlign') && !is.textAlign(textAlign)) {
1831
- return false;
1832
- }
1833
- if (desc.hasOwnProperty('strokeWidth') && !is.strokeWidth(strokeWidth)) {
1834
- return false;
1835
- }
1836
- if (desc.hasOwnProperty('strokeColor') && !is.color(strokeColor)) {
1837
- return false;
1838
- }
1839
- if (!box(desc)) {
1840
- return false;
1841
- }
1842
- return true;
1843
- }
1844
- var check = {
1845
- attrs: attrs,
1846
- textDesc: textDesc,
1847
- rectDesc: rectDesc,
1848
- circleDesc: circleDesc,
1849
- imageDesc: imageDesc,
1850
- svgDesc: svgDesc,
1851
- htmlDesc: htmlDesc,
1852
- };
1853
-
1854
- function parseRadianToAngle(radian) {
1855
- return radian / Math.PI * 180;
1856
- }
1857
- function parseAngleToRadian(angle) {
1858
- return angle / 180 * Math.PI;
1859
- }
1860
- function calcElementCenter(elem) {
1861
- var p = {
1862
- x: elem.x + elem.w / 2,
1863
- y: elem.y + elem.h / 2,
1864
- };
1865
- return p;
1866
- }
1867
- function calcRadian(center, start, end) {
1868
- var startAngle = calcLineAngle(center, start);
1869
- var endAngle = calcLineAngle(center, end);
1870
- if (endAngle !== null && startAngle !== null) {
1871
- if (startAngle > Math.PI * 3 / 2 && endAngle < Math.PI / 2) {
1872
- return endAngle + (Math.PI * 2 - startAngle);
1873
- }
1874
- else if (endAngle > Math.PI * 3 / 2 && startAngle < Math.PI / 2) {
1875
- return startAngle + (Math.PI * 2 - endAngle);
1876
- }
1877
- else {
1878
- return endAngle - startAngle;
1879
- }
1880
- }
1881
- else {
1882
- return 0;
1883
- }
1884
- }
1885
- function calcLineAngle(center, p) {
1886
- var x = p.x - center.x;
1887
- var y = center.y - p.y;
1888
- if (x === 0) {
1889
- if (y < 0) {
1890
- return Math.PI / 2;
1891
- }
1892
- else if (y > 0) {
1893
- return Math.PI * (3 / 2);
1894
- }
1895
- }
1896
- else if (y === 0) {
1897
- if (x < 0) {
1898
- return Math.PI;
1899
- }
1900
- else if (x > 0) {
1901
- return 0;
1902
- }
1903
- }
1904
- if (x > 0 && y < 0) {
1905
- return Math.atan(Math.abs(y) / Math.abs(x));
1906
- }
1907
- else if (x < 0 && y < 0) {
1908
- return Math.PI - Math.atan(Math.abs(y) / Math.abs(x));
1909
- }
1910
- else if (x < 0 && y > 0) {
1911
- return Math.PI + Math.atan(Math.abs(y) / Math.abs(x));
1912
- }
1913
- else if (x > 0 && y > 0) {
1914
- return Math.PI * 2 - Math.atan(Math.abs(y) / Math.abs(x));
1915
- }
1916
- return null;
1917
- }
1918
-
1919
- function rotateElement(ctx, elem, callback) {
1920
- var center = calcElementCenter(elem);
1921
- var radian = parseAngleToRadian(elem.angle || 0);
1922
- return rotateContext(ctx, center, radian || 0, callback);
1923
- }
1924
- function rotateContext(ctx, center, radian, callback) {
1925
- if (center && (radian > 0 || radian < 0)) {
1926
- ctx.translate(center.x, center.y);
1927
- ctx.rotate(radian);
1928
- ctx.translate(-center.x, -center.y);
1929
- }
1930
- callback(ctx);
1931
- if (center && (radian > 0 || radian < 0)) {
1932
- ctx.translate(center.x, center.y);
1933
- ctx.rotate(-radian);
1934
- ctx.translate(-center.x, -center.y);
1935
- }
1936
- }
1937
-
1938
- var istype = index.istype, color = index.color;
1939
- function clearContext(ctx) {
1940
- ctx.setFillStyle('#000000');
1941
- ctx.setStrokeStyle('#000000');
1942
- ctx.setLineDash([]);
1943
- ctx.setGlobalAlpha(1);
1944
- ctx.setShadowColor('#00000000');
1945
- ctx.setShadowOffsetX(0);
1946
- ctx.setShadowOffsetY(0);
1947
- ctx.setShadowBlur(0);
1948
- }
1949
- function drawBgColor(ctx, color) {
1950
- var size = ctx.getSize();
1951
- ctx.setFillStyle(color);
1952
- ctx.fillRect(0, 0, size.contextWidth, size.contextHeight);
1953
- }
1954
- function drawBox(ctx, elem, pattern) {
1955
- clearContext(ctx);
1956
- drawBoxBorder(ctx, elem);
1957
- clearContext(ctx);
1958
- rotateElement(ctx, elem, function () {
1959
- var x = elem.x, y = elem.y, w = elem.w, h = elem.h;
1960
- var r = elem.desc.borderRadius || 0;
1961
- r = Math.min(r, w / 2, h / 2);
1962
- if (w < r * 2 || h < r * 2) {
1963
- r = 0;
1964
- }
1965
- ctx.beginPath();
1966
- ctx.moveTo(x + r, y);
1967
- ctx.arcTo(x + w, y, x + w, y + h, r);
1968
- ctx.arcTo(x + w, y + h, x, y + h, r);
1969
- ctx.arcTo(x, y + h, x, y, r);
1970
- ctx.arcTo(x, y, x + w, y, r);
1971
- ctx.closePath();
1972
- if (typeof pattern === 'string') {
1973
- ctx.setFillStyle(pattern);
1974
- }
1975
- else if (['CanvasPattern'].includes(istype.type(pattern))) {
1976
- ctx.setFillStyle(pattern);
1977
- }
1978
- ctx.fill();
1979
- });
1980
- }
1981
- function drawBoxBorder(ctx, elem) {
1982
- clearContext(ctx);
1983
- rotateElement(ctx, elem, function () {
1984
- if (!(elem.desc.borderWidth && elem.desc.borderWidth > 0)) {
1985
- return;
1986
- }
1987
- var bw = elem.desc.borderWidth;
1988
- var borderColor = '#000000';
1989
- if (color.isColorStr(elem.desc.borderColor) === true) {
1990
- borderColor = elem.desc.borderColor;
1991
- }
1992
- var x = elem.x - bw / 2;
1993
- var y = elem.y - bw / 2;
1994
- var w = elem.w + bw;
1995
- var h = elem.h + bw;
1996
- var r = elem.desc.borderRadius || 0;
1997
- r = Math.min(r, w / 2, h / 2);
1998
- if (r < w / 2 && r < h / 2) {
1999
- r = r + bw / 2;
2000
- }
2001
- var desc = elem.desc;
2002
- if (desc.shadowColor !== undefined && index.color.isColorStr(desc.shadowColor)) {
2003
- ctx.setShadowColor(desc.shadowColor);
2004
- }
2005
- if (desc.shadowOffsetX !== undefined && is.number(desc.shadowOffsetX)) {
2006
- ctx.setShadowOffsetX(desc.shadowOffsetX);
2007
- }
2008
- if (desc.shadowOffsetY !== undefined && is.number(desc.shadowOffsetY)) {
2009
- ctx.setShadowOffsetY(desc.shadowOffsetY);
2010
- }
2011
- if (desc.shadowBlur !== undefined && is.number(desc.shadowBlur)) {
2012
- ctx.setShadowBlur(desc.shadowBlur);
2013
- }
2014
- ctx.beginPath();
2015
- ctx.setLineWidth(bw);
2016
- ctx.setStrokeStyle(borderColor);
2017
- ctx.moveTo(x + r, y);
2018
- ctx.arcTo(x + w, y, x + w, y + h, r);
2019
- ctx.arcTo(x + w, y + h, x, y + h, r);
2020
- ctx.arcTo(x, y + h, x, y, r);
2021
- ctx.arcTo(x, y, x + w, y, r);
2022
- ctx.closePath();
2023
- ctx.stroke();
2024
- });
2025
- }
2026
-
2027
- function drawRect(ctx, elem) {
2028
- drawBox(ctx, elem, elem.desc.bgColor);
2029
- }
2030
-
2031
- function drawImage(ctx, elem, loader) {
2032
- var content = loader.getContent(elem.uuid);
2033
- rotateElement(ctx, elem, function () {
2034
- if (content) {
2035
- ctx.drawImage(content, elem.x, elem.y, elem.w, elem.h);
2036
- }
2037
- });
2038
- }
2039
-
2040
- function drawSVG(ctx, elem, loader) {
2041
- var content = loader.getContent(elem.uuid);
2042
- rotateElement(ctx, elem, function () {
2043
- if (content) {
2044
- ctx.drawImage(content, elem.x, elem.y, elem.w, elem.h);
2045
- }
2046
- });
2047
- }
2048
-
2049
- function drawHTML(ctx, elem, loader) {
2050
- var content = loader.getContent(elem.uuid);
2051
- rotateElement(ctx, elem, function () {
2052
- if (content) {
2053
- ctx.drawImage(content, elem.x, elem.y, elem.w, elem.h);
2054
- }
2055
- });
2056
- }
2057
-
2058
- function drawText(ctx, elem, loader, helperConfig) {
2059
- clearContext(ctx);
2060
- drawBox(ctx, elem, elem.desc.bgColor || 'transparent');
2061
- rotateElement(ctx, elem, function () {
2062
- var desc = __assign$1({
2063
- fontSize: 12,
2064
- fontFamily: 'sans-serif',
2065
- textAlign: 'center',
2066
- }, elem.desc);
2067
- ctx.setFillStyle(elem.desc.color);
2068
- ctx.setTextBaseline('top');
2069
- ctx.setFont({
2070
- fontWeight: desc.fontWeight,
2071
- fontSize: desc.fontSize,
2072
- fontFamily: desc.fontFamily
2073
- });
2074
- var descText = desc.text.replace(/\r\n/ig, '\n');
2075
- var fontHeight = desc.lineHeight || desc.fontSize;
2076
- var descTextList = descText.split('\n');
2077
- var lines = [];
2078
- descTextList.forEach(function (tempText) {
2079
- var lineText = '';
2080
- var lineNum = 0;
2081
- for (var i = 0; i < tempText.length; i++) {
2082
- if (ctx.measureText(lineText + (tempText[i] || '')).width < ctx.calcDeviceNum(elem.w)) {
2083
- lineText += (tempText[i] || '');
2084
- }
2085
- else {
2086
- lines.push({
2087
- text: lineText,
2088
- width: ctx.calcScreenNum(ctx.measureText(lineText).width),
2089
- });
2090
- lineText = (tempText[i] || '');
2091
- lineNum++;
2092
- }
2093
- if ((lineNum + 1) * fontHeight > elem.h) {
2094
- break;
2095
- }
2096
- if (lineText && tempText.length - 1 === i) {
2097
- if ((lineNum + 1) * fontHeight < elem.h) {
2098
- lines.push({
2099
- text: lineText,
2100
- width: ctx.calcScreenNum(ctx.measureText(lineText).width),
2101
- });
2102
- break;
2103
- }
2104
- }
2105
- }
2106
- });
2107
- {
2108
- var _y_1 = elem.y;
2109
- if (lines.length * fontHeight < elem.h) {
2110
- _y_1 += ((elem.h - lines.length * fontHeight) / 2);
2111
- }
2112
- if (desc.textShadowColor !== undefined && index.color.isColorStr(desc.textShadowColor)) {
2113
- ctx.setShadowColor(desc.textShadowColor);
2114
- }
2115
- if (desc.textShadowOffsetX !== undefined && is.number(desc.textShadowOffsetX)) {
2116
- ctx.setShadowOffsetX(desc.textShadowOffsetX);
2117
- }
2118
- if (desc.textShadowOffsetY !== undefined && is.number(desc.textShadowOffsetY)) {
2119
- ctx.setShadowOffsetY(desc.textShadowOffsetY);
2120
- }
2121
- if (desc.textShadowBlur !== undefined && is.number(desc.textShadowBlur)) {
2122
- ctx.setShadowBlur(desc.textShadowBlur);
2123
- }
2124
- lines.forEach(function (line, i) {
2125
- var _x = elem.x;
2126
- if (desc.textAlign === 'center') {
2127
- _x = elem.x + (elem.w - line.width) / 2;
2128
- }
2129
- else if (desc.textAlign === 'right') {
2130
- _x = elem.x + (elem.w - line.width);
2131
- }
2132
- ctx.fillText(line.text, _x, _y_1 + fontHeight * i);
2133
- });
2134
- clearContext(ctx);
2135
- }
2136
- if (index.color.isColorStr(desc.strokeColor) && desc.strokeWidth !== undefined && desc.strokeWidth > 0) {
2137
- var _y_2 = elem.y;
2138
- if (lines.length * fontHeight < elem.h) {
2139
- _y_2 += ((elem.h - lines.length * fontHeight) / 2);
2140
- }
2141
- lines.forEach(function (line, i) {
2142
- var _x = elem.x;
2143
- if (desc.textAlign === 'center') {
2144
- _x = elem.x + (elem.w - line.width) / 2;
2145
- }
2146
- else if (desc.textAlign === 'right') {
2147
- _x = elem.x + (elem.w - line.width);
2148
- }
2149
- if (desc.strokeColor !== undefined) {
2150
- ctx.setStrokeStyle(desc.strokeColor);
2151
- }
2152
- if (desc.strokeWidth !== undefined && desc.strokeWidth > 0) {
2153
- ctx.setLineWidth(desc.strokeWidth);
2154
- }
2155
- ctx.strokeText(line.text, _x, _y_2 + fontHeight * i);
2156
- });
2157
- }
2158
- });
2159
- }
2160
-
2161
- function drawCircle(ctx, elem) {
2162
- clearContext(ctx);
2163
- rotateElement(ctx, elem, function (ctx) {
2164
- var x = elem.x, y = elem.y, w = elem.w, h = elem.h, desc = elem.desc;
2165
- var _a = desc.bgColor, bgColor = _a === void 0 ? '#000000' : _a, _b = desc.borderColor, borderColor = _b === void 0 ? '#000000' : _b, _c = desc.borderWidth, borderWidth = _c === void 0 ? 0 : _c;
2166
- var a = w / 2;
2167
- var b = h / 2;
2168
- var centerX = x + a;
2169
- var centerY = y + b;
2170
- if (borderWidth && borderWidth > 0) {
2171
- var ba = borderWidth / 2 + a;
2172
- var bb = borderWidth / 2 + b;
2173
- ctx.beginPath();
2174
- ctx.setStrokeStyle(borderColor);
2175
- ctx.setLineWidth(borderWidth);
2176
- ctx.ellipse(centerX, centerY, ba, bb, 0, 0, 2 * Math.PI);
2177
- ctx.closePath();
2178
- ctx.stroke();
2179
- }
2180
- ctx.beginPath();
2181
- ctx.setFillStyle(bgColor);
2182
- ctx.ellipse(centerX, centerY, a, b, 0, 0, 2 * Math.PI);
2183
- ctx.closePath();
2184
- ctx.fill();
2185
- });
2186
- }
2187
-
2188
- function drawElementWrapper(ctx, config) {
2189
- if (!(config === null || config === void 0 ? void 0 : config.selectedElementWrapper)) {
2190
- return;
2191
- }
2192
- var wrapper = config.selectedElementWrapper;
2193
- clearContext(ctx);
2194
- rotateContext(ctx, wrapper.translate, wrapper.radian || 0, function () {
2195
- ctx.beginPath();
2196
- ctx.setLineDash(wrapper.lineDash);
2197
- ctx.setLineWidth(wrapper.lineWidth);
2198
- ctx.setStrokeStyle(wrapper.color);
2199
- ctx.moveTo(wrapper.controllers.topLeft.x, wrapper.controllers.topLeft.y);
2200
- ctx.lineTo(wrapper.controllers.topRight.x, wrapper.controllers.topRight.y);
2201
- ctx.lineTo(wrapper.controllers.bottomRight.x, wrapper.controllers.bottomRight.y);
2202
- ctx.lineTo(wrapper.controllers.bottomLeft.x, wrapper.controllers.bottomLeft.y);
2203
- ctx.lineTo(wrapper.controllers.topLeft.x, wrapper.controllers.topLeft.y - wrapper.lineWidth / 2);
2204
- ctx.stroke();
2205
- ctx.closePath();
2206
- if (wrapper.lock !== true) {
2207
- if (wrapper.controllers.rotate.invisible !== true) {
2208
- ctx.beginPath();
2209
- ctx.moveTo(wrapper.controllers.top.x, wrapper.controllers.top.y);
2210
- ctx.lineTo(wrapper.controllers.rotate.x, wrapper.controllers.rotate.y + wrapper.controllerSize);
2211
- ctx.stroke();
2212
- ctx.closePath();
2213
- ctx.beginPath();
2214
- ctx.setLineDash([]);
2215
- ctx.setLineWidth(wrapper.controllerSize / 2);
2216
- ctx.arc(wrapper.controllers.rotate.x, wrapper.controllers.rotate.y, wrapper.controllerSize * 0.8, Math.PI / 6, Math.PI * 2);
2217
- ctx.stroke();
2218
- ctx.closePath();
2219
- }
2220
- ctx.setFillStyle(wrapper.color);
2221
- [
2222
- wrapper.controllers.topLeft,
2223
- wrapper.controllers.top,
2224
- wrapper.controllers.topRight,
2225
- wrapper.controllers.right,
2226
- wrapper.controllers.bottomRight,
2227
- wrapper.controllers.bottom,
2228
- wrapper.controllers.bottomLeft,
2229
- wrapper.controllers.left,
2230
- ].forEach(function (controller) {
2231
- if (controller.invisible !== true) {
2232
- ctx.beginPath();
2233
- ctx.arc(controller.x, controller.y, wrapper.controllerSize, 0, Math.PI * 2);
2234
- ctx.fill();
2235
- ctx.closePath();
2236
- }
2237
- });
2238
- }
2239
- else {
2240
- clearContext(ctx);
2241
- ctx.setStrokeStyle(wrapper.color);
2242
- [
2243
- wrapper.controllers.topLeft, wrapper.controllers.top, wrapper.controllers.topRight, wrapper.controllers.right,
2244
- wrapper.controllers.bottomRight, wrapper.controllers.bottom, wrapper.controllers.bottomLeft, wrapper.controllers.left,
2245
- ].forEach(function (controller) {
2246
- ctx.beginPath();
2247
- ctx.moveTo(controller.x - wrapper.controllerSize / 2, controller.y - wrapper.controllerSize / 2);
2248
- ctx.lineTo(controller.x + wrapper.controllerSize / 2, controller.y + wrapper.controllerSize / 2);
2249
- ctx.stroke();
2250
- ctx.closePath();
2251
- ctx.beginPath();
2252
- ctx.moveTo(controller.x + wrapper.controllerSize / 2, controller.y - wrapper.controllerSize / 2);
2253
- ctx.lineTo(controller.x - wrapper.controllerSize / 2, controller.y + wrapper.controllerSize / 2);
2254
- ctx.stroke();
2255
- ctx.closePath();
2256
- });
2257
- }
2258
- });
2259
- }
2260
- function drawAreaWrapper(ctx, config) {
2261
- if (!(config === null || config === void 0 ? void 0 : config.selectedAreaWrapper)) {
2262
- return;
2263
- }
2264
- var wrapper = config.selectedAreaWrapper;
2265
- if (wrapper && wrapper.w > 0 && wrapper.h > 0) {
2266
- clearContext(ctx);
2267
- ctx.setGlobalAlpha(0.3);
2268
- ctx.setFillStyle(wrapper.color);
2269
- ctx.fillRect(wrapper.x, wrapper.y, wrapper.w, wrapper.h);
2270
- clearContext(ctx);
2271
- ctx.beginPath();
2272
- ctx.setLineDash(wrapper.lineDash);
2273
- ctx.setLineWidth(wrapper.lineWidth);
2274
- ctx.setStrokeStyle(wrapper.color);
2275
- ctx.moveTo(wrapper.x, wrapper.y);
2276
- ctx.lineTo(wrapper.x + wrapper.w, wrapper.y);
2277
- ctx.lineTo(wrapper.x + wrapper.w, wrapper.y + wrapper.h);
2278
- ctx.lineTo(wrapper.x, wrapper.y + wrapper.h);
2279
- ctx.lineTo(wrapper.x, wrapper.y);
2280
- ctx.stroke();
2281
- ctx.closePath();
2282
- }
2283
- }
2284
- function drawElementListWrappers(ctx, config) {
2285
- if (!Array.isArray(config === null || config === void 0 ? void 0 : config.selectedElementListWrappers)) {
2286
- return;
2287
- }
2288
- var wrapperList = config.selectedElementListWrappers;
2289
- wrapperList === null || wrapperList === void 0 ? void 0 : wrapperList.forEach(function (wrapper) {
2290
- clearContext(ctx);
2291
- rotateContext(ctx, wrapper.translate, wrapper.radian || 0, function () {
2292
- clearContext(ctx);
2293
- ctx.setGlobalAlpha(0.05);
2294
- ctx.setFillStyle(wrapper.color);
2295
- ctx.fillRect(wrapper.controllers.topLeft.x, wrapper.controllers.topLeft.y, wrapper.controllers.bottomRight.x - wrapper.controllers.topLeft.x, wrapper.controllers.bottomRight.y - wrapper.controllers.topLeft.y);
2296
- clearContext(ctx);
2297
- ctx.beginPath();
2298
- ctx.setLineDash(wrapper.lineDash);
2299
- ctx.setLineWidth(wrapper.lineWidth);
2300
- ctx.setStrokeStyle(wrapper.color);
2301
- ctx.moveTo(wrapper.controllers.topLeft.x, wrapper.controllers.topLeft.y);
2302
- ctx.lineTo(wrapper.controllers.topRight.x, wrapper.controllers.topRight.y);
2303
- ctx.lineTo(wrapper.controllers.bottomRight.x, wrapper.controllers.bottomRight.y);
2304
- ctx.lineTo(wrapper.controllers.bottomLeft.x, wrapper.controllers.bottomLeft.y);
2305
- ctx.lineTo(wrapper.controllers.topLeft.x, wrapper.controllers.topLeft.y - wrapper.lineWidth / 2);
2306
- ctx.stroke();
2307
- ctx.closePath();
2308
- if (wrapper.lock === true) {
2309
- clearContext(ctx);
2310
- ctx.setStrokeStyle(wrapper.color);
2311
- [
2312
- wrapper.controllers.topLeft, wrapper.controllers.top, wrapper.controllers.topRight, wrapper.controllers.right,
2313
- wrapper.controllers.bottomRight, wrapper.controllers.bottom, wrapper.controllers.bottomLeft, wrapper.controllers.left,
2314
- ].forEach(function (controller) {
2315
- ctx.beginPath();
2316
- ctx.moveTo(controller.x - wrapper.controllerSize / 2, controller.y - wrapper.controllerSize / 2);
2317
- ctx.lineTo(controller.x + wrapper.controllerSize / 2, controller.y + wrapper.controllerSize / 2);
2318
- ctx.stroke();
2319
- ctx.closePath();
2320
- ctx.beginPath();
2321
- ctx.moveTo(controller.x + wrapper.controllerSize / 2, controller.y - wrapper.controllerSize / 2);
2322
- ctx.lineTo(controller.x - wrapper.controllerSize / 2, controller.y + wrapper.controllerSize / 2);
2323
- ctx.stroke();
2324
- ctx.closePath();
2325
- });
2326
- }
2327
- });
2328
- });
2329
- }
2330
-
2331
- var isColorStr = index.color.isColorStr;
2332
- function drawContext(ctx, data, helperConfig, loader) {
2333
- var _a;
2334
- clearContext(ctx);
2335
- var size = ctx.getSize();
2336
- ctx.clearRect(0, 0, size.contextWidth, size.contextHeight);
2337
- if (typeof data.bgColor === 'string' && isColorStr(data.bgColor)) {
2338
- drawBgColor(ctx, data.bgColor);
2339
- }
2340
- if (!(data.elements.length > 0)) {
2341
- return;
2342
- }
2343
- for (var i = 0; i < data.elements.length; i++) {
2344
- var elem = data.elements[i];
2345
- if (((_a = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _a === void 0 ? void 0 : _a.invisible) === true) {
2346
- continue;
2347
- }
2348
- switch (elem.type) {
2349
- case 'rect': {
2350
- drawRect(ctx, elem);
2351
- break;
2352
- }
2353
- case 'text': {
2354
- drawText(ctx, elem);
2355
- break;
2356
- }
2357
- case 'image': {
2358
- drawImage(ctx, elem, loader);
2359
- break;
2360
- }
2361
- case 'svg': {
2362
- drawSVG(ctx, elem, loader);
2363
- break;
2364
- }
2365
- case 'html': {
2366
- drawHTML(ctx, elem, loader);
2367
- break;
2368
- }
2369
- case 'circle': {
2370
- drawCircle(ctx, elem);
2371
- break;
2372
- }
2373
- }
2374
- }
2375
- drawElementWrapper(ctx, helperConfig);
2376
- drawAreaWrapper(ctx, helperConfig);
2377
- drawElementListWrappers(ctx, helperConfig);
2378
- }
2379
-
2380
- var defaultConfig = {
2381
- elementWrapper: {
2382
- color: '#2ab6f1',
2383
- lockColor: '#aaaaaa',
2384
- controllerSize: 6,
2385
- lineWidth: 1,
2386
- lineDash: [4, 3],
2387
- }
2388
- };
2389
- function mergeConfig(config) {
2390
- var result = index.data.deepClone(defaultConfig);
2391
- if (config) {
2392
- if (config.elementWrapper) {
2393
- result.elementWrapper = __assign$1(__assign$1({}, result.elementWrapper), config.elementWrapper);
2394
- }
2395
- }
2396
- return result;
2397
- }
2398
-
2399
- var CoreEvent = (function () {
2400
- function CoreEvent() {
2401
- this._listeners = new Map();
2402
- }
2403
- CoreEvent.prototype.on = function (eventKey, callback) {
2404
- if (this._listeners.has(eventKey)) {
2405
- var callbacks = this._listeners.get(eventKey);
2406
- callbacks === null || callbacks === void 0 ? void 0 : callbacks.push(callback);
2407
- this._listeners.set(eventKey, callbacks || []);
2408
- }
2409
- else {
2410
- this._listeners.set(eventKey, [callback]);
2411
- }
2412
- };
2413
- CoreEvent.prototype.off = function (eventKey, callback) {
2414
- if (this._listeners.has(eventKey)) {
2415
- var callbacks = this._listeners.get(eventKey);
2416
- if (Array.isArray(callbacks)) {
2417
- for (var i = 0; i < (callbacks === null || callbacks === void 0 ? void 0 : callbacks.length); i++) {
2418
- if (callbacks[i] === callback) {
2419
- callbacks.splice(i, 1);
2420
- break;
2421
- }
2422
- }
2423
- }
2424
- this._listeners.set(eventKey, callbacks || []);
2425
- }
2426
- };
2427
- CoreEvent.prototype.trigger = function (eventKey, arg) {
2428
- var callbacks = this._listeners.get(eventKey);
2429
- if (Array.isArray(callbacks)) {
2430
- callbacks.forEach(function (cb) {
2431
- cb(arg);
2432
- });
2433
- return true;
2434
- }
2435
- else {
2436
- return false;
2437
- }
2438
- };
2439
- CoreEvent.prototype.has = function (name) {
2440
- if (this._listeners.has(name)) {
2441
- var list = this._listeners.get(name);
2442
- if (Array.isArray(list) && list.length > 0) {
2443
- return true;
2444
- }
2445
- }
2446
- return false;
2447
- };
2448
- return CoreEvent;
2449
- }());
2450
-
2451
- function isChangeImageElementResource(before, after) {
2452
- var _a, _b;
2453
- return (((_a = before === null || before === void 0 ? void 0 : before.desc) === null || _a === void 0 ? void 0 : _a.src) !== ((_b = after === null || after === void 0 ? void 0 : after.desc) === null || _b === void 0 ? void 0 : _b.src));
2454
- }
2455
- function isChangeSVGElementResource(before, after) {
2456
- var _a, _b;
2457
- return (((_a = before === null || before === void 0 ? void 0 : before.desc) === null || _a === void 0 ? void 0 : _a.svg) !== ((_b = after === null || after === void 0 ? void 0 : after.desc) === null || _b === void 0 ? void 0 : _b.svg));
2458
- }
2459
- function isChangeHTMLElementResource(before, after) {
2460
- var _a, _b, _c, _d, _e, _f;
2461
- return (((_a = before === null || before === void 0 ? void 0 : before.desc) === null || _a === void 0 ? void 0 : _a.html) !== ((_b = after === null || after === void 0 ? void 0 : after.desc) === null || _b === void 0 ? void 0 : _b.html)
2462
- || ((_c = before === null || before === void 0 ? void 0 : before.desc) === null || _c === void 0 ? void 0 : _c.width) !== ((_d = after === null || after === void 0 ? void 0 : after.desc) === null || _d === void 0 ? void 0 : _d.width)
2463
- || ((_e = before === null || before === void 0 ? void 0 : before.desc) === null || _e === void 0 ? void 0 : _e.height) !== ((_f = after === null || after === void 0 ? void 0 : after.desc) === null || _f === void 0 ? void 0 : _f.height));
2464
- }
2465
- function diffElementResourceChange(before, after) {
2466
- var result = null;
2467
- var isChange = false;
2468
- switch (after.type) {
2469
- case 'image': {
2470
- isChange = isChangeImageElementResource(before, after);
2471
- break;
2472
- }
2473
- case 'svg': {
2474
- isChange = isChangeSVGElementResource(before, after);
2475
- break;
2476
- }
2477
- case 'html': {
2478
- isChange = isChangeHTMLElementResource(before, after);
2479
- break;
2480
- }
2481
- }
2482
- if (isChange === true) {
2483
- result = after.uuid;
2484
- }
2485
- return result;
2486
- }
2487
- function diffElementResourceChangeList(before, after) {
2488
- var _a;
2489
- var uuids = [];
2490
- var beforeMap = parseDataElementMap(before);
2491
- var afterMap = parseDataElementMap(after);
2492
- for (var uuid in afterMap) {
2493
- if (['image', 'svg', 'html'].includes((_a = afterMap[uuid]) === null || _a === void 0 ? void 0 : _a.type) !== true) {
2494
- continue;
2495
- }
2496
- if (beforeMap[uuid]) {
2497
- var isChange = false;
2498
- switch (beforeMap[uuid].type) {
2499
- case 'image': {
2500
- isChange = isChangeImageElementResource(beforeMap[uuid], afterMap[uuid]);
2501
- break;
2502
- }
2503
- case 'svg': {
2504
- isChange = isChangeSVGElementResource(beforeMap[uuid], afterMap[uuid]);
2505
- break;
2506
- }
2507
- case 'html': {
2508
- isChange = isChangeHTMLElementResource(beforeMap[uuid], afterMap[uuid]);
2509
- break;
2510
- }
2511
- }
2512
- if (isChange === true) {
2513
- uuids.push(uuid);
2514
- }
2515
- }
2516
- else {
2517
- uuids.push(uuid);
2518
- }
2519
- }
2520
- return uuids;
2521
- }
2522
- function parseDataElementMap(data) {
2523
- var elemMap = {};
2524
- data.elements.forEach(function (elem) {
2525
- elemMap[elem.uuid] = elem;
2526
- });
2527
- return elemMap;
2528
- }
2529
-
2530
- function limitNum(num) {
2531
- var numStr = num.toFixed(2);
2532
- return parseFloat(numStr);
2533
- }
2534
- function limitAngle(angle) {
2535
- return limitNum(angle % 360);
2536
- }
2537
-
2538
- var elementTypes = {
2539
- 'text': {},
2540
- 'rect': {},
2541
- 'image': {},
2542
- 'svg': {},
2543
- 'circle': {},
2544
- 'html': {},
2545
- };
2546
- var elementNames = Object.keys(elementTypes);
2547
- var LIMIT_QBLIQUE_ANGLE = 15;
2548
-
2549
- var createUUID$1 = index.uuid.createUUID;
2550
- var limitQbliqueAngle$1 = LIMIT_QBLIQUE_ANGLE;
2551
- var Element = (function () {
2552
- function Element(ctx) {
2553
- this._ctx = ctx;
2554
- }
2555
- Element.prototype.initData = function (data) {
2556
- data.elements.forEach(function (elem) {
2557
- if (!(elem.uuid && typeof elem.uuid === 'string')) {
2558
- elem.uuid = createUUID$1();
2559
- }
2560
- });
2561
- return data;
2562
- };
2563
- Element.prototype.isPointInElement = function (p, data) {
2564
- var _a, _b;
2565
- var ctx = this._ctx;
2566
- var idx = -1;
2567
- var uuid = null;
2568
- var _loop_1 = function (i) {
2569
- var ele = data.elements[i];
2570
- if (((_a = ele.operation) === null || _a === void 0 ? void 0 : _a.invisible) === true)
2571
- return "continue";
2572
- var bw = 0;
2573
- if (((_b = ele.desc) === null || _b === void 0 ? void 0 : _b.borderWidth) > 0) {
2574
- bw = ele.desc.borderWidth;
2575
- }
2576
- rotateElement(ctx, ele, function () {
2577
- ctx.beginPath();
2578
- ctx.moveTo(ele.x - bw, ele.y - bw);
2579
- ctx.lineTo(ele.x + ele.w + bw, ele.y - bw);
2580
- ctx.lineTo(ele.x + ele.w + bw, ele.y + ele.h + bw);
2581
- ctx.lineTo(ele.x - bw, ele.y + ele.h + bw);
2582
- ctx.lineTo(ele.x - bw, ele.y - bw);
2583
- ctx.closePath();
2584
- if (ctx.isPointInPath(p.x, p.y)) {
2585
- idx = i;
2586
- uuid = ele.uuid;
2587
- }
2588
- });
2589
- if (idx >= 0) {
2590
- return "break";
2591
- }
2592
- };
2593
- for (var i = data.elements.length - 1; i >= 0; i--) {
2594
- var state_1 = _loop_1(i);
2595
- if (state_1 === "break")
2596
- break;
2597
- }
2598
- return [idx, uuid];
2599
- };
2600
- Element.prototype.dragElement = function (data, uuid, point, prevPoint, scale) {
2601
- var index = this.getElementIndex(data, uuid);
2602
- if (!data.elements[index]) {
2603
- return;
2604
- }
2605
- var moveX = point.x - prevPoint.x;
2606
- var moveY = point.y - prevPoint.y;
2607
- data.elements[index].x += (moveX / scale);
2608
- data.elements[index].y += (moveY / scale);
2609
- this.limitElementAttrs(data.elements[index]);
2610
- };
2611
- Element.prototype.transformElement = function (data, uuid, point, prevPoint, scale, direction) {
2612
- var _a, _b;
2613
- var index = this.getElementIndex(data, uuid);
2614
- if (!data.elements[index]) {
2615
- return null;
2616
- }
2617
- if (((_b = (_a = data.elements[index]) === null || _a === void 0 ? void 0 : _a.operation) === null || _b === void 0 ? void 0 : _b.lock) === true) {
2618
- return null;
2619
- }
2620
- var moveX = (point.x - prevPoint.x) / scale;
2621
- var moveY = (point.y - prevPoint.y) / scale;
2622
- var elem = data.elements[index];
2623
- if ([
2624
- 'top-left', 'top', 'top-right', 'right',
2625
- 'bottom-right', 'bottom', 'bottom-left', 'left'
2626
- ].includes(direction)) {
2627
- var p = calcuScaleElemPosition(elem, moveX, moveY, direction);
2628
- elem.x = p.x;
2629
- elem.y = p.y;
2630
- elem.w = p.w;
2631
- elem.h = p.h;
2632
- }
2633
- else if (direction === 'rotate') {
2634
- var center = calcElementCenter(elem);
2635
- var radian = calcRadian(center, prevPoint, point);
2636
- elem.angle = (elem.angle || 0) + parseRadianToAngle(radian);
2637
- }
2638
- this.limitElementAttrs(elem);
2639
- return {
2640
- width: limitNum(elem.w),
2641
- height: limitNum(elem.h),
2642
- angle: limitAngle(elem.angle || 0),
2643
- };
2644
- };
2645
- Element.prototype.getElementIndex = function (data, uuid) {
2646
- var idx = -1;
2647
- for (var i = 0; i < data.elements.length; i++) {
2648
- if (data.elements[i].uuid === uuid) {
2649
- idx = i;
2650
- break;
2651
- }
2652
- }
2653
- return idx;
2654
- };
2655
- Element.prototype.limitElementAttrs = function (elem) {
2656
- elem.x = limitNum(elem.x);
2657
- elem.y = limitNum(elem.y);
2658
- elem.w = limitNum(elem.w);
2659
- elem.h = limitNum(elem.h);
2660
- elem.angle = limitAngle(elem.angle || 0);
2661
- };
2662
- return Element;
2663
- }());
2664
- function calcuScaleElemPosition(elem, moveX, moveY, direction, scale) {
2665
- var p = { x: elem.x, y: elem.y, w: elem.w, h: elem.h };
2666
- elem.angle;
2667
- switch (direction) {
2668
- case 'top-left': {
2669
- if (elem.w - moveX > 0 && elem.h - moveY > 0) {
2670
- p.x += moveX;
2671
- p.y += moveY;
2672
- p.w -= moveX;
2673
- p.h -= moveY;
2674
- }
2675
- break;
2676
- }
2677
- case 'top': {
2678
- if (elem.angle === 0 || Math.abs(elem.angle) < limitQbliqueAngle$1) {
2679
- if (p.h - moveY > 0) {
2680
- p.y += moveY;
2681
- p.h -= moveY;
2682
- }
2683
- }
2684
- else if (elem.angle > 0 || elem.angle < 0) {
2685
- var angle_1 = elem.angle > 0 ? elem.angle : Math.max(0, elem.angle + 360);
2686
- var moveDist = calcMoveDist(moveX, moveY);
2687
- var centerX = p.x + elem.w / 2;
2688
- var centerY = p.y + elem.h / 2;
2689
- if (angle_1 < 90) {
2690
- moveDist = 0 - changeMoveDistDirect(moveDist, moveY);
2691
- var radian = parseRadian(angle_1);
2692
- var centerMoveDist = moveDist / 2;
2693
- centerX = centerX + centerMoveDist * Math.sin(radian);
2694
- centerY = centerY - centerMoveDist * Math.cos(radian);
2695
- }
2696
- else if (angle_1 < 180) {
2697
- moveDist = changeMoveDistDirect(moveDist, moveX);
2698
- var radian = parseRadian(angle_1 - 90);
2699
- var centerMoveDist = moveDist / 2;
2700
- centerX = centerX + centerMoveDist * Math.cos(radian);
2701
- centerY = centerY + centerMoveDist * Math.sin(radian);
2702
- }
2703
- else if (angle_1 < 270) {
2704
- moveDist = changeMoveDistDirect(moveDist, moveY);
2705
- var radian = parseRadian(angle_1 - 180);
2706
- var centerMoveDist = moveDist / 2;
2707
- centerX = centerX - centerMoveDist * Math.sin(radian);
2708
- centerY = centerY + centerMoveDist * Math.cos(radian);
2709
- }
2710
- else if (angle_1 < 360) {
2711
- moveDist = 0 - changeMoveDistDirect(moveDist, moveX);
2712
- var radian = parseRadian(angle_1 - 270);
2713
- var centerMoveDist = moveDist / 2;
2714
- centerX = centerX - centerMoveDist * Math.cos(radian);
2715
- centerY = centerY - centerMoveDist * Math.sin(radian);
2716
- }
2717
- if (p.h + moveDist > 0) {
2718
- p.h = p.h + moveDist;
2719
- p.x = centerX - p.w / 2;
2720
- p.y = centerY - p.h / 2;
2721
- }
2722
- }
2723
- else {
2724
- if (p.h - moveY > 0) {
2725
- p.y += moveY;
2726
- p.h -= moveY;
2727
- }
2728
- }
2729
- break;
2730
- }
2731
- case 'top-right': {
2732
- if (p.h - moveY > 0 && p.w + moveX > 0) {
2733
- p.y += moveY;
2734
- p.w += moveX;
2735
- p.h -= moveY;
2736
- }
2737
- break;
2738
- }
2739
- case 'right': {
2740
- if (elem.angle === 0 || Math.abs(elem.angle) < limitQbliqueAngle$1) {
2741
- if (elem.w + moveX > 0) {
2742
- p.w += moveX;
2743
- }
2744
- }
2745
- else if (elem.angle > 0 || elem.angle < 0) {
2746
- var angle_2 = elem.angle > 0 ? elem.angle : Math.max(0, elem.angle + 360);
2747
- var moveDist = calcMoveDist(moveX, moveY);
2748
- var centerX = p.x + elem.w / 2;
2749
- var centerY = p.y + elem.h / 2;
2750
- if (angle_2 < 90) {
2751
- moveDist = changeMoveDistDirect(moveDist, moveY);
2752
- var radian = parseRadian(angle_2);
2753
- var centerMoveDist = moveDist / 2;
2754
- centerX = centerX + centerMoveDist * Math.cos(radian);
2755
- centerY = centerY + centerMoveDist * Math.sin(radian);
2756
- }
2757
- else if (angle_2 < 180) {
2758
- moveDist = changeMoveDistDirect(moveDist, moveY);
2759
- var radian = parseRadian(angle_2 - 90);
2760
- var centerMoveDist = moveDist / 2;
2761
- centerX = centerX - centerMoveDist * Math.sin(radian);
2762
- centerY = centerY + centerMoveDist * Math.cos(radian);
2763
- }
2764
- else if (angle_2 < 270) {
2765
- moveDist = changeMoveDistDirect(moveDist, moveY);
2766
- var radian = parseRadian(angle_2 - 180);
2767
- var centerMoveDist = moveDist / 2;
2768
- centerX = centerX + centerMoveDist * Math.cos(radian);
2769
- centerY = centerY + centerMoveDist * Math.sin(radian);
2770
- moveDist = 0 - moveDist;
2771
- }
2772
- else if (angle_2 < 360) {
2773
- moveDist = changeMoveDistDirect(moveDist, moveX);
2774
- var radian = parseRadian(angle_2 - 270);
2775
- var centerMoveDist = moveDist / 2;
2776
- centerX = centerX + centerMoveDist * Math.sin(radian);
2777
- centerY = centerY - centerMoveDist * Math.cos(radian);
2778
- }
2779
- if (p.w + moveDist > 0) {
2780
- p.w = p.w + moveDist;
2781
- p.x = centerX - p.w / 2;
2782
- p.y = centerY - p.h / 2;
2783
- }
2784
- }
2785
- else {
2786
- if (elem.w + moveX > 0) {
2787
- p.w += moveX;
2788
- }
2789
- }
2790
- break;
2791
- }
2792
- case 'bottom-right': {
2793
- if (elem.w + moveX > 0 && elem.h + moveY > 0) {
2794
- p.w += moveX;
2795
- p.h += moveY;
2796
- }
2797
- break;
2798
- }
2799
- case 'bottom': {
2800
- if (elem.angle === 0 || Math.abs(elem.angle) < limitQbliqueAngle$1) {
2801
- if (elem.h + moveY > 0) {
2802
- p.h += moveY;
2803
- }
2804
- }
2805
- else if (elem.angle > 0 || elem.angle < 0) {
2806
- var angle_3 = elem.angle > 0 ? elem.angle : Math.max(0, elem.angle + 360);
2807
- var moveDist = calcMoveDist(moveX, moveY);
2808
- var centerX = p.x + elem.w / 2;
2809
- var centerY = p.y + elem.h / 2;
2810
- if (angle_3 < 90) {
2811
- moveDist = changeMoveDistDirect(moveDist, moveY);
2812
- var radian = parseRadian(angle_3);
2813
- var centerMoveDist = moveDist / 2;
2814
- centerX = centerX - centerMoveDist * Math.sin(radian);
2815
- centerY = centerY + centerMoveDist * Math.cos(radian);
2816
- }
2817
- else if (angle_3 < 180) {
2818
- moveDist = 0 - changeMoveDistDirect(moveDist, moveX);
2819
- var radian = parseRadian(angle_3 - 90);
2820
- var centerMoveDist = moveDist / 2;
2821
- centerX = centerX - centerMoveDist * Math.cos(radian);
2822
- centerY = centerY - centerMoveDist * Math.sin(radian);
2823
- }
2824
- else if (angle_3 < 270) {
2825
- moveDist = changeMoveDistDirect(moveDist, moveX);
2826
- var radian = parseRadian(angle_3 - 180);
2827
- var centerMoveDist = moveDist / 2;
2828
- centerX = centerX + centerMoveDist * Math.sin(radian);
2829
- centerY = centerY - centerMoveDist * Math.cos(radian);
2830
- }
2831
- else if (angle_3 < 360) {
2832
- moveDist = changeMoveDistDirect(moveDist, moveX);
2833
- var radian = parseRadian(angle_3 - 270);
2834
- var centerMoveDist = moveDist / 2;
2835
- centerX = centerX + centerMoveDist * Math.cos(radian);
2836
- centerY = centerY + centerMoveDist * Math.sin(radian);
2837
- }
2838
- if (p.h + moveDist > 0) {
2839
- p.h = p.h + moveDist;
2840
- p.x = centerX - p.w / 2;
2841
- p.y = centerY - p.h / 2;
2842
- }
2843
- }
2844
- else {
2845
- if (elem.h + moveY > 0) {
2846
- p.h += moveY;
2847
- }
2848
- }
2849
- break;
2850
- }
2851
- case 'bottom-left': {
2852
- if (elem.w - moveX > 0 && elem.h + moveY > 0) {
2853
- p.x += moveX;
2854
- p.w -= moveX;
2855
- p.h += moveY;
2856
- }
2857
- break;
2858
- }
2859
- case 'left': {
2860
- if (elem.angle === 0 || Math.abs(elem.angle) < limitQbliqueAngle$1) {
2861
- if (elem.w - moveX > 0) {
2862
- p.x += moveX;
2863
- p.w -= moveX;
2864
- }
2865
- }
2866
- else if (elem.angle > 0 || elem.angle < 0) {
2867
- var angle_4 = elem.angle > 0 ? elem.angle : Math.max(0, elem.angle + 360);
2868
- var moveDist = calcMoveDist(moveX, moveY);
2869
- var centerX = p.x + elem.w / 2;
2870
- var centerY = p.y + elem.h / 2;
2871
- if (angle_4 < 90) {
2872
- moveDist = 0 - changeMoveDistDirect(moveDist, moveX);
2873
- var radian = parseRadian(angle_4);
2874
- var centerMoveDist = moveDist / 2;
2875
- centerX = centerX - centerMoveDist * Math.cos(radian);
2876
- centerY = centerY - centerMoveDist * Math.sin(radian);
2877
- }
2878
- else if (angle_4 < 180) {
2879
- moveDist = changeMoveDistDirect(moveDist, moveX);
2880
- var radian = parseRadian(angle_4 - 90);
2881
- var centerMoveDist = moveDist / 2;
2882
- centerX = centerX + centerMoveDist * Math.sin(radian);
2883
- centerY = centerY - centerMoveDist * Math.cos(radian);
2884
- }
2885
- else if (angle_4 < 270) {
2886
- moveDist = changeMoveDistDirect(moveDist, moveY);
2887
- var radian = parseRadian(angle_4 - 180);
2888
- var centerMoveDist = moveDist / 2;
2889
- centerX = centerX + centerMoveDist * Math.cos(radian);
2890
- centerY = centerY + centerMoveDist * Math.sin(radian);
2891
- }
2892
- else if (angle_4 < 360) {
2893
- moveDist = changeMoveDistDirect(moveDist, moveY);
2894
- var radian = parseRadian(angle_4 - 270);
2895
- var centerMoveDist = moveDist / 2;
2896
- centerX = centerX - centerMoveDist * Math.sin(radian);
2897
- centerY = centerY + centerMoveDist * Math.cos(radian);
2898
- }
2899
- if (p.w + moveDist > 0) {
2900
- p.w = p.w + moveDist;
2901
- p.x = centerX - p.w / 2;
2902
- p.y = centerY - p.h / 2;
2903
- }
2904
- }
2905
- else {
2906
- if (elem.w - moveX > 0) {
2907
- p.x += moveX;
2908
- p.w -= moveX;
2909
- }
2910
- }
2911
- break;
2912
- }
2913
- }
2914
- return p;
2915
- }
2916
- function parseRadian(angle) {
2917
- return angle * Math.PI / 180;
2918
- }
2919
- function calcMoveDist(moveX, moveY) {
2920
- return Math.sqrt(moveX * moveX + moveY * moveY);
2921
- }
2922
- function changeMoveDistDirect(moveDist, moveDirect) {
2923
- return moveDirect > 0 ? Math.abs(moveDist) : 0 - Math.abs(moveDist);
2924
- }
2925
-
2926
- var limitQbliqueAngle = LIMIT_QBLIQUE_ANGLE;
2927
- var deepClone$4 = index.data.deepClone;
2928
- var Helper = (function () {
2929
- function Helper(board, config) {
2930
- this._areaStart = { x: 0, y: 0 };
2931
- this._areaEnd = { x: 0, y: 0 };
2932
- this._board = board;
2933
- this._ctx = this._board.getContext();
2934
- this._coreConfig = config;
2935
- this._helperConfig = {
2936
- elementIndexMap: {}
2937
- };
2938
- }
2939
- Helper.prototype.updateConfig = function (data, opts) {
2940
- this._updateElementIndex(data);
2941
- this._updateSelectedElementWrapper(data, opts);
2942
- this._updateSelectedElementListWrapper(data, opts);
2943
- };
2944
- Helper.prototype.getConfig = function () {
2945
- return deepClone$4(this._helperConfig);
2946
- };
2947
- Helper.prototype.getElementIndexByUUID = function (uuid) {
2948
- var index = this._helperConfig.elementIndexMap[uuid];
2949
- if (index >= 0) {
2950
- return index;
2951
- }
2952
- return null;
2953
- };
2954
- Helper.prototype.isPointInElementWrapperController = function (p, data) {
2955
- var _a, _b;
2956
- var ctx = this._ctx;
2957
- var uuid = ((_b = (_a = this._helperConfig) === null || _a === void 0 ? void 0 : _a.selectedElementWrapper) === null || _b === void 0 ? void 0 : _b.uuid) || null;
2958
- var directIndex = null;
2959
- var selectedControllerDirection = null;
2960
- var hoverControllerDirection = null;
2961
- if (!this._helperConfig.selectedElementWrapper) {
2962
- return { uuid: uuid, selectedControllerDirection: selectedControllerDirection, directIndex: directIndex, hoverControllerDirection: hoverControllerDirection };
2963
- }
2964
- var wrapper = this._helperConfig.selectedElementWrapper;
2965
- var controllers = [
2966
- wrapper.controllers.right,
2967
- wrapper.controllers.topRight,
2968
- wrapper.controllers.top,
2969
- wrapper.controllers.topLeft,
2970
- wrapper.controllers.left,
2971
- wrapper.controllers.bottomLeft,
2972
- wrapper.controllers.bottom,
2973
- wrapper.controllers.bottomRight,
2974
- ];
2975
- var directionNames = [
2976
- 'right',
2977
- 'top-right',
2978
- 'top',
2979
- 'top-left',
2980
- 'left',
2981
- 'bottom-left',
2982
- 'bottom',
2983
- 'bottom-right',
2984
- ];
2985
- var hoverDirectionNames = index.data.deepClone(directionNames);
2986
- var angleMoveNum = 0;
2987
- if (data && uuid) {
2988
- var elemIdx = this.getElementIndexByUUID(uuid);
2989
- if (elemIdx !== null && elemIdx >= 0) {
2990
- var elem = data.elements[elemIdx];
2991
- var angle = elem.angle;
2992
- if (angle < 0) {
2993
- angle += 360;
2994
- }
2995
- if (angle < 45) {
2996
- angleMoveNum = 0;
2997
- }
2998
- else if (angle < 90) {
2999
- angleMoveNum = 1;
3000
- }
3001
- else if (angle < 135) {
3002
- angleMoveNum = 2;
3003
- }
3004
- else if (angle < 180) {
3005
- angleMoveNum = 3;
3006
- }
3007
- else if (angle < 225) {
3008
- angleMoveNum = 4;
3009
- }
3010
- else if (angle < 270) {
3011
- angleMoveNum = 5;
3012
- }
3013
- else if (angle < 315) {
3014
- angleMoveNum = 6;
3015
- }
3016
- }
3017
- }
3018
- if (angleMoveNum > 0) {
3019
- hoverDirectionNames = hoverDirectionNames.slice(-angleMoveNum).concat(hoverDirectionNames.slice(0, -angleMoveNum));
3020
- }
3021
- rotateContext(ctx, wrapper.translate, wrapper.radian || 0, function () {
3022
- for (var i = 0; i < controllers.length; i++) {
3023
- var controller = controllers[i];
3024
- if (controller.invisible === true) {
3025
- continue;
3026
- }
3027
- ctx.beginPath();
3028
- ctx.arc(controller.x, controller.y, wrapper.controllerSize, 0, Math.PI * 2);
3029
- ctx.closePath();
3030
- if (ctx.isPointInPath(p.x, p.y)) {
3031
- selectedControllerDirection = directionNames[i];
3032
- hoverControllerDirection = hoverDirectionNames[i];
3033
- }
3034
- if (selectedControllerDirection) {
3035
- directIndex = i;
3036
- break;
3037
- }
3038
- }
3039
- });
3040
- if (selectedControllerDirection === null) {
3041
- var controller_1 = wrapper.controllers.rotate;
3042
- if (controller_1.invisible !== true) {
3043
- rotateContext(ctx, wrapper.translate, wrapper.radian || 0, function () {
3044
- ctx.beginPath();
3045
- ctx.arc(controller_1.x, controller_1.y, wrapper.controllerSize, 0, Math.PI * 2);
3046
- ctx.closePath();
3047
- if (ctx.isPointInPath(p.x, p.y)) {
3048
- selectedControllerDirection = 'rotate';
3049
- hoverControllerDirection = 'rotate';
3050
- }
3051
- });
3052
- }
3053
- }
3054
- return { uuid: uuid, selectedControllerDirection: selectedControllerDirection, hoverControllerDirection: hoverControllerDirection, directIndex: directIndex };
3055
- };
3056
- Helper.prototype.isPointInElementList = function (p, data) {
3057
- var _a, _b, _c;
3058
- var ctx = this._ctx;
3059
- var idx = -1;
3060
- var uuid = null;
3061
- var wrapperList = ((_a = this._helperConfig) === null || _a === void 0 ? void 0 : _a.selectedElementListWrappers) || [];
3062
- var _loop_1 = function (i) {
3063
- var wrapper = wrapperList[i];
3064
- var elemIdx = this_1._helperConfig.elementIndexMap[wrapper.uuid];
3065
- var ele = data.elements[elemIdx];
3066
- if (!ele)
3067
- return "continue";
3068
- if (((_b = ele.operation) === null || _b === void 0 ? void 0 : _b.invisible) === true)
3069
- return "continue";
3070
- var bw = 0;
3071
- if (((_c = ele.desc) === null || _c === void 0 ? void 0 : _c.borderWidth) > 0) {
3072
- bw = ele.desc.borderWidth;
3073
- }
3074
- rotateElement(ctx, ele, function () {
3075
- ctx.beginPath();
3076
- ctx.moveTo(ele.x - bw, ele.y - bw);
3077
- ctx.lineTo(ele.x + ele.w + bw, ele.y - bw);
3078
- ctx.lineTo(ele.x + ele.w + bw, ele.y + ele.h + bw);
3079
- ctx.lineTo(ele.x - bw, ele.y + ele.h + bw);
3080
- ctx.lineTo(ele.x - bw, ele.y - bw);
3081
- ctx.closePath();
3082
- if (ctx.isPointInPath(p.x, p.y)) {
3083
- idx = i;
3084
- uuid = ele.uuid;
3085
- }
3086
- });
3087
- if (idx >= 0) {
3088
- return "break";
3089
- }
3090
- };
3091
- var this_1 = this;
3092
- for (var i = 0; i < wrapperList.length; i++) {
3093
- var state_1 = _loop_1(i);
3094
- if (state_1 === "break")
3095
- break;
3096
- }
3097
- if (uuid && idx >= 0) {
3098
- return true;
3099
- }
3100
- else {
3101
- return false;
3102
- }
3103
- };
3104
- Helper.prototype.startSelectArea = function (p) {
3105
- this._areaStart = p;
3106
- this._areaEnd = p;
3107
- };
3108
- Helper.prototype.changeSelectArea = function (p) {
3109
- this._areaEnd = p;
3110
- this._calcSelectedArea();
3111
- };
3112
- Helper.prototype.clearSelectedArea = function () {
3113
- this._areaStart = { x: 0, y: 0 };
3114
- this._areaEnd = { x: 0, y: 0 };
3115
- this._calcSelectedArea();
3116
- };
3117
- Helper.prototype.calcSelectedElements = function (data) {
3118
- var transform = this._ctx.getTransform();
3119
- var _a = transform.scale, scale = _a === void 0 ? 1 : _a, _b = transform.scrollX, scrollX = _b === void 0 ? 0 : _b, _c = transform.scrollY, scrollY = _c === void 0 ? 0 : _c;
3120
- var start = this._areaStart;
3121
- var end = this._areaEnd;
3122
- var x = (Math.min(start.x, end.x) - scrollX) / scale;
3123
- var y = (Math.min(start.y, end.y) - scrollY) / scale;
3124
- var w = Math.abs(end.x - start.x) / scale;
3125
- var h = Math.abs(end.y - start.y) / scale;
3126
- var uuids = [];
3127
- var ctx = this._ctx;
3128
- ctx.beginPath();
3129
- ctx.moveTo(x, y);
3130
- ctx.lineTo(x + w, y);
3131
- ctx.lineTo(x + w, y + h);
3132
- ctx.lineTo(x, y + h);
3133
- ctx.lineTo(x, y);
3134
- ctx.closePath();
3135
- data.elements.forEach(function (elem) {
3136
- var _a;
3137
- if (((_a = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _a === void 0 ? void 0 : _a.invisible) !== true) {
3138
- var centerX = elem.x + elem.w / 2;
3139
- var centerY = elem.y + elem.h / 2;
3140
- if (ctx.isPointInPathWithoutScroll(centerX, centerY)) {
3141
- uuids.push(elem.uuid);
3142
- }
3143
- }
3144
- });
3145
- return uuids;
3146
- };
3147
- Helper.prototype._calcSelectedArea = function () {
3148
- var start = this._areaStart;
3149
- var end = this._areaEnd;
3150
- var transform = this._ctx.getTransform();
3151
- var _a = transform.scale, scale = _a === void 0 ? 1 : _a, _b = transform.scrollX, scrollX = _b === void 0 ? 0 : _b, _c = transform.scrollY, scrollY = _c === void 0 ? 0 : _c;
3152
- var elemWrapper = this._coreConfig.elementWrapper;
3153
- var lineWidth = elemWrapper.lineWidth / scale;
3154
- var lineDash = elemWrapper.lineDash.map(function (n) { return (n / scale); });
3155
- this._helperConfig.selectedAreaWrapper = {
3156
- x: (Math.min(start.x, end.x) - scrollX) / scale,
3157
- y: (Math.min(start.y, end.y) - scrollY) / scale,
3158
- w: Math.abs(end.x - start.x) / scale,
3159
- h: Math.abs(end.y - start.y) / scale,
3160
- startPoint: { x: start.x, y: start.y },
3161
- endPoint: { x: end.x, y: end.y },
3162
- lineWidth: lineWidth,
3163
- lineDash: lineDash,
3164
- color: elemWrapper.color,
3165
- };
3166
- };
3167
- Helper.prototype._updateElementIndex = function (data) {
3168
- var _this = this;
3169
- this._helperConfig.elementIndexMap = {};
3170
- data.elements.forEach(function (elem, i) {
3171
- _this._helperConfig.elementIndexMap[elem.uuid] = i;
3172
- });
3173
- };
3174
- Helper.prototype._updateSelectedElementWrapper = function (data, opts) {
3175
- var _a;
3176
- var uuid = opts.selectedUUID;
3177
- if (!(typeof uuid === 'string' && this._helperConfig.elementIndexMap[uuid] >= 0)) {
3178
- delete this._helperConfig.selectedElementWrapper;
3179
- return;
3180
- }
3181
- var index = this._helperConfig.elementIndexMap[uuid];
3182
- var elem = data.elements[index];
3183
- if (((_a = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _a === void 0 ? void 0 : _a.invisible) === true) {
3184
- return;
3185
- }
3186
- var wrapper = this._createSelectedElementWrapper(elem, opts);
3187
- this._helperConfig.selectedElementWrapper = wrapper;
3188
- };
3189
- Helper.prototype._updateSelectedElementListWrapper = function (data, opts) {
3190
- var _this = this;
3191
- var selectedUUIDList = opts.selectedUUIDList;
3192
- var wrapperList = [];
3193
- data.elements.forEach(function (elem, i) {
3194
- if (selectedUUIDList === null || selectedUUIDList === void 0 ? void 0 : selectedUUIDList.includes(elem.uuid)) {
3195
- var wrapper = _this._createSelectedElementWrapper(elem, opts);
3196
- wrapperList.push(wrapper);
3197
- }
3198
- });
3199
- this._helperConfig.selectedElementListWrappers = wrapperList;
3200
- };
3201
- Helper.prototype._createSelectedElementWrapper = function (elem, opts) {
3202
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
3203
- var scale = opts.scale;
3204
- var elemWrapper = this._coreConfig.elementWrapper;
3205
- var controllerSize = elemWrapper.controllerSize / scale;
3206
- var lineWidth = elemWrapper.lineWidth / scale;
3207
- var lineDash = elemWrapper.lineDash.map(function (n) { return (n / scale); });
3208
- var rotateLimit = 12;
3209
- var bw = ((_a = elem.desc) === null || _a === void 0 ? void 0 : _a.borderWidth) || 0;
3210
- var hideObliqueDirection = false;
3211
- if (typeof elem.angle === 'number' && Math.abs(elem.angle) > limitQbliqueAngle) {
3212
- hideObliqueDirection = true;
3213
- }
3214
- var wrapper = {
3215
- uuid: elem.uuid,
3216
- controllerSize: controllerSize,
3217
- lock: ((_b = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _b === void 0 ? void 0 : _b.lock) === true,
3218
- controllers: {
3219
- topLeft: {
3220
- x: elem.x - controllerSize - bw,
3221
- y: elem.y - controllerSize - bw,
3222
- invisible: hideObliqueDirection || ((_c = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _c === void 0 ? void 0 : _c.disbaleScale) === true,
3223
- },
3224
- top: {
3225
- x: elem.x + elem.w / 2,
3226
- y: elem.y - controllerSize - bw,
3227
- invisible: ((_d = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _d === void 0 ? void 0 : _d.disbaleScale) === true,
3228
- },
3229
- topRight: {
3230
- x: elem.x + elem.w + controllerSize + bw,
3231
- y: elem.y - controllerSize - bw,
3232
- invisible: hideObliqueDirection || ((_e = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _e === void 0 ? void 0 : _e.disbaleScale) === true,
3233
- },
3234
- right: {
3235
- x: elem.x + elem.w + controllerSize + bw,
3236
- y: elem.y + elem.h / 2,
3237
- invisible: ((_f = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _f === void 0 ? void 0 : _f.disbaleScale) === true
3238
- },
3239
- bottomRight: {
3240
- x: elem.x + elem.w + controllerSize + bw,
3241
- y: elem.y + elem.h + controllerSize + bw,
3242
- invisible: hideObliqueDirection || ((_g = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _g === void 0 ? void 0 : _g.disbaleScale) === true,
3243
- },
3244
- bottom: {
3245
- x: elem.x + elem.w / 2,
3246
- y: elem.y + elem.h + controllerSize + bw,
3247
- invisible: ((_h = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _h === void 0 ? void 0 : _h.disbaleScale) === true,
3248
- },
3249
- bottomLeft: {
3250
- x: elem.x - controllerSize - bw,
3251
- y: elem.y + elem.h + controllerSize + bw,
3252
- invisible: hideObliqueDirection || ((_j = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _j === void 0 ? void 0 : _j.disbaleScale) === true,
3253
- },
3254
- left: {
3255
- x: elem.x - controllerSize - bw,
3256
- y: elem.y + elem.h / 2,
3257
- invisible: ((_k = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _k === void 0 ? void 0 : _k.disbaleScale) === true
3258
- },
3259
- rotate: {
3260
- x: elem.x + elem.w / 2,
3261
- y: elem.y - controllerSize - (controllerSize * 2 + rotateLimit) - bw,
3262
- invisible: ((_l = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _l === void 0 ? void 0 : _l.disbaleRotate) === true
3263
- }
3264
- },
3265
- lineWidth: lineWidth,
3266
- lineDash: lineDash,
3267
- color: ((_m = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _m === void 0 ? void 0 : _m.lock) === true ? elemWrapper.lockColor : elemWrapper.color,
3268
- };
3269
- if (typeof elem.angle === 'number' && (elem.angle > 0 || elem.angle < 0)) {
3270
- wrapper.radian = parseAngleToRadian(elem.angle);
3271
- wrapper.translate = calcElementCenter(elem);
3272
- }
3273
- return wrapper;
3274
- };
3275
- return Helper;
3276
- }());
3277
-
3278
- var LoaderEvent = (function () {
3279
- function LoaderEvent() {
3280
- this._listeners = new Map();
3281
- }
3282
- LoaderEvent.prototype.on = function (eventKey, callback) {
3283
- if (this._listeners.has(eventKey)) {
3284
- var callbacks = this._listeners.get(eventKey);
3285
- callbacks === null || callbacks === void 0 ? void 0 : callbacks.push(callback);
3286
- this._listeners.set(eventKey, callbacks || []);
3287
- }
3288
- else {
3289
- this._listeners.set(eventKey, [callback]);
3290
- }
3291
- };
3292
- LoaderEvent.prototype.off = function (eventKey, callback) {
3293
- if (this._listeners.has(eventKey)) {
3294
- var callbacks = this._listeners.get(eventKey);
3295
- if (Array.isArray(callbacks)) {
3296
- for (var i = 0; i < (callbacks === null || callbacks === void 0 ? void 0 : callbacks.length); i++) {
3297
- if (callbacks[i] === callback) {
3298
- callbacks.splice(i, 1);
3299
- break;
3300
- }
3301
- }
3302
- }
3303
- this._listeners.set(eventKey, callbacks || []);
3304
- }
3305
- };
3306
- LoaderEvent.prototype.trigger = function (eventKey, arg) {
3307
- var callbacks = this._listeners.get(eventKey);
3308
- if (Array.isArray(callbacks)) {
3309
- callbacks.forEach(function (cb) {
3310
- cb(arg);
3311
- });
3312
- return true;
3313
- }
3314
- else {
3315
- return false;
3316
- }
3317
- };
3318
- LoaderEvent.prototype.has = function (name) {
3319
- if (this._listeners.has(name)) {
3320
- var list = this._listeners.get(name);
3321
- if (Array.isArray(list) && list.length > 0) {
3322
- return true;
3323
- }
3324
- }
3325
- return false;
3326
- };
3327
- return LoaderEvent;
3328
- }());
3329
-
3330
- function filterScript(html) {
3331
- return html.replace(/<script[\s\S]*?<\/script>/ig, '');
3332
- }
3333
-
3334
- var _a = index.loader, loadImage = _a.loadImage, loadSVG = _a.loadSVG, loadHTML = _a.loadHTML;
3335
- var LoaderStatus;
3336
- (function (LoaderStatus) {
3337
- LoaderStatus["FREE"] = "free";
3338
- LoaderStatus["LOADING"] = "loading";
3339
- LoaderStatus["COMPLETE"] = "complete";
3340
- })(LoaderStatus || (LoaderStatus = {}));
3341
- var Loader = (function () {
3342
- function Loader(opts) {
3343
- this._currentLoadData = {};
3344
- this._currentUUIDQueue = [];
3345
- this._storageLoadData = {};
3346
- this._status = LoaderStatus.FREE;
3347
- this._waitingLoadQueue = [];
3348
- this._opts = opts;
3349
- this._event = new LoaderEvent();
3350
- this._waitingLoadQueue = [];
3351
- }
3352
- Loader.prototype.load = function (data, changeResourceUUIDs) {
3353
- var _a = this._resetLoadData(data, changeResourceUUIDs), uuidQueue = _a[0], loadData = _a[1];
3354
- if (this._status === LoaderStatus.FREE || this._status === LoaderStatus.COMPLETE) {
3355
- this._currentUUIDQueue = uuidQueue;
3356
- this._currentLoadData = loadData;
3357
- this._loadTask();
3358
- }
3359
- else if (this._status === LoaderStatus.LOADING && uuidQueue.length > 0) {
3360
- this._waitingLoadQueue.push({
3361
- uuidQueue: uuidQueue,
3362
- loadData: loadData,
3363
- });
3364
- }
3365
- };
3366
- Loader.prototype.on = function (name, callback) {
3367
- this._event.on(name, callback);
3368
- };
3369
- Loader.prototype.off = function (name, callback) {
3370
- this._event.off(name, callback);
3371
- };
3372
- Loader.prototype.isComplete = function () {
3373
- return this._status === LoaderStatus.COMPLETE;
3374
- };
3375
- Loader.prototype.getContent = function (uuid) {
3376
- var _a;
3377
- if (((_a = this._storageLoadData[uuid]) === null || _a === void 0 ? void 0 : _a.status) === 'loaded') {
3378
- return this._storageLoadData[uuid].content;
3379
- }
3380
- return null;
3381
- };
3382
- Loader.prototype._resetLoadData = function (data, changeResourceUUIDs) {
3383
- var loadData = {};
3384
- var uuidQueue = [];
3385
- var storageLoadData = this._storageLoadData;
3386
- for (var i = data.elements.length - 1; i >= 0; i--) {
3387
- var elem = data.elements[i];
3388
- if (['image', 'svg', 'html',].includes(elem.type)) {
3389
- if (!storageLoadData[elem.uuid]) {
3390
- loadData[elem.uuid] = this._createEmptyLoadItem(elem);
3391
- uuidQueue.push(elem.uuid);
3392
- }
3393
- else {
3394
- if (changeResourceUUIDs.includes(elem.uuid)) {
3395
- loadData[elem.uuid] = this._createEmptyLoadItem(elem);
3396
- uuidQueue.push(elem.uuid);
3397
- }
3398
- }
3399
- }
3400
- }
3401
- return [uuidQueue, loadData];
3402
- };
3403
- Loader.prototype._createEmptyLoadItem = function (elem) {
3404
- var source = '';
3405
- var type = elem.type;
3406
- var elemW = elem.w;
3407
- var elemH = elem.h;
3408
- if (elem.type === 'image') {
3409
- var _elem = elem;
3410
- source = _elem.desc.src || '';
3411
- }
3412
- else if (elem.type === 'svg') {
3413
- var _elem = elem;
3414
- source = _elem.desc.svg || '';
3415
- }
3416
- else if (elem.type === 'html') {
3417
- var _elem = elem;
3418
- source = filterScript(_elem.desc.html || '');
3419
- elemW = _elem.desc.width || elem.w;
3420
- elemH = _elem.desc.height || elem.h;
3421
- }
3422
- return {
3423
- type: type,
3424
- status: 'null',
3425
- content: null,
3426
- source: source,
3427
- elemW: elemW,
3428
- elemH: elemH,
3429
- };
3430
- };
3431
- Loader.prototype._loadTask = function () {
3432
- var _this = this;
3433
- if (this._status === LoaderStatus.LOADING) {
3434
- return;
3435
- }
3436
- this._status = LoaderStatus.LOADING;
3437
- if (this._currentUUIDQueue.length === 0) {
3438
- if (this._waitingLoadQueue.length === 0) {
3439
- this._status = LoaderStatus.COMPLETE;
3440
- this._event.trigger('complete', undefined);
3441
- return;
3442
- }
3443
- else {
3444
- var waitingItem = this._waitingLoadQueue.shift();
3445
- if (waitingItem) {
3446
- var uuidQueue = waitingItem.uuidQueue, loadData = waitingItem.loadData;
3447
- this._currentLoadData = loadData;
3448
- this._currentUUIDQueue = uuidQueue;
3449
- }
3450
- }
3451
- }
3452
- var maxParallelNum = this._opts.maxParallelNum;
3453
- var uuids = this._currentUUIDQueue.splice(0, maxParallelNum);
3454
- var uuidMap = {};
3455
- uuids.forEach(function (url, i) {
3456
- uuidMap[url] = i;
3457
- });
3458
- var loadUUIDList = [];
3459
- var _loadAction = function () {
3460
- if (loadUUIDList.length >= maxParallelNum) {
3461
- return false;
3462
- }
3463
- if (uuids.length === 0) {
3464
- return true;
3465
- }
3466
- var _loop_1 = function (i) {
3467
- var uuid = uuids.shift();
3468
- if (uuid === undefined) {
3469
- return "break";
3470
- }
3471
- loadUUIDList.push(uuid);
3472
- _this._loadElementSource(_this._currentLoadData[uuid]).then(function (image) {
3473
- loadUUIDList.splice(loadUUIDList.indexOf(uuid), 1);
3474
- var status = _loadAction();
3475
- _this._storageLoadData[uuid] = {
3476
- type: _this._currentLoadData[uuid].type,
3477
- status: 'loaded',
3478
- content: image,
3479
- source: _this._currentLoadData[uuid].source,
3480
- elemW: _this._currentLoadData[uuid].elemW,
3481
- elemH: _this._currentLoadData[uuid].elemH,
3482
- };
3483
- if (loadUUIDList.length === 0 && uuids.length === 0 && status === true) {
3484
- _this._status = LoaderStatus.FREE;
3485
- _this._loadTask();
3486
- }
3487
- _this._event.trigger('load', {
3488
- type: _this._storageLoadData[uuid].type,
3489
- status: _this._storageLoadData[uuid].status,
3490
- content: _this._storageLoadData[uuid].content,
3491
- source: _this._storageLoadData[uuid].source,
3492
- elemW: _this._storageLoadData[uuid].elemW,
3493
- elemH: _this._storageLoadData[uuid].elemH,
3494
- });
3495
- }).catch(function (err) {
3496
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
3497
- console.warn(err);
3498
- loadUUIDList.splice(loadUUIDList.indexOf(uuid), 1);
3499
- var status = _loadAction();
3500
- if (_this._currentLoadData[uuid]) {
3501
- _this._storageLoadData[uuid] = {
3502
- type: (_a = _this._currentLoadData[uuid]) === null || _a === void 0 ? void 0 : _a.type,
3503
- status: 'fail',
3504
- content: null,
3505
- error: err,
3506
- source: (_b = _this._currentLoadData[uuid]) === null || _b === void 0 ? void 0 : _b.source,
3507
- elemW: (_c = _this._currentLoadData[uuid]) === null || _c === void 0 ? void 0 : _c.elemW,
3508
- elemH: (_d = _this._currentLoadData[uuid]) === null || _d === void 0 ? void 0 : _d.elemH,
3509
- };
3510
- }
3511
- if (loadUUIDList.length === 0 && uuids.length === 0 && status === true) {
3512
- _this._status = LoaderStatus.FREE;
3513
- _this._loadTask();
3514
- }
3515
- if (_this._currentLoadData[uuid]) {
3516
- _this._event.trigger('error', {
3517
- type: (_e = _this._storageLoadData[uuid]) === null || _e === void 0 ? void 0 : _e.type,
3518
- status: (_f = _this._storageLoadData[uuid]) === null || _f === void 0 ? void 0 : _f.status,
3519
- content: (_g = _this._storageLoadData[uuid]) === null || _g === void 0 ? void 0 : _g.content,
3520
- source: (_h = _this._storageLoadData[uuid]) === null || _h === void 0 ? void 0 : _h.source,
3521
- elemW: (_j = _this._storageLoadData[uuid]) === null || _j === void 0 ? void 0 : _j.elemW,
3522
- elemH: (_k = _this._storageLoadData[uuid]) === null || _k === void 0 ? void 0 : _k.elemH,
3523
- });
3524
- }
3525
- });
3526
- };
3527
- for (var i = loadUUIDList.length; i < maxParallelNum; i++) {
3528
- var state_1 = _loop_1();
3529
- if (state_1 === "break")
3530
- break;
3531
- }
3532
- return false;
3533
- };
3534
- _loadAction();
3535
- };
3536
- Loader.prototype._loadElementSource = function (params) {
3537
- return __awaiter$2(this, void 0, void 0, function () {
3538
- var image, image, image;
3539
- return __generator$2(this, function (_a) {
3540
- switch (_a.label) {
3541
- case 0:
3542
- if (!(params && params.type === 'image')) return [3, 2];
3543
- return [4, loadImage(params.source)];
3544
- case 1:
3545
- image = _a.sent();
3546
- return [2, image];
3547
- case 2:
3548
- if (!(params && params.type === 'svg')) return [3, 4];
3549
- return [4, loadSVG(params.source)];
3550
- case 3:
3551
- image = _a.sent();
3552
- return [2, image];
3553
- case 4:
3554
- if (!(params && params.type === 'html')) return [3, 6];
3555
- return [4, loadHTML(params.source, {
3556
- width: params.elemW, height: params.elemH
3557
- })];
3558
- case 5:
3559
- image = _a.sent();
3560
- return [2, image];
3561
- case 6: throw Error('Element\'s source is not support!');
3562
- }
3563
- });
3564
- });
3565
- };
3566
- return Loader;
3567
- }());
3568
-
3569
- var _board$1 = Symbol('_displayCtx');
3570
- var _helper$1 = Symbol('_helper');
3571
- var _element$1 = Symbol('_element');
3572
- var _opts$1 = Symbol('_opts');
3573
- var Mapper = (function () {
3574
- function Mapper(opts) {
3575
- this[_opts$1] = opts;
3576
- this[_board$1] = this[_opts$1].board;
3577
- this[_element$1] = this[_opts$1].element;
3578
- this[_helper$1] = this[_opts$1].helper;
3579
- }
3580
- Mapper.prototype.isEffectivePoint = function (p) {
3581
- var scrollLineWidth = this[_board$1].getScrollLineWidth();
3582
- var screenInfo = this[_board$1].getScreenInfo();
3583
- if (p.x <= (screenInfo.width - scrollLineWidth) && p.y <= (screenInfo.height - scrollLineWidth)) {
3584
- return true;
3585
- }
3586
- return false;
3587
- };
3588
- Mapper.prototype.judgePointCursor = function (p, data) {
3589
- var cursor = 'auto';
3590
- var elementUUID = null;
3591
- if (!this.isEffectivePoint(p)) {
3592
- return { cursor: cursor, elementUUID: elementUUID };
3593
- }
3594
- var _a = this[_helper$1].isPointInElementWrapperController(p, data), uuid = _a.uuid, hoverControllerDirection = _a.hoverControllerDirection;
3595
- var direction = hoverControllerDirection;
3596
- if (uuid && direction) {
3597
- switch (direction) {
3598
- case 'top-right': {
3599
- cursor = 'ne-resize';
3600
- break;
3601
- }
3602
- case 'top-left': {
3603
- cursor = 'nw-resize';
3604
- break;
3605
- }
3606
- case 'top': {
3607
- cursor = 'n-resize';
3608
- break;
3609
- }
3610
- case 'right': {
3611
- cursor = 'e-resize';
3612
- break;
3613
- }
3614
- case 'bottom-right': {
3615
- cursor = 'se-resize';
3616
- break;
3617
- }
3618
- case 'bottom': {
3619
- cursor = 's-resize';
3620
- break;
3621
- }
3622
- case 'bottom-left': {
3623
- cursor = 'sw-resize';
3624
- break;
3625
- }
3626
- case 'left': {
3627
- cursor = 'w-resize';
3628
- break;
3629
- }
3630
- case 'rotate': {
3631
- cursor = 'grab';
3632
- break;
3633
- }
3634
- }
3635
- if (uuid) {
3636
- elementUUID = uuid;
3637
- }
3638
- }
3639
- else {
3640
- var _b = this[_element$1].isPointInElement(p, data), index = _b[0], uuid_1 = _b[1];
3641
- if (index >= 0) {
3642
- cursor = 'move';
3643
- }
3644
- if (uuid_1) {
3645
- elementUUID = uuid_1;
3646
- }
3647
- }
3648
- return {
3649
- cursor: cursor,
3650
- elementUUID: elementUUID,
3651
- };
3652
- };
3653
- return Mapper;
3654
- }());
3655
-
3656
- function parseData(data) {
3657
- var result = {
3658
- elements: [],
3659
- };
3660
- if (Array.isArray(data === null || data === void 0 ? void 0 : data.elements)) {
3661
- data === null || data === void 0 ? void 0 : data.elements.forEach(function (elem) {
3662
- if (elem === void 0) { elem = {}; }
3663
- if (isElement(elem)) {
3664
- result.elements.push(elem);
3665
- }
3666
- });
3667
- }
3668
- if (typeof data.bgColor === 'string') {
3669
- result.bgColor = data.bgColor;
3670
- }
3671
- return result;
3672
- }
3673
- function isElement(elem) {
3674
- if (!(isNumber(elem.x) && isNumber(elem.y) && isNumber(elem.w) && isNumber(elem.h))) {
3675
- return false;
3676
- }
3677
- if (!(typeof elem.type === 'string' && elementNames.includes(elem.type))) {
3678
- return false;
3679
- }
3680
- return true;
3681
- }
3682
- function isNumber(num) {
3683
- return (num >= 0 || num < 0);
3684
- }
3685
-
3686
- var RendererEvent = (function () {
3687
- function RendererEvent() {
3688
- this._listeners = new Map();
3689
- }
3690
- RendererEvent.prototype.on = function (eventKey, callback) {
3691
- if (this._listeners.has(eventKey)) {
3692
- var callbacks = this._listeners.get(eventKey);
3693
- callbacks === null || callbacks === void 0 ? void 0 : callbacks.push(callback);
3694
- this._listeners.set(eventKey, callbacks || []);
3695
- }
3696
- else {
3697
- this._listeners.set(eventKey, [callback]);
3698
- }
3699
- };
3700
- RendererEvent.prototype.off = function (eventKey, callback) {
3701
- if (this._listeners.has(eventKey)) {
3702
- var callbacks = this._listeners.get(eventKey);
3703
- if (Array.isArray(callbacks)) {
3704
- for (var i = 0; i < (callbacks === null || callbacks === void 0 ? void 0 : callbacks.length); i++) {
3705
- if (callbacks[i] === callback) {
3706
- callbacks.splice(i, 1);
3707
- break;
3708
- }
3709
- }
3710
- }
3711
- this._listeners.set(eventKey, callbacks || []);
3712
- }
3713
- };
3714
- RendererEvent.prototype.trigger = function (eventKey, arg) {
3715
- var callbacks = this._listeners.get(eventKey);
3716
- if (Array.isArray(callbacks)) {
3717
- callbacks.forEach(function (cb) {
3718
- cb(arg);
3719
- });
3720
- return true;
3721
- }
3722
- else {
3723
- return false;
3724
- }
3725
- };
3726
- RendererEvent.prototype.has = function (name) {
3727
- if (this._listeners.has(name)) {
3728
- var list = this._listeners.get(name);
3729
- if (Array.isArray(list) && list.length > 0) {
3730
- return true;
3731
- }
3732
- }
3733
- return false;
3734
- };
3735
- return RendererEvent;
3736
- }());
3737
-
3738
- var requestAnimationFrame = window.requestAnimationFrame;
3739
- var deepClone$3 = index.data.deepClone;
3740
- var DrawStatus;
3741
- (function (DrawStatus) {
3742
- DrawStatus["NULL"] = "null";
3743
- DrawStatus["FREE"] = "free";
3744
- DrawStatus["DRAWING"] = "drawing";
3745
- DrawStatus["FREEZE"] = "freeze";
3746
- })(DrawStatus || (DrawStatus = {}));
3747
- var Renderer = (function (_super) {
3748
- __extends(Renderer, _super);
3749
- function Renderer(board) {
3750
- var _this = _super.call(this) || this;
3751
- _this._queue = [];
3752
- _this._status = DrawStatus.NULL;
3753
- _this._board = board;
3754
- _this._loader = new Loader({
3755
- board: board,
3756
- maxParallelNum: 6
3757
- });
3758
- _this._loader.on('load', function (res) {
3759
- _this._drawFrame();
3760
- });
3761
- _this._loader.on('error', function (res) {
3762
- console.log('Loader Error: ', res);
3763
- });
3764
- _this._loader.on('complete', function (res) {
3765
- });
3766
- return _this;
3767
- }
3768
- Renderer.prototype.freeze = function () {
3769
- this._status = DrawStatus.FREEZE;
3770
- };
3771
- Renderer.prototype.thaw = function () {
3772
- this._status = DrawStatus.FREE;
3773
- };
3774
- Renderer.prototype.render = function (data, helper, changeResourceUUIDs) {
3775
- if ([DrawStatus.FREEZE].includes(this._status)) {
3776
- return;
3777
- }
3778
- var _data = deepClone$3({ data: data, helper: helper });
3779
- this._queue.push(_data);
3780
- if (this._status !== DrawStatus.DRAWING) {
3781
- this._status = DrawStatus.DRAWING;
3782
- this._drawFrame();
3783
- }
3784
- this._loader.load(data, changeResourceUUIDs);
3785
- };
3786
- Renderer.prototype._drawFrame = function () {
3787
- var _this = this;
3788
- if (this._status === DrawStatus.FREEZE) {
3789
- return;
3790
- }
3791
- requestAnimationFrame(function () {
3792
- if (_this._status === DrawStatus.FREEZE) {
3793
- return;
3794
- }
3795
- var ctx = _this._board.getContext();
3796
- var item = _this._queue[0];
3797
- var isLastFrame = false;
3798
- if (_this._queue.length > 1) {
3799
- item = _this._queue.shift();
3800
- }
3801
- else {
3802
- isLastFrame = true;
3803
- }
3804
- if (_this._loader.isComplete() !== true) {
3805
- _this._drawFrame();
3806
- if (item) {
3807
- drawContext(ctx, item.data, item.helper, _this._loader);
3808
- _this._board.draw();
3809
- }
3810
- }
3811
- else if (item) {
3812
- drawContext(ctx, item.data, item.helper, _this._loader);
3813
- _this._board.draw();
3814
- _this._retainQueueOneItem();
3815
- if (!isLastFrame) {
3816
- _this._drawFrame();
3817
- }
3818
- else {
3819
- _this._status = DrawStatus.FREE;
3820
- }
3821
- }
3822
- else {
3823
- _this._status = DrawStatus.FREE;
3824
- }
3825
- _this.trigger('drawFrame', undefined);
3826
- if (_this._loader.isComplete() === true && _this._queue.length === 1 && _this._status === DrawStatus.FREE) {
3827
- _this.trigger('drawFrameComplete', undefined);
3828
- _this.freeze();
3829
- }
3830
- });
3831
- };
3832
- Renderer.prototype._retainQueueOneItem = function () {
3833
- if (this._queue.length <= 1) {
3834
- return;
3835
- }
3836
- var lastOne = deepClone$3(this._queue[this._queue.length - 1]);
3837
- this._queue = [lastOne];
3838
- };
3839
- return Renderer;
3840
- }(RendererEvent));
3841
-
3842
- var Mode;
3843
- (function (Mode) {
3844
- Mode["NULL"] = "null";
3845
- Mode["SELECT_ELEMENT"] = "select-element";
3846
- Mode["SELECT_ELEMENT_LIST"] = "select-element-list";
3847
- Mode["SELECT_ELEMENT_WRAPPER_CONTROLLER"] = "select-element-wrapper-controller";
3848
- Mode["SELECT_AREA"] = "select-area";
3849
- })(Mode || (Mode = {}));
3850
- var CursorStatus;
3851
- (function (CursorStatus) {
3852
- CursorStatus["DRAGGING"] = "dragging";
3853
- CursorStatus["NULL"] = "null";
3854
- })(CursorStatus || (CursorStatus = {}));
3855
-
3856
- function createData() {
3857
- return {
3858
- onlyRender: false,
3859
- hasInited: false,
3860
- mode: Mode.NULL,
3861
- cursorStatus: CursorStatus.NULL,
3862
- selectedUUID: null,
3863
- selectedUUIDList: [],
3864
- hoverUUID: null,
3865
- selectedControllerDirection: null,
3866
- hoverControllerDirection: null,
3867
- prevPoint: null,
3868
- };
3869
- }
3870
- var TempData = (function () {
3871
- function TempData() {
3872
- this._temp = createData();
3873
- }
3874
- TempData.prototype.set = function (name, value) {
3875
- this._temp[name] = value;
3876
- };
3877
- TempData.prototype.get = function (name) {
3878
- return this._temp[name];
3879
- };
3880
- TempData.prototype.clear = function () {
3881
- this._temp = createData();
3882
- };
3883
- return TempData;
3884
- }());
3885
-
3886
- var _board = Symbol('_board');
3887
- var _data = Symbol('_data');
3888
- var _opts = Symbol('_opts');
3889
- var _config = Symbol('_config');
3890
- var _renderer = Symbol('_renderer');
3891
- var _element = Symbol('_element');
3892
- var _helper = Symbol('_helper');
3893
- var _tempData = Symbol('_tempData');
3894
- var _draw = Symbol('_draw');
3895
- var _coreEvent = Symbol('_coreEvent');
3896
- var _mapper = Symbol('_mapper');
3897
- var _emitChangeScreen = Symbol('_emitChangeScreen');
3898
- var _emitChangeData = Symbol('_emitChangeData');
3899
- var _todo = Symbol('_todo');
3900
-
3901
- var deepClone$2 = index.data.deepClone;
3902
- var createUUID = index.uuid.createUUID;
3903
- function getSelectedElements(core) {
3904
- var elems = [];
3905
- var list = [];
3906
- var uuid = core[_tempData].get('selectedUUID');
3907
- if (typeof uuid === 'string' && uuid) {
3908
- list.push(uuid);
3909
- }
3910
- else {
3911
- list = core[_tempData].get('selectedUUIDList');
3912
- }
3913
- list.forEach(function (uuid) {
3914
- var _a;
3915
- var index = core[_helper].getElementIndexByUUID(uuid);
3916
- if (index !== null && index >= 0) {
3917
- var elem = (_a = core[_data]) === null || _a === void 0 ? void 0 : _a.elements[index];
3918
- if (elem)
3919
- elems.push(elem);
3920
- }
3921
- });
3922
- return deepClone$2(elems);
3923
- }
3924
- function getElement(core, uuid) {
3925
- var elem = null;
3926
- var index = core[_helper].getElementIndexByUUID(uuid);
3927
- if (index !== null && core[_data].elements[index]) {
3928
- elem = deepClone$2(core[_data].elements[index]);
3929
- }
3930
- return elem;
3931
- }
3932
- function getElementByIndex(core, index) {
3933
- var elem = null;
3934
- if (index >= 0 && core[_data].elements[index]) {
3935
- elem = deepClone$2(core[_data].elements[index]);
3936
- }
3937
- return elem;
3938
- }
3939
- function updateElement(core, elem) {
3940
- var _a;
3941
- var _elem = deepClone$2(elem);
3942
- var data = core[_data];
3943
- var resourceChangeUUIDs = [];
3944
- for (var i = 0; i < data.elements.length; i++) {
3945
- if (_elem.uuid === ((_a = data.elements[i]) === null || _a === void 0 ? void 0 : _a.uuid)) {
3946
- var result = diffElementResourceChange(data.elements[i], _elem);
3947
- if (typeof result === 'string') {
3948
- resourceChangeUUIDs.push(result);
3949
- }
3950
- data.elements[i] = _elem;
3951
- break;
3952
- }
3953
- }
3954
- core[_emitChangeData]();
3955
- core[_draw]({ resourceChangeUUIDs: resourceChangeUUIDs });
3956
- }
3957
- function selectElementByIndex(core, index, opts) {
3958
- if (core[_tempData].get('onlyRender') === true)
3959
- return;
3960
- if (core[_data].elements[index]) {
3961
- var uuid = core[_data].elements[index].uuid;
3962
- if ((opts === null || opts === void 0 ? void 0 : opts.useMode) === true) {
3963
- core[_tempData].set('mode', Mode.SELECT_ELEMENT);
3964
- }
3965
- else {
3966
- core[_tempData].set('mode', Mode.NULL);
3967
- }
3968
- if (typeof uuid === 'string') {
3969
- core[_tempData].set('selectedUUID', uuid);
3970
- core[_tempData].set('selectedUUIDList', []);
3971
- }
3972
- core[_draw]();
3973
- }
3974
- }
3975
- function selectElement(core, uuid, opts) {
3976
- if (core[_tempData].get('onlyRender') === true)
3977
- return;
3978
- var index = core[_helper].getElementIndexByUUID(uuid);
3979
- if (typeof index === 'number' && index >= 0) {
3980
- core.selectElementByIndex(index, opts);
3981
- }
3982
- }
3983
- function moveUpElement(core, uuid) {
3984
- var index = core[_helper].getElementIndexByUUID(uuid);
3985
- if (typeof index === 'number' && index >= 0 && index < core[_data].elements.length - 1) {
3986
- var temp = core[_data].elements[index];
3987
- core[_data].elements[index] = core[_data].elements[index + 1];
3988
- core[_data].elements[index + 1] = temp;
3989
- }
3990
- core[_emitChangeData]();
3991
- core[_draw]();
3992
- }
3993
- function moveDownElement(core, uuid) {
3994
- var index = core[_helper].getElementIndexByUUID(uuid);
3995
- if (typeof index === 'number' && index > 0 && index < core[_data].elements.length) {
3996
- var temp = core[_data].elements[index];
3997
- core[_data].elements[index] = core[_data].elements[index - 1];
3998
- core[_data].elements[index - 1] = temp;
3999
- }
4000
- core[_emitChangeData]();
4001
- core[_draw]();
4002
- }
4003
- function addElement(core, elem) {
4004
- var _elem = deepClone$2(elem);
4005
- _elem.uuid = createUUID();
4006
- core[_data].elements.push(_elem);
4007
- core[_emitChangeData]();
4008
- core[_draw]();
4009
- return _elem.uuid;
4010
- }
4011
- function deleteElement(core, uuid) {
4012
- var index = core[_element].getElementIndex(core[_data], uuid);
4013
- if (index >= 0) {
4014
- core[_data].elements.splice(index, 1);
4015
- core[_emitChangeData]();
4016
- core[_draw]();
4017
- }
4018
- }
4019
- function insertElementBefore(core, elem, beforeUUID) {
4020
- var index = core[_helper].getElementIndexByUUID(beforeUUID);
4021
- if (index !== null) {
4022
- return core.insertElementBeforeIndex(elem, index);
4023
- }
4024
- return null;
4025
- }
4026
- function insertElementBeforeIndex(core, elem, index) {
4027
- var _elem = deepClone$2(elem);
4028
- _elem.uuid = createUUID();
4029
- if (index >= 0) {
4030
- core[_data].elements.splice(index, 0, _elem);
4031
- core[_emitChangeData]();
4032
- core[_draw]();
4033
- return _elem.uuid;
4034
- }
4035
- return null;
4036
- }
4037
- function insertElementAfter(core, elem, beforeUUID) {
4038
- var index = core[_helper].getElementIndexByUUID(beforeUUID);
4039
- if (index !== null) {
4040
- return core.insertElementAfterIndex(elem, index);
4041
- }
4042
- return null;
4043
- }
4044
- function insertElementAfterIndex(core, elem, index) {
4045
- var _elem = deepClone$2(elem);
4046
- _elem.uuid = createUUID();
4047
- if (index >= 0) {
4048
- core[_data].elements.splice(index + 1, 0, _elem);
4049
- core[_emitChangeData]();
4050
- core[_draw]();
4051
- return _elem.uuid;
4052
- }
4053
- return null;
4054
- }
4055
-
4056
- var time = index.time;
4057
- var deepClone$1 = index.data.deepClone;
4058
- function initEvent(core) {
4059
- if (core[_tempData].get('hasInited') === true) {
4060
- return;
4061
- }
4062
- core[_board].on('hover', time.throttle(handleHover(core), 32));
4063
- core[_board].on('leave', time.throttle(handleLeave(core), 32));
4064
- core[_board].on('point', time.throttle(handleClick(core), 16));
4065
- core[_board].on('doubleClick', handleDoubleClick(core));
4066
- if (core[_tempData].get('onlyRender') === true) {
4067
- return;
4068
- }
4069
- core[_board].on('point', handlePoint(core));
4070
- core[_board].on('moveStart', handleMoveStart(core));
4071
- core[_board].on('move', time.throttle(handleMove(core), 16));
4072
- core[_board].on('moveEnd', handleMoveEnd(core));
4073
- core[_renderer].on('drawFrame', function () {
4074
- core[_coreEvent].trigger('drawFrame', undefined);
4075
- });
4076
- core[_renderer].on('drawFrameComplete', function () {
4077
- core[_coreEvent].trigger('drawFrameComplete', undefined);
4078
- });
4079
- core[_tempData].set('hasInited', true);
4080
- }
4081
- function handleDoubleClick(core) {
4082
- return function (point) {
4083
- var _a, _b, _c;
4084
- var _d = core[_element].isPointInElement(point, core[_data]), index = _d[0], uuid = _d[1];
4085
- if (index >= 0 && uuid) {
4086
- var elem = deepClone$1((_a = core[_data].elements) === null || _a === void 0 ? void 0 : _a[index]);
4087
- if (((_b = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _b === void 0 ? void 0 : _b.invisible) !== true) {
4088
- core[_coreEvent].trigger('screenDoubleClickElement', { index: index, uuid: uuid, element: deepClone$1((_c = core[_data].elements) === null || _c === void 0 ? void 0 : _c[index]) });
4089
- }
4090
- }
4091
- core[_draw]();
4092
- };
4093
- }
4094
- function handlePoint(core) {
4095
- return function (point) {
4096
- var _a, _b, _c;
4097
- if (!core[_mapper].isEffectivePoint(point)) {
4098
- return;
4099
- }
4100
- if (core[_helper].isPointInElementList(point, core[_data])) {
4101
- core[_tempData].set('mode', Mode.SELECT_ELEMENT_LIST);
4102
- }
4103
- else {
4104
- var _d = core[_helper].isPointInElementWrapperController(point, core[_data]), uuid = _d.uuid, selectedControllerDirection = _d.selectedControllerDirection;
4105
- if (uuid && selectedControllerDirection) {
4106
- core[_tempData].set('mode', Mode.SELECT_ELEMENT_WRAPPER_CONTROLLER);
4107
- core[_tempData].set('selectedControllerDirection', selectedControllerDirection);
4108
- core[_tempData].set('selectedUUID', uuid);
4109
- }
4110
- else {
4111
- var _e = core[_element].isPointInElement(point, core[_data]), index = _e[0], uuid_1 = _e[1];
4112
- if (index >= 0 && ((_b = (_a = core[_data].elements[index]) === null || _a === void 0 ? void 0 : _a.operation) === null || _b === void 0 ? void 0 : _b.invisible) !== true) {
4113
- core.selectElementByIndex(index, { useMode: true });
4114
- if (typeof uuid_1 === 'string' && core[_coreEvent].has('screenSelectElement')) {
4115
- core[_coreEvent].trigger('screenSelectElement', { index: index, uuid: uuid_1, element: deepClone$1((_c = core[_data].elements) === null || _c === void 0 ? void 0 : _c[index]) });
4116
- core[_emitChangeScreen]();
4117
- }
4118
- core[_tempData].set('mode', Mode.SELECT_ELEMENT);
4119
- }
4120
- else {
4121
- core[_tempData].set('selectedUUIDList', []);
4122
- core[_tempData].set('selectedUUID', null);
4123
- core[_tempData].set('mode', Mode.SELECT_AREA);
4124
- }
4125
- }
4126
- }
4127
- core[_draw]();
4128
- };
4129
- }
4130
- function handleClick(core) {
4131
- return function (point) {
4132
- var _a;
4133
- var _b = core[_element].isPointInElement(point, core[_data]), index = _b[0], uuid = _b[1];
4134
- if (index >= 0 && uuid) {
4135
- core[_coreEvent].trigger('screenClickElement', { index: index, uuid: uuid, element: deepClone$1((_a = core[_data].elements) === null || _a === void 0 ? void 0 : _a[index]) });
4136
- }
4137
- core[_draw]();
4138
- };
4139
- }
4140
- function handleMoveStart(core) {
4141
- return function (point) {
4142
- core[_tempData].set('prevPoint', point);
4143
- var uuid = core[_tempData].get('selectedUUID');
4144
- if (core[_tempData].get('mode') === Mode.SELECT_ELEMENT_LIST) ;
4145
- else if (core[_tempData].get('mode') === Mode.SELECT_ELEMENT) {
4146
- if (typeof uuid === 'string' && core[_coreEvent].has('screenMoveElementStart')) {
4147
- core[_coreEvent].trigger('screenMoveElementStart', {
4148
- index: core[_element].getElementIndex(core[_data], uuid),
4149
- uuid: uuid,
4150
- x: point.x,
4151
- y: point.y
4152
- });
4153
- }
4154
- }
4155
- else if (core[_tempData].get('mode') === Mode.SELECT_AREA) {
4156
- core[_helper].startSelectArea(point);
4157
- }
4158
- };
4159
- }
4160
- function handleMove(core) {
4161
- return function (point) {
4162
- if (core[_tempData].get('mode') === Mode.SELECT_ELEMENT_LIST) {
4163
- dragElements(core, core[_tempData].get('selectedUUIDList'), point, core[_tempData].get('prevPoint'));
4164
- core[_draw]();
4165
- core[_tempData].set('cursorStatus', CursorStatus.DRAGGING);
4166
- }
4167
- else if (typeof core[_tempData].get('selectedUUID') === 'string') {
4168
- if (core[_tempData].get('mode') === Mode.SELECT_ELEMENT) {
4169
- dragElements(core, [core[_tempData].get('selectedUUID')], point, core[_tempData].get('prevPoint'));
4170
- core[_draw]();
4171
- core[_tempData].set('cursorStatus', CursorStatus.DRAGGING);
4172
- }
4173
- else if (core[_tempData].get('mode') === Mode.SELECT_ELEMENT_WRAPPER_CONTROLLER && core[_tempData].get('selectedControllerDirection')) {
4174
- transfromElement(core, core[_tempData].get('selectedUUID'), point, core[_tempData].get('prevPoint'), core[_tempData].get('selectedControllerDirection'));
4175
- core[_tempData].set('cursorStatus', CursorStatus.DRAGGING);
4176
- }
4177
- }
4178
- else if (core[_tempData].get('mode') === Mode.SELECT_AREA) {
4179
- core[_helper].changeSelectArea(point);
4180
- core[_draw]();
4181
- }
4182
- core[_tempData].set('prevPoint', point);
4183
- };
4184
- }
4185
- function dragElements(core, uuids, point, prevPoint) {
4186
- if (!prevPoint) {
4187
- return;
4188
- }
4189
- uuids.forEach(function (uuid) {
4190
- var _a, _b;
4191
- var idx = core[_helper].getElementIndexByUUID(uuid);
4192
- if (idx === null)
4193
- return;
4194
- var elem = core[_data].elements[idx];
4195
- if (((_a = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _a === void 0 ? void 0 : _a.lock) !== true && ((_b = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _b === void 0 ? void 0 : _b.invisible) !== true) {
4196
- core[_element].dragElement(core[_data], uuid, point, prevPoint, core[_board].getContext().getTransform().scale);
4197
- }
4198
- });
4199
- core[_draw]();
4200
- }
4201
- function handleMoveEnd(core) {
4202
- return function (point) {
4203
- var uuid = core[_tempData].get('selectedUUID');
4204
- if (typeof uuid === 'string') {
4205
- var index = core[_element].getElementIndex(core[_data], uuid);
4206
- var elem = core[_data].elements[index];
4207
- if (elem) {
4208
- if (core[_coreEvent].has('screenMoveElementEnd')) {
4209
- core[_coreEvent].trigger('screenMoveElementEnd', {
4210
- index: index,
4211
- uuid: uuid,
4212
- x: point.x,
4213
- y: point.y
4214
- });
4215
- }
4216
- if (core[_coreEvent].has('screenChangeElement')) {
4217
- core[_coreEvent].trigger('screenChangeElement', {
4218
- index: index,
4219
- uuid: uuid,
4220
- width: elem.w,
4221
- height: elem.h,
4222
- angle: elem.angle || 0
4223
- });
4224
- }
4225
- core[_emitChangeData]();
4226
- }
4227
- }
4228
- else if (core[_tempData].get('mode') === Mode.SELECT_AREA) {
4229
- var uuids = core[_helper].calcSelectedElements(core[_data]);
4230
- if (uuids.length > 0) {
4231
- core[_tempData].set('selectedUUIDList', uuids);
4232
- core[_tempData].set('selectedUUID', null);
4233
- }
4234
- else {
4235
- core[_tempData].set('mode', Mode.NULL);
4236
- }
4237
- core[_helper].clearSelectedArea();
4238
- core[_draw]();
4239
- }
4240
- if (core[_tempData].get('mode') !== Mode.SELECT_ELEMENT) {
4241
- core[_tempData].set('selectedUUID', null);
4242
- }
4243
- core[_tempData].set('cursorStatus', CursorStatus.NULL);
4244
- core[_tempData].set('mode', Mode.NULL);
4245
- };
4246
- }
4247
- function handleHover(core) {
4248
- return function (point) {
4249
- var _a, _b;
4250
- var isMouseOverElement = false;
4251
- if (core[_tempData].get('mode') === Mode.SELECT_AREA) {
4252
- if (core[_tempData].get('onlyRender') !== true)
4253
- core[_board].resetCursor();
4254
- }
4255
- else if (core[_tempData].get('cursorStatus') === CursorStatus.NULL) {
4256
- var _c = core[_mapper].judgePointCursor(point, core[_data]), cursor = _c.cursor, elementUUID = _c.elementUUID;
4257
- if (core[_tempData].get('onlyRender') !== true)
4258
- core[_board].setCursor(cursor);
4259
- if (elementUUID) {
4260
- var index = core[_helper].getElementIndexByUUID(elementUUID);
4261
- if (index !== null && index >= 0) {
4262
- var elem = core[_data].elements[index];
4263
- if (((_a = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _a === void 0 ? void 0 : _a.lock) === true || ((_b = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _b === void 0 ? void 0 : _b.invisible) === true) {
4264
- core[_board].resetCursor();
4265
- return;
4266
- }
4267
- if (core[_tempData].get('hoverUUID') !== elem.uuid) {
4268
- var preIndex = core[_helper].getElementIndexByUUID(core[_tempData].get('hoverUUID') || '');
4269
- if (preIndex !== null && core[_data].elements[preIndex]) {
4270
- core[_coreEvent].trigger('mouseLeaveElement', {
4271
- uuid: core[_tempData].get('hoverUUID'),
4272
- index: preIndex,
4273
- element: core[_data].elements[preIndex]
4274
- });
4275
- }
4276
- }
4277
- if (elem) {
4278
- core[_coreEvent].trigger('mouseOverElement', { uuid: elem.uuid, index: index, element: elem, });
4279
- core[_tempData].set('hoverUUID', elem.uuid);
4280
- isMouseOverElement = true;
4281
- }
4282
- }
4283
- }
4284
- }
4285
- if (isMouseOverElement !== true && core[_tempData].get('hoverUUID') !== null) {
4286
- var uuid = core[_tempData].get('hoverUUID');
4287
- var index = core[_helper].getElementIndexByUUID(uuid || '');
4288
- if (index !== null)
4289
- core[_coreEvent].trigger('mouseLeaveElement', { uuid: uuid, index: index, element: core[_data].elements[index] });
4290
- core[_tempData].set('hoverUUID', null);
4291
- }
4292
- if (core[_coreEvent].has('mouseOverScreen'))
4293
- core[_coreEvent].trigger('mouseOverScreen', point);
4294
- };
4295
- }
4296
- function handleLeave(core) {
4297
- return function () {
4298
- if (core[_coreEvent].has('mouseLeaveScreen')) {
4299
- core[_coreEvent].trigger('mouseLeaveScreen', undefined);
4300
- }
4301
- };
4302
- }
4303
- function transfromElement(core, uuid, point, prevPoint, direction) {
4304
- if (!prevPoint) {
4305
- return null;
4306
- }
4307
- var result = core[_element].transformElement(core[_data], uuid, point, prevPoint, core[_board].getContext().getTransform().scale, direction);
4308
- core[_draw]();
4309
- return result;
4310
- }
4311
-
4312
- var deepClone = index.data.deepClone;
4313
- var Core = (function () {
4314
- function Core(mount, opts, config) {
4315
- var _c, _d, _e;
4316
- this[_a] = new CoreEvent();
4317
- this[_b] = new TempData();
4318
- this[_data] = { elements: [] };
4319
- this[_opts] = opts;
4320
- this[_tempData].set('onlyRender', opts.onlyRender === true);
4321
- this[_config] = mergeConfig(config || {});
4322
- this[_board] = new Board(mount, __assign$1(__assign$1({}, this[_opts]), { canScroll: (_c = config === null || config === void 0 ? void 0 : config.scrollWrapper) === null || _c === void 0 ? void 0 : _c.use, scrollConfig: {
4323
- color: ((_d = config === null || config === void 0 ? void 0 : config.scrollWrapper) === null || _d === void 0 ? void 0 : _d.color) || '#a0a0a0',
4324
- lineWidth: ((_e = config === null || config === void 0 ? void 0 : config.scrollWrapper) === null || _e === void 0 ? void 0 : _e.lineWidth) || 12,
4325
- } }));
4326
- this[_renderer] = new Renderer(this[_board]);
4327
- this[_element] = new Element(this[_board].getContext());
4328
- this[_helper] = new Helper(this[_board], this[_config]);
4329
- this[_mapper] = new Mapper({
4330
- board: this[_board],
4331
- helper: this[_helper],
4332
- element: this[_element]
4333
- });
4334
- initEvent(this);
4335
- }
4336
- Core.prototype[(_a = _coreEvent, _b = _tempData, _draw)] = function (opts) {
4337
- var _c, _d;
4338
- var transfrom = this[_board].getTransform();
4339
- this[_helper].updateConfig(this[_data], {
4340
- width: this[_opts].width,
4341
- height: this[_opts].height,
4342
- canScroll: ((_d = (_c = this[_config]) === null || _c === void 0 ? void 0 : _c.scrollWrapper) === null || _d === void 0 ? void 0 : _d.use) === true,
4343
- selectedUUID: this[_tempData].get('selectedUUID'),
4344
- selectedUUIDList: this[_tempData].get('selectedUUIDList'),
4345
- devicePixelRatio: this[_opts].devicePixelRatio,
4346
- scale: transfrom.scale,
4347
- scrollX: transfrom.scrollX,
4348
- scrollY: transfrom.scrollY,
4349
- });
4350
- this[_renderer].thaw();
4351
- this[_renderer].render(this[_data], this[_helper].getConfig(), (opts === null || opts === void 0 ? void 0 : opts.resourceChangeUUIDs) || []);
4352
- };
4353
- Core.prototype.getElement = function (uuid) {
4354
- return getElement(this, uuid);
4355
- };
4356
- Core.prototype.getElementByIndex = function (index) {
4357
- return getElementByIndex(this, index);
4358
- };
4359
- Core.prototype.selectElementByIndex = function (index, opts) {
4360
- return selectElementByIndex(this, index, opts);
4361
- };
4362
- Core.prototype.selectElement = function (uuid, opts) {
4363
- return selectElement(this, uuid, opts);
4364
- };
4365
- Core.prototype.moveUpElement = function (uuid) {
4366
- return moveUpElement(this, uuid);
4367
- };
4368
- Core.prototype.moveDownElement = function (uuid) {
4369
- return moveDownElement(this, uuid);
4370
- };
4371
- Core.prototype.updateElement = function (elem) {
4372
- return updateElement(this, elem);
4373
- };
4374
- Core.prototype.addElement = function (elem) {
4375
- return addElement(this, elem);
4376
- };
4377
- Core.prototype.deleteElement = function (uuid) {
4378
- return deleteElement(this, uuid);
4379
- };
4380
- Core.prototype.insertElementBefore = function (elem, beforeUUID) {
4381
- return insertElementBefore(this, elem, beforeUUID);
4382
- };
4383
- Core.prototype.insertElementBeforeIndex = function (elem, index) {
4384
- return insertElementBeforeIndex(this, elem, index);
4385
- };
4386
- Core.prototype.getSelectedElements = function () {
4387
- return getSelectedElements(this);
4388
- };
4389
- Core.prototype.insertElementAfter = function (elem, beforeUUID) {
4390
- return insertElementAfter(this, elem, beforeUUID);
4391
- };
4392
- Core.prototype.insertElementAfterIndex = function (elem, index) {
4393
- return insertElementAfterIndex(this, elem, index);
4394
- };
4395
- Core.prototype.resetSize = function (opts) {
4396
- this[_opts] = __assign$1(__assign$1({}, this[_opts]), opts);
4397
- this[_board].resetSize(opts);
4398
- this[_draw]();
4399
- };
4400
- Core.prototype.scale = function (ratio) {
4401
- var screen = this[_board].scale(ratio);
4402
- this[_draw]();
4403
- this[_emitChangeScreen]();
4404
- return screen;
4405
- };
4406
- Core.prototype.scrollLeft = function (left) {
4407
- var screen = this[_board].scrollX(0 - left);
4408
- this[_draw]();
4409
- this[_emitChangeScreen]();
4410
- return screen;
4411
- };
4412
- Core.prototype.scrollTop = function (top) {
4413
- var screen = this[_board].scrollY(0 - top);
4414
- this[_draw]();
4415
- this[_emitChangeScreen]();
4416
- return screen;
4417
- };
4418
- Core.prototype.getScreenTransform = function () {
4419
- var transform = this[_board].getTransform();
4420
- return {
4421
- scale: transform.scale,
4422
- scrollTop: Math.max(0, 0 - transform.scrollY),
4423
- scrollLeft: Math.max(0, 0 - transform.scrollX),
4424
- };
4425
- };
4426
- Core.prototype.getData = function () {
4427
- return deepClone(this[_data]);
4428
- };
4429
- Core.prototype.setData = function (data, opts) {
4430
- var resourceChangeUUIDs = diffElementResourceChangeList(this[_data], data);
4431
- this[_data] = this[_element].initData(deepClone(parseData(data)));
4432
- if (opts && opts.triggerChangeEvent === true) {
4433
- this[_emitChangeData]();
4434
- }
4435
- this[_draw]({ resourceChangeUUIDs: resourceChangeUUIDs });
4436
- };
4437
- Core.prototype.clearOperation = function () {
4438
- this[_tempData].clear();
4439
- this[_tempData].set('onlyRender', this[_opts].onlyRender === true);
4440
- this[_draw]();
4441
- };
4442
- Core.prototype.on = function (key, callback) {
4443
- this[_coreEvent].on(key, callback);
4444
- };
4445
- Core.prototype.off = function (key, callback) {
4446
- this[_coreEvent].off(key, callback);
4447
- };
4448
- Core.prototype.pointScreenToContext = function (p) {
4449
- return this[_board].pointScreenToContext(p);
4450
- };
4451
- Core.prototype.pointContextToScreen = function (p) {
4452
- return this[_board].pointContextToScreen(p);
4453
- };
4454
- Core.prototype.setOnlyRender = function () {
4455
- this[_tempData].set('onlyRender', true);
4456
- };
4457
- Core.prototype.cancelOnlyRender = function () {
4458
- this[_tempData].set('onlyRender', false);
4459
- };
4460
- Core.prototype.__getBoardContext = function () {
4461
- return this[_board].getContext();
4462
- };
4463
- Core.prototype.__getDisplayContext = function () {
4464
- return this[_board].getDisplayContext();
4465
- };
4466
- Core.prototype.__getOriginContext = function () {
4467
- return this[_board].getOriginContext();
4468
- };
4469
- Core.prototype[_emitChangeScreen] = function () {
4470
- if (this[_coreEvent].has('changeScreen')) {
4471
- this[_coreEvent].trigger('changeScreen', __assign$1({}, this.getScreenTransform()));
4472
- }
4473
- };
4474
- Core.prototype[_emitChangeData] = function () {
4475
- if (this[_coreEvent].has('changeData')) {
4476
- this[_coreEvent].trigger('changeData', deepClone(this[_data]));
4477
- }
4478
- };
4479
- Core.prototype[_todo] = function () {
4480
- console.log(this[_mapper]);
4481
- };
4482
- var _a, _b;
4483
- Core.is = is;
4484
- Core.check = check;
4485
- return Core;
4486
- }());
4487
-
4488
- return Core;
4489
-
4490
- })();
1
+ var iDrawCore=function(){'use strict';var t=function(){return t=Object.assign||function(t){for(var e,n=1,o=arguments.length;n<o;n++)for(var i in e=arguments[n])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t},t.apply(this,arguments)},e=function(){return e=Object.assign||function(t){for(var e,n=1,o=arguments.length;n<o;n++)for(var i in e=arguments[n])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t},e.apply(this,arguments)};function n(t){return'string'==typeof t&&/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)}function o(t){return(Object.prototype.toString.call(t)||'').replace(/(\[object|\])/gi,'').trim()}var i={type:function(t,e){var n=o(t);return!0===e?n.toLocaleLowerCase():n},array:function(t){return'Array'===o(t)},json:function(t){return'Object'===o(t)},function:function(t){return'Function'===o(t)},asyncFunction:function(t){return'AsyncFunction'===o(t)},string:function(t){return'String'===o(t)},number:function(t){return'Number'===o(t)},undefined:function(t){return'Undefined'===o(t)},null:function(t){return'Null'===o(t)},promise:function(t){return'Promise'===o(t)}},r=function(){return r=Object.assign||function(t){for(var e,n=1,o=arguments.length;n<o;n++)for(var i in e=arguments[n])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t},r.apply(this,arguments)};function s(t,e,n,o){return new(n||(n=Promise))((function(i,r){function s(t){try{a(o.next(t))}catch(t){r(t)}}function l(t){try{a(o.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?i(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(s,l)}a((o=o.apply(t,e||[])).next())}))}function l(t,e){var n,o,i,r,s={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return r={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(r[Symbol.iterator]=function(){return this}),r;function l(r){return function(l){return function(r){if(n)throw new TypeError("Generator is already executing.");for(;s;)try{if(n=1,o&&(i=2&r[0]?o.return:r[0]?o.throw||((i=o.return)&&i.call(o),0):o.next)&&!(i=i.call(o,r[1])).done)return i;switch(o=0,i&&(r=[2&r[0],i.value]),r[0]){case 0:case 1:i=r;break;case 4:return s.label++,{value:r[1],done:!1};case 5:s.label++,o=r[1],r=[0];continue;case 7:r=s.ops.pop(),s.trys.pop();continue;default:if(!(i=s.trys,(i=i.length>0&&i[i.length-1])||6!==r[0]&&2!==r[0])){s=0;continue}if(3===r[0]&&(!i||r[1]>i[0]&&r[1]<i[3])){s.label=r[1];break}if(6===r[0]&&s.label<i[1]){s.label=i[1],i=r;break}if(i&&s.label<i[2]){s.label=i[2],s.ops.push(r);break}i[2]&&s.ops.pop(),s.trys.pop();continue}r=e.call(t,s)}catch(t){r=[6,t],o=0}finally{n=i=0}if(5&r[0])throw r[1];return{value:r[0]?r[1]:void 0,done:!0}}([r,l])}}}function a(t,e){var n=e.width,o=e.height;return new Promise((function(e,i){var r=new Blob(["\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\""+(n||'')+"\" height = \""+(o||'')+"\">\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'}),s=new FileReader;s.readAsDataURL(r),s.onload=function(t){var n,o=null===(n=null==t?void 0:t.target)||void 0===n?void 0:n.result;e(o)},s.onerror=function(t){i(t)}}))}function c(t){return new Promise((function(e,n){var o=new Blob([t],{type:'image/svg+xml;charset=utf-8'}),i=new FileReader;i.readAsDataURL(o),i.onload=function(t){var n,o=null===(n=null==t?void 0:t.target)||void 0===n?void 0:n.result;e(o)},i.onerror=function(t){n(t)}}))}var h=window.Image;function u(t){return new Promise((function(e,n){var o=new h;o.onload=function(){e(o)},o.onabort=n,o.onerror=n,o.src=t}))}var f=function(){function t(t,e){this._opts=e,this._ctx=t,this._transform={scale:1,scrollX:0,scrollY:0}}return t.prototype.getContext=function(){return this._ctx},t.prototype.resetSize=function(t){this._opts=r(r({},this._opts),t)},t.prototype.calcDeviceNum=function(t){return t*this._opts.devicePixelRatio},t.prototype.calcScreenNum=function(t){return t/this._opts.devicePixelRatio},t.prototype.getSize=function(){return{width:this._opts.width,height:this._opts.height,contextWidth:this._opts.contextWidth,contextHeight:this._opts.contextHeight,devicePixelRatio:this._opts.devicePixelRatio}},t.prototype.setTransform=function(t){this._transform=r(r({},this._transform),t)},t.prototype.getTransform=function(){return{scale:this._transform.scale,scrollX:this._transform.scrollX,scrollY:this._transform.scrollY}},t.prototype.setFillStyle=function(t){this._ctx.fillStyle=t},t.prototype.fill=function(t){return this._ctx.fill(t||'nonzero')},t.prototype.arc=function(t,e,n,o,i,r){return this._ctx.arc(this._doSize(t),this._doSize(e),this._doSize(n),o,i,r)},t.prototype.rect=function(t,e,n,o){return this._ctx.rect(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o))},t.prototype.fillRect=function(t,e,n,o){return this._ctx.fillRect(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o))},t.prototype.clearRect=function(t,e,n,o){return this._ctx.clearRect(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o))},t.prototype.beginPath=function(){return this._ctx.beginPath()},t.prototype.closePath=function(){return this._ctx.closePath()},t.prototype.lineTo=function(t,e){return this._ctx.lineTo(this._doSize(t),this._doSize(e))},t.prototype.moveTo=function(t,e){return this._ctx.moveTo(this._doSize(t),this._doSize(e))},t.prototype.arcTo=function(t,e,n,o,i){return this._ctx.arcTo(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o),this._doSize(i))},t.prototype.setLineWidth=function(t){return this._ctx.lineWidth=this._doSize(t)},t.prototype.setLineDash=function(t){var e=this;return this._ctx.setLineDash(t.map((function(t){return e._doSize(t)})))},t.prototype.isPointInPath=function(t,e){return this._ctx.isPointInPath(this._doX(t),this._doY(e))},t.prototype.isPointInPathWithoutScroll=function(t,e){return this._ctx.isPointInPath(this._doSize(t),this._doSize(e))},t.prototype.setStrokeStyle=function(t){this._ctx.strokeStyle=t},t.prototype.stroke=function(){return this._ctx.stroke()},t.prototype.translate=function(t,e){return this._ctx.translate(this._doSize(t),this._doSize(e))},t.prototype.rotate=function(t){return this._ctx.rotate(t)},t.prototype.drawImage=function(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];var n=t[0],o=t[1],i=t[2],r=t[3],s=t[4],l=t[t.length-4],a=t[t.length-3],c=t[t.length-2],h=t[t.length-1];return 9===t.length?this._ctx.drawImage(n,this._doSize(o),this._doSize(i),this._doSize(r),this._doSize(s),this._doSize(l),this._doSize(a),this._doSize(c),this._doSize(h)):this._ctx.drawImage(n,this._doSize(l),this._doSize(a),this._doSize(c),this._doSize(h))},t.prototype.createPattern=function(t,e){return this._ctx.createPattern(t,e)},t.prototype.measureText=function(t){return this._ctx.measureText(t)},t.prototype.setTextAlign=function(t){this._ctx.textAlign=t},t.prototype.fillText=function(t,e,n,o){return void 0!==o?this._ctx.fillText(t,this._doSize(e),this._doSize(n),this._doSize(o)):this._ctx.fillText(t,this._doSize(e),this._doSize(n))},t.prototype.strokeText=function(t,e,n,o){return void 0!==o?this._ctx.strokeText(t,this._doSize(e),this._doSize(n),this._doSize(o)):this._ctx.strokeText(t,this._doSize(e),this._doSize(n))},t.prototype.setFont=function(t){var 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(' ')},t.prototype.setTextBaseline=function(t){this._ctx.textBaseline=t},t.prototype.setGlobalAlpha=function(t){this._ctx.globalAlpha=t},t.prototype.save=function(){this._ctx.save()},t.prototype.restore=function(){this._ctx.restore()},t.prototype.scale=function(t,e){this._ctx.scale(t,e)},t.prototype.setShadowColor=function(t){this._ctx.shadowColor=t},t.prototype.setShadowOffsetX=function(t){this._ctx.shadowOffsetX=this._doSize(t)},t.prototype.setShadowOffsetY=function(t){this._ctx.shadowOffsetY=this._doSize(t)},t.prototype.setShadowBlur=function(t){this._ctx.shadowBlur=this._doSize(t)},t.prototype.ellipse=function(t,e,n,o,i,r,s,l){this._ctx.ellipse(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o),i,r,s,l)},t.prototype._doSize=function(t){return this._opts.devicePixelRatio*t},t.prototype._doX=function(t){var e=this._transform,n=e.scale,o=(t-e.scrollX)/n;return this._doSize(o)},t.prototype._doY=function(t){var e=this._transform,n=e.scale,o=(t-e.scrollY)/n;return this._doSize(o)},t}();function d(t){return'number'==typeof t&&(t>0||t<=0)}function p(t){return'number'==typeof t&&t>=0}function v(t){return'string'==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(""+t)}function g(t){return'string'==typeof t&&/^(data:image\/)/.test(""+t)}var m={x:function(t){return d(t)},y:function(t){return d(t)},w:p,h:function(t){return'number'==typeof t&&t>=0},angle:function(t){return'number'==typeof t&&t>=-360&&t<=360},number:d,borderWidth:function(t){return p(t)},borderRadius:function(t){return d(t)&&t>=0},color:function(t){return n(t)},imageSrc:function(t){return g(t)||v(t)},imageURL:v,imageBase64:g,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){var e=!1;if('string'==typeof t){var n=document.createElement('div');n.innerHTML=t,n.children.length>0&&(e=!0),n=null}return e},text:function(t){return'string'==typeof t},fontSize:function(t){return d(t)&&t>0},lineHeight:function(t){return d(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 d(t)&&t>0}};function y(t){void 0===t&&(t={});var e=t.borderColor,n=t.borderRadius,o=t.borderWidth;return!(t.hasOwnProperty('borderColor')&&!m.color(e))&&(!(t.hasOwnProperty('borderRadius')&&!m.number(n))&&!(t.hasOwnProperty('borderWidth')&&!m.number(o)))}var _={attrs:function(t){var e=t.x,n=t.y,o=t.w,i=t.h,r=t.angle;return!!(m.x(e)&&m.y(n)&&m.w(o)&&m.h(i)&&m.angle(r))&&(r>=-360&&r<=360)},textDesc:function(t){var e=t.text,n=t.color,o=t.fontSize,i=t.lineHeight,r=t.fontFamily,s=t.textAlign,l=t.fontWeight,a=t.bgColor,c=t.strokeWidth,h=t.strokeColor;return!!m.text(e)&&(!!m.color(n)&&(!!m.fontSize(o)&&(!(t.hasOwnProperty('bgColor')&&!m.color(a))&&(!(t.hasOwnProperty('fontWeight')&&!m.fontWeight(l))&&(!(t.hasOwnProperty('lineHeight')&&!m.lineHeight(i))&&(!(t.hasOwnProperty('fontFamily')&&!m.fontFamily(r))&&(!(t.hasOwnProperty('textAlign')&&!m.textAlign(s))&&(!(t.hasOwnProperty('strokeWidth')&&!m.strokeWidth(c))&&(!(t.hasOwnProperty('strokeColor')&&!m.color(h))&&!!y(t))))))))))},rectDesc:function(t){var e=t.bgColor;return!(t.hasOwnProperty('bgColor')&&!m.color(e))&&!!y(t)},circleDesc:function(t){var e=t.bgColor,n=t.borderColor,o=t.borderWidth;return!(t.hasOwnProperty('bgColor')&&!m.color(e))&&(!(t.hasOwnProperty('borderColor')&&!m.color(n))&&!(t.hasOwnProperty('borderWidth')&&!m.number(o)))},imageDesc:function(t){var e=t.src;return!!m.imageSrc(e)},svgDesc:function(t){var e=t.svg;return!!m.svg(e)},htmlDesc:function(t){var e=t.html;return!!m.html(e)}},S={is:m,check:_,time:{delay:function(t){return new Promise((function(e){setTimeout((function(){e()}),t)}))},compose:function(t){return function(e,n){return function o(i){var r=t[i];i===t.length&&n&&(r=n);if(!r)return Promise.resolve();try{return Promise.resolve(r(e,o.bind(null,i+1)))}catch(t){return Promise.reject(t)}}(0)}},throttle:function(t,e){var n=-1;return function(){for(var o=[],i=0;i<arguments.length;i++)o[i]=arguments[i];n>0||(n=setTimeout((function(){t.apply(void 0,o),n=-1}),e))}}},loader:{loadImage:u,loadSVG:function(t){return s(this,void 0,void 0,(function(){return l(this,(function(e){switch(e.label){case 0:return[4,c(t)];case 1:return[4,u(e.sent())];case 2:return[2,e.sent()]}}))}))},loadHTML:function(t,e){return s(this,void 0,void 0,(function(){return l(this,(function(n){switch(n.label){case 0:return[4,a(t,e)];case 1:return[4,u(n.sent())];case 2:return[2,n.sent()]}}))}))}},file:{downloadImageFromCanvas:function(t,e){var n=e.filename,o=e.type,i=void 0===o?'image/jpeg':o,r=t.toDataURL(i),s=document.createElement('a');s.href=r,s.download=n;var l=document.createEvent('MouseEvents');l.initEvent('click',!0,!1),s.dispatchEvent(l)}},color:{toColorHexStr:function(t){return'#'+t.toString(16)},toColorHexNum:function(t){return parseInt(t.replace(/^\#/,'0x'))},isColorStr:n},uuid:{createUUID:function(){function t(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return""+t()+t()+"-"+t()+"-"+t()+"-"+t()+"-"+t()+t()+t()}},istype:i,data:{deepClone:function(t){return function t(e){var n,o=(n=e,Object.prototype.toString.call(n).replace(/[\]|\[]{1,1}/gi,'').split(' ')[1]);if(['Null','Number','String','Boolean','Undefined'].indexOf(o)>=0)return e;if('Array'===o){var i=[];return e.forEach((function(e){i.push(t(e))})),i}if('Object'===o){var r={};return Object.keys(e).forEach((function(n){r[n]=t(e[n])})),r}}(t)}},Context:f},x=function(){function t(){this._listeners=new Map}return t.prototype.on=function(t,e){if(this._listeners.has(t)){var n=this._listeners.get(t);null==n||n.push(e),this._listeners.set(t,n||[])}else this._listeners.set(t,[e])},t.prototype.off=function(t,e){if(this._listeners.has(t)){var n=this._listeners.get(t);if(Array.isArray(n))for(var o=0;o<(null==n?void 0:n.length);o++)if(n[o]===e){n.splice(o,1);break}this._listeners.set(t,n||[])}},t.prototype.trigger=function(t,e){var n=this._listeners.get(t);return!!Array.isArray(n)&&(n.forEach((function(t){t(e)})),!0)},t.prototype.has=function(t){if(this._listeners.has(t)){var e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1},t}();var b=function(){function t(){this._temp={prevClickPoint:null,isHoverCanvas:!1,isDragCanvas:!1,statusMap:{canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}}}return t.prototype.set=function(t,e){this._temp[t]=e},t.prototype.get=function(t){return this._temp[t]},t.prototype.clear=function(){this._temp={prevClickPoint:null,isHoverCanvas:!1,isDragCanvas:!1,statusMap:{canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}}},t}(),w=function(){function t(t,e){this._isMoving=!1,this._temp=new b,this._container=window,this._canvas=t,this._isMoving=!1,this._initEvent(),this._event=new x}return t.prototype.setStatusMap=function(t){this._temp.set('statusMap',t)},t.prototype.on=function(t,e){this._event.on(t,e)},t.prototype.off=function(t,e){this._event.off(t,e)},t.prototype._initEvent=function(){var 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()},t.prototype._initParentEvent=function(){for(var t=window,e=t.origin;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.prototype._listenHover=function(t){t.preventDefault();var e=this._getPosition(t);this._isVaildPoint(e)&&this._event.has('hover')&&this._event.trigger('hover',e),this._isMoving=!0},t.prototype._listenMoveStart=function(t){t.preventDefault();var 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},t.prototype._listenMove=function(t){if(t.preventDefault(),t.stopPropagation(),this._event.has('move')&&!0===this._isMoving){var e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger('move',e)}},t.prototype._listenMoveEnd=function(t){if(t.preventDefault(),this._event.has('moveEnd')){var e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger('moveEnd',e)}this._isMoving=!1},t.prototype._listSameOriginParentWindow=function(){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)},t.prototype._listenCanvasMoveStart=function(){this._temp.get('isHoverCanvas')&&this._temp.set('isDragCanvas',!0)},t.prototype._listenCanvasMoveEnd=function(){this._temp.set('isDragCanvas',!1)},t.prototype._listenCanvasMoveOver=function(){this._temp.set('isHoverCanvas',!0)},t.prototype._listenCanvasMoveLeave=function(){this._temp.set('isHoverCanvas',!1),this._event.has('leave')&&this._event.trigger('leave',void 0)},t.prototype._listenWindowMove=function(t){if(!0===this._temp.get('isDragCanvas')&&(t.preventDefault(),t.stopPropagation(),this._event.has('move')&&!0===this._isMoving)){var e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger('move',e)}},t.prototype._listenWindowMoveEnd=function(t){if(!0!=!this._temp.get('isDragCanvas')){if(t.preventDefault(),this._event.has('moveEnd')){var e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger('moveEnd',e)}this._temp.set('isDragCanvas',!1),this._isMoving=!1}},t.prototype._listenCanvasWheel=function(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);var e=this._temp.get('statusMap'),n=e.canScrollYNext,o=e.canScrollYPrev;(t.deltaX>0&&t.deltaX<0||t.deltaY>0&&!0===n||t.deltaY<0&&!0===o)&&t.preventDefault()},t.prototype._listenCanvasClick=function(t){t.preventDefault();var e=this._getPosition(t),n=Date.now();if(this._isVaildPoint(e)){var o=this._temp.get('prevClickPoint');o&&n-o.t<=500&&Math.abs(o.x-e.x)<=5&&Math.abs(o.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:n})}},t.prototype._getPosition=function(t){var e=this._canvas,n=0,o=0;if(t&&t.touches&&t.touches.length>0){var i=t.touches[0];i&&(n=i.clientX,o=i.clientY)}else n=t.clientX,o=t.clientY;return{x:n-e.getBoundingClientRect().left,y:o-e.getBoundingClientRect().top,t:Date.now()}},t.prototype._isVaildPoint=function(t){return E(t.x)&&E(t.y)},t}();function E(t){return t>0||t<0||0===t}var P={lineWidth:12,color:'#a0a0a0'},C=function(){function t(t,e){this._displayCtx=t,this._opts=this._getOpts(e)}return t.prototype.draw=function(t){var e=this._opts,n=e.width,o=e.height,i=this.calc(t),r=this._displayCtx;i.xSize>0&&(r.globalAlpha=.2,r.fillStyle=i.color,r.fillRect(0,this._doSize(o-i.lineSize),this._doSize(n),this._doSize(i.lineSize)),r.globalAlpha=1,z(r,{x:this._doSize(i.translateX),y:this._doSize(o-i.lineSize),w:this._doSize(i.xSize),h:this._doSize(i.lineSize),r:this._doSize(i.lineSize/2),color:i.color})),i.ySize>0&&(r.globalAlpha=.2,r.fillStyle=i.color,r.fillRect(this._doSize(n-i.lineSize),0,this._doSize(i.lineSize),this._doSize(o)),r.globalAlpha=1,z(r,{x:this._doSize(n-i.lineSize),y:this._doSize(i.translateY),w:this._doSize(i.lineSize),h:this._doSize(i.ySize),r:this._doSize(i.lineSize/2),color:i.color})),r.globalAlpha=1},t.prototype.resetSize=function(t){this._opts=e(e({},this._opts),t)},t.prototype.isPointAtScrollY=function(t){var e=this._opts,n=e.width,o=e.height,i=e.scrollConfig,r=this._displayCtx;return r.beginPath(),r.rect(this._doSize(n-i.lineWidth),0,this._doSize(i.lineWidth),this._doSize(o)),r.closePath(),!!r.isPointInPath(this._doSize(t.x),this._doSize(t.y))},t.prototype.isPointAtScrollX=function(t){var e=this._opts,n=e.width,o=e.height,i=e.scrollConfig,r=this._displayCtx;return r.beginPath(),r.rect(0,this._doSize(o-i.lineWidth),this._doSize(n-i.lineWidth),this._doSize(i.lineWidth)),r.closePath(),!!r.isPointInPath(this._doSize(t.x),this._doSize(t.y))},t.prototype.getLineWidth=function(){return this._opts.scrollConfig.lineWidth},t.prototype.calc=function(t){var e=this._opts,n=e.width,o=e.height,i=e.scrollConfig,r=2.5*i.lineWidth,s=i.lineWidth,l=0,a=0;t.left<=0&&t.right<=0&&(l=Math.max(r,n-(Math.abs(t.left)+Math.abs(t.right))))>=n&&(l=0),(t.top<=0||t.bottom<=0)&&(a=Math.max(r,o-(Math.abs(t.top)+Math.abs(t.bottom))))>=o&&(a=0);var c=0;l>0&&(c=l/2+(n-l)*Math.abs(t.left)/(Math.abs(t.left)+Math.abs(t.right)),c=Math.min(Math.max(0,c-l/2),n-l));var h=0;return a>0&&(h=a/2+(o-a)*Math.abs(t.top)/(Math.abs(t.top)+Math.abs(t.bottom)),h=Math.min(Math.max(0,h-a/2),o-a)),{lineSize:s,xSize:l,ySize:a,translateY:h,translateX:c,color:this._opts.scrollConfig.color}},t.prototype._doSize=function(t){return t*this._opts.devicePixelRatio},t.prototype._getOpts=function(t){var n=e({scrollConfig:P},t);return n.scrollConfig||(n.scrollConfig=P),n.scrollConfig.lineWidth>0||(n.scrollConfig.lineWidth=P.lineWidth),n.scrollConfig.lineWidth=Math.max(n.scrollConfig.lineWidth,P.lineWidth),!0!==S.color.isColorStr(n.scrollConfig.color)&&(n.scrollConfig.color=n.scrollConfig.color),n},t}();function z(t,e){var n=e.x,o=e.y,i=e.w,r=e.h,s=e.color,l=e.r;(i<2*(l=Math.min(l,i/2,r/2))||r<2*l)&&(l=0),t.beginPath(),t.moveTo(n+l,o),t.arcTo(n+i,o,n+i,o+r,l),t.arcTo(n+i,o+r,n,o+r,l),t.arcTo(n,o+r,n,o,l),t.arcTo(n,o,n+i,o,l),t.closePath(),t.fillStyle=s,t.fill()}var D,L=Symbol('_opts'),T=Symbol('_ctx'),M=function(){function t(t,e){this[L]=e,this[T]=t}return t.prototype.resetSize=function(t){this[L]=e(e({},this[L]),t)},t.prototype.calcScreen=function(){var t=this[T].getTransform().scale,e=this[L],n=e.width,o=e.height,i=e.contextWidth,r=e.contextHeight,s=e.devicePixelRatio,l=!0,a=!0,c=!0,h=!0;i*t<=n&&(this[T].setTransform({scrollX:(n-i*t)/2}),l=!1,a=!1),r*t<=o&&(this[T].setTransform({scrollY:(o-r*t)/2}),c=!1,h=!1),i*t>=n&&this[T].getTransform().scrollX>0&&(this[T].setTransform({scrollX:0}),l=!1),r*t>=o&&this[T].getTransform().scrollY>0&&(this[T].setTransform({scrollY:0}),c=!1);var u=this[T].getTransform(),f=u.scrollX,d=u.scrollY;f<0&&Math.abs(f)>Math.abs(i*t-n)&&(this[T].setTransform({scrollX:0-Math.abs(i*t-n)}),a=!1),d<0&&Math.abs(d)>Math.abs(r*t-o)&&(this[T].setTransform({scrollY:0-Math.abs(r*t-o)}),h=!1);var p=this[T].getTransform(),v=p.scrollX,g=p.scrollY;return{size:{x:v*t,y:g*t,w:i*t,h:r*t},position:{top:g,bottom:o-(r*t+g),left:v,right:n-(i*t+v)},deviceSize:{x:v*s,y:g*s,w:i*s*t,h:r*s*t},width:this[L].width,height:this[L].height,devicePixelRatio:this[L].devicePixelRatio,canScrollYPrev:c,canScrollYNext:h,canScrollXPrev:l,canScrollXNext:a}},t.prototype.calcScreenScroll=function(t,e,n,o,i){var r=o-n;t<=0&&e<=0&&(r=Math.abs(t)+Math.abs(e));var s=1;return r>0&&(s=r/(o-n)),0-s*i},t}(),k=Symbol('_canvas'),I=Symbol('_displayCanvas'),W=Symbol('_helperCanvas'),O=Symbol('_mount'),U=Symbol('_opts'),R=Symbol('_hasRendered'),A=Symbol('_ctx'),F=Symbol('_helperCtx'),Y=Symbol('_watcher'),X=Symbol('_render'),N=Symbol('_parsePrivateOptions'),H=Symbol('_scroller'),B=Symbol('_initEvent'),j=Symbol('_doScrollX'),G=Symbol('_doScrollY'),Q=Symbol('_doMoveScroll'),V=Symbol('_resetContext'),$=Symbol('_screen'),Z=S.Context,q=S.time.throttle,J=function(){function t(t,e){this[D]=!1,this[O]=t,this[k]=document.createElement('canvas'),this[W]=document.createElement('canvas'),this[I]=document.createElement('canvas'),this[O].appendChild(this[I]),this[U]=this[N](e);var n=this[k].getContext('2d'),o=this[I].getContext('2d'),i=this[W].getContext('2d');this[A]=new Z(n,this[U]),this[F]=new Z(i,this[U]),this[$]=new M(this[A],this[U]),this[Y]=new w(this[I],this[A]),this[H]=new C(o,{width:e.width,height:e.height,devicePixelRatio:e.devicePixelRatio||1,scrollConfig:e.scrollConfig}),this[X]()}return t.prototype.getDisplayContext2D=function(){return this[I].getContext('2d')},t.prototype.getOriginContext2D=function(){return this[A].getContext()},t.prototype.getHelperContext2D=function(){return this[F].getContext()},t.prototype.getContext=function(){return this[A]},t.prototype.getHelperContext=function(){return this[F]},t.prototype.scale=function(t){t>0&&(this[A].setTransform({scale:t}),this[F].setTransform({scale:t}));var e=this[$].calcScreen();return{position:e.position,size:e.size}},t.prototype.scrollX=function(t){this[Y].setStatusMap({canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}),(t>=0||t<0)&&(this[A].setTransform({scrollX:t}),this[F].setTransform({scrollX:t}));var e=this[$].calcScreen(),n=e.position,o=e.size,i=e.canScrollXNext,r=e.canScrollYNext,s=e.canScrollXPrev,l=e.canScrollYPrev;return this[Y].setStatusMap({canScrollYPrev:l,canScrollYNext:r,canScrollXPrev:s,canScrollXNext:i}),{position:n,size:o}},t.prototype.scrollY=function(t){this[Y].setStatusMap({canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}),(t>=0||t<0)&&(this[A].setTransform({scrollY:t}),this[F].setTransform({scrollY:t}));var e=this[$].calcScreen(),n=e.position,o=e.size,i=e.canScrollXNext,r=e.canScrollYNext,s=e.canScrollXPrev,l=e.canScrollYPrev;return this[Y].setStatusMap({canScrollYPrev:l,canScrollYNext:r,canScrollXPrev:s,canScrollXNext:i}),{position:n,size:o}},t.prototype.getTransform=function(){return this[A].getTransform()},t.prototype.draw=function(){this.clear();var t=this[$].calcScreen(),e=t.position,n=t.deviceSize,o=t.size,i=this[I].getContext('2d');return null==i||i.drawImage(this[k],n.x,n.y,n.w,n.h),null==i||i.drawImage(this[W],n.x,n.y,n.w,n.h),!0===this[U].canScroll&&this[H].draw(e),{position:e,size:o}},t.prototype.clear=function(){var t=this[I].getContext('2d');null==t||t.clearRect(0,0,this[I].width,this[I].height)},t.prototype.on=function(t,e){this[Y].on(t,e)},t.prototype.off=function(t,e){this[Y].off(t,e)},t.prototype.getScreenInfo=function(){return this[$].calcScreen()},t.prototype.setCursor=function(t){this[I].style.cursor=t},t.prototype.resetCursor=function(){this[I].style.cursor='auto'},t.prototype.resetSize=function(t){this[U]=e(e({},this[U]),t),this[V](),this[A].resetSize(t),this[F].resetSize(t),this[$].resetSize(t),this[H].resetSize({width:this[U].width,height:this[U].height,devicePixelRatio:this[U].devicePixelRatio}),this.draw()},t.prototype.getScrollLineWidth=function(){var t=0;return!0===this[U].canScroll&&(t=this[H].getLineWidth()),t},t.prototype.pointScreenToContext=function(t){var e=this.getTransform(),n=e.scrollX,o=e.scrollY,i=e.scale;return{x:(t.x-n)/i,y:(t.y-o)/i}},t.prototype.pointContextToScreen=function(t){var e=this.getTransform(),n=e.scrollX,o=e.scrollY,i=e.scale;return{x:t.x*i+n,y:t.y*i+o}},t.prototype[(D=R,X)]=function(){!0!==this[R]&&(this[V](),this[B](),this[R]=!0)},t.prototype[V]=function(){var t,n,o,i,r,s,l=this[U],a=l.width,c=l.height,h=l.contextWidth,u=l.contextHeight,f=l.devicePixelRatio;this[k].width=h*f,this[k].height=u*f,this[W].width=h*f,this[W].height=u*f,this[I].width=a*f,this[I].height=c*f,t=this[I],n={width:a+"px",height:c+"px"},o=function(t){var e={};return(t.getAttribute('style')||'').split(';').forEach((function(t){var n=t.split(':');n[0]&&'string'==typeof n[0]&&(e[n[0]]=n[1]||'')})),e}(t),i=e(e({},o),n),r=Object.keys(i),s='',r.forEach((function(t){s+=t+":"+(i[t]||'')+";"})),t.setAttribute('style',s)},t.prototype[N]=function(t){return e(e({},{devicePixelRatio:1}),t)},t.prototype[B]=function(){var t=this;if(!0!==this[R]&&!0===this[U].canScroll){this.on('wheelX',q((function(e){t[j](e)}),16)),this.on('wheelY',q((function(e){t[G](e)}),16));var e=null;this.on('moveStart',q((function(n){t[H].isPointAtScrollX(n)?e='x':t[H].isPointAtScrollY(n)&&(e='y')}),16)),this.on('move',q((function(n){e&&t[Q](e,n)}),16)),this.on('moveEnd',q((function(n){e&&t[Q](e,n),e=null}),16))}},t.prototype[j]=function(t,e){var n=this[U].width,o=e;'number'==typeof o&&(o>0||o<=0)||(o=this[A].getTransform().scrollX);var i=this[$].calcScreen().position,r=this[H].calc(i).xSize,s=this[$].calcScreenScroll(i.left,i.right,r,n,t);this.scrollX(o+s),this.draw()},t.prototype[G]=function(t,e){var n=this[U].height,o=e;'number'==typeof o&&(o>0||o<=0)||(o=this[A].getTransform().scrollY);var i=this[$].calcScreen().position,r=this[H].calc(i).ySize,s=this[$].calcScreenScroll(i.top,i.bottom,r,n,t);this.scrollY(o+s),this.draw()},t.prototype[Q]=function(t,e){if(t){var n=this[$].calcScreen().position,o=this[H].calc(n),i=o.xSize,r=o.ySize;'x'===t?this[j](e.x-i/2,0):'y'===t&&this[G](e.y-r/2,0)}},t}();function K(t){return'string'==typeof t&&/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)}function tt(t){return(Object.prototype.toString.call(t)||'').replace(/(\[object|\])/gi,'').trim()}var et={type:function(t,e){var n=tt(t);return!0===e?n.toLocaleLowerCase():n},array:function(t){return'Array'===tt(t)},json:function(t){return'Object'===tt(t)},function:function(t){return'Function'===tt(t)},asyncFunction:function(t){return'AsyncFunction'===tt(t)},string:function(t){return'String'===tt(t)},number:function(t){return'Number'===tt(t)},undefined:function(t){return'Undefined'===tt(t)},null:function(t){return'Null'===tt(t)},promise:function(t){return'Promise'===tt(t)}},nt=function(){return nt=Object.assign||function(t){for(var e,n=1,o=arguments.length;n<o;n++)for(var i in e=arguments[n])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t},nt.apply(this,arguments)};function ot(t,e,n,o){return new(n||(n=Promise))((function(i,r){function s(t){try{a(o.next(t))}catch(t){r(t)}}function l(t){try{a(o.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?i(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(s,l)}a((o=o.apply(t,e||[])).next())}))}function it(t,e){var n,o,i,r,s={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return r={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(r[Symbol.iterator]=function(){return this}),r;function l(r){return function(l){return function(r){if(n)throw new TypeError("Generator is already executing.");for(;s;)try{if(n=1,o&&(i=2&r[0]?o.return:r[0]?o.throw||((i=o.return)&&i.call(o),0):o.next)&&!(i=i.call(o,r[1])).done)return i;switch(o=0,i&&(r=[2&r[0],i.value]),r[0]){case 0:case 1:i=r;break;case 4:return s.label++,{value:r[1],done:!1};case 5:s.label++,o=r[1],r=[0];continue;case 7:r=s.ops.pop(),s.trys.pop();continue;default:if(!(i=s.trys,(i=i.length>0&&i[i.length-1])||6!==r[0]&&2!==r[0])){s=0;continue}if(3===r[0]&&(!i||r[1]>i[0]&&r[1]<i[3])){s.label=r[1];break}if(6===r[0]&&s.label<i[1]){s.label=i[1],i=r;break}if(i&&s.label<i[2]){s.label=i[2],s.ops.push(r);break}i[2]&&s.ops.pop(),s.trys.pop();continue}r=e.call(t,s)}catch(t){r=[6,t],o=0}finally{n=i=0}if(5&r[0])throw r[1];return{value:r[0]?r[1]:void 0,done:!0}}([r,l])}}}function rt(t,e){var n=e.width,o=e.height;return new Promise((function(e,i){var r=new Blob(["\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\""+(n||'')+"\" height = \""+(o||'')+"\">\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'}),s=new FileReader;s.readAsDataURL(r),s.onload=function(t){var n,o=null===(n=null==t?void 0:t.target)||void 0===n?void 0:n.result;e(o)},s.onerror=function(t){i(t)}}))}function st(t){return new Promise((function(e,n){var o=new Blob([t],{type:'image/svg+xml;charset=utf-8'}),i=new FileReader;i.readAsDataURL(o),i.onload=function(t){var n,o=null===(n=null==t?void 0:t.target)||void 0===n?void 0:n.result;e(o)},i.onerror=function(t){n(t)}}))}var lt=window.Image;function at(t){return new Promise((function(e,n){var o=new lt;o.onload=function(){e(o)},o.onabort=n,o.onerror=n,o.src=t}))}var ct=function(){function t(t,e){this._opts=e,this._ctx=t,this._transform={scale:1,scrollX:0,scrollY:0}}return t.prototype.getContext=function(){return this._ctx},t.prototype.resetSize=function(t){this._opts=nt(nt({},this._opts),t)},t.prototype.calcDeviceNum=function(t){return t*this._opts.devicePixelRatio},t.prototype.calcScreenNum=function(t){return t/this._opts.devicePixelRatio},t.prototype.getSize=function(){return{width:this._opts.width,height:this._opts.height,contextWidth:this._opts.contextWidth,contextHeight:this._opts.contextHeight,devicePixelRatio:this._opts.devicePixelRatio}},t.prototype.setTransform=function(t){this._transform=nt(nt({},this._transform),t)},t.prototype.getTransform=function(){return{scale:this._transform.scale,scrollX:this._transform.scrollX,scrollY:this._transform.scrollY}},t.prototype.setFillStyle=function(t){this._ctx.fillStyle=t},t.prototype.fill=function(t){return this._ctx.fill(t||'nonzero')},t.prototype.arc=function(t,e,n,o,i,r){return this._ctx.arc(this._doSize(t),this._doSize(e),this._doSize(n),o,i,r)},t.prototype.rect=function(t,e,n,o){return this._ctx.rect(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o))},t.prototype.fillRect=function(t,e,n,o){return this._ctx.fillRect(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o))},t.prototype.clearRect=function(t,e,n,o){return this._ctx.clearRect(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o))},t.prototype.beginPath=function(){return this._ctx.beginPath()},t.prototype.closePath=function(){return this._ctx.closePath()},t.prototype.lineTo=function(t,e){return this._ctx.lineTo(this._doSize(t),this._doSize(e))},t.prototype.moveTo=function(t,e){return this._ctx.moveTo(this._doSize(t),this._doSize(e))},t.prototype.arcTo=function(t,e,n,o,i){return this._ctx.arcTo(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o),this._doSize(i))},t.prototype.setLineWidth=function(t){return this._ctx.lineWidth=this._doSize(t)},t.prototype.setLineDash=function(t){var e=this;return this._ctx.setLineDash(t.map((function(t){return e._doSize(t)})))},t.prototype.isPointInPath=function(t,e){return this._ctx.isPointInPath(this._doX(t),this._doY(e))},t.prototype.isPointInPathWithoutScroll=function(t,e){return this._ctx.isPointInPath(this._doSize(t),this._doSize(e))},t.prototype.setStrokeStyle=function(t){this._ctx.strokeStyle=t},t.prototype.stroke=function(){return this._ctx.stroke()},t.prototype.translate=function(t,e){return this._ctx.translate(this._doSize(t),this._doSize(e))},t.prototype.rotate=function(t){return this._ctx.rotate(t)},t.prototype.drawImage=function(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];var n=t[0],o=t[1],i=t[2],r=t[3],s=t[4],l=t[t.length-4],a=t[t.length-3],c=t[t.length-2],h=t[t.length-1];return 9===t.length?this._ctx.drawImage(n,this._doSize(o),this._doSize(i),this._doSize(r),this._doSize(s),this._doSize(l),this._doSize(a),this._doSize(c),this._doSize(h)):this._ctx.drawImage(n,this._doSize(l),this._doSize(a),this._doSize(c),this._doSize(h))},t.prototype.createPattern=function(t,e){return this._ctx.createPattern(t,e)},t.prototype.measureText=function(t){return this._ctx.measureText(t)},t.prototype.setTextAlign=function(t){this._ctx.textAlign=t},t.prototype.fillText=function(t,e,n,o){return void 0!==o?this._ctx.fillText(t,this._doSize(e),this._doSize(n),this._doSize(o)):this._ctx.fillText(t,this._doSize(e),this._doSize(n))},t.prototype.strokeText=function(t,e,n,o){return void 0!==o?this._ctx.strokeText(t,this._doSize(e),this._doSize(n),this._doSize(o)):this._ctx.strokeText(t,this._doSize(e),this._doSize(n))},t.prototype.setFont=function(t){var 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(' ')},t.prototype.setTextBaseline=function(t){this._ctx.textBaseline=t},t.prototype.setGlobalAlpha=function(t){this._ctx.globalAlpha=t},t.prototype.save=function(){this._ctx.save()},t.prototype.restore=function(){this._ctx.restore()},t.prototype.scale=function(t,e){this._ctx.scale(t,e)},t.prototype.setShadowColor=function(t){this._ctx.shadowColor=t},t.prototype.setShadowOffsetX=function(t){this._ctx.shadowOffsetX=this._doSize(t)},t.prototype.setShadowOffsetY=function(t){this._ctx.shadowOffsetY=this._doSize(t)},t.prototype.setShadowBlur=function(t){this._ctx.shadowBlur=this._doSize(t)},t.prototype.ellipse=function(t,e,n,o,i,r,s,l){this._ctx.ellipse(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o),i,r,s,l)},t.prototype._doSize=function(t){return this._opts.devicePixelRatio*t},t.prototype._doX=function(t){var e=this._transform,n=e.scale,o=(t-e.scrollX)/n;return this._doSize(o)},t.prototype._doY=function(t){var e=this._transform,n=e.scale,o=(t-e.scrollY)/n;return this._doSize(o)},t}();function ht(t){return'number'==typeof t&&(t>0||t<=0)}function ut(t){return'number'==typeof t&&t>=0}function ft(t){return'string'==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(""+t)}function dt(t){return'string'==typeof t&&/^(data:image\/)/.test(""+t)}var pt={x:function(t){return ht(t)},y:function(t){return ht(t)},w:ut,h:function(t){return'number'==typeof t&&t>=0},angle:function(t){return'number'==typeof t&&t>=-360&&t<=360},number:ht,borderWidth:function(t){return ut(t)},borderRadius:function(t){return ht(t)&&t>=0},color:function(t){return K(t)},imageSrc:function(t){return dt(t)||ft(t)},imageURL:ft,imageBase64:dt,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){var e=!1;if('string'==typeof t){var n=document.createElement('div');n.innerHTML=t,n.children.length>0&&(e=!0),n=null}return e},text:function(t){return'string'==typeof t},fontSize:function(t){return ht(t)&&t>0},lineHeight:function(t){return ht(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 ht(t)&&t>0}};function vt(t){void 0===t&&(t={});var e=t.borderColor,n=t.borderRadius,o=t.borderWidth;return!(t.hasOwnProperty('borderColor')&&!pt.color(e))&&(!(t.hasOwnProperty('borderRadius')&&!pt.number(n))&&!(t.hasOwnProperty('borderWidth')&&!pt.number(o)))}var gt={attrs:function(t){var e=t.x,n=t.y,o=t.w,i=t.h,r=t.angle;return!!(pt.x(e)&&pt.y(n)&&pt.w(o)&&pt.h(i)&&pt.angle(r))&&(r>=-360&&r<=360)},textDesc:function(t){var e=t.text,n=t.color,o=t.fontSize,i=t.lineHeight,r=t.fontFamily,s=t.textAlign,l=t.fontWeight,a=t.bgColor,c=t.strokeWidth,h=t.strokeColor;return!!pt.text(e)&&(!!pt.color(n)&&(!!pt.fontSize(o)&&(!(t.hasOwnProperty('bgColor')&&!pt.color(a))&&(!(t.hasOwnProperty('fontWeight')&&!pt.fontWeight(l))&&(!(t.hasOwnProperty('lineHeight')&&!pt.lineHeight(i))&&(!(t.hasOwnProperty('fontFamily')&&!pt.fontFamily(r))&&(!(t.hasOwnProperty('textAlign')&&!pt.textAlign(s))&&(!(t.hasOwnProperty('strokeWidth')&&!pt.strokeWidth(c))&&(!(t.hasOwnProperty('strokeColor')&&!pt.color(h))&&!!vt(t))))))))))},rectDesc:function(t){var e=t.bgColor;return!(t.hasOwnProperty('bgColor')&&!pt.color(e))&&!!vt(t)},circleDesc:function(t){var e=t.bgColor,n=t.borderColor,o=t.borderWidth;return!(t.hasOwnProperty('bgColor')&&!pt.color(e))&&(!(t.hasOwnProperty('borderColor')&&!pt.color(n))&&!(t.hasOwnProperty('borderWidth')&&!pt.number(o)))},imageDesc:function(t){var e=t.src;return!!pt.imageSrc(e)},svgDesc:function(t){var e=t.svg;return!!pt.svg(e)},htmlDesc:function(t){var e=t.html;return!!pt.html(e)}},mt={is:pt,check:gt,time:{delay:function(t){return new Promise((function(e){setTimeout((function(){e()}),t)}))},compose:function(t){return function(e,n){return function o(i){var r=t[i];i===t.length&&n&&(r=n);if(!r)return Promise.resolve();try{return Promise.resolve(r(e,o.bind(null,i+1)))}catch(t){return Promise.reject(t)}}(0)}},throttle:function(t,e){var n=-1;return function(){for(var o=[],i=0;i<arguments.length;i++)o[i]=arguments[i];n>0||(n=setTimeout((function(){t.apply(void 0,o),n=-1}),e))}}},loader:{loadImage:at,loadSVG:function(t){return ot(this,void 0,void 0,(function(){return it(this,(function(e){switch(e.label){case 0:return[4,st(t)];case 1:return[4,at(e.sent())];case 2:return[2,e.sent()]}}))}))},loadHTML:function(t,e){return ot(this,void 0,void 0,(function(){return it(this,(function(n){switch(n.label){case 0:return[4,rt(t,e)];case 1:return[4,at(n.sent())];case 2:return[2,n.sent()]}}))}))}},file:{downloadImageFromCanvas:function(t,e){var n=e.filename,o=e.type,i=void 0===o?'image/jpeg':o,r=t.toDataURL(i),s=document.createElement('a');s.href=r,s.download=n;var l=document.createEvent('MouseEvents');l.initEvent('click',!0,!1),s.dispatchEvent(l)}},color:{toColorHexStr:function(t){return'#'+t.toString(16)},toColorHexNum:function(t){return parseInt(t.replace(/^\#/,'0x'))},isColorStr:K},uuid:{createUUID:function(){function t(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return""+t()+t()+"-"+t()+"-"+t()+"-"+t()+"-"+t()+t()+t()}},istype:et,data:{deepClone:function(t){return function t(e){var n,o=(n=e,Object.prototype.toString.call(n).replace(/[\]|\[]{1,1}/gi,'').split(' ')[1]);if(['Null','Number','String','Boolean','Undefined'].indexOf(o)>=0)return e;if('Array'===o){var i=[];return e.forEach((function(e){i.push(t(e))})),i}if('Object'===o){var r={};return Object.keys(e).forEach((function(n){r[n]=t(e[n])})),r}}(t)}},Context:ct},yt=function(t,e){return yt=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n])},yt(t,e)};var _t=function(){return _t=Object.assign||function(t){for(var e,n=1,o=arguments.length;n<o;n++)for(var i in e=arguments[n])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t},_t.apply(this,arguments)};function St(t,e,n,o){return new(n||(n=Promise))((function(i,r){function s(t){try{a(o.next(t))}catch(t){r(t)}}function l(t){try{a(o.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?i(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(s,l)}a((o=o.apply(t,e||[])).next())}))}function xt(t,e){var n,o,i,r,s={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return r={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(r[Symbol.iterator]=function(){return this}),r;function l(r){return function(l){return function(r){if(n)throw new TypeError("Generator is already executing.");for(;s;)try{if(n=1,o&&(i=2&r[0]?o.return:r[0]?o.throw||((i=o.return)&&i.call(o),0):o.next)&&!(i=i.call(o,r[1])).done)return i;switch(o=0,i&&(r=[2&r[0],i.value]),r[0]){case 0:case 1:i=r;break;case 4:return s.label++,{value:r[1],done:!1};case 5:s.label++,o=r[1],r=[0];continue;case 7:r=s.ops.pop(),s.trys.pop();continue;default:if(!(i=s.trys,(i=i.length>0&&i[i.length-1])||6!==r[0]&&2!==r[0])){s=0;continue}if(3===r[0]&&(!i||r[1]>i[0]&&r[1]<i[3])){s.label=r[1];break}if(6===r[0]&&s.label<i[1]){s.label=i[1],i=r;break}if(i&&s.label<i[2]){s.label=i[2],s.ops.push(r);break}i[2]&&s.ops.pop(),s.trys.pop();continue}r=e.call(t,s)}catch(t){r=[6,t],o=0}finally{n=i=0}if(5&r[0])throw r[1];return{value:r[0]?r[1]:void 0,done:!0}}([r,l])}}}function bt(t){return'string'==typeof t&&/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)}function wt(t){return(Object.prototype.toString.call(t)||'').replace(/(\[object|\])/gi,'').trim()}var Et={type:function(t,e){var n=wt(t);return!0===e?n.toLocaleLowerCase():n},array:function(t){return'Array'===wt(t)},json:function(t){return'Object'===wt(t)},function:function(t){return'Function'===wt(t)},asyncFunction:function(t){return'AsyncFunction'===wt(t)},string:function(t){return'String'===wt(t)},number:function(t){return'Number'===wt(t)},undefined:function(t){return'Undefined'===wt(t)},null:function(t){return'Null'===wt(t)},promise:function(t){return'Promise'===wt(t)}},Pt=function(){return Pt=Object.assign||function(t){for(var e,n=1,o=arguments.length;n<o;n++)for(var i in e=arguments[n])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t},Pt.apply(this,arguments)};function Ct(t,e,n,o){return new(n||(n=Promise))((function(i,r){function s(t){try{a(o.next(t))}catch(t){r(t)}}function l(t){try{a(o.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?i(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(s,l)}a((o=o.apply(t,e||[])).next())}))}function zt(t,e){var n,o,i,r,s={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return r={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(r[Symbol.iterator]=function(){return this}),r;function l(r){return function(l){return function(r){if(n)throw new TypeError("Generator is already executing.");for(;s;)try{if(n=1,o&&(i=2&r[0]?o.return:r[0]?o.throw||((i=o.return)&&i.call(o),0):o.next)&&!(i=i.call(o,r[1])).done)return i;switch(o=0,i&&(r=[2&r[0],i.value]),r[0]){case 0:case 1:i=r;break;case 4:return s.label++,{value:r[1],done:!1};case 5:s.label++,o=r[1],r=[0];continue;case 7:r=s.ops.pop(),s.trys.pop();continue;default:if(!(i=s.trys,(i=i.length>0&&i[i.length-1])||6!==r[0]&&2!==r[0])){s=0;continue}if(3===r[0]&&(!i||r[1]>i[0]&&r[1]<i[3])){s.label=r[1];break}if(6===r[0]&&s.label<i[1]){s.label=i[1],i=r;break}if(i&&s.label<i[2]){s.label=i[2],s.ops.push(r);break}i[2]&&s.ops.pop(),s.trys.pop();continue}r=e.call(t,s)}catch(t){r=[6,t],o=0}finally{n=i=0}if(5&r[0])throw r[1];return{value:r[0]?r[1]:void 0,done:!0}}([r,l])}}}function Dt(t,e){var n=e.width,o=e.height;return new Promise((function(e,i){var r=new Blob(["\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\""+(n||'')+"\" height = \""+(o||'')+"\">\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'}),s=new FileReader;s.readAsDataURL(r),s.onload=function(t){var n,o=null===(n=null==t?void 0:t.target)||void 0===n?void 0:n.result;e(o)},s.onerror=function(t){i(t)}}))}function Lt(t){return new Promise((function(e,n){var o=new Blob([t],{type:'image/svg+xml;charset=utf-8'}),i=new FileReader;i.readAsDataURL(o),i.onload=function(t){var n,o=null===(n=null==t?void 0:t.target)||void 0===n?void 0:n.result;e(o)},i.onerror=function(t){n(t)}}))}var Tt=window.Image;function Mt(t){return new Promise((function(e,n){var o=new Tt;o.onload=function(){e(o)},o.onabort=n,o.onerror=n,o.src=t}))}var kt=function(){function t(t,e){this._opts=e,this._ctx=t,this._transform={scale:1,scrollX:0,scrollY:0}}return t.prototype.getContext=function(){return this._ctx},t.prototype.resetSize=function(t){this._opts=Pt(Pt({},this._opts),t)},t.prototype.calcDeviceNum=function(t){return t*this._opts.devicePixelRatio},t.prototype.calcScreenNum=function(t){return t/this._opts.devicePixelRatio},t.prototype.getSize=function(){return{width:this._opts.width,height:this._opts.height,contextWidth:this._opts.contextWidth,contextHeight:this._opts.contextHeight,devicePixelRatio:this._opts.devicePixelRatio}},t.prototype.setTransform=function(t){this._transform=Pt(Pt({},this._transform),t)},t.prototype.getTransform=function(){return{scale:this._transform.scale,scrollX:this._transform.scrollX,scrollY:this._transform.scrollY}},t.prototype.setFillStyle=function(t){this._ctx.fillStyle=t},t.prototype.fill=function(t){return this._ctx.fill(t||'nonzero')},t.prototype.arc=function(t,e,n,o,i,r){return this._ctx.arc(this._doSize(t),this._doSize(e),this._doSize(n),o,i,r)},t.prototype.rect=function(t,e,n,o){return this._ctx.rect(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o))},t.prototype.fillRect=function(t,e,n,o){return this._ctx.fillRect(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o))},t.prototype.clearRect=function(t,e,n,o){return this._ctx.clearRect(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o))},t.prototype.beginPath=function(){return this._ctx.beginPath()},t.prototype.closePath=function(){return this._ctx.closePath()},t.prototype.lineTo=function(t,e){return this._ctx.lineTo(this._doSize(t),this._doSize(e))},t.prototype.moveTo=function(t,e){return this._ctx.moveTo(this._doSize(t),this._doSize(e))},t.prototype.arcTo=function(t,e,n,o,i){return this._ctx.arcTo(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o),this._doSize(i))},t.prototype.setLineWidth=function(t){return this._ctx.lineWidth=this._doSize(t)},t.prototype.setLineDash=function(t){var e=this;return this._ctx.setLineDash(t.map((function(t){return e._doSize(t)})))},t.prototype.isPointInPath=function(t,e){return this._ctx.isPointInPath(this._doX(t),this._doY(e))},t.prototype.isPointInPathWithoutScroll=function(t,e){return this._ctx.isPointInPath(this._doSize(t),this._doSize(e))},t.prototype.setStrokeStyle=function(t){this._ctx.strokeStyle=t},t.prototype.stroke=function(){return this._ctx.stroke()},t.prototype.translate=function(t,e){return this._ctx.translate(this._doSize(t),this._doSize(e))},t.prototype.rotate=function(t){return this._ctx.rotate(t)},t.prototype.drawImage=function(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];var n=t[0],o=t[1],i=t[2],r=t[3],s=t[4],l=t[t.length-4],a=t[t.length-3],c=t[t.length-2],h=t[t.length-1];return 9===t.length?this._ctx.drawImage(n,this._doSize(o),this._doSize(i),this._doSize(r),this._doSize(s),this._doSize(l),this._doSize(a),this._doSize(c),this._doSize(h)):this._ctx.drawImage(n,this._doSize(l),this._doSize(a),this._doSize(c),this._doSize(h))},t.prototype.createPattern=function(t,e){return this._ctx.createPattern(t,e)},t.prototype.measureText=function(t){return this._ctx.measureText(t)},t.prototype.setTextAlign=function(t){this._ctx.textAlign=t},t.prototype.fillText=function(t,e,n,o){return void 0!==o?this._ctx.fillText(t,this._doSize(e),this._doSize(n),this._doSize(o)):this._ctx.fillText(t,this._doSize(e),this._doSize(n))},t.prototype.strokeText=function(t,e,n,o){return void 0!==o?this._ctx.strokeText(t,this._doSize(e),this._doSize(n),this._doSize(o)):this._ctx.strokeText(t,this._doSize(e),this._doSize(n))},t.prototype.setFont=function(t){var 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(' ')},t.prototype.setTextBaseline=function(t){this._ctx.textBaseline=t},t.prototype.setGlobalAlpha=function(t){this._ctx.globalAlpha=t},t.prototype.save=function(){this._ctx.save()},t.prototype.restore=function(){this._ctx.restore()},t.prototype.scale=function(t,e){this._ctx.scale(t,e)},t.prototype.setShadowColor=function(t){this._ctx.shadowColor=t},t.prototype.setShadowOffsetX=function(t){this._ctx.shadowOffsetX=this._doSize(t)},t.prototype.setShadowOffsetY=function(t){this._ctx.shadowOffsetY=this._doSize(t)},t.prototype.setShadowBlur=function(t){this._ctx.shadowBlur=this._doSize(t)},t.prototype.ellipse=function(t,e,n,o,i,r,s,l){this._ctx.ellipse(this._doSize(t),this._doSize(e),this._doSize(n),this._doSize(o),i,r,s,l)},t.prototype._doSize=function(t){return this._opts.devicePixelRatio*t},t.prototype._doX=function(t){var e=this._transform,n=e.scale,o=(t-e.scrollX)/n;return this._doSize(o)},t.prototype._doY=function(t){var e=this._transform,n=e.scale,o=(t-e.scrollY)/n;return this._doSize(o)},t}();function It(t){return'number'==typeof t&&(t>0||t<=0)}function Wt(t){return'number'==typeof t&&t>=0}function Ot(t){return'string'==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(""+t)}function Ut(t){return'string'==typeof t&&/^(data:image\/)/.test(""+t)}var Rt={x:function(t){return It(t)},y:function(t){return It(t)},w:Wt,h:function(t){return'number'==typeof t&&t>=0},angle:function(t){return'number'==typeof t&&t>=-360&&t<=360},number:It,borderWidth:function(t){return Wt(t)},borderRadius:function(t){return It(t)&&t>=0},color:function(t){return bt(t)},imageSrc:function(t){return Ut(t)||Ot(t)},imageURL:Ot,imageBase64:Ut,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){var e=!1;if('string'==typeof t){var n=document.createElement('div');n.innerHTML=t,n.children.length>0&&(e=!0),n=null}return e},text:function(t){return'string'==typeof t},fontSize:function(t){return It(t)&&t>0},lineHeight:function(t){return It(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 It(t)&&t>0}};function At(t){void 0===t&&(t={});var e=t.borderColor,n=t.borderRadius,o=t.borderWidth;return!(t.hasOwnProperty('borderColor')&&!Rt.color(e))&&(!(t.hasOwnProperty('borderRadius')&&!Rt.number(n))&&!(t.hasOwnProperty('borderWidth')&&!Rt.number(o)))}var Ft={attrs:function(t){var e=t.x,n=t.y,o=t.w,i=t.h,r=t.angle;return!!(Rt.x(e)&&Rt.y(n)&&Rt.w(o)&&Rt.h(i)&&Rt.angle(r))&&(r>=-360&&r<=360)},textDesc:function(t){var e=t.text,n=t.color,o=t.fontSize,i=t.lineHeight,r=t.fontFamily,s=t.textAlign,l=t.fontWeight,a=t.bgColor,c=t.strokeWidth,h=t.strokeColor;return!!Rt.text(e)&&(!!Rt.color(n)&&(!!Rt.fontSize(o)&&(!(t.hasOwnProperty('bgColor')&&!Rt.color(a))&&(!(t.hasOwnProperty('fontWeight')&&!Rt.fontWeight(l))&&(!(t.hasOwnProperty('lineHeight')&&!Rt.lineHeight(i))&&(!(t.hasOwnProperty('fontFamily')&&!Rt.fontFamily(r))&&(!(t.hasOwnProperty('textAlign')&&!Rt.textAlign(s))&&(!(t.hasOwnProperty('strokeWidth')&&!Rt.strokeWidth(c))&&(!(t.hasOwnProperty('strokeColor')&&!Rt.color(h))&&!!At(t))))))))))},rectDesc:function(t){var e=t.bgColor;return!(t.hasOwnProperty('bgColor')&&!Rt.color(e))&&!!At(t)},circleDesc:function(t){var e=t.bgColor,n=t.borderColor,o=t.borderWidth;return!(t.hasOwnProperty('bgColor')&&!Rt.color(e))&&(!(t.hasOwnProperty('borderColor')&&!Rt.color(n))&&!(t.hasOwnProperty('borderWidth')&&!Rt.number(o)))},imageDesc:function(t){var e=t.src;return!!Rt.imageSrc(e)},svgDesc:function(t){var e=t.svg;return!!Rt.svg(e)},htmlDesc:function(t){var e=t.html;return!!Rt.html(e)}},Yt={is:Rt,check:Ft,time:{delay:function(t){return new Promise((function(e){setTimeout((function(){e()}),t)}))},compose:function(t){return function(e,n){return function o(i){var r=t[i];i===t.length&&n&&(r=n);if(!r)return Promise.resolve();try{return Promise.resolve(r(e,o.bind(null,i+1)))}catch(t){return Promise.reject(t)}}(0)}},throttle:function(t,e){var n=-1;return function(){for(var o=[],i=0;i<arguments.length;i++)o[i]=arguments[i];n>0||(n=setTimeout((function(){t.apply(void 0,o),n=-1}),e))}}},loader:{loadImage:Mt,loadSVG:function(t){return Ct(this,void 0,void 0,(function(){return zt(this,(function(e){switch(e.label){case 0:return[4,Lt(t)];case 1:return[4,Mt(e.sent())];case 2:return[2,e.sent()]}}))}))},loadHTML:function(t,e){return Ct(this,void 0,void 0,(function(){return zt(this,(function(n){switch(n.label){case 0:return[4,Dt(t,e)];case 1:return[4,Mt(n.sent())];case 2:return[2,n.sent()]}}))}))}},file:{downloadImageFromCanvas:function(t,e){var n=e.filename,o=e.type,i=void 0===o?'image/jpeg':o,r=t.toDataURL(i),s=document.createElement('a');s.href=r,s.download=n;var l=document.createEvent('MouseEvents');l.initEvent('click',!0,!1),s.dispatchEvent(l)}},color:{toColorHexStr:function(t){return'#'+t.toString(16)},toColorHexNum:function(t){return parseInt(t.replace(/^\#/,'0x'))},isColorStr:bt},uuid:{createUUID:function(){function t(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return""+t()+t()+"-"+t()+"-"+t()+"-"+t()+"-"+t()+t()+t()}},istype:Et,data:{deepClone:function(t){return function t(e){var n,o=(n=e,Object.prototype.toString.call(n).replace(/[\]|\[]{1,1}/gi,'').split(' ')[1]);if(['Null','Number','String','Boolean','Undefined'].indexOf(o)>=0)return e;if('Array'===o){var i=[];return e.forEach((function(e){i.push(t(e))})),i}if('Object'===o){var r={};return Object.keys(e).forEach((function(n){r[n]=t(e[n])})),r}}(t)}},Context:kt};function Xt(t,e,n){var o=function(t){return{x:t.x+t.w/2,y:t.y+t.h/2}}(e),i=function(t){return t/180*Math.PI}(e.angle||0);return function(t,e,n,o){e&&(n>0||n<0)&&(t.translate(e.x,e.y),t.rotate(n),t.translate(-e.x,-e.y));o(t),e&&(n>0||n<0)&&(t.translate(e.x,e.y),t.rotate(-n),t.translate(-e.x,-e.y))}(t,o,i||0,n)}var Nt=Yt.is,Ht=Yt.istype,Bt=Yt.color;function jt(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 Gt(t,e,n){jt(t),function(t,e){jt(t),Xt(t,e,(function(){if(e.desc.borderWidth&&e.desc.borderWidth>0){var n=e.desc.borderWidth,o='#000000';!0===Bt.isColorStr(e.desc.borderColor)&&(o=e.desc.borderColor);var i=e.x-n/2,r=e.y-n/2,s=e.w+n,l=e.h+n,a=e.desc.borderRadius||0;(a=Math.min(a,s/2,l/2))<s/2&&a<l/2&&(a+=n/2);var c=e.desc;void 0!==c.shadowColor&&Bt.isColorStr(c.shadowColor)&&t.setShadowColor(c.shadowColor),void 0!==c.shadowOffsetX&&Nt.number(c.shadowOffsetX)&&t.setShadowOffsetX(c.shadowOffsetX),void 0!==c.shadowOffsetY&&Nt.number(c.shadowOffsetY)&&t.setShadowOffsetY(c.shadowOffsetY),void 0!==c.shadowBlur&&Nt.number(c.shadowBlur)&&t.setShadowBlur(c.shadowBlur),t.beginPath(),t.setLineWidth(n),t.setStrokeStyle(o),t.moveTo(i+a,r),t.arcTo(i+s,r,i+s,r+l,a),t.arcTo(i+s,r+l,i,r+l,a),t.arcTo(i,r+l,i,r,a),t.arcTo(i,r,i+s,r,a),t.closePath(),t.stroke()}}))}(t,e),jt(t),Xt(t,e,(function(){var o=e.x,i=e.y,r=e.w,s=e.h,l=e.desc.borderRadius||0;(r<2*(l=Math.min(l,r/2,s/2))||s<2*l)&&(l=0),t.beginPath(),t.moveTo(o+l,i),t.arcTo(o+r,i,o+r,i+s,l),t.arcTo(o+r,i+s,o,i+s,l),t.arcTo(o,i+s,o,i,l),t.arcTo(o,i,o+r,i,l),t.closePath(),('string'==typeof n||['CanvasPattern'].includes(Ht.type(n)))&&t.setFillStyle(n),t.fill()}))}function Qt(t,e){Gt(t,e,e.desc.bgColor)}function Vt(t,e,n){var o=n.getContent(e.uuid);Xt(t,e,(function(){o&&t.drawImage(o,e.x,e.y,e.w,e.h)}))}function $t(t,e,n){var o=n.getContent(e.uuid);Xt(t,e,(function(){o&&t.drawImage(o,e.x,e.y,e.w,e.h)}))}function Zt(t,e,n){var o=n.getContent(e.uuid);Xt(t,e,(function(){o&&t.drawImage(o,e.x,e.y,e.w,e.h)}))}var qt=Yt.is,Jt=Yt.color;function Kt(t,e,n){jt(t),Gt(t,e,e.desc.bgColor||'transparent'),Xt(t,e,(function(){var n=_t({fontSize:12,fontFamily:'sans-serif',textAlign:'center'},e.desc);t.setFillStyle(e.desc.color),t.setTextBaseline('top'),t.setFont({fontWeight:n.fontWeight,fontSize:n.fontSize,fontFamily:n.fontFamily});var o=n.text.replace(/\r\n/gi,'\n'),i=n.lineHeight||n.fontSize,r=o.split('\n'),s=[];r.forEach((function(n){for(var o='',r=0,l=0;l<n.length&&(t.measureText(o+(n[l]||'')).width<t.calcDeviceNum(e.w)?o+=n[l]||'':(s.push({text:o,width:t.calcScreenNum(t.measureText(o).width)}),o=n[l]||'',r++),!((r+1)*i>e.h));l++)if(o&&n.length-1===l&&(r+1)*i<e.h){s.push({text:o,width:t.calcScreenNum(t.measureText(o).width)});break}}));var l=e.y;if(s.length*i<e.h&&(l+=(e.h-s.length*i)/2),void 0!==n.textShadowColor&&Jt.isColorStr(n.textShadowColor)&&t.setShadowColor(n.textShadowColor),void 0!==n.textShadowOffsetX&&qt.number(n.textShadowOffsetX)&&t.setShadowOffsetX(n.textShadowOffsetX),void 0!==n.textShadowOffsetY&&qt.number(n.textShadowOffsetY)&&t.setShadowOffsetY(n.textShadowOffsetY),void 0!==n.textShadowBlur&&qt.number(n.textShadowBlur)&&t.setShadowBlur(n.textShadowBlur),s.forEach((function(o,r){var s=e.x;'center'===n.textAlign?s=e.x+(e.w-o.width)/2:'right'===n.textAlign&&(s=e.x+(e.w-o.width)),t.fillText(o.text,s,l+i*r)})),jt(t),Jt.isColorStr(n.strokeColor)&&void 0!==n.strokeWidth&&n.strokeWidth>0){var a=e.y;s.length*i<e.h&&(a+=(e.h-s.length*i)/2),s.forEach((function(o,r){var s=e.x;'center'===n.textAlign?s=e.x+(e.w-o.width)/2:'right'===n.textAlign&&(s=e.x+(e.w-o.width)),void 0!==n.strokeColor&&t.setStrokeStyle(n.strokeColor),void 0!==n.strokeWidth&&n.strokeWidth>0&&t.setLineWidth(n.strokeWidth),t.strokeText(o.text,s,a+i*r)}))}}))}function te(t,e){jt(t),Xt(t,e,(function(t){var n=e.x,o=e.y,i=e.w,r=e.h,s=e.desc,l=s.bgColor,a=void 0===l?'#000000':l,c=s.borderColor,h=void 0===c?'#000000':c,u=s.borderWidth,f=void 0===u?0:u,d=i/2,p=r/2,v=n+d,g=o+p;if(f&&f>0){var m=f/2+d,y=f/2+p;t.beginPath(),t.setStrokeStyle(h),t.setLineWidth(f),t.ellipse(v,g,m,y,0,0,2*Math.PI),t.closePath(),t.stroke()}t.beginPath(),t.setFillStyle(a),t.ellipse(v,g,d,p,0,0,2*Math.PI),t.closePath(),t.fill()}))}var ee=Yt.color.isColorStr;function ne(t,e,n){var o;jt(t);var i=t.getSize();if(t.clearRect(0,0,i.contextWidth,i.contextHeight),'string'==typeof e.bgColor&&ee(e.bgColor)&&function(t,e){var n=t.getSize();t.setFillStyle(e),t.fillRect(0,0,n.contextWidth,n.contextHeight)}(t,e.bgColor),e.elements.length>0)for(var r=0;r<e.elements.length;r++){var s=e.elements[r];if(!0!==(null===(o=null==s?void 0:s.operation)||void 0===o?void 0:o.invisible))switch(s.type){case'rect':Qt(t,s);break;case'text':Kt(t,s);break;case'image':Vt(t,s,n);break;case'svg':$t(t,s,n);break;case'html':Zt(t,s,n);break;case'circle':te(t,s)}}}var oe=function(){function t(){this._listeners=new Map}return t.prototype.on=function(t,e){if(this._listeners.has(t)){var n=this._listeners.get(t);null==n||n.push(e),this._listeners.set(t,n||[])}else this._listeners.set(t,[e])},t.prototype.off=function(t,e){if(this._listeners.has(t)){var n=this._listeners.get(t);if(Array.isArray(n))for(var o=0;o<(null==n?void 0:n.length);o++)if(n[o]===e){n.splice(o,1);break}this._listeners.set(t,n||[])}},t.prototype.trigger=function(t,e){var n=this._listeners.get(t);return!!Array.isArray(n)&&(n.forEach((function(t){t(e)})),!0)},t.prototype.has=function(t){if(this._listeners.has(t)){var e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1},t}();var ie,re=Yt.loader,se=re.loadImage,le=re.loadSVG,ae=re.loadHTML,ce=Yt.data.deepClone;!function(t){t.FREE="free",t.LOADING="loading",t.COMPLETE="complete"}(ie||(ie={}));var he,ue,fe,de,pe=function(){function t(t){this._currentLoadData={},this._currentUUIDQueue=[],this._storageLoadData={},this._status=ie.FREE,this._waitingLoadQueue=[],this._opts=t,this._event=new oe,this._waitingLoadQueue=[]}return t.prototype.load=function(t,e){var n=this._resetLoadData(t,e),o=n[0],i=n[1];this._status===ie.FREE||this._status===ie.COMPLETE?(this._currentUUIDQueue=o,this._currentLoadData=i,this._loadTask()):this._status===ie.LOADING&&o.length>0&&this._waitingLoadQueue.push({uuidQueue:o,loadData:i})},t.prototype.on=function(t,e){this._event.on(t,e)},t.prototype.off=function(t,e){this._event.off(t,e)},t.prototype.isComplete=function(){return this._status===ie.COMPLETE},t.prototype.getContent=function(t){var e;return'loaded'===(null===(e=this._storageLoadData[t])||void 0===e?void 0:e.status)?this._storageLoadData[t].content:null},t.prototype._resetLoadData=function(t,e){for(var n={},o=[],i=this._storageLoadData,r=t.elements.length-1;r>=0;r--){var s=t.elements[r];['image','svg','html'].includes(s.type)&&(i[s.uuid]?e.includes(s.uuid)&&(n[s.uuid]=this._createEmptyLoadItem(s),o.push(s.uuid)):(n[s.uuid]=this._createEmptyLoadItem(s),o.push(s.uuid)))}return[o,n]},t.prototype._createEmptyLoadItem=function(t){var e='',n=t.type,o=t.w,i=t.h;if('image'===t.type)e=(r=t).desc.src||'';else if('svg'===t.type){e=(r=t).desc.svg||''}else if('html'===t.type){var r;e=function(t){return t.replace(/<script[\s\S]*?<\/script>/gi,'')}((r=t).desc.html||''),o=r.desc.width||t.w,i=r.desc.height||t.h}return{uuid:t.uuid,type:n,status:'null',content:null,source:e,elemW:o,elemH:i,element:ce(t)}},t.prototype._loadTask=function(){var t=this;if(this._status!==ie.LOADING){if(this._status=ie.LOADING,0===this._currentUUIDQueue.length){if(0===this._waitingLoadQueue.length)return this._status=ie.COMPLETE,void this._event.trigger('complete',void 0);var e=this._waitingLoadQueue.shift();if(e){var n=e.uuidQueue,o=e.loadData;this._currentLoadData=o,this._currentUUIDQueue=n}}var i=this._opts.maxParallelNum,r=this._currentUUIDQueue.splice(0,i),s={};r.forEach((function(t,e){s[t]=e}));var l=[],a=function(){if(l.length>=i)return!1;if(0===r.length)return!0;for(var e=function(e){var n=r.shift();if(void 0===n)return"break";l.push(n),t._loadElementSource(t._currentLoadData[n]).then((function(e){var o,i;l.splice(l.indexOf(n),1);var s=a();t._storageLoadData[n]={uuid:n,type:t._currentLoadData[n].type,status:'loaded',content:e,source:t._currentLoadData[n].source,elemW:t._currentLoadData[n].elemW,elemH:t._currentLoadData[n].elemH,element:t._currentLoadData[n].element},0===l.length&&0===r.length&&!0===s&&(t._status=ie.FREE,t._loadTask()),t._event.trigger('load',{uuid:null===(o=t._storageLoadData[n])||void 0===o?void 0:o.uuid,type:t._storageLoadData[n].type,status:t._storageLoadData[n].status,content:t._storageLoadData[n].content,source:t._storageLoadData[n].source,elemW:t._storageLoadData[n].elemW,elemH:t._storageLoadData[n].elemH,element:null===(i=t._storageLoadData[n])||void 0===i?void 0:i.element})})).catch((function(e){var o,i,s,c,h,u,f,d,p,v,g,m;console.warn(e),l.splice(l.indexOf(n),1);var y=a();t._currentLoadData[n]&&(t._storageLoadData[n]={uuid:n,type:null===(o=t._currentLoadData[n])||void 0===o?void 0:o.type,status:'fail',content:null,error:e,source:null===(i=t._currentLoadData[n])||void 0===i?void 0:i.source,elemW:null===(s=t._currentLoadData[n])||void 0===s?void 0:s.elemW,elemH:null===(c=t._currentLoadData[n])||void 0===c?void 0:c.elemH,element:null===(h=t._currentLoadData[n])||void 0===h?void 0:h.element}),0===l.length&&0===r.length&&!0===y&&(t._status=ie.FREE,t._loadTask()),t._currentLoadData[n]&&t._event.trigger('error',{uuid:n,type:null===(u=t._storageLoadData[n])||void 0===u?void 0:u.type,status:null===(f=t._storageLoadData[n])||void 0===f?void 0:f.status,content:null===(d=t._storageLoadData[n])||void 0===d?void 0:d.content,source:null===(p=t._storageLoadData[n])||void 0===p?void 0:p.source,elemW:null===(v=t._storageLoadData[n])||void 0===v?void 0:v.elemW,elemH:null===(g=t._storageLoadData[n])||void 0===g?void 0:g.elemH,element:null===(m=t._storageLoadData[n])||void 0===m?void 0:m.element})}))},n=l.length;n<i;n++){if("break"===e())break}return!1};a()}},t.prototype._loadElementSource=function(t){return St(this,void 0,void 0,(function(){return xt(this,(function(e){switch(e.label){case 0:return t&&'image'===t.type?[4,se(t.source)]:[3,2];case 1:case 3:case 5:return[2,e.sent()];case 2:return t&&'svg'===t.type?[4,le(t.source)]:[3,4];case 4:return t&&'html'===t.type?[4,ae(t.source,{width:t.elemW,height:t.elemH})]:[3,6];case 6:throw Error('Element\'s source is not support!')}}))}))},t}(),ve=function(){function t(){this._listeners=new Map}return t.prototype.on=function(t,e){if(this._listeners.has(t)){var n=this._listeners.get(t);null==n||n.push(e),this._listeners.set(t,n||[])}else this._listeners.set(t,[e])},t.prototype.off=function(t,e){if(this._listeners.has(t)){var n=this._listeners.get(t);if(Array.isArray(n))for(var o=0;o<(null==n?void 0:n.length);o++)if(n[o]===e){n.splice(o,1);break}this._listeners.set(t,n||[])}},t.prototype.trigger=function(t,e){var n=this._listeners.get(t);return!!Array.isArray(n)&&(n.forEach((function(t){t(e)})),!0)},t.prototype.has=function(t){if(this._listeners.has(t)){var e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1},t}(),ge=Symbol('_queue'),me=Symbol('_ctx'),ye=Symbol('_status'),_e=Symbol('_loader'),Se=Symbol('_opts'),xe=Symbol('_freeze'),be=Symbol('_drawFrame'),we=Symbol('_retainQueueOneItem'),Ee=window.requestAnimationFrame,Pe=Yt.uuid.createUUID,Ce=Yt.data.deepClone,ze=Yt.Context;!function(t){t.NULL="null",t.FREE="free",t.DRAWING="drawing",t.FREEZE="freeze"}(de||(de={}));var De=function(t){function e(e){var n=t.call(this)||this;return n[he]=[],n[ue]=null,n[fe]=de.NULL,n[Se]=e,n[_e]=new pe({maxParallelNum:6}),n[_e].on('load',(function(t){n[be](),n.trigger('load',{element:t.element})})),n[_e].on('error',(function(t){n.trigger('error',{element:t.element,error:t.error})})),n[_e].on('complete',(function(){n.trigger('loadComplete',{t:Date.now()})})),n}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Class extends value "+String(e)+" is not a constructor or null");function n(){this.constructor=t}yt(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}(e,t),e.prototype.render=function(t,e,n){var o=(n||{}).changeResourceUUIDs,i=void 0===o?[]:o;this[ye]=de.FREE;var r=Ce(e);if(Array.isArray(r.elements)&&r.elements.forEach((function(t){'string'==typeof t.uuid&&t.uuid||(t.uuid=Pe())})),!this[me])if(this[Se]&&'[object HTMLCanvasElement]'===Object.prototype.toString.call(t)){var s=this[Se],l=s.width,a=s.height,c=s.contextWidth,h=s.contextHeight,u=s.devicePixelRatio,f=t;f.width=l*u,f.height=a*u;var d=f.getContext('2d');this[me]=new ze(d,{width:l,height:a,contextWidth:c||l,contextHeight:h||a,devicePixelRatio:u})}else t&&(this[me]=t);if(![de.FREEZE].includes(this[ye])){var p=Ce({data:r});this[ge].push(p),this[be](),this[_e].load(r,i||[])}},e.prototype.getContext=function(){return this[me]},e.prototype.thaw=function(){this[ye]=de.FREE},e.prototype[(he=ge,ue=me,fe=ye,xe)]=function(){this[ye]=de.FREEZE},e.prototype[be]=function(){var t=this;this[ye]!==de.FREEZE&&Ee((function(){if(t[ye]!==de.FREEZE){var e=t[me],n=t[ge][0],o=!1;t[ge].length>1?n=t[ge].shift():o=!0,!0!==t[_e].isComplete()?(t[be](),n&&e&&ne(e,n.data,t[_e])):n&&e?(ne(e,n.data,t[_e]),t[we](),o?t[ye]=de.FREE:t[be]()):t[ye]=de.FREE,t.trigger('drawFrame',{t:Date.now()}),!0===t[_e].isComplete()&&1===t[ge].length&&t[ye]===de.FREE&&(e&&t[ge][0]&&t[ge][0].data&&ne(e,t[ge][0].data,t[_e]),t.trigger('drawFrameComplete',{t:Date.now()}),t[xe]())}}))},e.prototype[we]=function(){if(!(this[ge].length<=1)){var t=Ce(this[ge][this[ge].length-1]);this[ge]=[t]}},e}(ve),Le=mt.color.isColorStr;function Te(t){return'number'==typeof t&&(t>0||t<=0)}function Me(t){return'number'==typeof t&&t>=0}function ke(t){return'string'==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(""+t)}function Ie(t){return'string'==typeof t&&/^(data:image\/)/.test(""+t)}var We={x:function(t){return Te(t)},y:function(t){return Te(t)},w:Me,h:function(t){return'number'==typeof t&&t>=0},angle:function(t){return'number'==typeof t&&t>=-360&&t<=360},number:Te,borderWidth:function(t){return Me(t)},borderRadius:function(t){return Te(t)&&t>=0},color:function(t){return Le(t)},imageSrc:function(t){return Ie(t)||ke(t)},imageURL:ke,imageBase64:Ie,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){var e=!1;if('string'==typeof t){var n=document.createElement('div');n.innerHTML=t,n.children.length>0&&(e=!0),n=null}return e},text:function(t){return'string'==typeof t},fontSize:function(t){return Te(t)&&t>0},lineHeight:function(t){return Te(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 Te(t)&&t>0}};function Oe(t){void 0===t&&(t={});var e=t.borderColor,n=t.borderRadius,o=t.borderWidth;return!(t.hasOwnProperty('borderColor')&&!We.color(e))&&(!(t.hasOwnProperty('borderRadius')&&!We.number(n))&&!(t.hasOwnProperty('borderWidth')&&!We.number(o)))}var Ue={attrs:function(t){var e=t.x,n=t.y,o=t.w,i=t.h,r=t.angle;return!!(We.x(e)&&We.y(n)&&We.w(o)&&We.h(i)&&We.angle(r))&&(r>=-360&&r<=360)},textDesc:function(t){var e=t.text,n=t.color,o=t.fontSize,i=t.lineHeight,r=t.fontFamily,s=t.textAlign,l=t.fontWeight,a=t.bgColor,c=t.strokeWidth,h=t.strokeColor;return!!We.text(e)&&(!!We.color(n)&&(!!We.fontSize(o)&&(!(t.hasOwnProperty('bgColor')&&!We.color(a))&&(!(t.hasOwnProperty('fontWeight')&&!We.fontWeight(l))&&(!(t.hasOwnProperty('lineHeight')&&!We.lineHeight(i))&&(!(t.hasOwnProperty('fontFamily')&&!We.fontFamily(r))&&(!(t.hasOwnProperty('textAlign')&&!We.textAlign(s))&&(!(t.hasOwnProperty('strokeWidth')&&!We.strokeWidth(c))&&(!(t.hasOwnProperty('strokeColor')&&!We.color(h))&&!!Oe(t))))))))))},rectDesc:function(t){var e=t.bgColor;return!(t.hasOwnProperty('bgColor')&&!We.color(e))&&!!Oe(t)},circleDesc:function(t){var e=t.bgColor,n=t.borderColor,o=t.borderWidth;return!(t.hasOwnProperty('bgColor')&&!We.color(e))&&(!(t.hasOwnProperty('borderColor')&&!We.color(n))&&!(t.hasOwnProperty('borderWidth')&&!We.number(o)))},imageDesc:function(t){var e=t.src;return!!We.imageSrc(e)},svgDesc:function(t){var e=t.svg;return!!We.svg(e)},htmlDesc:function(t){var e=t.html;return!!We.html(e)}};function Re(t){return t/180*Math.PI}function Ae(t){return{x:t.x+t.w/2,y:t.y+t.h/2}}function Fe(t,e){var n=e.x-t.x,o=t.y-e.y;if(0===n){if(o<0)return Math.PI/2;if(o>0)return 1.5*Math.PI}else if(0===o){if(n<0)return Math.PI;if(n>0)return 0}return n>0&&o<0?Math.atan(Math.abs(o)/Math.abs(n)):n<0&&o<0?Math.PI-Math.atan(Math.abs(o)/Math.abs(n)):n<0&&o>0?Math.PI+Math.atan(Math.abs(o)/Math.abs(n)):n>0&&o>0?2*Math.PI-Math.atan(Math.abs(o)/Math.abs(n)):null}var Ye={elementWrapper:{color:'#2ab6f1',lockColor:'#aaaaaa',controllerSize:6,lineWidth:1,lineDash:[4,3]}};var Xe=function(){function t(){this._listeners=new Map}return t.prototype.on=function(t,e){if(this._listeners.has(t)){var n=this._listeners.get(t);null==n||n.push(e),this._listeners.set(t,n||[])}else this._listeners.set(t,[e])},t.prototype.off=function(t,e){if(this._listeners.has(t)){var n=this._listeners.get(t);if(Array.isArray(n))for(var o=0;o<(null==n?void 0:n.length);o++)if(n[o]===e){n.splice(o,1);break}this._listeners.set(t,n||[])}},t.prototype.trigger=function(t,e){var n=this._listeners.get(t);return!!Array.isArray(n)&&(n.forEach((function(t){t(e)})),!0)},t.prototype.has=function(t){if(this._listeners.has(t)){var e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1},t}();function Ne(t,e){var n,o;return(null===(n=null==t?void 0:t.desc)||void 0===n?void 0:n.src)!==(null===(o=null==e?void 0:e.desc)||void 0===o?void 0:o.src)}function He(t,e){var n,o;return(null===(n=null==t?void 0:t.desc)||void 0===n?void 0:n.svg)!==(null===(o=null==e?void 0:e.desc)||void 0===o?void 0:o.svg)}function Be(t,e){var n,o,i,r,s,l;return(null===(n=null==t?void 0:t.desc)||void 0===n?void 0:n.html)!==(null===(o=null==e?void 0:e.desc)||void 0===o?void 0:o.html)||(null===(i=null==t?void 0:t.desc)||void 0===i?void 0:i.width)!==(null===(r=null==e?void 0:e.desc)||void 0===r?void 0:r.width)||(null===(s=null==t?void 0:t.desc)||void 0===s?void 0:s.height)!==(null===(l=null==e?void 0:e.desc)||void 0===l?void 0:l.height)}function je(t,e){var n=null,o=!1;switch(e.type){case'image':o=Ne(t,e);break;case'svg':o=He(t,e);break;case'html':o=Be(t,e)}return!0===o&&(n=e.uuid),n}function Ge(t){var e={};return t.elements.forEach((function(t){e[t.uuid]=t})),e}function Qe(t,e,n){return Ve(t,Ae(e),Re(e.angle||0)||0,n)}function Ve(t,e,n,o){e&&(n>0||n<0)&&(t.translate(e.x,e.y),t.rotate(n),t.translate(-e.x,-e.y)),o(t),e&&(n>0||n<0)&&(t.translate(e.x,e.y),t.rotate(-n),t.translate(-e.x,-e.y))}function $e(t){var e=t.toFixed(2);return parseFloat(e)}function Ze(t){return $e(t%360)}var qe=Object.keys({text:{},rect:{},image:{},svg:{},circle:{},html:{}}),Je=mt.uuid.createUUID,Ke=15,tn=function(){function t(t){this._ctx=t}return t.prototype.initData=function(t){return t.elements.forEach((function(t){t.uuid&&'string'==typeof t.uuid||(t.uuid=Je())})),t},t.prototype.isPointInElement=function(t,e){for(var n,o,i=this._ctx,r=-1,s=null,l=function(l){var a=e.elements[l];if(!0===(null===(n=a.operation)||void 0===n?void 0:n.invisible))return"continue";var c=0;return(null===(o=a.desc)||void 0===o?void 0:o.borderWidth)>0&&(c=a.desc.borderWidth),Qe(i,a,(function(){i.beginPath(),i.moveTo(a.x-c,a.y-c),i.lineTo(a.x+a.w+c,a.y-c),i.lineTo(a.x+a.w+c,a.y+a.h+c),i.lineTo(a.x-c,a.y+a.h+c),i.lineTo(a.x-c,a.y-c),i.closePath(),i.isPointInPath(t.x,t.y)&&(r=l,s=a.uuid)})),r>=0?"break":void 0},a=e.elements.length-1;a>=0;a--){if("break"===l(a))break}return[r,s]},t.prototype.dragElement=function(t,e,n,o,i){var r=this.getElementIndex(t,e);if(t.elements[r]){var s=n.x-o.x,l=n.y-o.y;t.elements[r].x+=s/i,t.elements[r].y+=l/i,this.limitElementAttrs(t.elements[r])}},t.prototype.transformElement=function(t,e,n,o,i,r){var s,l,a=this.getElementIndex(t,e);if(!t.elements[a])return null;if(!0===(null===(l=null===(s=t.elements[a])||void 0===s?void 0:s.operation)||void 0===l?void 0:l.lock))return null;var c=(n.x-o.x)/i,h=(n.y-o.y)/i,u=t.elements[a];if(['top-left','top','top-right','right','bottom-right','bottom','bottom-left','left'].includes(r)){var f=function(t,e,n,o,i){var r={x:t.x,y:t.y,w:t.w,h:t.h};switch(t.angle,o){case'top-left':t.w-e>0&&t.h-n>0&&(r.x+=e,r.y+=n,r.w-=e,r.h-=n);break;case'top':if(0===t.angle||Math.abs(t.angle)<Ke)r.h-n>0&&(r.y+=n,r.h-=n);else if(t.angle>0||t.angle<0){var s=t.angle>0?t.angle:Math.max(0,t.angle+360),l=nn(e,n),a=r.x+t.w/2,c=r.y+t.h/2;if(s<90){l=0-on(l,n);var h=en(s);a+=(p=l/2)*Math.sin(h),c-=p*Math.cos(h)}else if(s<180){l=on(l,e);h=en(s-90);a+=(p=l/2)*Math.cos(h),c+=p*Math.sin(h)}else if(s<270){l=on(l,n);h=en(s-180);a-=(p=l/2)*Math.sin(h),c+=p*Math.cos(h)}else if(s<360){l=0-on(l,e);h=en(s-270);a-=(p=l/2)*Math.cos(h),c-=p*Math.sin(h)}r.h+l>0&&(r.h=r.h+l,r.x=a-r.w/2,r.y=c-r.h/2)}else r.h-n>0&&(r.y+=n,r.h-=n);break;case'top-right':r.h-n>0&&r.w+e>0&&(r.y+=n,r.w+=e,r.h-=n);break;case'right':if(0===t.angle||Math.abs(t.angle)<Ke)t.w+e>0&&(r.w+=e);else if(t.angle>0||t.angle<0){var u=t.angle>0?t.angle:Math.max(0,t.angle+360);l=nn(e,n),a=r.x+t.w/2,c=r.y+t.h/2;if(u<90){l=on(l,n);h=en(u);a+=(p=l/2)*Math.cos(h),c+=p*Math.sin(h)}else if(u<180){l=on(l,n);h=en(u-90);a-=(p=l/2)*Math.sin(h),c+=p*Math.cos(h)}else if(u<270){l=on(l,n);h=en(u-180);a+=(p=l/2)*Math.cos(h),c+=p*Math.sin(h),l=0-l}else if(u<360){l=on(l,e);h=en(u-270);a+=(p=l/2)*Math.sin(h),c-=p*Math.cos(h)}r.w+l>0&&(r.w=r.w+l,r.x=a-r.w/2,r.y=c-r.h/2)}else t.w+e>0&&(r.w+=e);break;case'bottom-right':t.w+e>0&&t.h+n>0&&(r.w+=e,r.h+=n);break;case'bottom':if(0===t.angle||Math.abs(t.angle)<Ke)t.h+n>0&&(r.h+=n);else if(t.angle>0||t.angle<0){var f=t.angle>0?t.angle:Math.max(0,t.angle+360);l=nn(e,n),a=r.x+t.w/2,c=r.y+t.h/2;if(f<90){l=on(l,n);h=en(f);a-=(p=l/2)*Math.sin(h),c+=p*Math.cos(h)}else if(f<180){l=0-on(l,e);h=en(f-90);a-=(p=l/2)*Math.cos(h),c-=p*Math.sin(h)}else if(f<270){l=on(l,e);h=en(f-180);a+=(p=l/2)*Math.sin(h),c-=p*Math.cos(h)}else if(f<360){l=on(l,e);h=en(f-270);a+=(p=l/2)*Math.cos(h),c+=p*Math.sin(h)}r.h+l>0&&(r.h=r.h+l,r.x=a-r.w/2,r.y=c-r.h/2)}else t.h+n>0&&(r.h+=n);break;case'bottom-left':t.w-e>0&&t.h+n>0&&(r.x+=e,r.w-=e,r.h+=n);break;case'left':if(0===t.angle||Math.abs(t.angle)<Ke)t.w-e>0&&(r.x+=e,r.w-=e);else if(t.angle>0||t.angle<0){var d=t.angle>0?t.angle:Math.max(0,t.angle+360);l=nn(e,n),a=r.x+t.w/2,c=r.y+t.h/2;if(d<90){l=0-on(l,e);h=en(d);a-=(p=l/2)*Math.cos(h),c-=p*Math.sin(h)}else if(d<180){l=on(l,e);h=en(d-90);a+=(p=l/2)*Math.sin(h),c-=p*Math.cos(h)}else if(d<270){l=on(l,n);h=en(d-180);a+=(p=l/2)*Math.cos(h),c+=p*Math.sin(h)}else if(d<360){l=on(l,n);var p;h=en(d-270);a-=(p=l/2)*Math.sin(h),c+=p*Math.cos(h)}r.w+l>0&&(r.w=r.w+l,r.x=a-r.w/2,r.y=c-r.h/2)}else t.w-e>0&&(r.x+=e,r.w-=e)}return r}(u,c,h,r);u.x=f.x,u.y=f.y,u.w=f.w,u.h=f.h}else if('rotate'===r){var d=function(t,e,n){var o=Fe(t,e),i=Fe(t,n);return null!==i&&null!==o?o>3*Math.PI/2&&i<Math.PI/2?i+(2*Math.PI-o):i>3*Math.PI/2&&o<Math.PI/2?o+(2*Math.PI-i):i-o:0}(Ae(u),o,n);u.angle=(u.angle||0)+function(t){return t/Math.PI*180}(d)}return this.limitElementAttrs(u),{width:$e(u.w),height:$e(u.h),angle:Ze(u.angle||0)}},t.prototype.getElementIndex=function(t,e){for(var n=-1,o=0;o<t.elements.length;o++)if(t.elements[o].uuid===e){n=o;break}return n},t.prototype.limitElementAttrs=function(t){t.x=$e(t.x),t.y=$e(t.y),t.w=$e(t.w),t.h=$e(t.h),t.angle=Ze(t.angle||0)},t}();function en(t){return t*Math.PI/180}function nn(t,e){return Math.sqrt(t*t+e*e)}function on(t,e){return e>0?Math.abs(t):0-Math.abs(t)}var rn=mt.data.deepClone,sn=function(){function t(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:{}}}return t.prototype.updateConfig=function(t,e){this._updateElementIndex(t),this._updateSelectedElementWrapper(t,e),this._updateSelectedElementListWrapper(t,e)},t.prototype.getConfig=function(){return rn(this._helperConfig)},t.prototype.getElementIndexByUUID=function(t){var e=this._helperConfig.elementIndexMap[t];return e>=0?e:null},t.prototype.isPointInElementWrapperController=function(t,e){var n,o,i=this._ctx,r=(null===(o=null===(n=this._helperConfig)||void 0===n?void 0:n.selectedElementWrapper)||void 0===o?void 0:o.uuid)||null,s=null,l=null,a=null;if(!this._helperConfig.selectedElementWrapper)return{uuid:r,selectedControllerDirection:l,directIndex:s,hoverControllerDirection:a};var c=this._helperConfig.selectedElementWrapper,h=[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'],f=mt.data.deepClone(u),d=0;if(e&&r){var p=this.getElementIndexByUUID(r);if(null!==p&&p>=0){var v=e.elements[p].angle;v<0&&(v+=360),v<45?d=0:v<90?d=1:v<135?d=2:v<180?d=3:v<225?d=4:v<270?d=5:v<315&&(d=6)}}if(d>0&&(f=f.slice(-d).concat(f.slice(0,-d))),Ve(i,c.translate,c.radian||0,(function(){for(var e=0;e<h.length;e++){var n=h[e];if(!0!==n.invisible&&(i.beginPath(),i.arc(n.x,n.y,c.controllerSize,0,2*Math.PI),i.closePath(),i.isPointInPath(t.x,t.y)&&(l=u[e],a=f[e]),l)){s=e;break}}})),null===l){var g=c.controllers.rotate;!0!==g.invisible&&Ve(i,c.translate,c.radian||0,(function(){i.beginPath(),i.arc(g.x,g.y,c.controllerSize,0,2*Math.PI),i.closePath(),i.isPointInPath(t.x,t.y)&&(l='rotate',a='rotate')}))}return{uuid:r,selectedControllerDirection:l,hoverControllerDirection:a,directIndex:s}},t.prototype.isPointInElementList=function(t,e){for(var n,o,i,r=this._ctx,s=-1,l=null,a=(null===(n=this._helperConfig)||void 0===n?void 0:n.selectedElementListWrappers)||[],c=function(n){var c=a[n],u=h._helperConfig.elementIndexMap[c.uuid],f=e.elements[u];if(!f)return"continue";if(!0===(null===(o=f.operation)||void 0===o?void 0:o.invisible))return"continue";var d=0;return(null===(i=f.desc)||void 0===i?void 0:i.borderWidth)>0&&(d=f.desc.borderWidth),Qe(r,f,(function(){r.beginPath(),r.moveTo(f.x-d,f.y-d),r.lineTo(f.x+f.w+d,f.y-d),r.lineTo(f.x+f.w+d,f.y+f.h+d),r.lineTo(f.x-d,f.y+f.h+d),r.lineTo(f.x-d,f.y-d),r.closePath(),r.isPointInPath(t.x,t.y)&&(s=n,l=f.uuid)})),s>=0?"break":void 0},h=this,u=0;u<a.length;u++){if("break"===c(u))break}return!!(l&&s>=0)},t.prototype.startSelectArea=function(t){this._areaStart=t,this._areaEnd=t},t.prototype.changeSelectArea=function(t){this._areaEnd=t,this._calcSelectedArea()},t.prototype.clearSelectedArea=function(){this._areaStart={x:0,y:0},this._areaEnd={x:0,y:0},this._calcSelectedArea()},t.prototype.calcSelectedElements=function(t){var e=this._ctx.getTransform(),n=e.scale,o=void 0===n?1:n,i=e.scrollX,r=void 0===i?0:i,s=e.scrollY,l=void 0===s?0:s,a=this._areaStart,c=this._areaEnd,h=(Math.min(a.x,c.x)-r)/o,u=(Math.min(a.y,c.y)-l)/o,f=Math.abs(c.x-a.x)/o,d=Math.abs(c.y-a.y)/o,p=[],v=this._ctx;return v.beginPath(),v.moveTo(h,u),v.lineTo(h+f,u),v.lineTo(h+f,u+d),v.lineTo(h,u+d),v.lineTo(h,u),v.closePath(),t.elements.forEach((function(t){var e;if(!0!==(null===(e=null==t?void 0:t.operation)||void 0===e?void 0:e.invisible)){var n=t.x+t.w/2,o=t.y+t.h/2;v.isPointInPathWithoutScroll(n,o)&&p.push(t.uuid)}})),p},t.prototype._calcSelectedArea=function(){var t=this._areaStart,e=this._areaEnd,n=this._ctx.getTransform(),o=n.scale,i=void 0===o?1:o,r=n.scrollX,s=void 0===r?0:r,l=n.scrollY,a=void 0===l?0:l,c=this._coreConfig.elementWrapper,h=c.lineWidth/i,u=c.lineDash.map((function(t){return t/i}));this._helperConfig.selectedAreaWrapper={x:(Math.min(t.x,e.x)-s)/i,y:(Math.min(t.y,e.y)-a)/i,w:Math.abs(e.x-t.x)/i,h:Math.abs(e.y-t.y)/i,startPoint:{x:t.x,y:t.y},endPoint:{x:e.x,y:e.y},lineWidth:h,lineDash:u,color:c.color}},t.prototype._updateElementIndex=function(t){var e=this;this._helperConfig.elementIndexMap={},t.elements.forEach((function(t,n){e._helperConfig.elementIndexMap[t.uuid]=n}))},t.prototype._updateSelectedElementWrapper=function(t,e){var n,o=e.selectedUUID;if('string'==typeof o&&this._helperConfig.elementIndexMap[o]>=0){var i=this._helperConfig.elementIndexMap[o],r=t.elements[i];if(!0!==(null===(n=null==r?void 0:r.operation)||void 0===n?void 0:n.invisible)){var s=this._createSelectedElementWrapper(r,e);this._helperConfig.selectedElementWrapper=s}}else delete this._helperConfig.selectedElementWrapper},t.prototype._updateSelectedElementListWrapper=function(t,e){var n=this,o=e.selectedUUIDList,i=[];t.elements.forEach((function(t,r){if(null==o?void 0:o.includes(t.uuid)){var s=n._createSelectedElementWrapper(t,e);i.push(s)}})),this._helperConfig.selectedElementListWrappers=i},t.prototype._createSelectedElementWrapper=function(t,e){var n,o,i,r,s,l,a,c,h,u,f,d,p=e.scale,v=this._coreConfig.elementWrapper,g=v.controllerSize/p,m=v.lineWidth/p,y=v.lineDash.map((function(t){return t/p})),_=(null===(n=t.desc)||void 0===n?void 0:n.borderWidth)||0,S=!1;'number'==typeof t.angle&&Math.abs(t.angle)>15&&(S=!0);var x={uuid:t.uuid,controllerSize:g,lock:!0===(null===(o=null==t?void 0:t.operation)||void 0===o?void 0:o.lock),controllers:{topLeft:{x:t.x-g-_,y:t.y-g-_,invisible:S||!0===(null===(i=null==t?void 0:t.operation)||void 0===i?void 0:i.disbaleScale)},top:{x:t.x+t.w/2,y:t.y-g-_,invisible:!0===(null===(r=null==t?void 0:t.operation)||void 0===r?void 0:r.disbaleScale)},topRight:{x:t.x+t.w+g+_,y:t.y-g-_,invisible:S||!0===(null===(s=null==t?void 0:t.operation)||void 0===s?void 0:s.disbaleScale)},right:{x:t.x+t.w+g+_,y:t.y+t.h/2,invisible:!0===(null===(l=null==t?void 0:t.operation)||void 0===l?void 0:l.disbaleScale)},bottomRight:{x:t.x+t.w+g+_,y:t.y+t.h+g+_,invisible:S||!0===(null===(a=null==t?void 0:t.operation)||void 0===a?void 0:a.disbaleScale)},bottom:{x:t.x+t.w/2,y:t.y+t.h+g+_,invisible:!0===(null===(c=null==t?void 0:t.operation)||void 0===c?void 0:c.disbaleScale)},bottomLeft:{x:t.x-g-_,y:t.y+t.h+g+_,invisible:S||!0===(null===(h=null==t?void 0:t.operation)||void 0===h?void 0:h.disbaleScale)},left:{x:t.x-g-_,y:t.y+t.h/2,invisible:!0===(null===(u=null==t?void 0:t.operation)||void 0===u?void 0:u.disbaleScale)},rotate:{x:t.x+t.w/2,y:t.y-g-(2*g+12)-_,invisible:!0===(null===(f=null==t?void 0:t.operation)||void 0===f?void 0:f.disbaleRotate)}},lineWidth:m,lineDash:y,color:!0===(null===(d=null==t?void 0:t.operation)||void 0===d?void 0:d.lock)?v.lockColor:v.color};return'number'==typeof t.angle&&(t.angle>0||t.angle<0)&&(x.radian=Re(t.angle),x.translate=Ae(t)),x},t}(),ln=Symbol('_displayCtx'),an=Symbol('_helper'),cn=Symbol('_element'),hn=Symbol('_opts'),un=function(){function t(t){this[hn]=t,this[ln]=this[hn].board,this[cn]=this[hn].element,this[an]=this[hn].helper}return t.prototype.isEffectivePoint=function(t){var e=this[ln].getScrollLineWidth(),n=this[ln].getScreenInfo();return t.x<=n.width-e&&t.y<=n.height-e},t.prototype.judgePointCursor=function(t,e){var n='auto',o=null;if(!this.isEffectivePoint(t))return{cursor:n,elementUUID:o};var i=this[an].isPointInElementWrapperController(t,e),r=i.uuid,s=i.hoverControllerDirection;if(r&&s){switch(s){case'top-right':n='ne-resize';break;case'top-left':n='nw-resize';break;case'top':n='n-resize';break;case'right':n='e-resize';break;case'bottom-right':n='se-resize';break;case'bottom':n='s-resize';break;case'bottom-left':n='sw-resize';break;case'left':n='w-resize';break;case'rotate':n='grab'}r&&(o=r)}else{var l=this[cn].isPointInElement(t,e),a=l[0],c=l[1];a>=0&&(n='move'),c&&(o=c)}return{cursor:n,elementUUID:o}},t}();function fn(t){var e={elements:[]};return Array.isArray(null==t?void 0:t.elements)&&(null==t||t.elements.forEach((function(t){void 0===t&&(t={}),function(t){if(!(dn(t.x)&&dn(t.y)&&dn(t.w)&&dn(t.h)))return!1;if('string'!=typeof t.type||!qe.includes(t.type))return!1;return!0}(t)&&e.elements.push(t)}))),'string'==typeof t.bgColor&&(e.bgColor=t.bgColor),e}function dn(t){return t>=0||t<0}var pn,vn,gn=function(){function t(){this._temp={hasInited:!1}}return t.prototype.set=function(t,e){this._temp[t]=e},t.prototype.get=function(t){return this._temp[t]},t.prototype.clear=function(){this._temp={hasInited:!1}},t}(),mn=Symbol('_board'),yn=Symbol('_data'),_n=Symbol('_opts'),Sn=Symbol('_config'),xn=Symbol('_renderer'),bn=Symbol('_element'),wn=Symbol('_tempData'),En=Symbol('_draw'),Pn=Symbol('_coreEvent'),Cn=Symbol('_emitChangeScreen'),zn=Symbol('_emitChangeData'),Dn=Symbol('_engine');!function(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"}(pn||(pn={})),function(t){t.DRAGGING="dragging",t.NULL="null"}(vn||(vn={}));var Ln=mt.data.deepClone,Tn=mt.uuid.createUUID;function Mn(){return{hasInited:!1,mode:pn.NULL,cursorStatus:vn.NULL,selectedUUID:null,selectedUUIDList:[],hoverUUID:null,selectedControllerDirection:null,hoverControllerDirection:null,prevPoint:null}}var kn=function(){function t(){this._temp=Mn()}return t.prototype.set=function(t,e){this._temp[t]=e},t.prototype.get=function(t){return this._temp[t]},t.prototype.clear=function(){this._temp=Mn()},t}(),In=mt.time,Wn=mt.data.deepClone,On=function(){function t(t){this._plugins=[];var e=t.board,n=t.config,o=t.element,i=new sn(e,n);this._opts=t,this.temp=new kn,this.helper=i,this._mapper=new un({board:e,helper:i,element:o})}return t.prototype.addPlugin=function(t){this._plugins.push(t)},t.prototype.getHelperConfig=function(){return this.helper.getConfig()},t.prototype.updateHelperConfig=function(t){var e,n=this._opts,o=n.board,i=n.getDataFeekback,r=n.config,s=i(),l=o.getTransform();this.helper.updateConfig(s,{width:t.width,height:t.height,devicePixelRatio:t.devicePixelRatio,canScroll:!0===(null===(e=null==r?void 0:r.scrollWrapper)||void 0===e?void 0:e.use),selectedUUID:this.temp.get('selectedUUID'),selectedUUIDList:this.temp.get('selectedUUIDList'),scale:l.scale,scrollX:l.scrollX,scrollY:l.scrollY})},t.prototype.init=function(){this._initEvent()},t.prototype._initEvent=function(){if(!0!==this.temp.get('hasInited')){var t=this._opts.board;t.on('hover',In.throttle(this._handleHover.bind(this),32)),t.on('leave',In.throttle(this._handleLeave.bind(this),32)),t.on('point',In.throttle(this._handleClick.bind(this),16)),t.on('doubleClick',this._handleDoubleClick.bind(this)),t.on('point',this._handlePoint.bind(this)),t.on('moveStart',this._handleMoveStart.bind(this)),t.on('move',In.throttle(this._handleMove.bind(this),16)),t.on('moveEnd',this._handleMoveEnd.bind(this))}},t.prototype._handleDoubleClick=function(t){var e,n,o,i=this._opts,r=i.element,s=i.getDataFeekback,l=i.drawFeekback,a=i.coreEvent,c=s(),h=r.isPointInElement(t,c),u=h[0],f=h[1];if(u>=0&&f){var d=Wn(null===(e=c.elements)||void 0===e?void 0:e[u]);!0!==(null===(n=null==d?void 0:d.operation)||void 0===n?void 0:n.invisible)&&a.trigger('screenDoubleClickElement',{index:u,uuid:f,element:Wn(null===(o=c.elements)||void 0===o?void 0:o[u])})}l()},t.prototype._handlePoint=function(t){var e,n,o;if(this._mapper.isEffectivePoint(t)){var i=this._opts,r=i.element,s=i.getDataFeekback,l=i.selectElementByIndex,a=i.coreEvent,c=i.emitChangeScreen,h=i.drawFeekback,u=this.helper,f=s();if(u.isPointInElementList(t,f))this.temp.set('mode',pn.SELECT_ELEMENT_LIST);else{var d=u.isPointInElementWrapperController(t,f),p=d.uuid,v=d.selectedControllerDirection;if(p&&v)this.temp.set('mode',pn.SELECT_ELEMENT_WRAPPER_CONTROLLER),this.temp.set('selectedControllerDirection',v),this.temp.set('selectedUUID',p);else{var g=r.isPointInElement(t,f),m=g[0],y=g[1];m>=0&&!0!==(null===(n=null===(e=f.elements[m])||void 0===e?void 0:e.operation)||void 0===n?void 0:n.invisible)?(l(m,{useMode:!0}),'string'==typeof y&&a.has('screenSelectElement')&&(a.trigger('screenSelectElement',{index:m,uuid:y,element:Wn(null===(o=f.elements)||void 0===o?void 0:o[m])}),c()),this.temp.set('mode',pn.SELECT_ELEMENT)):(this.temp.set('selectedUUIDList',[]),this.temp.set('selectedUUID',null),this.temp.set('mode',pn.SELECT_AREA))}}h()}},t.prototype._handleClick=function(t){var e,n=this._opts,o=n.element,i=n.getDataFeekback,r=n.coreEvent,s=n.drawFeekback,l=i(),a=o.isPointInElement(t,l),c=a[0],h=a[1];c>=0&&h&&r.trigger('screenClickElement',{index:c,uuid:h,element:Wn(null===(e=l.elements)||void 0===e?void 0:e[c])}),s()},t.prototype._handleMoveStart=function(t){var e=this._opts,n=e.element,o=e.getDataFeekback,i=e.coreEvent,r=o(),s=this.helper;this.temp.set('prevPoint',t);var l=this.temp.get('selectedUUID');this.temp.get('mode')===pn.SELECT_ELEMENT_LIST||(this.temp.get('mode')===pn.SELECT_ELEMENT?'string'==typeof l&&i.has('screenMoveElementStart')&&i.trigger('screenMoveElementStart',{index:n.getElementIndex(r,l),uuid:l,x:t.x,y:t.y}):this.temp.get('mode')===pn.SELECT_AREA&&s.startSelectArea(t))},t.prototype._handleMove=function(t){var e=this._opts.drawFeekback,n=this.helper;this.temp.get('mode')===pn.SELECT_ELEMENT_LIST?(this._dragElements(this.temp.get('selectedUUIDList'),t,this.temp.get('prevPoint')),e(),this.temp.set('cursorStatus',vn.DRAGGING)):'string'==typeof this.temp.get('selectedUUID')?this.temp.get('mode')===pn.SELECT_ELEMENT?(this._dragElements([this.temp.get('selectedUUID')],t,this.temp.get('prevPoint')),e(),this.temp.set('cursorStatus',vn.DRAGGING)):this.temp.get('mode')===pn.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',vn.DRAGGING)):this.temp.get('mode')===pn.SELECT_AREA&&(n.changeSelectArea(t),e()),this.temp.set('prevPoint',t)},t.prototype._dragElements=function(t,e,n){if(n){var o=this._opts,i=o.board,r=o.element,s=o.getDataFeekback,l=o.drawFeekback,a=s(),c=this.helper;t.forEach((function(t){var o,s,l=c.getElementIndexByUUID(t);if(null!==l){var h=a.elements[l];!0!==(null===(o=null==h?void 0:h.operation)||void 0===o?void 0:o.lock)&&!0!==(null===(s=null==h?void 0:h.operation)||void 0===s?void 0:s.invisible)&&r.dragElement(a,t,e,n,i.getContext().getTransform().scale)}})),l()}},t.prototype._transfromElement=function(t,e,n,o){if(!n)return null;var i=this._opts,r=i.board,s=i.element,l=i.getDataFeekback,a=i.drawFeekback,c=l(),h=s.transformElement(c,t,e,n,r.getContext().getTransform().scale,o);return a(),h},t.prototype._handleMoveEnd=function(t){var e=this._opts,n=e.element,o=e.getDataFeekback,i=e.coreEvent,r=e.drawFeekback,s=e.emitChangeData,l=o(),a=this.helper,c=this.temp.get('selectedUUID');if('string'==typeof c){var h=n.getElementIndex(l,c),u=l.elements[h];u&&(i.has('screenMoveElementEnd')&&i.trigger('screenMoveElementEnd',{index:h,uuid:c,x:t.x,y:t.y}),i.has('screenChangeElement')&&i.trigger('screenChangeElement',{index:h,uuid:c,width:u.w,height:u.h,angle:u.angle||0}),s())}else if(this.temp.get('mode')===pn.SELECT_AREA){var f=a.calcSelectedElements(l);f.length>0?(this.temp.set('selectedUUIDList',f),this.temp.set('selectedUUID',null)):this.temp.set('mode',pn.NULL),a.clearSelectedArea(),r()}this.temp.get('mode')!==pn.SELECT_ELEMENT&&this.temp.set('selectedUUID',null),this.temp.set('cursorStatus',vn.NULL),this.temp.set('mode',pn.NULL)},t.prototype._handleHover=function(t){var e,n,o=!1,i=this._opts,r=i.board,s=i.getDataFeekback,l=i.coreEvent,a=s(),c=this.helper,h=this._mapper;if(this.temp.get('mode')===pn.SELECT_AREA)r.resetCursor();else if(this.temp.get('cursorStatus')===vn.NULL){var u=h.judgePointCursor(t,a),f=u.cursor,d=u.elementUUID;if(r.setCursor(f),d)if(null!==(g=c.getElementIndexByUUID(d))&&g>=0){var p=a.elements[g];if(!0===(null===(e=null==p?void 0:p.operation)||void 0===e?void 0:e.lock)||!0===(null===(n=null==p?void 0:p.operation)||void 0===n?void 0:n.invisible))return void r.resetCursor();if(this.temp.get('hoverUUID')!==p.uuid){var v=c.getElementIndexByUUID(this.temp.get('hoverUUID')||'');null!==v&&a.elements[v]&&l.trigger('mouseLeaveElement',{uuid:this.temp.get('hoverUUID'),index:v,element:a.elements[v]})}p&&(l.trigger('mouseOverElement',{uuid:p.uuid,index:g,element:p}),this.temp.set('hoverUUID',p.uuid),o=!0)}}if(!0!==o&&null!==this.temp.get('hoverUUID')){var g,m=this.temp.get('hoverUUID');null!==(g=c.getElementIndexByUUID(m||''))&&l.trigger('mouseLeaveElement',{uuid:m,index:g,element:a.elements[g]}),this.temp.set('hoverUUID',null)}l.has('mouseOverScreen')&&l.trigger('mouseOverScreen',t)},t.prototype._handleLeave=function(){var t=this._opts.coreEvent;t.has('mouseLeaveScreen')&&t.trigger('mouseLeaveScreen',void 0)},t}();function Un(t){t.setFillStyle('#000000'),t.setStrokeStyle('#000000'),t.setLineDash([]),t.setGlobalAlpha(1),t.setShadowColor('#00000000'),t.setShadowOffsetX(0),t.setShadowOffsetY(0),t.setShadowBlur(0)}var Rn=mt.data.deepClone,An=function(){function e(e,i,r){var s,l,a,c=this;this[n]=new Xe,this[o]=new gn,this[yn]={elements:[]},this[_n]=i,this[Sn]=function(e){var n=mt.data.deepClone(Ye);return e&&e.elementWrapper&&(n.elementWrapper=t(t({},n.elementWrapper),e.elementWrapper)),n}(r||{}),this[mn]=new J(e,t(t({},this[_n]),{canScroll:null===(s=null==r?void 0:r.scrollWrapper)||void 0===s?void 0:s.use,scrollConfig:{color:(null===(l=null==r?void 0:r.scrollWrapper)||void 0===l?void 0:l.color)||'#a0a0a0',lineWidth:(null===(a=null==r?void 0:r.scrollWrapper)||void 0===a?void 0:a.lineWidth)||12}})),this[xn]=new De;var h=function(){var t=c[mn].getHelperContext(),e=c[Dn].getHelperConfig();c[mn].clear();var n=c[_n],o=n.contextWidth,i=n.contextHeight,r=n.devicePixelRatio;t.clearRect(0,0,o*r,i*r),function(t,e){if(null==e?void 0:e.selectedElementWrapper){var n=e.selectedElementWrapper;Un(t),Ve(t,n.translate,n.radian||0,(function(){t.beginPath(),t.setLineDash(n.lineDash),t.setLineWidth(n.lineWidth),t.setStrokeStyle(n.color),t.moveTo(n.controllers.topLeft.x,n.controllers.topLeft.y),t.lineTo(n.controllers.topRight.x,n.controllers.topRight.y),t.lineTo(n.controllers.bottomRight.x,n.controllers.bottomRight.y),t.lineTo(n.controllers.bottomLeft.x,n.controllers.bottomLeft.y),t.lineTo(n.controllers.topLeft.x,n.controllers.topLeft.y-n.lineWidth/2),t.stroke(),t.closePath(),!0!==n.lock?(!0!==n.controllers.rotate.invisible&&(t.beginPath(),t.moveTo(n.controllers.top.x,n.controllers.top.y),t.lineTo(n.controllers.rotate.x,n.controllers.rotate.y+n.controllerSize),t.stroke(),t.closePath(),t.beginPath(),t.setLineDash([]),t.setLineWidth(n.controllerSize/2),t.arc(n.controllers.rotate.x,n.controllers.rotate.y,.8*n.controllerSize,Math.PI/6,2*Math.PI),t.stroke(),t.closePath()),t.setFillStyle(n.color),[n.controllers.topLeft,n.controllers.top,n.controllers.topRight,n.controllers.right,n.controllers.bottomRight,n.controllers.bottom,n.controllers.bottomLeft,n.controllers.left].forEach((function(e){!0!==e.invisible&&(t.beginPath(),t.arc(e.x,e.y,n.controllerSize,0,2*Math.PI),t.fill(),t.closePath())}))):(Un(t),t.setStrokeStyle(n.color),[n.controllers.topLeft,n.controllers.top,n.controllers.topRight,n.controllers.right,n.controllers.bottomRight,n.controllers.bottom,n.controllers.bottomLeft,n.controllers.left].forEach((function(e){t.beginPath(),t.moveTo(e.x-n.controllerSize/2,e.y-n.controllerSize/2),t.lineTo(e.x+n.controllerSize/2,e.y+n.controllerSize/2),t.stroke(),t.closePath(),t.beginPath(),t.moveTo(e.x+n.controllerSize/2,e.y-n.controllerSize/2),t.lineTo(e.x-n.controllerSize/2,e.y+n.controllerSize/2),t.stroke(),t.closePath()})))}))}}(t,e),function(t,e){if(null==e?void 0:e.selectedAreaWrapper){var n=e.selectedAreaWrapper;n&&n.w>0&&n.h>0&&(Un(t),t.setGlobalAlpha(.3),t.setFillStyle(n.color),t.fillRect(n.x,n.y,n.w,n.h),Un(t),t.beginPath(),t.setLineDash(n.lineDash),t.setLineWidth(n.lineWidth),t.setStrokeStyle(n.color),t.moveTo(n.x,n.y),t.lineTo(n.x+n.w,n.y),t.lineTo(n.x+n.w,n.y+n.h),t.lineTo(n.x,n.y+n.h),t.lineTo(n.x,n.y),t.stroke(),t.closePath())}}(t,e),function(t,e){if(Array.isArray(null==e?void 0:e.selectedElementListWrappers)){var n=e.selectedElementListWrappers;null==n||n.forEach((function(e){Un(t),Ve(t,e.translate,e.radian||0,(function(){Un(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),Un(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&&(Un(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((function(n){t.beginPath(),t.moveTo(n.x-e.controllerSize/2,n.y-e.controllerSize/2),t.lineTo(n.x+e.controllerSize/2,n.y+e.controllerSize/2),t.stroke(),t.closePath(),t.beginPath(),t.moveTo(n.x+e.controllerSize/2,n.y-e.controllerSize/2),t.lineTo(n.x-e.controllerSize/2,n.y+e.controllerSize/2),t.stroke(),t.closePath()})))}))}))}}(t,e),c[mn].draw()};this[xn].on('drawFrame',(function(t){h()})),this[xn].on('drawFrameComplete',(function(t){h()})),this[bn]=new tn(this[mn].getContext()),this[Dn]=new On({coreEvent:this[Pn],board:this[mn],element:this[bn],config:this[Sn],drawFeekback:this[En].bind(this),getDataFeekback:function(){return c[yn]},selectElementByIndex:this.selectElementByIndex.bind(this),emitChangeScreen:this[Cn].bind(this),emitChangeData:this[zn].bind(this)}),this[Dn].init(),this[xn].on('drawFrame',(function(){c[Pn].trigger('drawFrame',void 0)})),this[xn].on('drawFrameComplete',(function(){c[Pn].trigger('drawFrameComplete',void 0)})),this[wn].set('hasInited',!0)}var n,o;return e.prototype[(n=Pn,o=wn,En)]=function(t){this[Dn].updateHelperConfig({width:this[_n].width,height:this[_n].height,devicePixelRatio:this[_n].devicePixelRatio}),this[xn].thaw(),this[xn].render(this[mn].getContext(),this[yn],{changeResourceUUIDs:(null==t?void 0:t.resourceChangeUUIDs)||[]})},e.prototype.getElement=function(t){return function(t,e){var n=null,o=t[Dn].helper.getElementIndexByUUID(e);return null!==o&&t[yn].elements[o]&&(n=Ln(t[yn].elements[o])),n}(this,t)},e.prototype.getElementByIndex=function(t){return function(t,e){var n=null;return e>=0&&t[yn].elements[e]&&(n=Ln(t[yn].elements[e])),n}(this,t)},e.prototype.selectElementByIndex=function(t,e){return function(t,e,n){if(t[yn].elements[e]){var o=t[yn].elements[e].uuid;!0===(null==n?void 0:n.useMode)?t[Dn].temp.set('mode',pn.SELECT_ELEMENT):t[Dn].temp.set('mode',pn.NULL),'string'==typeof o&&(t[Dn].temp.set('selectedUUID',o),t[Dn].temp.set('selectedUUIDList',[])),t[En]()}}(this,t,e)},e.prototype.selectElement=function(t,e){return function(t,e,n){var o=t[Dn].helper.getElementIndexByUUID(e);'number'==typeof o&&o>=0&&t.selectElementByIndex(o,n)}(this,t,e)},e.prototype.moveUpElement=function(t){return function(t,e){var n=t[Dn].helper.getElementIndexByUUID(e);if('number'==typeof n&&n>=0&&n<t[yn].elements.length-1){var o=t[yn].elements[n];t[yn].elements[n]=t[yn].elements[n+1],t[yn].elements[n+1]=o}t[zn](),t[En]()}(this,t)},e.prototype.moveDownElement=function(t){return function(t,e){var n=t[Dn].helper.getElementIndexByUUID(e);if('number'==typeof n&&n>0&&n<t[yn].elements.length){var o=t[yn].elements[n];t[yn].elements[n]=t[yn].elements[n-1],t[yn].elements[n-1]=o}t[zn](),t[En]()}(this,t)},e.prototype.updateElement=function(t){return function(t,e){for(var n,o=Ln(e),i=t[yn],r=[],s=0;s<i.elements.length;s++)if(o.uuid===(null===(n=i.elements[s])||void 0===n?void 0:n.uuid)){var l=je(i.elements[s],o);'string'==typeof l&&r.push(l),i.elements[s]=o;break}t[zn](),t[En]({resourceChangeUUIDs:r})}(this,t)},e.prototype.addElement=function(t){return function(t,e){var n=Ln(e);return n.uuid=Tn(),t[yn].elements.push(n),t[zn](),t[En](),n.uuid}(this,t)},e.prototype.deleteElement=function(t){return function(t,e){var n=t[bn].getElementIndex(t[yn],e);n>=0&&(t[yn].elements.splice(n,1),t[zn](),t[En]())}(this,t)},e.prototype.insertElementBefore=function(t,e){return function(t,e,n){var o=t[Dn].helper.getElementIndexByUUID(n);return null!==o?t.insertElementBeforeIndex(e,o):null}(this,t,e)},e.prototype.insertElementBeforeIndex=function(t,e){return function(t,e,n){var o=Ln(e);return o.uuid=Tn(),n>=0?(t[yn].elements.splice(n,0,o),t[zn](),t[En](),o.uuid):null}(this,t,e)},e.prototype.getSelectedElements=function(){return e=[],n=[],'string'==typeof(o=(t=this)[Dn].temp.get('selectedUUID'))&&o?n.push(o):n=t[Dn].temp.get('selectedUUIDList'),n.forEach((function(n){var o,i=t[Dn].helper.getElementIndexByUUID(n);if(null!==i&&i>=0){var r=null===(o=t[yn])||void 0===o?void 0:o.elements[i];r&&e.push(r)}})),Ln(e);var t,e,n,o},e.prototype.insertElementAfter=function(t,e){return function(t,e,n){var o=t[Dn].helper.getElementIndexByUUID(n);return null!==o?t.insertElementAfterIndex(e,o):null}(this,t,e)},e.prototype.insertElementAfterIndex=function(t,e){return function(t,e,n){var o=Ln(e);return o.uuid=Tn(),n>=0?(t[yn].elements.splice(n+1,0,o),t[zn](),t[En](),o.uuid):null}(this,t,e)},e.prototype.resetSize=function(e){this[_n]=t(t({},this[_n]),e),this[mn].resetSize(e),this[En]()},e.prototype.scale=function(t){var e=this[mn].scale(t);return this[En](),this[Cn](),e},e.prototype.scrollLeft=function(t){var e=this[mn].scrollX(0-t);return this[En](),this[Cn](),e},e.prototype.scrollTop=function(t){var e=this[mn].scrollY(0-t);return this[En](),this[Cn](),e},e.prototype.getScreenTransform=function(){var t=this[mn].getTransform();return{scale:t.scale,scrollTop:Math.max(0,0-t.scrollY),scrollLeft:Math.max(0,0-t.scrollX)}},e.prototype.getData=function(){return Rn(this[yn])},e.prototype.setData=function(t,e){var n=function(t,e){var n,o=[],i=Ge(t),r=Ge(e);for(var s in r)if(!0===['image','svg','html'].includes(null===(n=r[s])||void 0===n?void 0:n.type))if(i[s]){var l=!1;switch(i[s].type){case'image':l=Ne(i[s],r[s]);break;case'svg':l=He(i[s],r[s]);break;case'html':l=Be(i[s],r[s])}!0===l&&o.push(s)}else o.push(s);return o}(this[yn],t);this[yn]=this[bn].initData(Rn(fn(t))),e&&!0===e.triggerChangeEvent&&this[zn](),this[En]({resourceChangeUUIDs:n})},e.prototype.clearOperation=function(){this[wn].clear(),this[En]()},e.prototype.on=function(t,e){this[Pn].on(t,e)},e.prototype.off=function(t,e){this[Pn].off(t,e)},e.prototype.pointScreenToContext=function(t){return this[mn].pointScreenToContext(t)},e.prototype.pointContextToScreen=function(t){return this[mn].pointContextToScreen(t)},e.prototype.__getBoardContext=function(){return this[mn].getContext()},e.prototype.__getDisplayContext2D=function(){return this[mn].getDisplayContext2D()},e.prototype.__getOriginContext2D=function(){return this[mn].getOriginContext2D()},e.prototype[Cn]=function(){this[Pn].has('changeScreen')&&this[Pn].trigger('changeScreen',t({},this.getScreenTransform()))},e.prototype[zn]=function(){this[Pn].has('changeData')&&this[Pn].trigger('changeData',Rn(this[yn]))},e.is=We,e.check=Ue,e}();return An}();