@anu3ev/fabric-image-editor 0.1.73 → 0.1.75
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/dist/main.js +425 -334
- package/package.json +1 -1
- package/readme.md +338 -30
package/dist/main.js
CHANGED
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var
|
|
1
|
+
var ve = Object.defineProperty, Ae = Object.defineProperties;
|
|
2
|
+
var Ce = Object.getOwnPropertyDescriptors;
|
|
3
|
+
var W = Object.getOwnPropertySymbols;
|
|
4
4
|
var he = Object.prototype.hasOwnProperty, ge = Object.prototype.propertyIsEnumerable;
|
|
5
|
-
var le = (r, e, t) => e in r ?
|
|
5
|
+
var le = (r, e, t) => e in r ? ve(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, I = (r, e) => {
|
|
6
6
|
for (var t in e || (e = {}))
|
|
7
7
|
he.call(e, t) && le(r, t, e[t]);
|
|
8
|
-
if (
|
|
9
|
-
for (var t of
|
|
8
|
+
if (W)
|
|
9
|
+
for (var t of W(e))
|
|
10
10
|
ge.call(e, t) && le(r, t, e[t]);
|
|
11
11
|
return r;
|
|
12
|
-
}, ue = (r, e) =>
|
|
13
|
-
var
|
|
12
|
+
}, ue = (r, e) => Ae(r, Ce(e));
|
|
13
|
+
var F = (r, e) => {
|
|
14
14
|
var t = {};
|
|
15
15
|
for (var s in r)
|
|
16
16
|
he.call(r, s) && e.indexOf(s) < 0 && (t[s] = r[s]);
|
|
17
|
-
if (r != null &&
|
|
18
|
-
for (var s of
|
|
17
|
+
if (r != null && W)
|
|
18
|
+
for (var s of W(r))
|
|
19
19
|
e.indexOf(s) < 0 && ge.call(r, s) && (t[s] = r[s]);
|
|
20
20
|
return t;
|
|
21
21
|
};
|
|
22
|
-
var
|
|
22
|
+
var y = (r, e, t) => new Promise((s, a) => {
|
|
23
23
|
var n = (c) => {
|
|
24
24
|
try {
|
|
25
25
|
i(t.next(c));
|
|
@@ -35,15 +35,15 @@ var b = (r, e, t) => new Promise((s, a) => {
|
|
|
35
35
|
}, i = (c) => c.done ? s(c.value) : Promise.resolve(c.value).then(n, o);
|
|
36
36
|
i((t = t.apply(r, e)).next());
|
|
37
37
|
});
|
|
38
|
-
import { ActiveSelection as
|
|
38
|
+
import { ActiveSelection as v, util as P, controlsUtils as Se, InteractiveFabricObject as Ee, loadSVGFromURL as De, FabricImage as z, Point as G, Gradient as Me, Rect as Ne, Circle as Oe, Triangle as Le, Group as q, Canvas as we, Pattern as Te } from "fabric";
|
|
39
39
|
import { create as ke } from "jsondiffpatch";
|
|
40
40
|
import Be from "diff-match-patch";
|
|
41
|
-
var
|
|
41
|
+
var xe = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict", A = function() {
|
|
42
42
|
for (var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 21, t = "", s = crypto.getRandomValues(new Uint8Array(e |= 0)); e--; )
|
|
43
|
-
t +=
|
|
43
|
+
t += xe[s[e] & 63];
|
|
44
44
|
return t;
|
|
45
45
|
};
|
|
46
|
-
class
|
|
46
|
+
class Y {
|
|
47
47
|
/**
|
|
48
48
|
* Конструктор принимает редактор и опции.
|
|
49
49
|
* @param params
|
|
@@ -61,7 +61,7 @@ class Z {
|
|
|
61
61
|
* @param params.options.adaptCanvasToContainerOnResize — адаптировать канвас к размерам контейнера при изменении размеров окна
|
|
62
62
|
*/
|
|
63
63
|
constructor({ editor: e, options: t = {} }) {
|
|
64
|
-
this.isDragging = !1, this.lastMouseX = 0, this.lastMouseY = 0, this.isUndoRedoKeyPressed = !1, this.isSpacePressed = !1, this.savedSelection = [], this.canvasDragging = !1, this.mouseWheelZooming = !1, this.bringToFrontOnSelection = !1, this.resetObjectFitByDoubleClick = !1, this.copyObjectsByHotkey = !1, this.pasteImageFromClipboard = !1, this.undoRedoByHotKeys = !1, this.selectAllByHotkey = !1, this.deleteObjectsByHotkey = !1, this.adaptCanvasToContainerOnResize = !1, this.editor = e, this.canvas = e.canvas, this.options = t, this.handleContainerResizeBound =
|
|
64
|
+
this.isDragging = !1, this.lastMouseX = 0, this.lastMouseY = 0, this.isUndoRedoKeyPressed = !1, this.isSpacePressed = !1, this.savedSelection = [], this.canvasDragging = !1, this.mouseWheelZooming = !1, this.bringToFrontOnSelection = !1, this.resetObjectFitByDoubleClick = !1, this.copyObjectsByHotkey = !1, this.pasteImageFromClipboard = !1, this.undoRedoByHotKeys = !1, this.selectAllByHotkey = !1, this.deleteObjectsByHotkey = !1, this.adaptCanvasToContainerOnResize = !1, this.editor = e, this.canvas = e.canvas, this.options = t, this.handleContainerResizeBound = Y.debounce(this.handleContainerResize.bind(this), 500), this.handleCopyEventBound = this.handleCopyEvent.bind(this), this.handlePasteEventBound = this.handlePasteEvent.bind(this), this.handleUndoRedoEventBound = this.handleUndoRedoEvent.bind(this), this.handleUndoRedoKeyUpBound = this.handleUndoRedoKeyUp.bind(this), this.handleSelectAllEventBound = this.handleSelectAllEvent.bind(this), this.handleDeleteObjectsEventBound = this.handleDeleteObjectsEvent.bind(this), this.handleSpaceKeyDownBound = this.handleSpaceKeyDown.bind(this), this.handleSpaceKeyUpBound = this.handleSpaceKeyUp.bind(this), this.handleObjectModifiedHistoryBound = Y.debounce(this.handleObjectModifiedHistory.bind(this), 300), this.handleObjectRotatingHistoryBound = Y.debounce(this.handleObjectRotatingHistory.bind(this), 300), this.handleObjectAddedHistoryBound = this.handleObjectAddedHistory.bind(this), this.handleObjectRemovedHistoryBound = this.handleObjectRemovedHistory.bind(this), this.handleOverlayUpdateBound = this.handleOverlayUpdate.bind(this), this.handleBackgroundUpdateBound = this.handleBackgroundUpdate.bind(this), this.handleCanvasDragStartBound = this.handleCanvasDragStart.bind(this), this.handleCanvasDraggingBound = this.handleCanvasDragging.bind(this), this.handleCanvasDragEndBound = this.handleCanvasDragEnd.bind(this), this.handleMouseWheelZoomBound = this.handleMouseWheelZoom.bind(this), this.handleBringToFrontBound = this.handleBringToFront.bind(this), this.handleResetObjectFitBound = this.handleResetObjectFit.bind(this), this.handleLockedSelectionBound = this._filterLockedSelection.bind(this), this.init();
|
|
65
65
|
}
|
|
66
66
|
/**
|
|
67
67
|
* Инициализация всех обработчиков согласно опциям.
|
|
@@ -98,7 +98,7 @@ class Z {
|
|
|
98
98
|
if (a.length === 1)
|
|
99
99
|
this.canvas.setActiveObject(a[0]);
|
|
100
100
|
else {
|
|
101
|
-
const o = new
|
|
101
|
+
const o = new v(a, {
|
|
102
102
|
canvas: this.canvas
|
|
103
103
|
});
|
|
104
104
|
this.canvas.setActiveObject(o);
|
|
@@ -106,7 +106,7 @@ class Z {
|
|
|
106
106
|
this.canvas.requestRenderAll();
|
|
107
107
|
return;
|
|
108
108
|
}
|
|
109
|
-
const n = new
|
|
109
|
+
const n = new v(e, {
|
|
110
110
|
canvas: this.canvas
|
|
111
111
|
});
|
|
112
112
|
this.editor.objectLockManager.lockObject({
|
|
@@ -175,7 +175,7 @@ class Z {
|
|
|
175
175
|
* @param event.code — код клавиши
|
|
176
176
|
*/
|
|
177
177
|
handleUndoRedoEvent(e) {
|
|
178
|
-
return
|
|
178
|
+
return y(this, null, function* () {
|
|
179
179
|
const { ctrlKey: t, metaKey: s, code: a, repeat: n } = e;
|
|
180
180
|
this._shouldIgnoreKeyboardEvent(e) || !t && !s || n || !/Mac/i.test(navigator.userAgent) && this.isUndoRedoKeyPressed || (a === "KeyZ" ? (e.preventDefault(), this.isUndoRedoKeyPressed = !0, yield this.editor.historyManager.undo()) : a === "KeyY" && (e.preventDefault(), this.isUndoRedoKeyPressed = !0, yield this.editor.historyManager.redo()));
|
|
181
181
|
});
|
|
@@ -220,7 +220,7 @@ class Z {
|
|
|
220
220
|
if (a || n) return;
|
|
221
221
|
this.isSpacePressed = !0, e.preventDefault();
|
|
222
222
|
const o = t.getActiveObject() || null;
|
|
223
|
-
o instanceof
|
|
223
|
+
o instanceof v ? this.savedSelection = o.getObjects().slice() : o && (this.savedSelection = [o]), t.discardActiveObject(), t.set({
|
|
224
224
|
selection: !1,
|
|
225
225
|
defaultCursor: "grab"
|
|
226
226
|
}), t.setCursor("grab"), s.canvasManager.getObjects().forEach((i) => {
|
|
@@ -259,7 +259,7 @@ class Z {
|
|
|
259
259
|
t.setActiveObject(e[0]);
|
|
260
260
|
return;
|
|
261
261
|
}
|
|
262
|
-
const a = e.filter((o) => s.canvasManager.getObjects().includes(o)), n = new
|
|
262
|
+
const a = e.filter((o) => s.canvasManager.getObjects().includes(o)), n = new v(a, { canvas: t });
|
|
263
263
|
t.setActiveObject(n);
|
|
264
264
|
}
|
|
265
265
|
// --- Обработчики для событий canvas (Fabric) ---
|
|
@@ -372,7 +372,7 @@ class Z {
|
|
|
372
372
|
};
|
|
373
373
|
}
|
|
374
374
|
}
|
|
375
|
-
class
|
|
375
|
+
class _e {
|
|
376
376
|
/**
|
|
377
377
|
* Класс для динамической загрузки внешних модулей.
|
|
378
378
|
*/
|
|
@@ -432,7 +432,7 @@ class Ue {
|
|
|
432
432
|
* @returns Promise, который будет выполнен, когда воркер вернет ответ
|
|
433
433
|
*/
|
|
434
434
|
post(e, t, s = []) {
|
|
435
|
-
const a = `${e}:${
|
|
435
|
+
const a = `${e}:${A(8)}`;
|
|
436
436
|
return new Promise((n, o) => {
|
|
437
437
|
this._callbacks.set(a, { resolve: n, reject: o }), this.worker.postMessage({ action: e, payload: t, requestId: a }, s);
|
|
438
438
|
});
|
|
@@ -444,50 +444,50 @@ class Ue {
|
|
|
444
444
|
this.worker.terminate();
|
|
445
445
|
}
|
|
446
446
|
}
|
|
447
|
-
const N = 12, He = 2,
|
|
448
|
-
function
|
|
447
|
+
const N = 12, He = 2, ee = 8, te = 20, ze = 100, se = 20, ae = 8, Ze = 100, X = 32, ne = 1, Ye = "#2B2D33", oe = "#3D8BF4", ie = "#FFFFFF";
|
|
448
|
+
function V(r, e, t, s, a) {
|
|
449
449
|
const n = N, o = He;
|
|
450
|
-
r.save(), r.translate(e, t), r.rotate(P.degreesToRadians(a.angle)), r.fillStyle =
|
|
451
|
-
}
|
|
452
|
-
function Me(r, e, t, s, a) {
|
|
453
|
-
const n = q, o = ee, i = ze;
|
|
454
|
-
r.save(), r.translate(e, t), r.rotate(P.degreesToRadians(a.angle)), r.fillStyle = oe, r.strokeStyle = ne, r.lineWidth = ae, r.beginPath(), r.roundRect(-n / 2, -o / 2, n, o, i), r.fill(), r.stroke(), r.restore();
|
|
450
|
+
r.save(), r.translate(e, t), r.rotate(P.degreesToRadians(a.angle)), r.fillStyle = ie, r.strokeStyle = oe, r.lineWidth = ne, r.beginPath(), r.roundRect(-n / 2, -n / 2, n, n, o), r.fill(), r.stroke(), r.restore();
|
|
455
451
|
}
|
|
456
452
|
function fe(r, e, t, s, a) {
|
|
457
|
-
const n =
|
|
458
|
-
r.save(), r.translate(e, t), r.rotate(P.degreesToRadians(a.angle)), r.fillStyle =
|
|
453
|
+
const n = ee, o = te, i = ze;
|
|
454
|
+
r.save(), r.translate(e, t), r.rotate(P.degreesToRadians(a.angle)), r.fillStyle = ie, r.strokeStyle = oe, r.lineWidth = ne, r.beginPath(), r.roundRect(-n / 2, -o / 2, n, o, i), r.fill(), r.stroke(), r.restore();
|
|
455
|
+
}
|
|
456
|
+
function me(r, e, t, s, a) {
|
|
457
|
+
const n = se, o = ae, i = Ze;
|
|
458
|
+
r.save(), r.translate(e, t), r.rotate(P.degreesToRadians(a.angle)), r.fillStyle = ie, r.strokeStyle = oe, r.lineWidth = ne, r.beginPath(), r.roundRect(-n / 2, -o / 2, n, o, i), r.fill(), r.stroke(), r.restore();
|
|
459
459
|
}
|
|
460
|
-
const
|
|
461
|
-
|
|
460
|
+
const Pe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE4Ljc1IDQuMzc1djMuNzVhLjYyNS42MjUgMCAwIDEtLjYyNS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDEgMC0xLjI1aDIuMTRsLTIuMDc3LTEuOTAzLS4wMi0uMDE5YTYuMjUgNi4yNSAwIDEgMC0uMTMgOC45NjcuNjI2LjYyNiAwIDAgMSAuODYuOTA5QTcuNDU2IDcuNDU2IDAgMCAxIDEwIDE3LjVoLS4xMDNhNy41IDcuNSAwIDEgMSA1LjM5Ni0xMi44MTJMMTcuNSA2LjcwM1Y0LjM3NWEuNjI1LjYyNSAwIDAgMSAxLjI1IDBaIi8+PC9zdmc+", ye = new Image();
|
|
461
|
+
ye.src = Pe;
|
|
462
462
|
function We(r, e, t, s, a) {
|
|
463
|
-
const o =
|
|
464
|
-
r.save(), r.translate(e, t), r.rotate(P.degreesToRadians(a.angle)), r.fillStyle =
|
|
463
|
+
const o = X / 2;
|
|
464
|
+
r.save(), r.translate(e, t), r.rotate(P.degreesToRadians(a.angle)), r.fillStyle = Ye, r.beginPath(), r.arc(0, 0, o, 0, 2 * Math.PI), r.fill(), r.drawImage(ye, -o / 2, -o / 2, o, o), r.restore();
|
|
465
465
|
}
|
|
466
466
|
const Fe = {
|
|
467
467
|
// Угловые точки
|
|
468
468
|
tl: {
|
|
469
|
-
render:
|
|
469
|
+
render: V,
|
|
470
470
|
sizeX: N,
|
|
471
471
|
sizeY: N,
|
|
472
472
|
offsetX: 0,
|
|
473
473
|
offsetY: 0
|
|
474
474
|
},
|
|
475
475
|
tr: {
|
|
476
|
-
render:
|
|
476
|
+
render: V,
|
|
477
477
|
sizeX: N,
|
|
478
478
|
sizeY: N,
|
|
479
479
|
offsetX: 0,
|
|
480
480
|
offsetY: 0
|
|
481
481
|
},
|
|
482
482
|
bl: {
|
|
483
|
-
render:
|
|
483
|
+
render: V,
|
|
484
484
|
sizeX: N,
|
|
485
485
|
sizeY: N,
|
|
486
486
|
offsetX: 0,
|
|
487
487
|
offsetY: 0
|
|
488
488
|
},
|
|
489
489
|
br: {
|
|
490
|
-
render:
|
|
490
|
+
render: V,
|
|
491
491
|
sizeX: N,
|
|
492
492
|
sizeY: N,
|
|
493
493
|
offsetX: 0,
|
|
@@ -495,46 +495,46 @@ const Fe = {
|
|
|
495
495
|
},
|
|
496
496
|
// Середина вертикалей
|
|
497
497
|
ml: {
|
|
498
|
-
render:
|
|
499
|
-
sizeX:
|
|
500
|
-
sizeY:
|
|
498
|
+
render: fe,
|
|
499
|
+
sizeX: ee,
|
|
500
|
+
sizeY: te,
|
|
501
501
|
offsetX: 0,
|
|
502
502
|
offsetY: 0
|
|
503
503
|
},
|
|
504
504
|
mr: {
|
|
505
|
-
render:
|
|
506
|
-
sizeX:
|
|
507
|
-
sizeY:
|
|
505
|
+
render: fe,
|
|
506
|
+
sizeX: ee,
|
|
507
|
+
sizeY: te,
|
|
508
508
|
offsetX: 0,
|
|
509
509
|
offsetY: 0
|
|
510
510
|
},
|
|
511
511
|
// Середина горизонталей
|
|
512
512
|
mt: {
|
|
513
|
-
render:
|
|
514
|
-
sizeX:
|
|
515
|
-
sizeY:
|
|
513
|
+
render: me,
|
|
514
|
+
sizeX: se,
|
|
515
|
+
sizeY: ae,
|
|
516
516
|
offsetX: 0,
|
|
517
517
|
offsetY: 0
|
|
518
518
|
},
|
|
519
519
|
mb: {
|
|
520
|
-
render:
|
|
521
|
-
sizeX:
|
|
522
|
-
sizeY:
|
|
520
|
+
render: me,
|
|
521
|
+
sizeX: se,
|
|
522
|
+
sizeY: ae,
|
|
523
523
|
offsetX: 0,
|
|
524
524
|
offsetY: 0
|
|
525
525
|
},
|
|
526
526
|
// Специальный «rotate» контрол
|
|
527
527
|
mtr: {
|
|
528
528
|
render: We,
|
|
529
|
-
sizeX:
|
|
530
|
-
sizeY:
|
|
529
|
+
sizeX: X,
|
|
530
|
+
sizeY: X,
|
|
531
531
|
offsetX: 0,
|
|
532
|
-
offsetY: -
|
|
532
|
+
offsetY: -X
|
|
533
533
|
}
|
|
534
534
|
};
|
|
535
535
|
class Ve {
|
|
536
536
|
static apply() {
|
|
537
|
-
const e =
|
|
537
|
+
const e = Se.createObjectDefaultControls();
|
|
538
538
|
Object.entries(Fe).forEach(([t, s]) => {
|
|
539
539
|
Object.assign(e[t], {
|
|
540
540
|
render: s.render,
|
|
@@ -546,10 +546,10 @@ class Ve {
|
|
|
546
546
|
var h;
|
|
547
547
|
(h = o.target.canvas) == null || h.setCursor("grabbing");
|
|
548
548
|
});
|
|
549
|
-
}),
|
|
549
|
+
}), Ee.ownDefaults.controls = e;
|
|
550
550
|
}
|
|
551
551
|
}
|
|
552
|
-
const Ge = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNi44NzUgMi41YS42MjUuNjI1IDAgMCAwLS42MjUuNjI0VjYuMjVIMy4xMjVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2MTBjMCAuMzQ1LjI4LjYyNS42MjUuNjI1aDEwYy4zNDUgMCAuNjI1LS4yOC42MjUtLjYyNXYtMy4xMjZoMy4xMjVjLjM0NSAwIC42MjUtLjI4LjYyNS0uNjI1di0xMGEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTEwWm02Ljg3NSAxMGgyLjVWMy43NUg3LjV2Mi41aDUuNjI1Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NS42MjRabS0xMCAzLjc1VjcuNWg4Ljc1djguNzVIMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", Xe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMi41IDcuNWMwLS42OS41Ni0xLjI1IDEuMjUtMS4yNWgxMi41Yy42OSAwIDEuMjUuNTYgMS4yNSAxLjI1djguNzVjMCAuNjktLjU2IDEuMjUtMS4yNSAxLjI1SDMuNzVjLS42OSAwLTEuMjUtLjU2LTEuMjUtMS4yNVY3LjVabTEzLjc1IDBIMy43NXY4Ljc1aDEyLjVWNy41WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTAgMS44NzVhMi4xODggMi4xODggMCAwIDAtMi4xODggMi4xODh2Mi44MTJhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyYTMuNDM3IDMuNDM3IDAgMSAxIDYuODc1IDB2Mi44MTNhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyQTIuMTg4IDIuMTg4IDAgMCAwIDEwIDEuODc2WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTEwIDEyLjgxM2EuOTM3LjkzNyAwIDEgMCAwLTEuODc1LjkzNy45MzcgMCAwIDAgMCAxLjg3NFoiLz48L3N2Zz4=", Qe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE2LjI1IDYuMjVINy41VjQuMzc1YTIuNSAyLjUgMCAwIDEgMi41LTIuNWMxLjIgMCAyLjI4MS44NiAyLjUxMiAyYS42MjUuNjI1IDAgMCAwIDEuMjI2LS4yNWMtLjM1NC0xLjczOC0xLjkyNS0zLTMuNzM4LTNhMy43NTQgMy43NTQgMCAwIDAtMy43NSAzLjc1VjYuMjVoLTIuNUExLjI1IDEuMjUgMCAwIDAgMi41IDcuNXY4Ljc1YTEuMjUgMS4yNSAwIDAgMCAxLjI1IDEuMjVoMTIuNWExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjcuNWExLjI1IDEuMjUgMCAwIDAtMS4yNS0xLjI1Wm0wIDEwSDMuNzVWNy41aDEyLjV2OC43NVptLTUuMzEzLTQuMzc1YS45MzcuOTM3IDAgMSAxLTEuODc0IDAgLjkzNy45MzcgMCAwIDEgMS44NzQgMFoiLz48L3N2Zz4K", Ke = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTIuNSA4LjEyNSAxMCAxMi41bDcuNS00LjM3NUwxMCAzLjc1IDIuNSA4LjEyNVoiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjY4NSAzLjIxYS42MjUuNjI1IDAgMCAxIC42MyAwbDcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOGw3LjUtNC4zNzVaTTMuNzQgOC4xMjUgMTAgMTEuNzc2bDYuMjYtMy42NTFMMTAgNC40NzQgMy43NCA4LjEyNVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA5LjQ2YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDExLjc3NmwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA5LjQ2Wm0tMS42NiAyLjQxNUwxMCAxNS41MjZsNi4yNi0zLjY1MS0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNi0xLjk3NSAxLjE1MVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", $e = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMy4yMWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDguMTI1IDEwIDExLjc3Nmw2LjI2LTMuNjUxTDEwIDQuNDc0IDMuNzQgOC4xMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjcxNCAxMCAxMCAxMi41bDQuMjg2LTIuNSAzLjIxNCAxLjg3NUwxMCAxNi4yNWwtNy41LTQuMzc1TDUuNzE0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDkuNDZhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgMTEuNzc2bDMuOTctMi4zMTZhLjYyNS42MjUgMCAwIDEgLjYzIDBsMy4yMTUgMS44NzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhMNS40IDkuNDZabS0xLjY2IDIuNDE1TDEwIDE1LjUyNmw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2LTEuOTc1IDEuMTUxWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", Je = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0ibTIuNSA2LjI1IDcuNSA0LjM3NSA3LjUtNC4zNzVMMTAgMS44NzUgMi41IDYuMjVaIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMS4zMzVhLjYyNS42MjUgMCAwIDEgLjYzIDBsNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4bDcuNS00LjM3NVpNMy43NCA2LjI1IDEwIDkuOTAxbDYuMjYtMy42NTFMMTAgMi41OTkgMy43NCA2LjI1WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDExLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCAxMy42NTFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgMTEuMzM1Wk0zLjc0IDEzLjc1IDEwIDE3LjQwMWw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTMuNzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgNy41ODVhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgOS45MDFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgNy41ODVaTTMuNzQgMTAgMTAgMTMuNjUxIDE2LjI2IDEwbC0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNkwzLjc0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", qe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMS45NiAxMy40MzVhLjYyNS42MjUgMCAwIDEgLjg1NS0uMjI1TDEwIDE3LjQwMWw3LjE4NS00LjE5YS42MjUuNjI1IDAgMCAxIC42MyAxLjA3OWwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEtLjIyNS0uODU1Wk05LjY4NSAxLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDYuMjUgMTAgOS45MDFsNi4yNi0zLjY1MUwxMCAyLjU5OSAzLjc0IDYuMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Im01LjcxNCAxMS44NzUgNC4yODYgMi41IDQuMjg2LTIuNUwxNy41IDEzLjc1IDEwIDE4LjEyNSAyLjUgMTMuNzVsMy4yMTQtMS44NzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgMTEuMzM1YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDEzLjY1MWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCAxMS4zMzVaTTMuNzQgMTMuNzUgMTAgMTcuNDAxbDYuMjYtMy42NTEtMS45NzQtMS4xNTEtMy45NzEgMi4zMTZhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTMuOTctMi4zMTZMMy43NCAxMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA3LjU4NWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCA5LjkwMWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA3LjU4NVpNMy43NCAxMCAxMCAxMy42NTEgMTYuMjYgMTBsLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTBaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=", et = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI0VDNEU0MCIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOC4xMjUgMS4yNUExLjg3NSAxLjg3NSAwIDAgMCA2LjI1IDMuMTI1di42MjVIMy4xMjVhLjYyNS42MjUgMCAwIDAgMCAxLjI1aC42MjV2MTEuMjVBMS4yNSAxLjI1IDAgMCAwIDUgMTcuNWgxMGExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjVoLjYyNWEuNjI1LjYyNSAwIDAgMCAwLTEuMjVIMTMuNzV2LS42MjVhMS44NzUgMS44NzUgMCAwIDAtMS44NzUtMS44NzVoLTMuNzVabTQuMzc1IDIuNXYtLjYyNWEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2LjYyNWg1Wk01IDE2LjI1VjVoMTB2MTEuMjVINVpNOC4xMjUgNy41Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NWEuNjI1LjYyNSAwIDEgMS0xLjI1IDB2LTVjMC0uMzQ1LjI4LS42MjUuNjI1LS42MjVabTQuMzc1IDUuNjI1di01YS42MjUuNjI1IDAgMCAwLTEuMjUgMHY1YS42MjUuNjI1IDAgMSAwIDEuMjUgMFoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==",
|
|
552
|
+
const Ge = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNi44NzUgMi41YS42MjUuNjI1IDAgMCAwLS42MjUuNjI0VjYuMjVIMy4xMjVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2MTBjMCAuMzQ1LjI4LjYyNS42MjUuNjI1aDEwYy4zNDUgMCAuNjI1LS4yOC42MjUtLjYyNXYtMy4xMjZoMy4xMjVjLjM0NSAwIC42MjUtLjI4LjYyNS0uNjI1di0xMGEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTEwWm02Ljg3NSAxMGgyLjVWMy43NUg3LjV2Mi41aDUuNjI1Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NS42MjRabS0xMCAzLjc1VjcuNWg4Ljc1djguNzVIMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", Xe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMi41IDcuNWMwLS42OS41Ni0xLjI1IDEuMjUtMS4yNWgxMi41Yy42OSAwIDEuMjUuNTYgMS4yNSAxLjI1djguNzVjMCAuNjktLjU2IDEuMjUtMS4yNSAxLjI1SDMuNzVjLS42OSAwLTEuMjUtLjU2LTEuMjUtMS4yNVY3LjVabTEzLjc1IDBIMy43NXY4Ljc1aDEyLjVWNy41WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTAgMS44NzVhMi4xODggMi4xODggMCAwIDAtMi4xODggMi4xODh2Mi44MTJhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyYTMuNDM3IDMuNDM3IDAgMSAxIDYuODc1IDB2Mi44MTNhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyQTIuMTg4IDIuMTg4IDAgMCAwIDEwIDEuODc2WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTEwIDEyLjgxM2EuOTM3LjkzNyAwIDEgMCAwLTEuODc1LjkzNy45MzcgMCAwIDAgMCAxLjg3NFoiLz48L3N2Zz4=", Qe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE2LjI1IDYuMjVINy41VjQuMzc1YTIuNSAyLjUgMCAwIDEgMi41LTIuNWMxLjIgMCAyLjI4MS44NiAyLjUxMiAyYS42MjUuNjI1IDAgMCAwIDEuMjI2LS4yNWMtLjM1NC0xLjczOC0xLjkyNS0zLTMuNzM4LTNhMy43NTQgMy43NTQgMCAwIDAtMy43NSAzLjc1VjYuMjVoLTIuNUExLjI1IDEuMjUgMCAwIDAgMi41IDcuNXY4Ljc1YTEuMjUgMS4yNSAwIDAgMCAxLjI1IDEuMjVoMTIuNWExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjcuNWExLjI1IDEuMjUgMCAwIDAtMS4yNS0xLjI1Wm0wIDEwSDMuNzVWNy41aDEyLjV2OC43NVptLTUuMzEzLTQuMzc1YS45MzcuOTM3IDAgMSAxLTEuODc0IDAgLjkzNy45MzcgMCAwIDEgMS44NzQgMFoiLz48L3N2Zz4K", Ke = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTIuNSA4LjEyNSAxMCAxMi41bDcuNS00LjM3NUwxMCAzLjc1IDIuNSA4LjEyNVoiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjY4NSAzLjIxYS42MjUuNjI1IDAgMCAxIC42MyAwbDcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOGw3LjUtNC4zNzVaTTMuNzQgOC4xMjUgMTAgMTEuNzc2bDYuMjYtMy42NTFMMTAgNC40NzQgMy43NCA4LjEyNVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA5LjQ2YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDExLjc3NmwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA5LjQ2Wm0tMS42NiAyLjQxNUwxMCAxNS41MjZsNi4yNi0zLjY1MS0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNi0xLjk3NSAxLjE1MVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", $e = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMy4yMWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDguMTI1IDEwIDExLjc3Nmw2LjI2LTMuNjUxTDEwIDQuNDc0IDMuNzQgOC4xMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjcxNCAxMCAxMCAxMi41bDQuMjg2LTIuNSAzLjIxNCAxLjg3NUwxMCAxNi4yNWwtNy41LTQuMzc1TDUuNzE0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDkuNDZhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgMTEuNzc2bDMuOTctMi4zMTZhLjYyNS42MjUgMCAwIDEgLjYzIDBsMy4yMTUgMS44NzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhMNS40IDkuNDZabS0xLjY2IDIuNDE1TDEwIDE1LjUyNmw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2LTEuOTc1IDEuMTUxWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", Je = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0ibTIuNSA2LjI1IDcuNSA0LjM3NSA3LjUtNC4zNzVMMTAgMS44NzUgMi41IDYuMjVaIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMS4zMzVhLjYyNS42MjUgMCAwIDEgLjYzIDBsNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4bDcuNS00LjM3NVpNMy43NCA2LjI1IDEwIDkuOTAxbDYuMjYtMy42NTFMMTAgMi41OTkgMy43NCA2LjI1WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDExLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCAxMy42NTFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgMTEuMzM1Wk0zLjc0IDEzLjc1IDEwIDE3LjQwMWw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTMuNzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgNy41ODVhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgOS45MDFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgNy41ODVaTTMuNzQgMTAgMTAgMTMuNjUxIDE2LjI2IDEwbC0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNkwzLjc0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", qe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMS45NiAxMy40MzVhLjYyNS42MjUgMCAwIDEgLjg1NS0uMjI1TDEwIDE3LjQwMWw3LjE4NS00LjE5YS42MjUuNjI1IDAgMCAxIC42MyAxLjA3OWwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEtLjIyNS0uODU1Wk05LjY4NSAxLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDYuMjUgMTAgOS45MDFsNi4yNi0zLjY1MUwxMCAyLjU5OSAzLjc0IDYuMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Im01LjcxNCAxMS44NzUgNC4yODYgMi41IDQuMjg2LTIuNUwxNy41IDEzLjc1IDEwIDE4LjEyNSAyLjUgMTMuNzVsMy4yMTQtMS44NzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgMTEuMzM1YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDEzLjY1MWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCAxMS4zMzVaTTMuNzQgMTMuNzUgMTAgMTcuNDAxbDYuMjYtMy42NTEtMS45NzQtMS4xNTEtMy45NzEgMi4zMTZhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTMuOTctMi4zMTZMMy43NCAxMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA3LjU4NWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCA5LjkwMWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA3LjU4NVpNMy43NCAxMCAxMCAxMy42NTEgMTYuMjYgMTBsLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTBaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=", et = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI0VDNEU0MCIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOC4xMjUgMS4yNUExLjg3NSAxLjg3NSAwIDAgMCA2LjI1IDMuMTI1di42MjVIMy4xMjVhLjYyNS42MjUgMCAwIDAgMCAxLjI1aC42MjV2MTEuMjVBMS4yNSAxLjI1IDAgMCAwIDUgMTcuNWgxMGExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjVoLjYyNWEuNjI1LjYyNSAwIDAgMCAwLTEuMjVIMTMuNzV2LS42MjVhMS44NzUgMS44NzUgMCAwIDAtMS44NzUtMS44NzVoLTMuNzVabTQuMzc1IDIuNXYtLjYyNWEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2LjYyNWg1Wk01IDE2LjI1VjVoMTB2MTEuMjVINVpNOC4xMjUgNy41Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NWEuNjI1LjYyNSAwIDEgMS0xLjI1IDB2LTVjMC0uMzQ1LjI4LS42MjUuNjI1LS42MjVabTQuMzc1IDUuNjI1di01YS42MjUuNjI1IDAgMCAwLTEuMjUgMHY1YS42MjUuNjI1IDAgMSAwIDEuMjUgMFoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", Z = {
|
|
553
553
|
style: {
|
|
554
554
|
position: "absolute",
|
|
555
555
|
display: "none",
|
|
@@ -626,7 +626,7 @@ const Ge = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMj
|
|
|
626
626
|
sendBackwards: $e
|
|
627
627
|
},
|
|
628
628
|
handlers: {
|
|
629
|
-
copyPaste: (r) =>
|
|
629
|
+
copyPaste: (r) => y(null, null, function* () {
|
|
630
630
|
r.clipboardManager.copyPaste();
|
|
631
631
|
}),
|
|
632
632
|
delete: (r) => {
|
|
@@ -659,11 +659,11 @@ class tt {
|
|
|
659
659
|
_initToolbar() {
|
|
660
660
|
if (!this.options.showToolbar) return;
|
|
661
661
|
const e = this.options.toolbar || {};
|
|
662
|
-
this.config = ue(
|
|
663
|
-
style:
|
|
664
|
-
btnStyle:
|
|
665
|
-
icons:
|
|
666
|
-
handlers:
|
|
662
|
+
this.config = ue(I(I({}, Z), e), {
|
|
663
|
+
style: I(I({}, Z.style), e.style || {}),
|
|
664
|
+
btnStyle: I(I({}, Z.btnStyle), e.btnStyle || {}),
|
|
665
|
+
icons: I(I({}, Z.icons), e.icons || {}),
|
|
666
|
+
handlers: I(I({}, Z.handlers), e.handlers || {})
|
|
667
667
|
}), this.currentTarget = null, this.currentLocked = !1, this.isTransforming = !1, this._onMouseDown = this._handleMouseDown.bind(this), this._onObjectMoving = this._startTransform.bind(this), this._onObjectScaling = this._startTransform.bind(this), this._onObjectRotating = this._startTransform.bind(this), this._onMouseUp = this._endTransform.bind(this), this._onObjectModified = this._endTransform.bind(this), this._onSelectionChange = this._updateToolbar.bind(this), this._onSelectionClear = () => {
|
|
668
668
|
this.el.style.display = "none";
|
|
669
669
|
}, this._createDOM(), this._bindEvents();
|
|
@@ -754,10 +754,10 @@ class tt {
|
|
|
754
754
|
}
|
|
755
755
|
const { el: t, config: s, canvas: a } = this;
|
|
756
756
|
e.setCoords();
|
|
757
|
-
const n = a.getZoom(), [, , , , o, i] = a.viewportTransform, { x: c } = e.getCenterPoint(), { top: d, height: h } = e.getBoundingRect(), g = c * n + o - t.offsetWidth / 2,
|
|
757
|
+
const n = a.getZoom(), [, , , , o, i] = a.viewportTransform, { x: c } = e.getCenterPoint(), { top: d, height: h } = e.getBoundingRect(), g = c * n + o - t.offsetWidth / 2, u = s.offsetTop || 0, f = (d + h) * n + i + u;
|
|
758
758
|
Object.assign(t.style, {
|
|
759
759
|
left: `${g}px`,
|
|
760
|
-
top: `${
|
|
760
|
+
top: `${f}px`,
|
|
761
761
|
display: "flex"
|
|
762
762
|
});
|
|
763
763
|
}
|
|
@@ -873,7 +873,7 @@ class st {
|
|
|
873
873
|
console.log("Нет изменений для сохранения.");
|
|
874
874
|
return;
|
|
875
875
|
}
|
|
876
|
-
console.log("baseState", this.baseState), this.currentIndex < this.patches.length && this.patches.splice(this.currentIndex), console.log("diff", s), this.totalChangesCount += 1, this.patches.push({ id:
|
|
876
|
+
console.log("baseState", this.baseState), this.currentIndex < this.patches.length && this.patches.splice(this.currentIndex), console.log("diff", s), this.totalChangesCount += 1, this.patches.push({ id: A(), diff: s }), this.currentIndex += 1, this.patches.length > this.maxHistoryLength && (this.baseState = this.diffPatcher.patch(this.baseState, this.patches[0].diff), this.patches.shift(), this.currentIndex -= 1, this.baseStateChangesCount += 1), console.log("Состояние сохранено. Текущий индекс истории:", this.currentIndex);
|
|
877
877
|
}
|
|
878
878
|
/**
|
|
879
879
|
* Функция загрузки состояния в канвас.
|
|
@@ -881,7 +881,7 @@ class st {
|
|
|
881
881
|
* @fires editor:history-state-loaded
|
|
882
882
|
*/
|
|
883
883
|
loadStateFromFullState(e) {
|
|
884
|
-
return
|
|
884
|
+
return y(this, null, function* () {
|
|
885
885
|
if (!e) return;
|
|
886
886
|
console.log("loadStateFromFullState fullState", e);
|
|
887
887
|
const { canvas: t, canvasManager: s, interactionBlocker: a, backgroundManager: n } = this.editor, { width: o, height: i } = t;
|
|
@@ -906,7 +906,7 @@ class st {
|
|
|
906
906
|
* @fires editor:undo
|
|
907
907
|
*/
|
|
908
908
|
undo() {
|
|
909
|
-
return
|
|
909
|
+
return y(this, null, function* () {
|
|
910
910
|
if (!this.skipHistory) {
|
|
911
911
|
if (this.currentIndex <= 0) {
|
|
912
912
|
console.log("Нет предыдущих состояний для отмены.");
|
|
@@ -943,7 +943,7 @@ class st {
|
|
|
943
943
|
* @fires editor:redo
|
|
944
944
|
*/
|
|
945
945
|
redo() {
|
|
946
|
-
return
|
|
946
|
+
return y(this, null, function* () {
|
|
947
947
|
if (!this.skipHistory) {
|
|
948
948
|
if (this.currentIndex >= this.patches.length) {
|
|
949
949
|
console.log("Нет состояний для повтора.");
|
|
@@ -976,7 +976,7 @@ class st {
|
|
|
976
976
|
});
|
|
977
977
|
}
|
|
978
978
|
}
|
|
979
|
-
const at = 0.1, nt = 2, ot = 0.1, it = 90,
|
|
979
|
+
const at = 0.1, nt = 2, ot = 0.1, it = 90, R = 16, U = 16, w = 4096, T = 4096, be = "application/image-editor:";
|
|
980
980
|
class O {
|
|
981
981
|
constructor({ editor: e }) {
|
|
982
982
|
this.editor = e, this.options = e.options, this._createdBlobUrls = [], this.acceptContentTypes = this.editor.options.acceptContentTypes, this.acceptFormats = this.getAllowedFormatsFromContentTypes();
|
|
@@ -994,83 +994,114 @@ class O {
|
|
|
994
994
|
* @returns возвращает Promise с объектом изображения или null в случае ошибки
|
|
995
995
|
*/
|
|
996
996
|
importImage(e) {
|
|
997
|
-
return
|
|
997
|
+
return y(this, null, function* () {
|
|
998
998
|
const {
|
|
999
999
|
source: t,
|
|
1000
1000
|
scale: s = `image-${this.options.scaleType}`,
|
|
1001
1001
|
withoutSave: a = !1,
|
|
1002
|
-
fromClipboard: n = !1
|
|
1002
|
+
fromClipboard: n = !1,
|
|
1003
|
+
isBackground: o = !1,
|
|
1004
|
+
withoutSelection: i = !1
|
|
1003
1005
|
} = e;
|
|
1004
1006
|
if (!t) return null;
|
|
1005
|
-
const { canvas:
|
|
1006
|
-
if (!this.isAllowedContentType(
|
|
1007
|
-
const
|
|
1008
|
-
return
|
|
1007
|
+
const { canvas: c, montageArea: d, transformManager: h, historyManager: l, errorManager: g } = this.editor, u = yield this.getContentType(t), f = O.getFormatFromContentType(u), { acceptContentTypes: m, acceptFormats: M } = this;
|
|
1008
|
+
if (!this.isAllowedContentType(u)) {
|
|
1009
|
+
const j = `Неверный contentType для изображения: ${u}. Ожидается один из: ${this.acceptContentTypes.join(", ")}.`;
|
|
1010
|
+
return g.emitError({
|
|
1009
1011
|
origin: "ImageManager",
|
|
1010
1012
|
method: "importImage",
|
|
1011
1013
|
code: "INVALID_CONTENT_TYPE",
|
|
1012
|
-
message:
|
|
1013
|
-
data: {
|
|
1014
|
+
message: j,
|
|
1015
|
+
data: {
|
|
1016
|
+
source: t,
|
|
1017
|
+
format: f,
|
|
1018
|
+
contentType: u,
|
|
1019
|
+
acceptContentTypes: m,
|
|
1020
|
+
acceptFormats: M,
|
|
1021
|
+
fromClipboard: n,
|
|
1022
|
+
isBackground: o,
|
|
1023
|
+
withoutSelection: i
|
|
1024
|
+
}
|
|
1014
1025
|
}), null;
|
|
1015
1026
|
}
|
|
1016
|
-
|
|
1027
|
+
l.suspendHistory();
|
|
1017
1028
|
try {
|
|
1018
|
-
let
|
|
1029
|
+
let j, b;
|
|
1019
1030
|
if (t instanceof File)
|
|
1020
|
-
|
|
1031
|
+
j = URL.createObjectURL(t);
|
|
1021
1032
|
else if (typeof t == "string") {
|
|
1022
1033
|
const E = yield (yield fetch(t, { mode: "cors" })).blob();
|
|
1023
|
-
|
|
1034
|
+
j = URL.createObjectURL(E);
|
|
1024
1035
|
} else
|
|
1025
|
-
return
|
|
1036
|
+
return g.emitError({
|
|
1026
1037
|
origin: "ImageManager",
|
|
1027
1038
|
method: "importImage",
|
|
1028
1039
|
code: "INVALID_SOURCE_TYPE",
|
|
1029
1040
|
message: "Неверный тип источника изображения. Ожидается URL или объект File.",
|
|
1030
|
-
data: {
|
|
1041
|
+
data: {
|
|
1042
|
+
source: t,
|
|
1043
|
+
format: f,
|
|
1044
|
+
contentType: u,
|
|
1045
|
+
acceptContentTypes: m,
|
|
1046
|
+
acceptFormats: M,
|
|
1047
|
+
fromClipboard: n,
|
|
1048
|
+
isBackground: o,
|
|
1049
|
+
withoutSelection: i
|
|
1050
|
+
}
|
|
1031
1051
|
}), null;
|
|
1032
|
-
if (this._createdBlobUrls.push(
|
|
1033
|
-
const
|
|
1034
|
-
|
|
1052
|
+
if (this._createdBlobUrls.push(j), f === "svg") {
|
|
1053
|
+
const C = yield De(j);
|
|
1054
|
+
b = P.groupSVGElements(C.objects, C.options);
|
|
1035
1055
|
} else
|
|
1036
|
-
|
|
1037
|
-
const { width:
|
|
1038
|
-
if (
|
|
1039
|
-
const
|
|
1056
|
+
b = yield z.fromURL(j, { crossOrigin: "anonymous" });
|
|
1057
|
+
const { width: S, height: k } = b;
|
|
1058
|
+
if (b instanceof z) {
|
|
1059
|
+
const C = b.getElement();
|
|
1040
1060
|
let E = "";
|
|
1041
|
-
if (
|
|
1042
|
-
const L = yield this.resizeImageToBoundaries(E, "max"),
|
|
1043
|
-
this._createdBlobUrls.push(
|
|
1044
|
-
} else if (
|
|
1045
|
-
const L = yield this.resizeImageToBoundaries(E, "min"),
|
|
1046
|
-
this._createdBlobUrls.push(
|
|
1061
|
+
if (C instanceof HTMLImageElement ? E = C.src : C instanceof HTMLCanvasElement && (E = C.toDataURL()), k > T || S > w) {
|
|
1062
|
+
const L = yield this.resizeImageToBoundaries(E, "max"), p = URL.createObjectURL(L);
|
|
1063
|
+
this._createdBlobUrls.push(p), b = yield z.fromURL(p, { crossOrigin: "anonymous" });
|
|
1064
|
+
} else if (k < U || S < R) {
|
|
1065
|
+
const L = yield this.resizeImageToBoundaries(E, "min"), p = URL.createObjectURL(L);
|
|
1066
|
+
this._createdBlobUrls.push(p), b = yield z.fromURL(p, { crossOrigin: "anonymous" });
|
|
1047
1067
|
}
|
|
1048
1068
|
}
|
|
1049
|
-
if (
|
|
1050
|
-
this.editor.canvasManager.scaleMontageAreaToImage({ object:
|
|
1069
|
+
if (b.set("id", `${b.type}-${A()}`), b.set("format", f), s === "scale-montage")
|
|
1070
|
+
this.editor.canvasManager.scaleMontageAreaToImage({ object: b, withoutSave: !0 });
|
|
1051
1071
|
else {
|
|
1052
|
-
const { width:
|
|
1053
|
-
s === "image-contain" && L < 1 ?
|
|
1072
|
+
const { width: C, height: E } = d, L = this.calculateScaleFactor({ imageObject: b, scaleType: s });
|
|
1073
|
+
s === "image-contain" && L < 1 ? h.fitObject({ object: b, type: "contain", withoutSave: !0 }) : s === "image-cover" && (S > C || k > E) && h.fitObject({ object: b, type: "cover", withoutSave: !0 });
|
|
1054
1074
|
}
|
|
1055
|
-
|
|
1056
|
-
const
|
|
1057
|
-
image:
|
|
1058
|
-
format:
|
|
1059
|
-
contentType:
|
|
1075
|
+
c.add(b), c.centerObject(b), i || c.setActiveObject(b), c.renderAll(), l.resumeHistory(), a || l.saveState();
|
|
1076
|
+
const H = {
|
|
1077
|
+
image: b,
|
|
1078
|
+
format: f,
|
|
1079
|
+
contentType: u,
|
|
1060
1080
|
scale: s,
|
|
1061
1081
|
withoutSave: a,
|
|
1062
1082
|
source: t,
|
|
1063
|
-
fromClipboard: n
|
|
1083
|
+
fromClipboard: n,
|
|
1084
|
+
isBackground: o,
|
|
1085
|
+
withoutSelection: i
|
|
1064
1086
|
};
|
|
1065
|
-
return
|
|
1066
|
-
} catch (
|
|
1067
|
-
return
|
|
1087
|
+
return c.fire("editor:image-imported", H), H;
|
|
1088
|
+
} catch (j) {
|
|
1089
|
+
return g.emitError({
|
|
1068
1090
|
origin: "ImageManager",
|
|
1069
1091
|
method: "importImage",
|
|
1070
1092
|
code: "IMPORT_FAILED",
|
|
1071
|
-
message: `Ошибка импорта изображения: ${
|
|
1072
|
-
data: {
|
|
1073
|
-
|
|
1093
|
+
message: `Ошибка импорта изображения: ${j.message}`,
|
|
1094
|
+
data: {
|
|
1095
|
+
source: t,
|
|
1096
|
+
format: f,
|
|
1097
|
+
contentType: u,
|
|
1098
|
+
scale: s,
|
|
1099
|
+
withoutSave: a,
|
|
1100
|
+
fromClipboard: n,
|
|
1101
|
+
isBackground: o,
|
|
1102
|
+
withoutSelection: i
|
|
1103
|
+
}
|
|
1104
|
+
}), l.resumeHistory(), null;
|
|
1074
1105
|
}
|
|
1075
1106
|
});
|
|
1076
1107
|
}
|
|
@@ -1083,16 +1114,16 @@ class O {
|
|
|
1083
1114
|
* @returns возвращает Promise с Blob-объектом уменьшенного изображения
|
|
1084
1115
|
*/
|
|
1085
1116
|
resizeImageToBoundaries(e, t = "max") {
|
|
1086
|
-
return
|
|
1087
|
-
let s = `Размер изображения больше максимального размера канваса, поэтому оно будет уменьшено до максимальных размеров c сохранением пропорций: ${
|
|
1088
|
-
t === "min" && (s = `Размер изображения меньше минимального размера канваса, поэтому оно будет увеличено до минимальных размеров c сохранением пропорций: ${
|
|
1117
|
+
return y(this, null, function* () {
|
|
1118
|
+
let s = `Размер изображения больше максимального размера канваса, поэтому оно будет уменьшено до максимальных размеров c сохранением пропорций: ${w}x${T}`;
|
|
1119
|
+
t === "min" && (s = `Размер изображения меньше минимального размера канваса, поэтому оно будет увеличено до минимальных размеров c сохранением пропорций: ${R}x${U}`);
|
|
1089
1120
|
const a = {
|
|
1090
1121
|
dataURL: e,
|
|
1091
1122
|
sizeType: t,
|
|
1092
|
-
maxWidth:
|
|
1093
|
-
maxHeight:
|
|
1094
|
-
minWidth:
|
|
1095
|
-
minHeight:
|
|
1123
|
+
maxWidth: w,
|
|
1124
|
+
maxHeight: T,
|
|
1125
|
+
minWidth: R,
|
|
1126
|
+
minHeight: U
|
|
1096
1127
|
};
|
|
1097
1128
|
return this.editor.errorManager.emitWarning({
|
|
1098
1129
|
origin: "ImageManager",
|
|
@@ -1115,7 +1146,7 @@ class O {
|
|
|
1115
1146
|
* @fires editor:canvas-exported
|
|
1116
1147
|
*/
|
|
1117
1148
|
exportCanvasAsImageFile() {
|
|
1118
|
-
return
|
|
1149
|
+
return y(this, arguments, function* (e = {}) {
|
|
1119
1150
|
const {
|
|
1120
1151
|
fileName: t = "image.png",
|
|
1121
1152
|
contentType: s = "image/png",
|
|
@@ -1125,16 +1156,16 @@ class O {
|
|
|
1125
1156
|
try {
|
|
1126
1157
|
const d = s === "application/pdf", h = d ? "image/jpg" : s, l = O.getFormatFromContentType(h);
|
|
1127
1158
|
i.setCoords();
|
|
1128
|
-
const { left: g, top:
|
|
1129
|
-
|
|
1130
|
-
const j =
|
|
1131
|
-
j && (j.visible = !1),
|
|
1132
|
-
const
|
|
1133
|
-
if (l === "svg" &&
|
|
1134
|
-
const
|
|
1135
|
-
|
|
1159
|
+
const { left: g, top: u, width: f, height: m } = i.getBoundingRect(), M = yield o.clone(["id", "format", "locked"]);
|
|
1160
|
+
M.enableRetinaScaling = !1, ["image/jpg", "image/jpeg"].includes(h) && (M.backgroundColor = "#ffffff");
|
|
1161
|
+
const j = M.getObjects().find((p) => p.id === i.id);
|
|
1162
|
+
j && (j.visible = !1), M.viewportTransform = [1, 0, 0, 1, -g, -u], M.setDimensions({ width: f, height: m }, { backstoreOnly: !0 }), M.renderAll();
|
|
1163
|
+
const b = M.getObjects().filter((p) => p.format).every((p) => p.format === "svg");
|
|
1164
|
+
if (l === "svg" && b) {
|
|
1165
|
+
const p = M.toSVG();
|
|
1166
|
+
M.dispose();
|
|
1136
1167
|
const D = {
|
|
1137
|
-
image: O._exportSVGStringAsFile(
|
|
1168
|
+
image: O._exportSVGStringAsFile(p, {
|
|
1138
1169
|
exportAsBase64: a,
|
|
1139
1170
|
exportAsBlob: n,
|
|
1140
1171
|
fileName: t
|
|
@@ -1145,42 +1176,42 @@ class O {
|
|
|
1145
1176
|
};
|
|
1146
1177
|
return o.fire("editor:canvas-exported", D), D;
|
|
1147
1178
|
}
|
|
1148
|
-
const S = yield new Promise((
|
|
1149
|
-
|
|
1150
|
-
D ?
|
|
1179
|
+
const S = yield new Promise((p, B) => {
|
|
1180
|
+
M.getElement().toBlob((D) => {
|
|
1181
|
+
D ? p(D) : B(new Error("Failed to create Blob from canvas"));
|
|
1151
1182
|
});
|
|
1152
1183
|
});
|
|
1153
|
-
if (
|
|
1154
|
-
const
|
|
1184
|
+
if (M.dispose(), n) {
|
|
1185
|
+
const p = {
|
|
1155
1186
|
image: S,
|
|
1156
1187
|
format: l,
|
|
1157
1188
|
contentType: h,
|
|
1158
1189
|
fileName: t
|
|
1159
1190
|
};
|
|
1160
|
-
return o.fire("editor:canvas-exported",
|
|
1191
|
+
return o.fire("editor:canvas-exported", p), p;
|
|
1161
1192
|
}
|
|
1162
|
-
const
|
|
1193
|
+
const k = yield createImageBitmap(S), H = yield c.post(
|
|
1163
1194
|
"toDataURL",
|
|
1164
|
-
{ format: l, quality: 1, bitmap:
|
|
1165
|
-
[
|
|
1195
|
+
{ format: l, quality: 1, bitmap: k },
|
|
1196
|
+
[k]
|
|
1166
1197
|
);
|
|
1167
1198
|
if (d) {
|
|
1168
|
-
const B =
|
|
1199
|
+
const B = f * 0.264583, D = m * 0.264583, pe = (yield this.editor.moduleLoader.loadModule("jspdf")).jsPDF, J = new pe({
|
|
1169
1200
|
orientation: B > D ? "landscape" : "portrait",
|
|
1170
1201
|
unit: "mm",
|
|
1171
1202
|
format: [B, D]
|
|
1172
1203
|
});
|
|
1173
|
-
if (
|
|
1204
|
+
if (J.addImage(String(H), "JPG", 0, 0, B, D), a) {
|
|
1174
1205
|
const de = {
|
|
1175
|
-
image:
|
|
1206
|
+
image: J.output("datauristring"),
|
|
1176
1207
|
format: "pdf",
|
|
1177
1208
|
contentType: "application/pdf",
|
|
1178
1209
|
fileName: t
|
|
1179
1210
|
};
|
|
1180
1211
|
return o.fire("editor:canvas-exported", de), de;
|
|
1181
1212
|
}
|
|
1182
|
-
const
|
|
1183
|
-
image: new File([
|
|
1213
|
+
const Ie = J.output("blob"), ce = {
|
|
1214
|
+
image: new File([Ie], t, { type: "application/pdf" }),
|
|
1184
1215
|
format: "pdf",
|
|
1185
1216
|
contentType: "application/pdf",
|
|
1186
1217
|
fileName: t
|
|
@@ -1188,21 +1219,21 @@ class O {
|
|
|
1188
1219
|
return o.fire("editor:canvas-exported", ce), ce;
|
|
1189
1220
|
}
|
|
1190
1221
|
if (a) {
|
|
1191
|
-
const
|
|
1192
|
-
image:
|
|
1222
|
+
const p = {
|
|
1223
|
+
image: H,
|
|
1193
1224
|
format: l,
|
|
1194
1225
|
contentType: h,
|
|
1195
1226
|
fileName: t
|
|
1196
1227
|
};
|
|
1197
|
-
return o.fire("editor:canvas-exported",
|
|
1228
|
+
return o.fire("editor:canvas-exported", p), p;
|
|
1198
1229
|
}
|
|
1199
|
-
const
|
|
1200
|
-
image: new File([S],
|
|
1230
|
+
const C = l === "svg" && !b ? t.replace(/\.[^/.]+$/, ".png") : t, L = {
|
|
1231
|
+
image: new File([S], C, { type: h }),
|
|
1201
1232
|
format: l,
|
|
1202
1233
|
contentType: h,
|
|
1203
|
-
fileName:
|
|
1234
|
+
fileName: C
|
|
1204
1235
|
};
|
|
1205
|
-
return o.fire("editor:canvas-exported",
|
|
1236
|
+
return o.fire("editor:canvas-exported", L), L;
|
|
1206
1237
|
} catch (d) {
|
|
1207
1238
|
return this.editor.errorManager.emitError({
|
|
1208
1239
|
origin: "ImageManager",
|
|
@@ -1226,7 +1257,7 @@ class O {
|
|
|
1226
1257
|
* @fires editor:object-exported
|
|
1227
1258
|
*/
|
|
1228
1259
|
exportObjectAsImageFile() {
|
|
1229
|
-
return
|
|
1260
|
+
return y(this, arguments, function* (e = {}) {
|
|
1230
1261
|
const {
|
|
1231
1262
|
object: t,
|
|
1232
1263
|
fileName: s = "image.png",
|
|
@@ -1245,31 +1276,31 @@ class O {
|
|
|
1245
1276
|
try {
|
|
1246
1277
|
const h = O.getFormatFromContentType(a);
|
|
1247
1278
|
if (h === "svg") {
|
|
1248
|
-
const
|
|
1279
|
+
const m = d.toSVG(), M = O._exportSVGStringAsFile(m, {
|
|
1249
1280
|
exportAsBase64: n,
|
|
1250
1281
|
exportAsBlob: o,
|
|
1251
1282
|
fileName: s
|
|
1252
1283
|
}), j = {
|
|
1253
1284
|
object: d,
|
|
1254
|
-
image:
|
|
1285
|
+
image: M,
|
|
1255
1286
|
format: h,
|
|
1256
1287
|
contentType: "image/svg+xml",
|
|
1257
1288
|
fileName: s.replace(/\.[^/.]+$/, ".svg")
|
|
1258
1289
|
};
|
|
1259
1290
|
return i.fire("editor:object-exported", j), j;
|
|
1260
1291
|
}
|
|
1261
|
-
if (n && d instanceof
|
|
1262
|
-
const
|
|
1292
|
+
if (n && d instanceof z) {
|
|
1293
|
+
const m = yield createImageBitmap(d.getElement()), M = yield c.post(
|
|
1263
1294
|
"toDataURL",
|
|
1264
1295
|
{
|
|
1265
1296
|
format: h,
|
|
1266
1297
|
quality: 1,
|
|
1267
|
-
bitmap:
|
|
1298
|
+
bitmap: m
|
|
1268
1299
|
},
|
|
1269
|
-
[
|
|
1300
|
+
[m]
|
|
1270
1301
|
), j = {
|
|
1271
1302
|
object: d,
|
|
1272
|
-
image:
|
|
1303
|
+
image: M,
|
|
1273
1304
|
format: h,
|
|
1274
1305
|
contentType: a,
|
|
1275
1306
|
fileName: s
|
|
@@ -1278,29 +1309,29 @@ class O {
|
|
|
1278
1309
|
}
|
|
1279
1310
|
const l = d.toCanvasElement({
|
|
1280
1311
|
enableRetinaScaling: !1
|
|
1281
|
-
}), g = yield new Promise((
|
|
1312
|
+
}), g = yield new Promise((m, M) => {
|
|
1282
1313
|
l.toBlob((j) => {
|
|
1283
|
-
j ?
|
|
1314
|
+
j ? m(j) : M(new Error("Failed to create Blob from canvas"));
|
|
1284
1315
|
});
|
|
1285
1316
|
});
|
|
1286
1317
|
if (o) {
|
|
1287
|
-
const
|
|
1318
|
+
const m = {
|
|
1288
1319
|
object: d,
|
|
1289
1320
|
image: g,
|
|
1290
1321
|
format: h,
|
|
1291
1322
|
contentType: a,
|
|
1292
1323
|
fileName: s
|
|
1293
1324
|
};
|
|
1294
|
-
return i.fire("editor:object-exported",
|
|
1325
|
+
return i.fire("editor:object-exported", m), m;
|
|
1295
1326
|
}
|
|
1296
|
-
const
|
|
1327
|
+
const u = new File([g], s, { type: a }), f = {
|
|
1297
1328
|
object: d,
|
|
1298
|
-
image:
|
|
1329
|
+
image: u,
|
|
1299
1330
|
format: h,
|
|
1300
1331
|
contentType: a,
|
|
1301
1332
|
fileName: s
|
|
1302
1333
|
};
|
|
1303
|
-
return i.fire("editor:object-exported",
|
|
1334
|
+
return i.fire("editor:object-exported", f), f;
|
|
1304
1335
|
} catch (h) {
|
|
1305
1336
|
return this.editor.errorManager.emitError({
|
|
1306
1337
|
origin: "ImageManager",
|
|
@@ -1339,7 +1370,7 @@ class O {
|
|
|
1339
1370
|
* @public
|
|
1340
1371
|
*/
|
|
1341
1372
|
getContentType(e) {
|
|
1342
|
-
return
|
|
1373
|
+
return y(this, null, function* () {
|
|
1343
1374
|
return typeof e == "string" ? this.getContentTypeFromUrl(e) : e.type || "application/octet-stream";
|
|
1344
1375
|
});
|
|
1345
1376
|
}
|
|
@@ -1350,7 +1381,7 @@ class O {
|
|
|
1350
1381
|
* @public
|
|
1351
1382
|
*/
|
|
1352
1383
|
getContentTypeFromUrl(e) {
|
|
1353
|
-
return
|
|
1384
|
+
return y(this, null, function* () {
|
|
1354
1385
|
if (e.startsWith("data:")) {
|
|
1355
1386
|
const t = e.match(/^data:([^;]+)/);
|
|
1356
1387
|
return t ? t[1] : "application/octet-stream";
|
|
@@ -1429,7 +1460,7 @@ class O {
|
|
|
1429
1460
|
return t ? t[1] : "";
|
|
1430
1461
|
}
|
|
1431
1462
|
}
|
|
1432
|
-
const
|
|
1463
|
+
const x = (r, e, t) => Math.max(Math.min(r, t), e), je = (r, e) => r * e, rt = (r, e) => new G(r / 2, e / 2);
|
|
1433
1464
|
function ct(r) {
|
|
1434
1465
|
return ((r == null ? void 0 : r.type) === "image" || (r == null ? void 0 : r.format) === "svg") && typeof (r == null ? void 0 : r.width) == "number" && typeof (r == null ? void 0 : r.height) == "number";
|
|
1435
1466
|
}
|
|
@@ -1458,20 +1489,20 @@ class dt {
|
|
|
1458
1489
|
* @fires editor:resolution-width-changed
|
|
1459
1490
|
*/
|
|
1460
1491
|
setResolutionWidth(e, { preserveProportional: t, withoutSave: s, adaptCanvasToContainer: a } = {}) {
|
|
1461
|
-
var
|
|
1492
|
+
var f;
|
|
1462
1493
|
if (!e) return;
|
|
1463
1494
|
const {
|
|
1464
1495
|
canvas: n,
|
|
1465
1496
|
montageArea: o,
|
|
1466
1497
|
options: { canvasBackstoreWidth: i }
|
|
1467
|
-
} = this.editor, { width: c, height: d } = o, h =
|
|
1468
|
-
if (!i || i === "auto" || a ? this.adaptCanvasToContainer() : i ? this.setCanvasBackstoreWidth(Number(i)) : this.setCanvasBackstoreWidth(h), o.set({ width: h }), (
|
|
1469
|
-
const
|
|
1470
|
-
this.setResolutionHeight(
|
|
1498
|
+
} = this.editor, { width: c, height: d } = o, h = x(Number(e), R, w);
|
|
1499
|
+
if (!i || i === "auto" || a ? this.adaptCanvasToContainer() : i ? this.setCanvasBackstoreWidth(Number(i)) : this.setCanvasBackstoreWidth(h), o.set({ width: h }), (f = n.clipPath) == null || f.set({ width: h }), t) {
|
|
1500
|
+
const m = h / c, M = je(d, m);
|
|
1501
|
+
this.setResolutionHeight(M);
|
|
1471
1502
|
return;
|
|
1472
1503
|
}
|
|
1473
|
-
const { left: l, top: g } = this.getObjectDefaultCoords(o),
|
|
1474
|
-
n.setViewportTransform([
|
|
1504
|
+
const { left: l, top: g } = this.getObjectDefaultCoords(o), u = n.getZoom();
|
|
1505
|
+
n.setViewportTransform([u, 0, 0, u, l, g]), this.centerMontageArea(), s || this.editor.historyManager.saveState(), n.fire("editor:resolution-width-changed", {
|
|
1475
1506
|
width: h,
|
|
1476
1507
|
preserveProportional: t,
|
|
1477
1508
|
withoutSave: s,
|
|
@@ -1488,20 +1519,20 @@ class dt {
|
|
|
1488
1519
|
* @fires editor:resolution-height-changed
|
|
1489
1520
|
*/
|
|
1490
1521
|
setResolutionHeight(e, { preserveProportional: t, withoutSave: s, adaptCanvasToContainer: a } = {}) {
|
|
1491
|
-
var
|
|
1522
|
+
var f;
|
|
1492
1523
|
if (!e) return;
|
|
1493
1524
|
const {
|
|
1494
1525
|
canvas: n,
|
|
1495
1526
|
montageArea: o,
|
|
1496
1527
|
options: { canvasBackstoreHeight: i }
|
|
1497
|
-
} = this.editor, { width: c, height: d } = o, h =
|
|
1498
|
-
if (!i || i === "auto" || a ? this.adaptCanvasToContainer() : i ? this.setCanvasBackstoreHeight(Number(i)) : this.setCanvasBackstoreHeight(h), o.set({ height: h }), (
|
|
1499
|
-
const
|
|
1500
|
-
this.setResolutionWidth(
|
|
1528
|
+
} = this.editor, { width: c, height: d } = o, h = x(Number(e), U, T);
|
|
1529
|
+
if (!i || i === "auto" || a ? this.adaptCanvasToContainer() : i ? this.setCanvasBackstoreHeight(Number(i)) : this.setCanvasBackstoreHeight(h), o.set({ height: h }), (f = n.clipPath) == null || f.set({ height: h }), t) {
|
|
1530
|
+
const m = h / d, M = je(c, m);
|
|
1531
|
+
this.setResolutionWidth(M);
|
|
1501
1532
|
return;
|
|
1502
1533
|
}
|
|
1503
|
-
const { left: l, top: g } = this.getObjectDefaultCoords(o),
|
|
1504
|
-
n.setViewportTransform([
|
|
1534
|
+
const { left: l, top: g } = this.getObjectDefaultCoords(o), u = n.getZoom();
|
|
1535
|
+
n.setViewportTransform([u, 0, 0, u, l, g]), this.centerMontageArea(), s || this.editor.historyManager.saveState(), n.fire("editor:resolution-height-changed", {
|
|
1505
1536
|
height: h,
|
|
1506
1537
|
preserveProportional: t,
|
|
1507
1538
|
withoutSave: s,
|
|
@@ -1547,7 +1578,7 @@ class dt {
|
|
|
1547
1578
|
*/
|
|
1548
1579
|
setCanvasBackstoreWidth(e) {
|
|
1549
1580
|
if (!e || typeof e != "number") return;
|
|
1550
|
-
const t =
|
|
1581
|
+
const t = x(e, R, w);
|
|
1551
1582
|
this.editor.canvas.setDimensions({ width: t }, { backstoreOnly: !0 });
|
|
1552
1583
|
}
|
|
1553
1584
|
/**
|
|
@@ -1556,7 +1587,7 @@ class dt {
|
|
|
1556
1587
|
*/
|
|
1557
1588
|
setCanvasBackstoreHeight(e) {
|
|
1558
1589
|
if (!e || typeof e != "number") return;
|
|
1559
|
-
const t =
|
|
1590
|
+
const t = x(e, U, T);
|
|
1560
1591
|
this.editor.canvas.setDimensions({ height: t }, { backstoreOnly: !0 });
|
|
1561
1592
|
}
|
|
1562
1593
|
/**
|
|
@@ -1565,7 +1596,7 @@ class dt {
|
|
|
1565
1596
|
* с учётом минимальных и максимальных значений.
|
|
1566
1597
|
*/
|
|
1567
1598
|
adaptCanvasToContainer() {
|
|
1568
|
-
const { canvas: e } = this.editor, t = this.getEditorContainer(), s = t.clientWidth, a = t.clientHeight, n =
|
|
1599
|
+
const { canvas: e } = this.editor, t = this.getEditorContainer(), s = t.clientWidth, a = t.clientHeight, n = x(s, R, w), o = x(a, U, T);
|
|
1569
1600
|
e.setDimensions({ width: n, height: o }, { backstoreOnly: !0 });
|
|
1570
1601
|
}
|
|
1571
1602
|
/**
|
|
@@ -1599,7 +1630,7 @@ class dt {
|
|
|
1599
1630
|
if (h.length === 1)
|
|
1600
1631
|
e.setActiveObject(h[0]);
|
|
1601
1632
|
else {
|
|
1602
|
-
const l = new
|
|
1633
|
+
const l = new v(h, {
|
|
1603
1634
|
canvas: e
|
|
1604
1635
|
});
|
|
1605
1636
|
e.setActiveObject(l);
|
|
@@ -1767,18 +1798,18 @@ class dt {
|
|
|
1767
1798
|
} = this.editor, d = e || a.getActiveObject();
|
|
1768
1799
|
if (!ct(d)) return;
|
|
1769
1800
|
const { width: h, height: l } = d;
|
|
1770
|
-
let g = Math.min(h,
|
|
1801
|
+
let g = Math.min(h, w), u = Math.min(l, T);
|
|
1771
1802
|
if (t) {
|
|
1772
1803
|
const {
|
|
1773
|
-
width:
|
|
1774
|
-
height:
|
|
1775
|
-
} = n,
|
|
1776
|
-
g =
|
|
1804
|
+
width: f,
|
|
1805
|
+
height: m
|
|
1806
|
+
} = n, M = h / f, j = l / m, b = Math.max(M, j);
|
|
1807
|
+
g = f * b, u = m * b;
|
|
1777
1808
|
}
|
|
1778
|
-
this.setResolutionWidth(g, { withoutSave: !0 }), this.setResolutionHeight(
|
|
1809
|
+
this.setResolutionWidth(g, { withoutSave: !0 }), this.setResolutionHeight(u, { withoutSave: !0 }), this.editor.backgroundManager.backgroundObject && this.editor.backgroundManager.refresh(), (h > i || l > c) && o.calculateAndApplyDefaultZoom(), o.resetObject({ object: d, withoutSave: !0 }), a.centerObject(d), a.renderAll(), s || this.editor.historyManager.saveState(), a.fire("editor:montage-area-scaled-to-image", {
|
|
1779
1810
|
object: d,
|
|
1780
1811
|
width: g,
|
|
1781
|
-
height:
|
|
1812
|
+
height: u,
|
|
1782
1813
|
preserveAspectRatio: t,
|
|
1783
1814
|
withoutSave: s
|
|
1784
1815
|
});
|
|
@@ -1850,9 +1881,9 @@ class lt {
|
|
|
1850
1881
|
* Если передавать координаты курсора, то нужно быть аккуратнее, так как юзер может выйти за пределы рабочей области
|
|
1851
1882
|
*/
|
|
1852
1883
|
zoom(e = ot, t = {}) {
|
|
1853
|
-
var g,
|
|
1884
|
+
var g, u;
|
|
1854
1885
|
if (!e) return;
|
|
1855
|
-
const { minZoom: s, maxZoom: a } = this, { canvas: n } = this.editor, o = n.getZoom(), i = n.getCenterPoint(), c = (g = t.pointX) != null ? g : i.x, d = (
|
|
1886
|
+
const { minZoom: s, maxZoom: a } = this, { canvas: n } = this.editor, o = n.getZoom(), i = n.getCenterPoint(), c = (g = t.pointX) != null ? g : i.x, d = (u = t.pointY) != null ? u : i.y, h = new G(c, d);
|
|
1856
1887
|
let l = Number((o + Number(e)).toFixed(2));
|
|
1857
1888
|
l > a && (l = a), l < s && (l = s), n.zoomToPoint(h, l), n.fire("editor:zoom-changed", {
|
|
1858
1889
|
currentZoom: n.getZoom(),
|
|
@@ -1866,7 +1897,7 @@ class lt {
|
|
|
1866
1897
|
* @fires editor:zoom-changed
|
|
1867
1898
|
*/
|
|
1868
1899
|
setZoom(e = this.defaultZoom) {
|
|
1869
|
-
const { minZoom: t, maxZoom: s } = this, { canvas: a } = this.editor, n = new
|
|
1900
|
+
const { minZoom: t, maxZoom: s } = this, { canvas: a } = this.editor, n = new G(a.getCenterPoint());
|
|
1870
1901
|
let o = e;
|
|
1871
1902
|
e > s && (o = s), e < t && (o = t), a.zoomToPoint(n, o), a.fire("editor:zoom-changed", {
|
|
1872
1903
|
currentZoom: a.getZoom(),
|
|
@@ -1879,7 +1910,7 @@ class lt {
|
|
|
1879
1910
|
* @fires editor:zoom-changed
|
|
1880
1911
|
*/
|
|
1881
1912
|
resetZoom() {
|
|
1882
|
-
const { canvas: e } = this.editor, t = new
|
|
1913
|
+
const { canvas: e } = this.editor, t = new G(e.getCenterPoint());
|
|
1883
1914
|
e.zoomToPoint(t, this.defaultZoom), this.editor.canvas.fire("editor:zoom-changed", {
|
|
1884
1915
|
currentZoom: e.getZoom(),
|
|
1885
1916
|
point: t
|
|
@@ -1942,7 +1973,7 @@ class lt {
|
|
|
1942
1973
|
withoutSave: s
|
|
1943
1974
|
} = {}) {
|
|
1944
1975
|
const { canvas: a, historyManager: n } = this.editor, o = e || a.getActiveObject();
|
|
1945
|
-
o && (o instanceof
|
|
1976
|
+
o && (o instanceof v ? o.getObjects().forEach((i) => {
|
|
1946
1977
|
i.set("opacity", t);
|
|
1947
1978
|
}) : o.set("opacity", t), a.renderAll(), s || n.saveState(), a.fire("editor:object-opacity-changed", {
|
|
1948
1979
|
object: o,
|
|
@@ -1969,12 +2000,12 @@ class lt {
|
|
|
1969
2000
|
} = {}) {
|
|
1970
2001
|
const { canvas: n, historyManager: o } = this.editor, i = e || n.getActiveObject();
|
|
1971
2002
|
if (i) {
|
|
1972
|
-
if (i instanceof
|
|
2003
|
+
if (i instanceof v && !a) {
|
|
1973
2004
|
const c = i.getObjects();
|
|
1974
2005
|
n.discardActiveObject(), c.forEach((h) => {
|
|
1975
2006
|
this._fitSingleObject(h, t);
|
|
1976
2007
|
});
|
|
1977
|
-
const d = new
|
|
2008
|
+
const d = new v(c, { canvas: n });
|
|
1978
2009
|
n.setActiveObject(d);
|
|
1979
2010
|
} else
|
|
1980
2011
|
this._fitSingleObject(i, t);
|
|
@@ -1993,9 +2024,9 @@ class lt {
|
|
|
1993
2024
|
* @private
|
|
1994
2025
|
*/
|
|
1995
2026
|
_fitSingleObject(e, t) {
|
|
1996
|
-
const { canvas: s, montageArea: a } = this.editor, { width: n, height: o, scaleX: i = 1, scaleY: c = 1, angle: d = 0 } = e, h = n * Math.abs(i), l = o * Math.abs(c), g = d * Math.PI / 180,
|
|
2027
|
+
const { canvas: s, montageArea: a } = this.editor, { width: n, height: o, scaleX: i = 1, scaleY: c = 1, angle: d = 0 } = e, h = n * Math.abs(i), l = o * Math.abs(c), g = d * Math.PI / 180, u = Math.abs(Math.cos(g)), f = Math.abs(Math.sin(g)), m = h * u + l * f, M = h * f + l * u, j = a.width, b = a.height;
|
|
1997
2028
|
let S;
|
|
1998
|
-
t === "contain" ? S = Math.min(j /
|
|
2029
|
+
t === "contain" ? S = Math.min(j / m, b / M) : S = Math.max(j / m, b / M), e.set({
|
|
1999
2030
|
scaleX: i * S,
|
|
2000
2031
|
scaleY: c * S
|
|
2001
2032
|
}), s.centerObject(e);
|
|
@@ -2034,11 +2065,11 @@ class lt {
|
|
|
2034
2065
|
}), t)
|
|
2035
2066
|
this.fitObject({ object: d, withoutSave: !0, fitAsOneObject: !0 });
|
|
2036
2067
|
else {
|
|
2037
|
-
const { width: l, height: g } = n, { width:
|
|
2068
|
+
const { width: l, height: g } = n, { width: u, height: f } = d, m = o.calculateScaleFactor({
|
|
2038
2069
|
imageObject: d,
|
|
2039
2070
|
scaleType: c
|
|
2040
2071
|
});
|
|
2041
|
-
c === "contain" &&
|
|
2072
|
+
c === "contain" && m < 1 || c === "cover" && (u > l || f > g) ? this.fitObject({ object: d, withoutSave: !0, fitAsOneObject: !0 }) : d.set({ scaleX: 1, scaleY: 1 });
|
|
2042
2073
|
}
|
|
2043
2074
|
d.set({ flipX: !1, flipY: !1, angle: 0 }), a.centerObject(d), a.renderAll(), i.resumeHistory(), s || i.saveState(), a.fire("editor:object-reset", {
|
|
2044
2075
|
object: d,
|
|
@@ -2104,7 +2135,7 @@ class ht {
|
|
|
2104
2135
|
}), e.upperCanvasEl.style.pointerEvents = "", e.lowerCanvasEl.style.pointerEvents = "", this.overlayMask.visible = !1, e.requestRenderAll(), e.fire("editor:enabled"), s.resumeHistory();
|
|
2105
2136
|
}
|
|
2106
2137
|
}
|
|
2107
|
-
class
|
|
2138
|
+
class _ {
|
|
2108
2139
|
constructor({ editor: e }) {
|
|
2109
2140
|
this.editor = e, this.backgroundObject = null;
|
|
2110
2141
|
}
|
|
@@ -2125,10 +2156,10 @@ class R {
|
|
|
2125
2156
|
s.resumeHistory();
|
|
2126
2157
|
return;
|
|
2127
2158
|
}
|
|
2128
|
-
a.set({ fill: e }), a.set("backgroundId", `background-${
|
|
2159
|
+
a.set({ fill: e }), a.set("backgroundId", `background-${A()}`), this.editor.canvas.requestRenderAll();
|
|
2129
2160
|
} else
|
|
2130
2161
|
this._removeCurrentBackground(), this._createColorBackground(e);
|
|
2131
|
-
this.editor.canvas.fire("background:changed", { type: "color", color: e }), s.resumeHistory(), t || s.saveState();
|
|
2162
|
+
this.editor.canvas.fire("editor:background:changed", { type: "color", color: e }), s.resumeHistory(), t || s.saveState();
|
|
2132
2163
|
} catch (s) {
|
|
2133
2164
|
this.editor.errorManager.emitError({
|
|
2134
2165
|
code: "BACKGROUND_CREATION_FAILED",
|
|
@@ -2152,15 +2183,15 @@ class R {
|
|
|
2152
2183
|
try {
|
|
2153
2184
|
const { historyManager: s } = this.editor, { backgroundObject: a } = this;
|
|
2154
2185
|
if (s.suspendHistory(), a && a.backgroundType === "gradient") {
|
|
2155
|
-
const n =
|
|
2156
|
-
if (
|
|
2186
|
+
const n = _._createFabricGradient(e);
|
|
2187
|
+
if (_._isGradientEqual(a.fill, n)) {
|
|
2157
2188
|
s.resumeHistory();
|
|
2158
2189
|
return;
|
|
2159
2190
|
}
|
|
2160
|
-
a.set({ fill: n }), a.set("backgroundId", `background-${
|
|
2191
|
+
a.set({ fill: n }), a.set("backgroundId", `background-${A()}`), this.editor.canvas.requestRenderAll();
|
|
2161
2192
|
} else
|
|
2162
2193
|
this._removeCurrentBackground(), this._createGradientBackground(e);
|
|
2163
|
-
this.editor.canvas.fire("background:changed", {
|
|
2194
|
+
this.editor.canvas.fire("editor:background:changed", {
|
|
2164
2195
|
type: "gradient",
|
|
2165
2196
|
gradientParams: e
|
|
2166
2197
|
}), s.resumeHistory(), t || s.saveState();
|
|
@@ -2174,6 +2205,58 @@ class R {
|
|
|
2174
2205
|
});
|
|
2175
2206
|
}
|
|
2176
2207
|
}
|
|
2208
|
+
/**
|
|
2209
|
+
* Устанавливает линейный градиентный фон.
|
|
2210
|
+
* @param options - Опции для установки линейного градиента
|
|
2211
|
+
*/
|
|
2212
|
+
setLinearGradientBackground({
|
|
2213
|
+
angle: e,
|
|
2214
|
+
startColor: t,
|
|
2215
|
+
endColor: s,
|
|
2216
|
+
startPosition: a,
|
|
2217
|
+
endPosition: n,
|
|
2218
|
+
withoutSave: o = !1
|
|
2219
|
+
}) {
|
|
2220
|
+
this.setGradientBackground({
|
|
2221
|
+
gradient: {
|
|
2222
|
+
type: "linear",
|
|
2223
|
+
angle: e,
|
|
2224
|
+
startColor: t,
|
|
2225
|
+
endColor: s,
|
|
2226
|
+
startPosition: a,
|
|
2227
|
+
endPosition: n
|
|
2228
|
+
},
|
|
2229
|
+
withoutSave: o
|
|
2230
|
+
});
|
|
2231
|
+
}
|
|
2232
|
+
/**
|
|
2233
|
+
* Устанавливает радиальный градиентный фон.
|
|
2234
|
+
* @param options - Опции для установки радиального градиента
|
|
2235
|
+
*/
|
|
2236
|
+
setRadialGradientBackground({
|
|
2237
|
+
centerX: e,
|
|
2238
|
+
centerY: t,
|
|
2239
|
+
radius: s,
|
|
2240
|
+
startColor: a,
|
|
2241
|
+
endColor: n,
|
|
2242
|
+
startPosition: o,
|
|
2243
|
+
endPosition: i,
|
|
2244
|
+
withoutSave: c = !1
|
|
2245
|
+
}) {
|
|
2246
|
+
this.setGradientBackground({
|
|
2247
|
+
gradient: {
|
|
2248
|
+
type: "radial",
|
|
2249
|
+
centerX: e,
|
|
2250
|
+
centerY: t,
|
|
2251
|
+
radius: s,
|
|
2252
|
+
startColor: a,
|
|
2253
|
+
endColor: n,
|
|
2254
|
+
startPosition: o,
|
|
2255
|
+
endPosition: i
|
|
2256
|
+
},
|
|
2257
|
+
withoutSave: c
|
|
2258
|
+
});
|
|
2259
|
+
}
|
|
2177
2260
|
/**
|
|
2178
2261
|
* Устанавливает фон из изображения.
|
|
2179
2262
|
* @param options - Опции для установки фонового изображения
|
|
@@ -2181,13 +2264,17 @@ class R {
|
|
|
2181
2264
|
* @param options.withoutSave - Если true, не сохранять состояние в историю
|
|
2182
2265
|
*/
|
|
2183
2266
|
setImageBackground(s) {
|
|
2184
|
-
return
|
|
2185
|
-
|
|
2267
|
+
return y(this, arguments, function* ({
|
|
2268
|
+
imageSource: e,
|
|
2186
2269
|
withoutSave: t = !1
|
|
2187
2270
|
}) {
|
|
2188
2271
|
try {
|
|
2189
2272
|
const { historyManager: a } = this.editor;
|
|
2190
|
-
a.suspendHistory(),
|
|
2273
|
+
a.suspendHistory(), yield this._createImageBackground(e), this.editor.canvas.fire("editor:background:changed", {
|
|
2274
|
+
type: "image",
|
|
2275
|
+
imageSource: e,
|
|
2276
|
+
backgroundObject: this.backgroundObject
|
|
2277
|
+
}), a.resumeHistory(), t || a.saveState();
|
|
2191
2278
|
} catch (a) {
|
|
2192
2279
|
this.editor.errorManager.emitError({
|
|
2193
2280
|
code: "BACKGROUND_CREATION_FAILED",
|
|
@@ -2207,16 +2294,8 @@ class R {
|
|
|
2207
2294
|
removeBackground({ withoutSave: e = !1 } = {}) {
|
|
2208
2295
|
try {
|
|
2209
2296
|
const { historyManager: t } = this.editor;
|
|
2210
|
-
if (!this.backgroundObject)
|
|
2211
|
-
|
|
2212
|
-
code: "NO_BACKGROUND_TO_REMOVE",
|
|
2213
|
-
origin: "BackgroundManager",
|
|
2214
|
-
method: "removeBackground",
|
|
2215
|
-
message: "Нет фона для удаления"
|
|
2216
|
-
});
|
|
2217
|
-
return;
|
|
2218
|
-
}
|
|
2219
|
-
t.suspendHistory(), this._removeCurrentBackground(), this.editor.canvas.fire("background:removed"), t.resumeHistory(), e || t.saveState();
|
|
2297
|
+
if (!this.backgroundObject) return;
|
|
2298
|
+
t.suspendHistory(), this._removeCurrentBackground(), this.editor.canvas.fire("editor:background:removed"), t.resumeHistory(), e || t.saveState();
|
|
2220
2299
|
} catch (t) {
|
|
2221
2300
|
this.editor.errorManager.emitError({
|
|
2222
2301
|
code: "BACKGROUND_REMOVAL_FAILED",
|
|
@@ -2233,11 +2312,9 @@ class R {
|
|
|
2233
2312
|
refresh() {
|
|
2234
2313
|
const { canvas: e, montageArea: t, historyManager: s } = this.editor;
|
|
2235
2314
|
if (!t || !this.backgroundObject) return;
|
|
2236
|
-
s.suspendHistory(),
|
|
2237
|
-
const
|
|
2238
|
-
this.backgroundObject
|
|
2239
|
-
const c = e.getObjects(), d = c.indexOf(t), h = c.indexOf(this.backgroundObject);
|
|
2240
|
-
this.backgroundObject && h !== d + 1 && e.moveObjectTo(this.backgroundObject, d + 1), e.requestRenderAll(), s.resumeHistory();
|
|
2315
|
+
s.suspendHistory(), this.editor.transformManager.fitObject({ object: this.backgroundObject, withoutSave: !0, type: "cover" });
|
|
2316
|
+
const a = e.getObjects(), n = a.indexOf(t), o = a.indexOf(this.backgroundObject);
|
|
2317
|
+
this.backgroundObject && o !== n + 1 && e.moveObjectTo(this.backgroundObject, n + 1), e.requestRenderAll(), s.resumeHistory();
|
|
2241
2318
|
}
|
|
2242
2319
|
/**
|
|
2243
2320
|
* Создает цветовой фон.
|
|
@@ -2252,8 +2329,8 @@ class R {
|
|
|
2252
2329
|
hasControls: !1,
|
|
2253
2330
|
id: "background",
|
|
2254
2331
|
backgroundType: "color",
|
|
2255
|
-
backgroundId: `background-${
|
|
2256
|
-
}, { withoutSelection: !0 }), this.
|
|
2332
|
+
backgroundId: `background-${A()}`
|
|
2333
|
+
}, { withoutSelection: !0 }), this.refresh();
|
|
2257
2334
|
}
|
|
2258
2335
|
/**
|
|
2259
2336
|
* Создает градиентный фон.
|
|
@@ -2269,44 +2346,38 @@ class R {
|
|
|
2269
2346
|
hasControls: !1,
|
|
2270
2347
|
id: "background",
|
|
2271
2348
|
backgroundType: "gradient",
|
|
2272
|
-
backgroundId: `background-${
|
|
2273
|
-
}, { withoutSelection: !0 }), this.
|
|
2274
|
-
const t =
|
|
2349
|
+
backgroundId: `background-${A()}`
|
|
2350
|
+
}, { withoutSelection: !0 }), this.refresh();
|
|
2351
|
+
const t = _._createFabricGradient(e);
|
|
2275
2352
|
this.backgroundObject.set("fill", t), this.editor.canvas.requestRenderAll();
|
|
2276
2353
|
}
|
|
2277
2354
|
/**
|
|
2278
2355
|
* Создает фон из изображения.
|
|
2279
|
-
* @param
|
|
2356
|
+
* @param source - источник изображения (URL или File)
|
|
2280
2357
|
*/
|
|
2281
2358
|
_createImageBackground(e) {
|
|
2282
|
-
return
|
|
2283
|
-
|
|
2284
|
-
|
|
2285
|
-
|
|
2286
|
-
|
|
2287
|
-
|
|
2288
|
-
|
|
2289
|
-
|
|
2290
|
-
|
|
2291
|
-
|
|
2292
|
-
|
|
2293
|
-
|
|
2294
|
-
|
|
2295
|
-
|
|
2296
|
-
|
|
2297
|
-
|
|
2298
|
-
|
|
2299
|
-
|
|
2300
|
-
|
|
2301
|
-
});
|
|
2359
|
+
return y(this, null, function* () {
|
|
2360
|
+
var s;
|
|
2361
|
+
const { image: t } = (s = yield this.editor.imageManager.importImage({
|
|
2362
|
+
source: e,
|
|
2363
|
+
withoutSave: !0,
|
|
2364
|
+
isBackground: !0,
|
|
2365
|
+
withoutSelection: !0,
|
|
2366
|
+
scale: "image-cover"
|
|
2367
|
+
})) != null ? s : {};
|
|
2368
|
+
if (!t)
|
|
2369
|
+
throw new Error("Не удалось загрузить изображение");
|
|
2370
|
+
t.set({
|
|
2371
|
+
selectable: !1,
|
|
2372
|
+
evented: !1,
|
|
2373
|
+
hasBorders: !1,
|
|
2374
|
+
hasControls: !1,
|
|
2375
|
+
id: "background",
|
|
2376
|
+
backgroundType: "image",
|
|
2377
|
+
backgroundId: `background-${A()}`
|
|
2378
|
+
}), this._removeCurrentBackground(), this.backgroundObject = t, this.refresh();
|
|
2302
2379
|
});
|
|
2303
2380
|
}
|
|
2304
|
-
/**
|
|
2305
|
-
* Настраивает позицию и размеры фона.
|
|
2306
|
-
*/
|
|
2307
|
-
_setupBackgroundPosition() {
|
|
2308
|
-
this.backgroundObject && this.refresh();
|
|
2309
|
-
}
|
|
2310
2381
|
/**
|
|
2311
2382
|
* Удаляет текущий фон.
|
|
2312
2383
|
*/
|
|
@@ -2319,20 +2390,40 @@ class R {
|
|
|
2319
2390
|
*/
|
|
2320
2391
|
static _createFabricGradient(e) {
|
|
2321
2392
|
const {
|
|
2322
|
-
|
|
2323
|
-
|
|
2324
|
-
|
|
2325
|
-
|
|
2326
|
-
|
|
2327
|
-
|
|
2328
|
-
{ offset: n / 100, color: s }
|
|
2329
|
-
{ offset: o / 100, color: a }
|
|
2393
|
+
startColor: t,
|
|
2394
|
+
endColor: s,
|
|
2395
|
+
startPosition: a = 0,
|
|
2396
|
+
endPosition: n = 100
|
|
2397
|
+
} = e, o = [
|
|
2398
|
+
{ offset: a / 100, color: t },
|
|
2399
|
+
{ offset: n / 100, color: s }
|
|
2330
2400
|
];
|
|
2331
|
-
|
|
2332
|
-
|
|
2401
|
+
if (e.type === "linear") {
|
|
2402
|
+
const l = e.angle * Math.PI / 180, g = _._angleToCoords(l);
|
|
2403
|
+
return new Me({
|
|
2404
|
+
type: "linear",
|
|
2405
|
+
gradientUnits: "percentage",
|
|
2406
|
+
coords: g,
|
|
2407
|
+
colorStops: o
|
|
2408
|
+
});
|
|
2409
|
+
}
|
|
2410
|
+
const {
|
|
2411
|
+
centerX: i = 50,
|
|
2412
|
+
centerY: c = 50,
|
|
2413
|
+
radius: d = 50
|
|
2414
|
+
} = e, h = {
|
|
2415
|
+
x1: i / 100,
|
|
2416
|
+
y1: c / 100,
|
|
2417
|
+
x2: i / 100,
|
|
2418
|
+
y2: c / 100,
|
|
2419
|
+
r1: 0,
|
|
2420
|
+
r2: d / 100
|
|
2421
|
+
};
|
|
2422
|
+
return new Me({
|
|
2423
|
+
type: "radial",
|
|
2333
2424
|
gradientUnits: "percentage",
|
|
2334
|
-
coords:
|
|
2335
|
-
colorStops:
|
|
2425
|
+
coords: h,
|
|
2426
|
+
colorStops: o
|
|
2336
2427
|
});
|
|
2337
2428
|
}
|
|
2338
2429
|
/**
|
|
@@ -2355,15 +2446,15 @@ class R {
|
|
|
2355
2446
|
* @returns true если градиенты одинаковые
|
|
2356
2447
|
*/
|
|
2357
2448
|
static _isGradientEqual(e, t) {
|
|
2358
|
-
if (!e || !t || e.type !==
|
|
2359
|
-
const
|
|
2360
|
-
return
|
|
2361
|
-
const c =
|
|
2449
|
+
if (!e || !t || e.type !== t.type) return !1;
|
|
2450
|
+
const s = e.colorStops || [], a = t.colorStops || [];
|
|
2451
|
+
return s.length !== a.length || !s.every((o, i) => {
|
|
2452
|
+
const c = a[i];
|
|
2362
2453
|
return o.color === c.color && Math.abs(o.offset - c.offset) < 1e-4;
|
|
2363
|
-
});
|
|
2454
|
+
}) ? !1 : e.type === "linear" && t.type === "linear" ? Math.abs(e.coords.x1 - t.coords.x1) < 1e-4 && Math.abs(e.coords.y1 - t.coords.y1) < 1e-4 && Math.abs(e.coords.x2 - t.coords.x2) < 1e-4 && Math.abs(e.coords.y2 - t.coords.y2) < 1e-4 : e.type === "radial" && t.type === "radial" ? Math.abs(e.coords.x1 - t.coords.x1) < 1e-4 && Math.abs(e.coords.y1 - t.coords.y1) < 1e-4 && Math.abs(e.coords.x2 - t.coords.x2) < 1e-4 && Math.abs(e.coords.y2 - t.coords.y2) < 1e-4 && Math.abs(e.coords.r1 - t.coords.r1) < 1e-4 && Math.abs(e.coords.r2 - t.coords.r2) < 1e-4 : !1;
|
|
2364
2455
|
}
|
|
2365
2456
|
}
|
|
2366
|
-
class
|
|
2457
|
+
class Q {
|
|
2367
2458
|
constructor({ editor: e }) {
|
|
2368
2459
|
this.editor = e;
|
|
2369
2460
|
}
|
|
@@ -2378,7 +2469,7 @@ class X {
|
|
|
2378
2469
|
const { canvas: s, historyManager: a } = this.editor;
|
|
2379
2470
|
a.suspendHistory();
|
|
2380
2471
|
const n = e || s.getActiveObject();
|
|
2381
|
-
n && (n instanceof
|
|
2472
|
+
n && (n instanceof v ? n.getObjects().forEach((o) => {
|
|
2382
2473
|
s.bringObjectToFront(o);
|
|
2383
2474
|
}) : s.bringObjectToFront(n), s.renderAll(), a.resumeHistory(), t || a.saveState(), s.fire("editor:object-bring-to-front", {
|
|
2384
2475
|
object: n,
|
|
@@ -2396,7 +2487,7 @@ class X {
|
|
|
2396
2487
|
const { canvas: s, historyManager: a } = this.editor;
|
|
2397
2488
|
a.suspendHistory();
|
|
2398
2489
|
const n = e || s.getActiveObject();
|
|
2399
|
-
n && (n instanceof
|
|
2490
|
+
n && (n instanceof v ? Q._moveSelectionForward(s, n) : s.bringObjectForward(n), s.renderAll(), a.resumeHistory(), t || a.saveState(), s.fire("editor:object-bring-forward", {
|
|
2400
2491
|
object: n,
|
|
2401
2492
|
withoutSave: t
|
|
2402
2493
|
}));
|
|
@@ -2419,7 +2510,7 @@ class X {
|
|
|
2419
2510
|
n.suspendHistory();
|
|
2420
2511
|
const c = e || s.getActiveObject();
|
|
2421
2512
|
if (c) {
|
|
2422
|
-
if (c instanceof
|
|
2513
|
+
if (c instanceof v) {
|
|
2423
2514
|
const d = c.getObjects();
|
|
2424
2515
|
for (let h = d.length - 1; h >= 0; h -= 1)
|
|
2425
2516
|
s.sendObjectToBack(d[h]);
|
|
@@ -2447,7 +2538,7 @@ class X {
|
|
|
2447
2538
|
} = this.editor;
|
|
2448
2539
|
n.suspendHistory();
|
|
2449
2540
|
const c = e || s.getActiveObject();
|
|
2450
|
-
c && (c instanceof
|
|
2541
|
+
c && (c instanceof v ? Q._moveSelectionBackwards(s, c) : s.sendObjectBackwards(c), i && s.sendObjectToBack(i), s.sendObjectToBack(a), o && s.sendObjectToBack(o), s.renderAll(), n.resumeHistory(), t || n.saveState(), s.fire("editor:object-send-backwards", {
|
|
2451
2542
|
object: c,
|
|
2452
2543
|
withoutSave: t
|
|
2453
2544
|
}));
|
|
@@ -2517,13 +2608,13 @@ class gt {
|
|
|
2517
2608
|
*/
|
|
2518
2609
|
addRectangle(h = {}, { withoutSelection: c, withoutAdding: d } = {}) {
|
|
2519
2610
|
var l = h, {
|
|
2520
|
-
id: e = `rect-${
|
|
2611
|
+
id: e = `rect-${A()}`,
|
|
2521
2612
|
left: t,
|
|
2522
2613
|
top: s,
|
|
2523
2614
|
width: a = 100,
|
|
2524
2615
|
height: n = 100,
|
|
2525
2616
|
fill: o = "blue"
|
|
2526
|
-
} = l, i =
|
|
2617
|
+
} = l, i = F(l, [
|
|
2527
2618
|
"id",
|
|
2528
2619
|
"left",
|
|
2529
2620
|
"top",
|
|
@@ -2531,7 +2622,7 @@ class gt {
|
|
|
2531
2622
|
"height",
|
|
2532
2623
|
"fill"
|
|
2533
2624
|
]);
|
|
2534
|
-
const { canvas: g } = this.editor,
|
|
2625
|
+
const { canvas: g } = this.editor, u = new Ne(I({
|
|
2535
2626
|
id: e,
|
|
2536
2627
|
left: t,
|
|
2537
2628
|
top: s,
|
|
@@ -2539,7 +2630,7 @@ class gt {
|
|
|
2539
2630
|
height: n,
|
|
2540
2631
|
fill: o
|
|
2541
2632
|
}, i));
|
|
2542
|
-
return !t && !s && g.centerObject(
|
|
2633
|
+
return !t && !s && g.centerObject(u), d || (g.add(u), c || g.setActiveObject(u), g.renderAll()), u;
|
|
2543
2634
|
}
|
|
2544
2635
|
/**
|
|
2545
2636
|
* Добавление круга
|
|
@@ -2559,19 +2650,19 @@ class gt {
|
|
|
2559
2650
|
*/
|
|
2560
2651
|
addCircle(d = {}, { withoutSelection: i, withoutAdding: c } = {}) {
|
|
2561
2652
|
var h = d, {
|
|
2562
|
-
id: e = `circle-${
|
|
2653
|
+
id: e = `circle-${A()}`,
|
|
2563
2654
|
left: t,
|
|
2564
2655
|
top: s,
|
|
2565
2656
|
radius: a = 50,
|
|
2566
2657
|
fill: n = "green"
|
|
2567
|
-
} = h, o =
|
|
2658
|
+
} = h, o = F(h, [
|
|
2568
2659
|
"id",
|
|
2569
2660
|
"left",
|
|
2570
2661
|
"top",
|
|
2571
2662
|
"radius",
|
|
2572
2663
|
"fill"
|
|
2573
2664
|
]);
|
|
2574
|
-
const { canvas: l } = this.editor, g = new Oe(
|
|
2665
|
+
const { canvas: l } = this.editor, g = new Oe(I({
|
|
2575
2666
|
id: e,
|
|
2576
2667
|
left: t,
|
|
2577
2668
|
top: s,
|
|
@@ -2599,13 +2690,13 @@ class gt {
|
|
|
2599
2690
|
*/
|
|
2600
2691
|
addTriangle(h = {}, { withoutSelection: c, withoutAdding: d } = {}) {
|
|
2601
2692
|
var l = h, {
|
|
2602
|
-
id: e = `triangle-${
|
|
2693
|
+
id: e = `triangle-${A()}`,
|
|
2603
2694
|
left: t,
|
|
2604
2695
|
top: s,
|
|
2605
2696
|
width: a = 100,
|
|
2606
2697
|
height: n = 100,
|
|
2607
2698
|
fill: o = "yellow"
|
|
2608
|
-
} = l, i =
|
|
2699
|
+
} = l, i = F(l, [
|
|
2609
2700
|
"id",
|
|
2610
2701
|
"left",
|
|
2611
2702
|
"top",
|
|
@@ -2613,7 +2704,7 @@ class gt {
|
|
|
2613
2704
|
"height",
|
|
2614
2705
|
"fill"
|
|
2615
2706
|
]);
|
|
2616
|
-
const { canvas: g } = this.editor,
|
|
2707
|
+
const { canvas: g } = this.editor, u = new Le(I({
|
|
2617
2708
|
id: e,
|
|
2618
2709
|
left: t,
|
|
2619
2710
|
top: s,
|
|
@@ -2621,7 +2712,7 @@ class gt {
|
|
|
2621
2712
|
width: a,
|
|
2622
2713
|
height: n
|
|
2623
2714
|
}, i));
|
|
2624
|
-
return !t && !s && g.centerObject(
|
|
2715
|
+
return !t && !s && g.centerObject(u), d || (g.add(u), c || g.setActiveObject(u), g.renderAll()), u;
|
|
2625
2716
|
}
|
|
2626
2717
|
}
|
|
2627
2718
|
class ut {
|
|
@@ -2652,7 +2743,7 @@ class ut {
|
|
|
2652
2743
|
* Асинхронное клонирование для внутреннего буфера
|
|
2653
2744
|
*/
|
|
2654
2745
|
_cloneToInternalClipboard(e) {
|
|
2655
|
-
return
|
|
2746
|
+
return y(this, null, function* () {
|
|
2656
2747
|
const { canvas: t, errorManager: s } = this.editor;
|
|
2657
2748
|
try {
|
|
2658
2749
|
const a = yield e.clone(["format"]);
|
|
@@ -2672,7 +2763,7 @@ class ut {
|
|
|
2672
2763
|
* Копирование в системный буфер обмена
|
|
2673
2764
|
*/
|
|
2674
2765
|
_copyToSystemClipboard(e) {
|
|
2675
|
-
return
|
|
2766
|
+
return y(this, null, function* () {
|
|
2676
2767
|
const { errorManager: t } = this.editor;
|
|
2677
2768
|
if (typeof ClipboardItem == "undefined" || !navigator.clipboard)
|
|
2678
2769
|
return t.emitWarning({
|
|
@@ -2699,7 +2790,7 @@ class ut {
|
|
|
2699
2790
|
* Копирование изображения в буфер обмена
|
|
2700
2791
|
*/
|
|
2701
2792
|
_copyImageToClipboard(e, t) {
|
|
2702
|
-
return
|
|
2793
|
+
return y(this, null, function* () {
|
|
2703
2794
|
try {
|
|
2704
2795
|
const a = e.toCanvasElement({ enableRetinaScaling: !1 }).toDataURL(), n = a.slice(5).split(";")[0], o = a.split(",")[1], i = atob(o), c = new Uint8Array(i.length);
|
|
2705
2796
|
for (let l = 0; l < i.length; l += 1)
|
|
@@ -2721,9 +2812,9 @@ class ut {
|
|
|
2721
2812
|
* Копирование текста в буфер обмена
|
|
2722
2813
|
*/
|
|
2723
2814
|
_copyTextToClipboard(e) {
|
|
2724
|
-
return
|
|
2815
|
+
return y(this, null, function* () {
|
|
2725
2816
|
try {
|
|
2726
|
-
const t = `${
|
|
2817
|
+
const t = `${be}${e}`;
|
|
2727
2818
|
return yield navigator.clipboard.writeText(t), console.info("Text copied to clipboard successfully"), !0;
|
|
2728
2819
|
} catch (t) {
|
|
2729
2820
|
const { errorManager: s } = this.editor;
|
|
@@ -2743,7 +2834,7 @@ class ut {
|
|
|
2743
2834
|
*/
|
|
2744
2835
|
_addClonedObjectToCanvas(e) {
|
|
2745
2836
|
const { canvas: t, historyManager: s } = this.editor;
|
|
2746
|
-
if (t.discardActiveObject(), e instanceof
|
|
2837
|
+
if (t.discardActiveObject(), e instanceof v) {
|
|
2747
2838
|
s.suspendHistory(), e.canvas = t, e.forEachObject((a) => {
|
|
2748
2839
|
t.add(a);
|
|
2749
2840
|
}), t.setActiveObject(e), t.requestRenderAll(), s.resumeHistory(), s.saveState();
|
|
@@ -2756,7 +2847,7 @@ class ut {
|
|
|
2756
2847
|
* @param source - источник изображения (data URL или URL)
|
|
2757
2848
|
*/
|
|
2758
2849
|
_handleImageImport(e) {
|
|
2759
|
-
return
|
|
2850
|
+
return y(this, null, function* () {
|
|
2760
2851
|
var s;
|
|
2761
2852
|
const { image: t } = (s = yield this.editor.imageManager.importImage({
|
|
2762
2853
|
source: e,
|
|
@@ -2772,13 +2863,13 @@ class ut {
|
|
|
2772
2863
|
* @fires editor:object-pasted
|
|
2773
2864
|
*/
|
|
2774
2865
|
copyPaste(e) {
|
|
2775
|
-
return
|
|
2866
|
+
return y(this, null, function* () {
|
|
2776
2867
|
const { canvas: t } = this.editor, s = e || t.getActiveObject();
|
|
2777
2868
|
if (!s || s.locked) return !1;
|
|
2778
2869
|
try {
|
|
2779
2870
|
const a = yield s.clone(["format"]);
|
|
2780
2871
|
return a.set({
|
|
2781
|
-
id: `${a.type}-${
|
|
2872
|
+
id: `${a.type}-${A()}`,
|
|
2782
2873
|
left: a.left + 10,
|
|
2783
2874
|
top: a.top + 10,
|
|
2784
2875
|
evented: !0
|
|
@@ -2802,14 +2893,14 @@ class ut {
|
|
|
2802
2893
|
* @param event.clipboardData.items — элементы буфера обмена
|
|
2803
2894
|
*/
|
|
2804
2895
|
handlePasteEvent(t) {
|
|
2805
|
-
return
|
|
2896
|
+
return y(this, arguments, function* ({ clipboardData: e }) {
|
|
2806
2897
|
var c;
|
|
2807
2898
|
if (!((c = e == null ? void 0 : e.items) != null && c.length)) {
|
|
2808
2899
|
this.paste();
|
|
2809
2900
|
return;
|
|
2810
2901
|
}
|
|
2811
2902
|
const s = e.getData("text/plain");
|
|
2812
|
-
if (s && s.startsWith(
|
|
2903
|
+
if (s && s.startsWith(be)) {
|
|
2813
2904
|
this.paste();
|
|
2814
2905
|
return;
|
|
2815
2906
|
}
|
|
@@ -2853,13 +2944,13 @@ class ut {
|
|
|
2853
2944
|
* @fires editor:object-pasted
|
|
2854
2945
|
*/
|
|
2855
2946
|
paste() {
|
|
2856
|
-
return
|
|
2947
|
+
return y(this, null, function* () {
|
|
2857
2948
|
const { canvas: e } = this.editor;
|
|
2858
2949
|
if (!this.clipboard) return !1;
|
|
2859
2950
|
try {
|
|
2860
2951
|
const t = yield this.clipboard.clone(["format"]);
|
|
2861
2952
|
return e.discardActiveObject(), t.set({
|
|
2862
|
-
id: `${t.type}-${
|
|
2953
|
+
id: `${t.type}-${A()}`,
|
|
2863
2954
|
left: t.left + 10,
|
|
2864
2955
|
top: t.top + 10,
|
|
2865
2956
|
evented: !0
|
|
@@ -2877,7 +2968,7 @@ class ut {
|
|
|
2877
2968
|
});
|
|
2878
2969
|
}
|
|
2879
2970
|
}
|
|
2880
|
-
class
|
|
2971
|
+
class K {
|
|
2881
2972
|
constructor({ editor: e }) {
|
|
2882
2973
|
this.editor = e;
|
|
2883
2974
|
}
|
|
@@ -2902,7 +2993,7 @@ class Q {
|
|
|
2902
2993
|
lockSkewingY: !0,
|
|
2903
2994
|
locked: !0
|
|
2904
2995
|
};
|
|
2905
|
-
o.set(i), !t &&
|
|
2996
|
+
o.set(i), !t && K._isGroupOrSelection(o) && o.getObjects().forEach((d) => {
|
|
2906
2997
|
d.set(i);
|
|
2907
2998
|
}), a.renderAll(), s || n.saveState(), a.fire("editor:object-locked", {
|
|
2908
2999
|
object: o,
|
|
@@ -2930,7 +3021,7 @@ class Q {
|
|
|
2930
3021
|
lockSkewingY: !1,
|
|
2931
3022
|
locked: !1
|
|
2932
3023
|
};
|
|
2933
|
-
n.set(o),
|
|
3024
|
+
n.set(o), K._isGroupOrSelection(n) && n.getObjects().forEach((i) => {
|
|
2934
3025
|
i.set(o);
|
|
2935
3026
|
}), s.renderAll(), t || a.saveState(), s.fire("editor:object-unlocked", {
|
|
2936
3027
|
object: n,
|
|
@@ -2938,7 +3029,7 @@ class Q {
|
|
|
2938
3029
|
});
|
|
2939
3030
|
}
|
|
2940
3031
|
static _isGroupOrSelection(e) {
|
|
2941
|
-
return e instanceof
|
|
3032
|
+
return e instanceof v || e instanceof q;
|
|
2942
3033
|
}
|
|
2943
3034
|
}
|
|
2944
3035
|
class Mt {
|
|
@@ -2959,9 +3050,9 @@ class Mt {
|
|
|
2959
3050
|
const { canvas: s, historyManager: a } = this.editor;
|
|
2960
3051
|
a.suspendHistory();
|
|
2961
3052
|
const n = e || s.getActiveObject();
|
|
2962
|
-
if (!n || !(n instanceof
|
|
2963
|
-
const o = n.getObjects(), i = new
|
|
2964
|
-
o.forEach((c) => s.remove(c)), i.set("id", `${i.type}-${
|
|
3053
|
+
if (!n || !(n instanceof v)) return;
|
|
3054
|
+
const o = n.getObjects(), i = new q(o);
|
|
3055
|
+
o.forEach((c) => s.remove(c)), i.set("id", `${i.type}-${A()}`), s.add(i), s.setActiveObject(i), s.renderAll(), a.resumeHistory(), t || a.saveState(), s.fire("editor:objects-grouped", {
|
|
2965
3056
|
object: n,
|
|
2966
3057
|
group: i,
|
|
2967
3058
|
withoutSave: t
|
|
@@ -2981,10 +3072,10 @@ class Mt {
|
|
|
2981
3072
|
const { canvas: s, historyManager: a } = this.editor;
|
|
2982
3073
|
a.suspendHistory();
|
|
2983
3074
|
const n = e || s.getActiveObject();
|
|
2984
|
-
if (!(n instanceof
|
|
3075
|
+
if (!(n instanceof q)) return;
|
|
2985
3076
|
const o = n.removeAll();
|
|
2986
3077
|
s.remove(n), o.forEach((c) => s.add(c));
|
|
2987
|
-
const i = new
|
|
3078
|
+
const i = new v(o, {
|
|
2988
3079
|
canvas: s
|
|
2989
3080
|
});
|
|
2990
3081
|
s.setActiveObject(i), s.renderAll(), a.resumeHistory(), t || a.saveState(), s.fire("editor:objects-ungrouped", {
|
|
@@ -3005,7 +3096,7 @@ class ft {
|
|
|
3005
3096
|
selectAll() {
|
|
3006
3097
|
const { canvas: e, canvasManager: t, objectLockManager: s } = this.editor;
|
|
3007
3098
|
e.discardActiveObject();
|
|
3008
|
-
const a = t.getObjects(), n = a.some((i) => i.locked), o = a.length > 1 ? new
|
|
3099
|
+
const a = t.getObjects(), n = a.some((i) => i.locked), o = a.length > 1 ? new v(t.getObjects(), { canvas: e }) : a[0];
|
|
3009
3100
|
n && s.lockObject({ object: o, skipInnerObjects: !0, withoutSave: !0 }), e.setActiveObject(o), e.requestRenderAll(), e.fire("editor:all-objects-selected", { selected: o });
|
|
3010
3101
|
}
|
|
3011
3102
|
}
|
|
@@ -3136,7 +3227,7 @@ const bt = {
|
|
|
3136
3227
|
INVALID_GRADIENT_FORMAT: "INVALID_GRADIENT_FORMAT"
|
|
3137
3228
|
}
|
|
3138
3229
|
};
|
|
3139
|
-
class
|
|
3230
|
+
class $ {
|
|
3140
3231
|
constructor({ editor: e }) {
|
|
3141
3232
|
this._buffer = [], this.editor = e;
|
|
3142
3233
|
}
|
|
@@ -3163,7 +3254,7 @@ class K {
|
|
|
3163
3254
|
* @fires editor:error
|
|
3164
3255
|
*/
|
|
3165
3256
|
emitError({ origin: e = "ImageEditor", method: t = "Unknown Method", code: s, data: a, message: n }) {
|
|
3166
|
-
if (
|
|
3257
|
+
if (!$.isValidErrorCode(s)) {
|
|
3167
3258
|
console.warn("Неизвестный код ошибки: ", { code: s, origin: e, method: t });
|
|
3168
3259
|
return;
|
|
3169
3260
|
}
|
|
@@ -3177,7 +3268,7 @@ class K {
|
|
|
3177
3268
|
message: o,
|
|
3178
3269
|
data: a
|
|
3179
3270
|
};
|
|
3180
|
-
this._buffer.push(
|
|
3271
|
+
this._buffer.push(I({
|
|
3181
3272
|
type: "editor:error"
|
|
3182
3273
|
}, i)), this.editor.canvas.fire("editor:error", i);
|
|
3183
3274
|
}
|
|
@@ -3192,7 +3283,7 @@ class K {
|
|
|
3192
3283
|
* @fires editor:warning
|
|
3193
3284
|
*/
|
|
3194
3285
|
emitWarning({ origin: e = "ImageEditor", method: t = "Unknown Method", code: s, message: a, data: n }) {
|
|
3195
|
-
if (
|
|
3286
|
+
if (!$.isValidErrorCode(s)) {
|
|
3196
3287
|
console.warn("Неизвестный код предупреждения: ", { code: s, origin: e, method: t });
|
|
3197
3288
|
return;
|
|
3198
3289
|
}
|
|
@@ -3205,7 +3296,7 @@ class K {
|
|
|
3205
3296
|
message: o,
|
|
3206
3297
|
data: n
|
|
3207
3298
|
};
|
|
3208
|
-
this._buffer.push(
|
|
3299
|
+
this._buffer.push(I({
|
|
3209
3300
|
type: "editor:warning"
|
|
3210
3301
|
}, i)), this.editor.canvas.fire("editor:warning", i);
|
|
3211
3302
|
}
|
|
@@ -3218,14 +3309,14 @@ class K {
|
|
|
3218
3309
|
return e ? Object.values(bt).some((t) => Object.values(t).includes(e)) : !1;
|
|
3219
3310
|
}
|
|
3220
3311
|
}
|
|
3221
|
-
class
|
|
3312
|
+
class re {
|
|
3222
3313
|
/**
|
|
3223
3314
|
* Конструктор класса ImageEditor.
|
|
3224
3315
|
* @param canvasId - идентификатор канваса, в котором будет создан редактор
|
|
3225
3316
|
* @param options - опции и настройки редактора
|
|
3226
3317
|
*/
|
|
3227
3318
|
constructor(e, t) {
|
|
3228
|
-
this.options = t, this.containerId = e, this.editorId = `${e}-${
|
|
3319
|
+
this.options = t, this.containerId = e, this.editorId = `${e}-${A()}`, this.clipboard = null, this.init();
|
|
3229
3320
|
}
|
|
3230
3321
|
/**
|
|
3231
3322
|
* Инициализация редактора.
|
|
@@ -3233,7 +3324,7 @@ class ie {
|
|
|
3233
3324
|
* @fires editor:ready
|
|
3234
3325
|
*/
|
|
3235
3326
|
init() {
|
|
3236
|
-
return
|
|
3327
|
+
return y(this, null, function* () {
|
|
3237
3328
|
const {
|
|
3238
3329
|
editorContainerWidth: e,
|
|
3239
3330
|
editorContainerHeight: t,
|
|
@@ -3246,13 +3337,13 @@ class ie {
|
|
|
3246
3337
|
scaleType: d,
|
|
3247
3338
|
_onReadyCallback: h
|
|
3248
3339
|
} = this.options;
|
|
3249
|
-
if (Ve.apply(), this.canvas = new
|
|
3340
|
+
if (Ve.apply(), this.canvas = new we(this.containerId, this.options), this.moduleLoader = new _e(), this.workerManager = new Ue(), this.errorManager = new $({ editor: this }), this.historyManager = new st({ editor: this }), this.toolbar = new tt({ editor: this }), this.transformManager = new lt({ editor: this }), this.canvasManager = new dt({ editor: this }), this.imageManager = new O({ editor: this }), this.layerManager = new Q({ editor: this }), this.shapeManager = new gt({ editor: this }), this.interactionBlocker = new ht({ editor: this }), this.backgroundManager = new _({ editor: this }), this.clipboardManager = new ut({ editor: this }), this.objectLockManager = new K({ editor: this }), this.groupingManager = new Mt({ editor: this }), this.selectionManager = new ft({ editor: this }), this.deletionManager = new mt({ editor: this }), this._createMontageArea(), this._createClippingArea(), this.listeners = new Y({ editor: this, options: this.options }), this.canvasManager.setEditorContainerWidth(e), this.canvasManager.setEditorContainerHeight(t), this.canvasManager.setCanvasWrapperWidth(s), this.canvasManager.setCanvasWrapperHeight(a), this.canvasManager.setCanvasCSSWidth(n), this.canvasManager.setCanvasCSSHeight(o), i != null && i.source) {
|
|
3250
3341
|
const {
|
|
3251
3342
|
source: l,
|
|
3252
3343
|
scale: g = `image-${d}`,
|
|
3253
|
-
withoutSave:
|
|
3344
|
+
withoutSave: u = !0
|
|
3254
3345
|
} = i;
|
|
3255
|
-
yield this.imageManager.importImage({ source: l, scale: g, withoutSave:
|
|
3346
|
+
yield this.imageManager.importImage({ source: l, scale: g, withoutSave: u });
|
|
3256
3347
|
} else
|
|
3257
3348
|
this.canvasManager.setDefaultScale({ withoutSave: !0 });
|
|
3258
3349
|
c && this.historyManager.loadStateFromFullState(c), this.historyManager.saveState(), console.log("editor:ready"), this.canvas.fire("editor:ready", this), typeof h == "function" && h(this);
|
|
@@ -3269,7 +3360,7 @@ class ie {
|
|
|
3269
3360
|
this.montageArea = this.shapeManager.addRectangle({
|
|
3270
3361
|
width: e,
|
|
3271
3362
|
height: t,
|
|
3272
|
-
fill:
|
|
3363
|
+
fill: re._createMosaicPattern(),
|
|
3273
3364
|
stroke: null,
|
|
3274
3365
|
strokeWidth: 0,
|
|
3275
3366
|
selectable: !1,
|
|
@@ -3319,7 +3410,7 @@ class ie {
|
|
|
3319
3410
|
const e = document.createElement("canvas");
|
|
3320
3411
|
e.width = 20, e.height = 20;
|
|
3321
3412
|
const t = e.getContext("2d");
|
|
3322
|
-
return t.fillStyle = "#ddd", t.fillRect(0, 0, 40, 40), t.fillStyle = "#ccc", t.fillRect(0, 0, 10, 10), t.fillRect(10, 10, 10, 10), new
|
|
3413
|
+
return t.fillStyle = "#ddd", t.fillRect(0, 0, 40, 40), t.fillStyle = "#ccc", t.fillRect(0, 0, 10, 10), t.fillRect(10, 10, 10, 10), new Te({
|
|
3323
3414
|
source: e,
|
|
3324
3415
|
repeat: "repeat"
|
|
3325
3416
|
});
|
|
@@ -3415,13 +3506,13 @@ const jt = {
|
|
|
3415
3506
|
keyboardIgnoreSelectors: []
|
|
3416
3507
|
};
|
|
3417
3508
|
function St(r, e = {}) {
|
|
3418
|
-
const t =
|
|
3509
|
+
const t = I(I({}, jt), e), s = document.getElementById(r);
|
|
3419
3510
|
if (!s)
|
|
3420
3511
|
return Promise.reject(new Error(`Контейнер с ID "${r}" не найден.`));
|
|
3421
3512
|
const a = document.createElement("canvas");
|
|
3422
3513
|
return a.id = `${r}-canvas`, s.appendChild(a), t.editorContainer = s, new Promise((n) => {
|
|
3423
3514
|
t._onReadyCallback = n;
|
|
3424
|
-
const o = new
|
|
3515
|
+
const o = new re(a.id, t);
|
|
3425
3516
|
window[r] = o;
|
|
3426
3517
|
});
|
|
3427
3518
|
}
|