@anu3ev/fabric-image-editor 0.1.41 → 0.1.42
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/dist/main.js +284 -389
- package/package.json +1 -1
package/dist/main.js
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
var
|
|
1
|
+
var Ee = Object.defineProperty;
|
|
2
2
|
var G = Object.getOwnPropertySymbols;
|
|
3
|
-
var
|
|
4
|
-
var
|
|
3
|
+
var fe = Object.prototype.hasOwnProperty, je = Object.prototype.propertyIsEnumerable;
|
|
4
|
+
var Me = (o, e, t) => e in o ? Ee(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t, C = (o, e) => {
|
|
5
5
|
for (var t in e || (e = {}))
|
|
6
|
-
|
|
6
|
+
fe.call(e, t) && Me(o, t, e[t]);
|
|
7
7
|
if (G)
|
|
8
8
|
for (var t of G(e))
|
|
9
|
-
|
|
9
|
+
je.call(e, t) && Me(o, t, e[t]);
|
|
10
10
|
return o;
|
|
11
11
|
};
|
|
12
12
|
var X = (o, e) => {
|
|
13
13
|
var t = {};
|
|
14
14
|
for (var a in o)
|
|
15
|
-
|
|
15
|
+
fe.call(o, a) && e.indexOf(a) < 0 && (t[a] = o[a]);
|
|
16
16
|
if (o != null && G)
|
|
17
17
|
for (var a of G(o))
|
|
18
|
-
e.indexOf(a) < 0 &&
|
|
18
|
+
e.indexOf(a) < 0 && je.call(o, a) && (t[a] = o[a]);
|
|
19
19
|
return t;
|
|
20
20
|
};
|
|
21
21
|
var Q = (o, e, t) => new Promise((a, r) => {
|
|
@@ -34,14 +34,14 @@ var Q = (o, e, t) => new Promise((a, r) => {
|
|
|
34
34
|
}, s = (c) => c.done ? a(c.value) : Promise.resolve(c.value).then(n, i);
|
|
35
35
|
s((t = t.apply(o, e)).next());
|
|
36
36
|
});
|
|
37
|
-
import { ActiveSelection as
|
|
37
|
+
import { ActiveSelection as R, util as P, controlsUtils as Oe, InteractiveFabricObject as Te, loadSVGFromURL as ke, FabricImage as ee, Point as K, Rect as xe, Circle as Be, Triangle as Ze, Group as ze, Canvas as Ue, Pattern as Ye } from "fabric";
|
|
38
38
|
import { create as _e } from "jsondiffpatch";
|
|
39
|
-
var
|
|
39
|
+
var He = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict", A = function() {
|
|
40
40
|
for (var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 21, t = "", a = crypto.getRandomValues(new Uint8Array(e |= 0)); e--; )
|
|
41
|
-
t +=
|
|
41
|
+
t += He[a[e] & 63];
|
|
42
42
|
return t;
|
|
43
43
|
};
|
|
44
|
-
class
|
|
44
|
+
class H {
|
|
45
45
|
/**
|
|
46
46
|
* Конструктор принимает редактор и опции.
|
|
47
47
|
* @param {Object} params
|
|
@@ -58,7 +58,7 @@ class R {
|
|
|
58
58
|
* @param {Boolean} [params.options.resetObjectFitByDoubleClick] — сброс фита объекта по двойному клику
|
|
59
59
|
*/
|
|
60
60
|
constructor({ editor: e, options: t = {} }) {
|
|
61
|
-
this.isDragging = !1, this.lastMouseX = 0, this.lastMouseY = 0, this.isUndoRedoKeyPressed = !1, this.isSpacePressed = !1, 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 =
|
|
61
|
+
this.isDragging = !1, this.lastMouseX = 0, this.lastMouseY = 0, this.isUndoRedoKeyPressed = !1, this.isSpacePressed = !1, 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 = H.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 = H.debounce(this.handleObjectModifiedHistory.bind(this), 300), this.handleObjectRotatingHistoryBound = H.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.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();
|
|
62
62
|
}
|
|
63
63
|
/**
|
|
64
64
|
* Инициализация всех обработчиков согласно опциям.
|
|
@@ -74,9 +74,9 @@ class R {
|
|
|
74
74
|
undoRedoByHotKeys: s,
|
|
75
75
|
selectAllByHotkey: c,
|
|
76
76
|
deleteObjectsByHotkey: u,
|
|
77
|
-
resetObjectFitByDoubleClick:
|
|
77
|
+
resetObjectFitByDoubleClick: l
|
|
78
78
|
} = this.options;
|
|
79
|
-
t && (this.canvas.on("mouse:down", this.handleCanvasDragStartBound), this.canvas.on("mouse:move", this.handleCanvasDraggingBound), this.canvas.on("mouse:up", this.handleCanvasDragEndBound), document.addEventListener("keydown", this.handleSpaceKeyDownBound, { capture: !0 }), document.addEventListener("keyup", this.handleSpaceKeyUpBound, { capture: !0 })), a && this.canvas.on("mouse:wheel", this.handleMouseWheelZoomBound), r && (this.canvas.on("selection:created", this.handleBringToFrontBound), this.canvas.on("selection:updated", this.handleBringToFrontBound)),
|
|
79
|
+
t && (this.canvas.on("mouse:down", this.handleCanvasDragStartBound), this.canvas.on("mouse:move", this.handleCanvasDraggingBound), this.canvas.on("mouse:up", this.handleCanvasDragEndBound), document.addEventListener("keydown", this.handleSpaceKeyDownBound, { capture: !0 }), document.addEventListener("keyup", this.handleSpaceKeyUpBound, { capture: !0 })), a && this.canvas.on("mouse:wheel", this.handleMouseWheelZoomBound), r && (this.canvas.on("selection:created", this.handleBringToFrontBound), this.canvas.on("selection:updated", this.handleBringToFrontBound)), l && this.canvas.on("mouse:dblclick", this.handleResetObjectFitBound), e && window.addEventListener("resize", this.handleContainerResizeBound, { capture: !0 }), n && document.addEventListener("keydown", this.handleCopyEventBound, { capture: !0 }), i && document.addEventListener("paste", this.handlePasteEventBound, { capture: !0 }), s && (document.addEventListener("keydown", this.handleUndoRedoEventBound, { capture: !0 }), document.addEventListener("keyup", this.handleUndoRedoKeyUpBound, { capture: !0 })), c && document.addEventListener("keydown", this.handleSelectAllEventBound, { capture: !0 }), u && document.addEventListener("keydown", this.handleDeleteObjectsEventBound, { capture: !0 }), this.canvas.on("object:modified", this.handleObjectModifiedHistoryBound), this.canvas.on("object:rotating", this.handleObjectRotatingHistoryBound), this.canvas.on("object:added", this.handleObjectAddedHistoryBound), this.canvas.on("object:removed", this.handleObjectRemovedHistoryBound), this.canvas.on("object:added", this.handleOverlayUpdateBound), this.canvas.on("selection:created", this.handleOverlayUpdateBound), this.canvas.on("selection:created", this.handleLockedSelectionBound), this.canvas.on("selection:updated", this.handleLockedSelectionBound);
|
|
80
80
|
}
|
|
81
81
|
/**
|
|
82
82
|
* При массовом выделении объектов удаляем из него залоченные.
|
|
@@ -95,7 +95,7 @@ class R {
|
|
|
95
95
|
this.canvas.setActiveObject(r[0]);
|
|
96
96
|
return;
|
|
97
97
|
}
|
|
98
|
-
const n = new
|
|
98
|
+
const n = new R(r, {
|
|
99
99
|
canvas: this.canvas
|
|
100
100
|
});
|
|
101
101
|
this.canvas.setActiveObject(n), this.canvas.requestRenderAll();
|
|
@@ -304,7 +304,7 @@ class R {
|
|
|
304
304
|
};
|
|
305
305
|
}
|
|
306
306
|
}
|
|
307
|
-
class
|
|
307
|
+
class Re {
|
|
308
308
|
/**
|
|
309
309
|
* @description Класс для динамической загрузки внешних модулей.
|
|
310
310
|
*/
|
|
@@ -381,24 +381,24 @@ class Pe {
|
|
|
381
381
|
this.worker.terminate();
|
|
382
382
|
}
|
|
383
383
|
}
|
|
384
|
-
var I = 12,
|
|
384
|
+
var I = 12, Fe = 2, ae = 8, re = 20, We = 100, ne = 20, ie = 8, Ve = 100, se = 32, oe = 1, Ge = "#2B2D33", ce = "#3D8BF4", ue = "#FFFFFF";
|
|
385
385
|
function J(o, e, t, a, r) {
|
|
386
|
-
var n = I, i =
|
|
387
|
-
o.save(), o.translate(e, t), o.rotate(P.degreesToRadians(r.angle)), o.fillStyle =
|
|
388
|
-
}
|
|
389
|
-
function je(o, e, t, a, r) {
|
|
390
|
-
var n = te, i = ae, s = Fe;
|
|
391
|
-
o.save(), o.translate(e, t), o.rotate(P.degreesToRadians(r.angle)), o.fillStyle = ce, o.strokeStyle = oe, o.lineWidth = se, o.beginPath(), o.roundRect(-8 / 2, -20 / 2, n, i, s), o.fill(), o.stroke(), o.restore();
|
|
386
|
+
var n = I, i = Fe;
|
|
387
|
+
o.save(), o.translate(e, t), o.rotate(P.degreesToRadians(r.angle)), o.fillStyle = ue, o.strokeStyle = ce, o.lineWidth = oe, o.beginPath(), o.roundRect(-12 / 2, -12 / 2, n, n, i), o.fill(), o.stroke(), o.restore();
|
|
392
388
|
}
|
|
393
389
|
function ye(o, e, t, a, r) {
|
|
394
|
-
var n =
|
|
395
|
-
o.save(), o.translate(e, t), o.rotate(P.degreesToRadians(r.angle)), o.fillStyle =
|
|
390
|
+
var n = ae, i = re, s = We;
|
|
391
|
+
o.save(), o.translate(e, t), o.rotate(P.degreesToRadians(r.angle)), o.fillStyle = ue, o.strokeStyle = ce, o.lineWidth = oe, o.beginPath(), o.roundRect(-8 / 2, -20 / 2, n, i, s), o.fill(), o.stroke(), o.restore();
|
|
392
|
+
}
|
|
393
|
+
function pe(o, e, t, a, r) {
|
|
394
|
+
var n = ne, i = ie, s = Ve;
|
|
395
|
+
o.save(), o.translate(e, t), o.rotate(P.degreesToRadians(r.angle)), o.fillStyle = ue, o.strokeStyle = ce, o.lineWidth = oe, o.beginPath(), o.roundRect(-20 / 2, -8 / 2, n, i, s), o.fill(), o.stroke(), o.restore();
|
|
396
396
|
}
|
|
397
|
-
var Xe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE4Ljc1IDQuMzc1djMuNzVhLjYyNS42MjUgMCAwIDEtLjYyNS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDEgMC0xLjI1aDIuMTRsLTIuMDc3LTEuOTAzLS4wMi0uMDE5YTYuMjUgNi4yNSAwIDEgMC0uMTMgOC45NjcuNjI2LjYyNiAwIDAgMSAuODYuOTA5QTcuNDU2IDcuNDU2IDAgMCAxIDEwIDE3LjVoLS4xMDNhNy41IDcuNSAwIDEgMSA1LjM5Ni0xMi44MTJMMTcuNSA2LjcwM1Y0LjM3NWEuNjI1LjYyNSAwIDAgMSAxLjI1IDBaIi8+PC9zdmc+",
|
|
398
|
-
|
|
397
|
+
var Xe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE4Ljc1IDQuMzc1djMuNzVhLjYyNS42MjUgMCAwIDEtLjYyNS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDEgMC0xLjI1aDIuMTRsLTIuMDc3LTEuOTAzLS4wMi0uMDE5YTYuMjUgNi4yNSAwIDEgMC0uMTMgOC45NjcuNjI2LjYyNiAwIDAgMSAuODYuOTA5QTcuNDU2IDcuNDU2IDAgMCAxIDEwIDE3LjVoLS4xMDNhNy41IDcuNSAwIDEgMSA1LjM5Ni0xMi44MTJMMTcuNSA2LjcwM1Y0LjM3NWEuNjI1LjYyNSAwIDAgMSAxLjI1IDBaIi8+PC9zdmc+", Ce = new Image();
|
|
398
|
+
Ce.src = Xe;
|
|
399
399
|
function Qe(o, e, t, a, r) {
|
|
400
|
-
var n =
|
|
401
|
-
o.save(), o.translate(e, t), o.rotate(P.degreesToRadians(r.angle)), o.fillStyle = Ge, o.beginPath(), o.arc(0, 0, i, 0, 2 * Math.PI), o.fill(), o.drawImage(
|
|
400
|
+
var n = se, i = n / 2;
|
|
401
|
+
o.save(), o.translate(e, t), o.rotate(P.degreesToRadians(r.angle)), o.fillStyle = Ge, o.beginPath(), o.arc(0, 0, i, 0, 2 * Math.PI), o.fill(), o.drawImage(Ce, -16 / 2, -16 / 2, i, i), o.restore();
|
|
402
402
|
}
|
|
403
403
|
var Je = {
|
|
404
404
|
// Угловые точки
|
|
@@ -432,46 +432,46 @@ var Je = {
|
|
|
432
432
|
},
|
|
433
433
|
// Середина вертикалей
|
|
434
434
|
ml: {
|
|
435
|
-
render:
|
|
436
|
-
sizeX:
|
|
437
|
-
sizeY:
|
|
435
|
+
render: ye,
|
|
436
|
+
sizeX: ae,
|
|
437
|
+
sizeY: re,
|
|
438
438
|
offsetX: 0,
|
|
439
439
|
offsetY: 0
|
|
440
440
|
},
|
|
441
441
|
mr: {
|
|
442
|
-
render:
|
|
443
|
-
sizeX:
|
|
444
|
-
sizeY:
|
|
442
|
+
render: ye,
|
|
443
|
+
sizeX: ae,
|
|
444
|
+
sizeY: re,
|
|
445
445
|
offsetX: 0,
|
|
446
446
|
offsetY: 0
|
|
447
447
|
},
|
|
448
448
|
// Середина горизонталей
|
|
449
449
|
mt: {
|
|
450
|
-
render:
|
|
451
|
-
sizeX:
|
|
452
|
-
sizeY:
|
|
450
|
+
render: pe,
|
|
451
|
+
sizeX: ne,
|
|
452
|
+
sizeY: ie,
|
|
453
453
|
offsetX: 0,
|
|
454
454
|
offsetY: 0
|
|
455
455
|
},
|
|
456
456
|
mb: {
|
|
457
|
-
render:
|
|
458
|
-
sizeX:
|
|
459
|
-
sizeY:
|
|
457
|
+
render: pe,
|
|
458
|
+
sizeX: ne,
|
|
459
|
+
sizeY: ie,
|
|
460
460
|
offsetX: 0,
|
|
461
461
|
offsetY: 0
|
|
462
462
|
},
|
|
463
463
|
// Специальный «rotate» контрол
|
|
464
464
|
mtr: {
|
|
465
465
|
render: Qe,
|
|
466
|
-
sizeX:
|
|
467
|
-
sizeY:
|
|
466
|
+
sizeX: se,
|
|
467
|
+
sizeY: se,
|
|
468
468
|
offsetX: 0,
|
|
469
469
|
offsetY: -32
|
|
470
470
|
}
|
|
471
471
|
};
|
|
472
472
|
class Ke {
|
|
473
473
|
static apply() {
|
|
474
|
-
var e =
|
|
474
|
+
var e = Oe.createObjectDefaultControls();
|
|
475
475
|
Object.entries(Je).forEach((t) => {
|
|
476
476
|
var [a, r] = t;
|
|
477
477
|
Object.assign(e[a], {
|
|
@@ -484,11 +484,11 @@ class Ke {
|
|
|
484
484
|
var u = i.target;
|
|
485
485
|
u.canvas.setCursor("grabbing");
|
|
486
486
|
});
|
|
487
|
-
}),
|
|
487
|
+
}), Te.ownDefaults.controls = e;
|
|
488
488
|
}
|
|
489
489
|
}
|
|
490
490
|
var $e = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNi44NzUgMi41YS42MjUuNjI1IDAgMCAwLS42MjUuNjI0VjYuMjVIMy4xMjVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2MTBjMCAuMzQ1LjI4LjYyNS42MjUuNjI1aDEwYy4zNDUgMCAuNjI1LS4yOC42MjUtLjYyNXYtMy4xMjZoMy4xMjVjLjM0NSAwIC42MjUtLjI4LjYyNS0uNjI1di0xMGEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTEwWm02Ljg3NSAxMGgyLjVWMy43NUg3LjV2Mi41aDUuNjI1Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NS42MjRabS0xMCAzLjc1VjcuNWg4Ljc1djguNzVIMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", qe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMi41IDcuNWMwLS42OS41Ni0xLjI1IDEuMjUtMS4yNWgxMi41Yy42OSAwIDEuMjUuNTYgMS4yNSAxLjI1djguNzVjMCAuNjktLjU2IDEuMjUtMS4yNSAxLjI1SDMuNzVjLS42OSAwLTEuMjUtLjU2LTEuMjUtMS4yNVY3LjVabTEzLjc1IDBIMy43NXY4Ljc1aDEyLjVWNy41WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTAgMS44NzVhMi4xODggMi4xODggMCAwIDAtMi4xODggMi4xODh2Mi44MTJhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyYTMuNDM3IDMuNDM3IDAgMSAxIDYuODc1IDB2Mi44MTNhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyQTIuMTg4IDIuMTg4IDAgMCAwIDEwIDEuODc2WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTEwIDEyLjgxM2EuOTM3LjkzNyAwIDEgMCAwLTEuODc1LjkzNy45MzcgMCAwIDAgMCAxLjg3NFoiLz48L3N2Zz4=", et = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE2LjI1IDYuMjVINy41VjQuMzc1YTIuNSAyLjUgMCAwIDEgMi41LTIuNWMxLjIgMCAyLjI4MS44NiAyLjUxMiAyYS42MjUuNjI1IDAgMCAwIDEuMjI2LS4yNWMtLjM1NC0xLjczOC0xLjkyNS0zLTMuNzM4LTNhMy43NTQgMy43NTQgMCAwIDAtMy43NSAzLjc1VjYuMjVoLTIuNUExLjI1IDEuMjUgMCAwIDAgMi41IDcuNXY4Ljc1YTEuMjUgMS4yNSAwIDAgMCAxLjI1IDEuMjVoMTIuNWExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjcuNWExLjI1IDEuMjUgMCAwIDAtMS4yNS0xLjI1Wm0wIDEwSDMuNzVWNy41aDEyLjV2OC43NVptLTUuMzEzLTQuMzc1YS45MzcuOTM3IDAgMSAxLTEuODc0IDAgLjkzNy45MzcgMCAwIDEgMS44NzQgMFoiLz48L3N2Zz4K", tt = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTIuNSA4LjEyNSAxMCAxMi41bDcuNS00LjM3NUwxMCAzLjc1IDIuNSA4LjEyNVoiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjY4NSAzLjIxYS42MjUuNjI1IDAgMCAxIC42MyAwbDcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOGw3LjUtNC4zNzVaTTMuNzQgOC4xMjUgMTAgMTEuNzc2bDYuMjYtMy42NTFMMTAgNC40NzQgMy43NCA4LjEyNVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA5LjQ2YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDExLjc3NmwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA5LjQ2Wm0tMS42NiAyLjQxNUwxMCAxNS41MjZsNi4yNi0zLjY1MS0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNi0xLjk3NSAxLjE1MVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", at = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMy4yMWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDguMTI1IDEwIDExLjc3Nmw2LjI2LTMuNjUxTDEwIDQuNDc0IDMuNzQgOC4xMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjcxNCAxMCAxMCAxMi41bDQuMjg2LTIuNSAzLjIxNCAxLjg3NUwxMCAxNi4yNWwtNy41LTQuMzc1TDUuNzE0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDkuNDZhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgMTEuNzc2bDMuOTctMi4zMTZhLjYyNS42MjUgMCAwIDEgLjYzIDBsMy4yMTUgMS44NzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhMNS40IDkuNDZabS0xLjY2IDIuNDE1TDEwIDE1LjUyNmw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2LTEuOTc1IDEuMTUxWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", rt = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0ibTIuNSA2LjI1IDcuNSA0LjM3NSA3LjUtNC4zNzVMMTAgMS44NzUgMi41IDYuMjVaIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMS4zMzVhLjYyNS42MjUgMCAwIDEgLjYzIDBsNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4bDcuNS00LjM3NVpNMy43NCA2LjI1IDEwIDkuOTAxbDYuMjYtMy42NTFMMTAgMi41OTkgMy43NCA2LjI1WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDExLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCAxMy42NTFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgMTEuMzM1Wk0zLjc0IDEzLjc1IDEwIDE3LjQwMWw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTMuNzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgNy41ODVhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgOS45MDFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgNy41ODVaTTMuNzQgMTAgMTAgMTMuNjUxIDE2LjI2IDEwbC0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNkwzLjc0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", nt = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMS45NiAxMy40MzVhLjYyNS42MjUgMCAwIDEgLjg1NS0uMjI1TDEwIDE3LjQwMWw3LjE4NS00LjE5YS42MjUuNjI1IDAgMCAxIC42MyAxLjA3OWwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEtLjIyNS0uODU1Wk05LjY4NSAxLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDYuMjUgMTAgOS45MDFsNi4yNi0zLjY1MUwxMCAyLjU5OSAzLjc0IDYuMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Im01LjcxNCAxMS44NzUgNC4yODYgMi41IDQuMjg2LTIuNUwxNy41IDEzLjc1IDEwIDE4LjEyNSAyLjUgMTMuNzVsMy4yMTQtMS44NzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgMTEuMzM1YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDEzLjY1MWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCAxMS4zMzVaTTMuNzQgMTMuNzUgMTAgMTcuNDAxbDYuMjYtMy42NTEtMS45NzQtMS4xNTEtMy45NzEgMi4zMTZhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTMuOTctMi4zMTZMMy43NCAxMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA3LjU4NWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCA5LjkwMWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA3LjU4NVpNMy43NCAxMCAxMCAxMy42NTEgMTYuMjYgMTBsLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTBaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=", it = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI0VDNEU0MCIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOC4xMjUgMS4yNUExLjg3NSAxLjg3NSAwIDAgMCA2LjI1IDMuMTI1di42MjVIMy4xMjVhLjYyNS42MjUgMCAwIDAgMCAxLjI1aC42MjV2MTEuMjVBMS4yNSAxLjI1IDAgMCAwIDUgMTcuNWgxMGExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjVoLjYyNWEuNjI1LjYyNSAwIDAgMCAwLTEuMjVIMTMuNzV2LS42MjVhMS44NzUgMS44NzUgMCAwIDAtMS44NzUtMS44NzVoLTMuNzVabTQuMzc1IDIuNXYtLjYyNWEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2LjYyNWg1Wk01IDE2LjI1VjVoMTB2MTEuMjVINVpNOC4xMjUgNy41Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NWEuNjI1LjYyNSAwIDEgMS0xLjI1IDB2LTVjMC0uMzQ1LjI4LS42MjUuNjI1LS42MjVabTQuMzc1IDUuNjI1di01YS42MjUuNjI1IDAgMCAwLTEuMjUgMHY1YS42MjUuNjI1IDAgMSAwIDEuMjUgMFoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==";
|
|
491
|
-
function
|
|
491
|
+
function be(o, e, t, a, r, n, i) {
|
|
492
492
|
try {
|
|
493
493
|
var s = o[n](i), c = s.value;
|
|
494
494
|
} catch (u) {
|
|
@@ -502,10 +502,10 @@ function st(o) {
|
|
|
502
502
|
return new Promise(function(a, r) {
|
|
503
503
|
var n = o.apply(e, t);
|
|
504
504
|
function i(c) {
|
|
505
|
-
|
|
505
|
+
be(n, a, r, i, s, "next", c);
|
|
506
506
|
}
|
|
507
507
|
function s(c) {
|
|
508
|
-
|
|
508
|
+
be(n, a, r, i, s, "throw", c);
|
|
509
509
|
}
|
|
510
510
|
i(void 0);
|
|
511
511
|
});
|
|
@@ -612,7 +612,7 @@ const _ = {
|
|
|
612
612
|
}
|
|
613
613
|
}
|
|
614
614
|
};
|
|
615
|
-
function
|
|
615
|
+
function Ie(o, e) {
|
|
616
616
|
var t = Object.keys(o);
|
|
617
617
|
if (Object.getOwnPropertySymbols) {
|
|
618
618
|
var a = Object.getOwnPropertySymbols(o);
|
|
@@ -625,9 +625,9 @@ function be(o, e) {
|
|
|
625
625
|
function j(o) {
|
|
626
626
|
for (var e = 1; e < arguments.length; e++) {
|
|
627
627
|
var t = arguments[e] != null ? arguments[e] : {};
|
|
628
|
-
e % 2 ?
|
|
628
|
+
e % 2 ? Ie(Object(t), !0).forEach(function(a) {
|
|
629
629
|
ot(o, a, t[a]);
|
|
630
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(o, Object.getOwnPropertyDescriptors(t)) :
|
|
630
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(o, Object.getOwnPropertyDescriptors(t)) : Ie(Object(t)).forEach(function(a) {
|
|
631
631
|
Object.defineProperty(o, a, Object.getOwnPropertyDescriptor(t, a));
|
|
632
632
|
});
|
|
633
633
|
}
|
|
@@ -705,12 +705,12 @@ class dt {
|
|
|
705
705
|
} = r, {
|
|
706
706
|
icons: c,
|
|
707
707
|
btnStyle: u,
|
|
708
|
-
handlers:
|
|
709
|
-
} = t.config,
|
|
710
|
-
|
|
708
|
+
handlers: l
|
|
709
|
+
} = t.config, d = document.createElement("button");
|
|
710
|
+
d.innerHTML = c[s] ? '<img src="'.concat(c[s], '" title="').concat(i, '" />') : i, Object.assign(d.style, u), d.onclick = () => {
|
|
711
711
|
var h;
|
|
712
|
-
return (h =
|
|
713
|
-
}, t.el.appendChild(
|
|
712
|
+
return (h = l[s]) === null || h === void 0 ? void 0 : h.call(l, t.editor);
|
|
713
|
+
}, t.el.appendChild(d);
|
|
714
714
|
};
|
|
715
715
|
for (var r of e)
|
|
716
716
|
a();
|
|
@@ -786,8 +786,8 @@ class dt {
|
|
|
786
786
|
x: c
|
|
787
787
|
} = e.getCenterPoint(), {
|
|
788
788
|
top: u,
|
|
789
|
-
height:
|
|
790
|
-
} = e.getBoundingRect(!1, !0),
|
|
789
|
+
height: l
|
|
790
|
+
} = e.getBoundingRect(!1, !0), d = c * n + i, h = d - t.offsetWidth / 2, g = (u + l) * n + s + a.offsetTop;
|
|
791
791
|
Object.assign(t.style, {
|
|
792
792
|
left: "".concat(h, "px"),
|
|
793
793
|
top: "".concat(g, "px"),
|
|
@@ -802,7 +802,7 @@ class dt {
|
|
|
802
802
|
this.el.removeEventListener("mouseover", this._onBtnOver), this.el.removeEventListener("mouseout", this._onBtnOut), this.canvas.off("mouse:down", this._onMouseDown), this.canvas.off("object:moving", this._onObjectMoving), this.canvas.off("object:scaling", this._onObjectScaling), this.canvas.off("object:rotating", this._onObjectRotating), this.canvas.off("mouse:up", this._onMouseUp), this.canvas.off("object:modified", this._onObjectModified), this.canvas.off("selection:created", this._onSelectionChange), this.canvas.off("selection:updated", this._onSelectionChange), this.canvas.off("selection:changed", this._onSelectionChange), this.canvas.off("after:render", this._onSelectionChange), this.canvas.off("selection:cleared", this._onSelectionClear), this.el.remove();
|
|
803
803
|
}
|
|
804
804
|
}
|
|
805
|
-
function
|
|
805
|
+
function Ae(o, e, t, a, r, n, i) {
|
|
806
806
|
try {
|
|
807
807
|
var s = o[n](i), c = s.value;
|
|
808
808
|
} catch (u) {
|
|
@@ -810,16 +810,16 @@ function Ie(o, e, t, a, r, n, i) {
|
|
|
810
810
|
}
|
|
811
811
|
s.done ? e(c) : Promise.resolve(c).then(a, r);
|
|
812
812
|
}
|
|
813
|
-
function
|
|
813
|
+
function te(o) {
|
|
814
814
|
return function() {
|
|
815
815
|
var e = this, t = arguments;
|
|
816
816
|
return new Promise(function(a, r) {
|
|
817
817
|
var n = o.apply(e, t);
|
|
818
818
|
function i(c) {
|
|
819
|
-
|
|
819
|
+
Ae(n, a, r, i, s, "next", c);
|
|
820
820
|
}
|
|
821
821
|
function s(c) {
|
|
822
|
-
|
|
822
|
+
Ae(n, a, r, i, s, "throw", c);
|
|
823
823
|
}
|
|
824
824
|
i(void 0);
|
|
825
825
|
});
|
|
@@ -920,7 +920,7 @@ class lt {
|
|
|
920
920
|
*/
|
|
921
921
|
loadStateFromFullState(e) {
|
|
922
922
|
var t = this;
|
|
923
|
-
return
|
|
923
|
+
return te(function* () {
|
|
924
924
|
if (e) {
|
|
925
925
|
console.log("loadStateFromFullState fullState", e);
|
|
926
926
|
var {
|
|
@@ -932,9 +932,9 @@ class lt {
|
|
|
932
932
|
height: s
|
|
933
933
|
} = a;
|
|
934
934
|
yield a.loadFromJSON(e);
|
|
935
|
-
var c = a.getObjects().find((
|
|
935
|
+
var c = a.getObjects().find((l) => l.id === "montage-area");
|
|
936
936
|
c && (t.editor.montageArea = c, (i !== e.width || s !== e.height) && r.updateCanvasAndFitObjects());
|
|
937
|
-
var u = a.getObjects().find((
|
|
937
|
+
var u = a.getObjects().find((l) => l.id === "overlay-mask");
|
|
938
938
|
u && (n.overlayMask = u, n.overlayMask.visible = !1), a.renderAll(), a.fire("editor:history-state-loaded", {
|
|
939
939
|
fullState: e,
|
|
940
940
|
currentIndex: t.currentIndex,
|
|
@@ -952,7 +952,7 @@ class lt {
|
|
|
952
952
|
*/
|
|
953
953
|
undo() {
|
|
954
954
|
var e = this;
|
|
955
|
-
return
|
|
955
|
+
return te(function* () {
|
|
956
956
|
if (!e.skipHistory) {
|
|
957
957
|
if (e.currentIndex <= 0) {
|
|
958
958
|
console.log("Нет предыдущих состояний для отмены.");
|
|
@@ -986,7 +986,7 @@ class lt {
|
|
|
986
986
|
*/
|
|
987
987
|
redo() {
|
|
988
988
|
var e = this;
|
|
989
|
-
return
|
|
989
|
+
return te(function* () {
|
|
990
990
|
if (!e.skipHistory) {
|
|
991
991
|
if (e.currentIndex >= e.patches.length) {
|
|
992
992
|
console.log("Нет состояний для повтора.");
|
|
@@ -1016,7 +1016,7 @@ class lt {
|
|
|
1016
1016
|
}
|
|
1017
1017
|
}
|
|
1018
1018
|
const ht = 0.1, gt = 2, vt = 0.1, mt = 90, k = 16, x = 16, E = 4096, O = 4096;
|
|
1019
|
-
function
|
|
1019
|
+
function Se(o, e, t, a, r, n, i) {
|
|
1020
1020
|
try {
|
|
1021
1021
|
var s = o[n](i), c = s.value;
|
|
1022
1022
|
} catch (u) {
|
|
@@ -1030,10 +1030,10 @@ function T(o) {
|
|
|
1030
1030
|
return new Promise(function(a, r) {
|
|
1031
1031
|
var n = o.apply(e, t);
|
|
1032
1032
|
function i(c) {
|
|
1033
|
-
|
|
1033
|
+
Se(n, a, r, i, s, "next", c);
|
|
1034
1034
|
}
|
|
1035
1035
|
function s(c) {
|
|
1036
|
-
|
|
1036
|
+
Se(n, a, r, i, s, "throw", c);
|
|
1037
1037
|
}
|
|
1038
1038
|
i(void 0);
|
|
1039
1039
|
});
|
|
@@ -1076,14 +1076,14 @@ class D {
|
|
|
1076
1076
|
montageArea: s,
|
|
1077
1077
|
transformManager: c,
|
|
1078
1078
|
historyManager: u,
|
|
1079
|
-
errorManager:
|
|
1080
|
-
} = t.editor,
|
|
1079
|
+
errorManager: l
|
|
1080
|
+
} = t.editor, d = yield t.getContentType(a), h = D.getFormatFromContentType(d), {
|
|
1081
1081
|
acceptContentTypes: g,
|
|
1082
1082
|
acceptFormats: M
|
|
1083
1083
|
} = t;
|
|
1084
|
-
if (!t.isAllowedContentType(
|
|
1085
|
-
var m = "Неверный contentType для изображения: ".concat(
|
|
1086
|
-
return
|
|
1084
|
+
if (!t.isAllowedContentType(d)) {
|
|
1085
|
+
var m = "Неверный contentType для изображения: ".concat(d, ". Ожидается один из: ").concat(t.acceptContentTypes.join(", "), ".");
|
|
1086
|
+
return l.emitError({
|
|
1087
1087
|
origin: "ImageManager",
|
|
1088
1088
|
method: "importImage",
|
|
1089
1089
|
code: "INVALID_CONTENT_TYPE",
|
|
@@ -1091,7 +1091,7 @@ class D {
|
|
|
1091
1091
|
data: {
|
|
1092
1092
|
source: a,
|
|
1093
1093
|
format: h,
|
|
1094
|
-
contentType:
|
|
1094
|
+
contentType: d,
|
|
1095
1095
|
acceptContentTypes: g,
|
|
1096
1096
|
acceptFormats: M
|
|
1097
1097
|
}
|
|
@@ -1106,12 +1106,12 @@ class D {
|
|
|
1106
1106
|
var S = yield fetch(a, {
|
|
1107
1107
|
mode: "cors"
|
|
1108
1108
|
}), N = yield S.blob({
|
|
1109
|
-
type:
|
|
1109
|
+
type: d,
|
|
1110
1110
|
quality: 1
|
|
1111
1111
|
});
|
|
1112
1112
|
f = URL.createObjectURL(N);
|
|
1113
1113
|
} else
|
|
1114
|
-
return
|
|
1114
|
+
return l.emitError({
|
|
1115
1115
|
origin: "ImageManager",
|
|
1116
1116
|
method: "importImage",
|
|
1117
1117
|
code: "INVALID_SOURCE_TYPE",
|
|
@@ -1119,30 +1119,30 @@ class D {
|
|
|
1119
1119
|
data: {
|
|
1120
1120
|
source: a,
|
|
1121
1121
|
format: h,
|
|
1122
|
-
contentType:
|
|
1122
|
+
contentType: d,
|
|
1123
1123
|
acceptContentTypes: g,
|
|
1124
1124
|
acceptFormats: M
|
|
1125
1125
|
}
|
|
1126
1126
|
}), null;
|
|
1127
1127
|
if (t._createdBlobUrls.push(f), h === "svg") {
|
|
1128
|
-
var
|
|
1129
|
-
v = P.groupSVGElements(
|
|
1128
|
+
var L = yield ke(f);
|
|
1129
|
+
v = P.groupSVGElements(L.objects, L.options);
|
|
1130
1130
|
} else
|
|
1131
|
-
v = yield
|
|
1131
|
+
v = yield ee.fromURL(f, {
|
|
1132
1132
|
crossOrigin: "anonymous"
|
|
1133
1133
|
});
|
|
1134
1134
|
var {
|
|
1135
|
-
width:
|
|
1135
|
+
width: w,
|
|
1136
1136
|
height: y
|
|
1137
1137
|
} = v;
|
|
1138
|
-
if (y > O ||
|
|
1138
|
+
if (y > O || w > E) {
|
|
1139
1139
|
var p = yield t.resizeImageToBoundaries(v._element.src, "max"), B = URL.createObjectURL(p);
|
|
1140
|
-
t._createdBlobUrls.push(B), v = yield
|
|
1140
|
+
t._createdBlobUrls.push(B), v = yield ee.fromURL(B, {
|
|
1141
1141
|
crossOrigin: "anonymous"
|
|
1142
1142
|
});
|
|
1143
|
-
} else if (y < x ||
|
|
1144
|
-
var
|
|
1145
|
-
t._createdBlobUrls.push(Z), v = yield
|
|
1143
|
+
} else if (y < x || w < k) {
|
|
1144
|
+
var F = yield t.resizeImageToBoundaries(v._element.src, "min"), Z = URL.createObjectURL(F);
|
|
1145
|
+
t._createdBlobUrls.push(Z), v = yield ee.fromURL(Z, {
|
|
1146
1146
|
crossOrigin: "anonymous"
|
|
1147
1147
|
});
|
|
1148
1148
|
}
|
|
@@ -1153,7 +1153,7 @@ class D {
|
|
|
1153
1153
|
});
|
|
1154
1154
|
else {
|
|
1155
1155
|
var {
|
|
1156
|
-
width:
|
|
1156
|
+
width: W,
|
|
1157
1157
|
height: z
|
|
1158
1158
|
} = s, U = t.calculateScaleFactor({
|
|
1159
1159
|
imageObject: v,
|
|
@@ -1163,7 +1163,7 @@ class D {
|
|
|
1163
1163
|
object: v,
|
|
1164
1164
|
type: "contain",
|
|
1165
1165
|
withoutSave: !0
|
|
1166
|
-
}) : r === "image-cover" && (
|
|
1166
|
+
}) : r === "image-cover" && (w > W || y > z) && c.fitObject({
|
|
1167
1167
|
object: v,
|
|
1168
1168
|
type: "cover",
|
|
1169
1169
|
withoutSave: !0
|
|
@@ -1173,14 +1173,14 @@ class D {
|
|
|
1173
1173
|
var V = {
|
|
1174
1174
|
image: v,
|
|
1175
1175
|
format: h,
|
|
1176
|
-
contentType:
|
|
1176
|
+
contentType: d,
|
|
1177
1177
|
scale: r,
|
|
1178
1178
|
withoutSave: n,
|
|
1179
1179
|
source: a
|
|
1180
1180
|
};
|
|
1181
1181
|
return i.fire("editor:image-imported", V), V;
|
|
1182
1182
|
} catch (Y) {
|
|
1183
|
-
return
|
|
1183
|
+
return l.emitError({
|
|
1184
1184
|
origin: "ImageManager",
|
|
1185
1185
|
method: "importImage",
|
|
1186
1186
|
code: "IMPORT_FAILED",
|
|
@@ -1188,7 +1188,7 @@ class D {
|
|
|
1188
1188
|
data: {
|
|
1189
1189
|
source: a,
|
|
1190
1190
|
format: h,
|
|
1191
|
-
contentType:
|
|
1191
|
+
contentType: d,
|
|
1192
1192
|
scale: r,
|
|
1193
1193
|
withoutSave: n
|
|
1194
1194
|
}
|
|
@@ -1251,7 +1251,7 @@ class D {
|
|
|
1251
1251
|
workerManager: u
|
|
1252
1252
|
} = t.editor;
|
|
1253
1253
|
try {
|
|
1254
|
-
var
|
|
1254
|
+
var l = r === "application/pdf", d = l ? "image/jpg" : r, h = D.getFormatFromContentType(d);
|
|
1255
1255
|
c.setCoords();
|
|
1256
1256
|
var {
|
|
1257
1257
|
left: g,
|
|
@@ -1259,7 +1259,7 @@ class D {
|
|
|
1259
1259
|
width: m,
|
|
1260
1260
|
height: f
|
|
1261
1261
|
} = c.getBoundingRect(), v = yield s.clone(["id", "format", "locked"]);
|
|
1262
|
-
["image/jpg", "image/jpeg"].includes(
|
|
1262
|
+
["image/jpg", "image/jpeg"].includes(d) && (v.backgroundColor = "#ffffff");
|
|
1263
1263
|
var S = v.getObjects().find((b) => b.id === c.id);
|
|
1264
1264
|
S.visible = !1, v.viewportTransform = [1, 0, 0, 1, -g, -M], v.setDimensions({
|
|
1265
1265
|
width: m,
|
|
@@ -1269,14 +1269,14 @@ class D {
|
|
|
1269
1269
|
}), v.renderAll();
|
|
1270
1270
|
var N = v.getObjects().filter((b) => b.format).every((b) => b.format === "svg");
|
|
1271
1271
|
if (h === "svg" && N) {
|
|
1272
|
-
var
|
|
1272
|
+
var L = v.toSVG();
|
|
1273
1273
|
v.dispose();
|
|
1274
|
-
var
|
|
1274
|
+
var w = D._exportSVGStringAsFile(L, {
|
|
1275
1275
|
exportAsBase64: n,
|
|
1276
1276
|
exportAsBlob: i,
|
|
1277
1277
|
fileName: a
|
|
1278
1278
|
}), y = {
|
|
1279
|
-
image:
|
|
1279
|
+
image: w,
|
|
1280
1280
|
format: "svg",
|
|
1281
1281
|
contentType: "image/svg+xml",
|
|
1282
1282
|
fileName: a.replace(/\.[^/.]+$/, ".svg")
|
|
@@ -1290,59 +1290,59 @@ class D {
|
|
|
1290
1290
|
var B = {
|
|
1291
1291
|
image: p,
|
|
1292
1292
|
format: h,
|
|
1293
|
-
contentType:
|
|
1293
|
+
contentType: d,
|
|
1294
1294
|
fileName: a
|
|
1295
1295
|
};
|
|
1296
1296
|
return s.fire("editor:canvas-exported", B), B;
|
|
1297
1297
|
}
|
|
1298
|
-
var
|
|
1298
|
+
var F = yield createImageBitmap(p), Z = yield u.post("toDataURL", {
|
|
1299
1299
|
format: h,
|
|
1300
1300
|
quality: 1,
|
|
1301
|
-
bitmap:
|
|
1302
|
-
}, [
|
|
1303
|
-
if (
|
|
1304
|
-
var
|
|
1301
|
+
bitmap: F
|
|
1302
|
+
}, [F]);
|
|
1303
|
+
if (l) {
|
|
1304
|
+
var W = 0.264583, z = m * W, U = f * W, V = (yield t.editor.moduleLoader.loadModule("jspdf")).jsPDF, Y = new V({
|
|
1305
1305
|
orientation: z > U ? "landscape" : "portrait",
|
|
1306
1306
|
unit: "mm",
|
|
1307
1307
|
format: [z, U]
|
|
1308
1308
|
});
|
|
1309
1309
|
if (Y.addImage(Z, "JPG", 0, 0, z, U), n) {
|
|
1310
|
-
var
|
|
1311
|
-
image:
|
|
1310
|
+
var De = Y.output("datauristring"), le = {
|
|
1311
|
+
image: De,
|
|
1312
1312
|
format: "pdf",
|
|
1313
1313
|
contentType: "application/pdf",
|
|
1314
1314
|
fileName: a
|
|
1315
1315
|
};
|
|
1316
|
-
return s.fire("editor:canvas-exported",
|
|
1316
|
+
return s.fire("editor:canvas-exported", le), le;
|
|
1317
1317
|
}
|
|
1318
|
-
var
|
|
1318
|
+
var Ne = Y.output("blob"), Le = new File([Ne], a, {
|
|
1319
1319
|
type: "application/pdf"
|
|
1320
|
-
}),
|
|
1321
|
-
image:
|
|
1320
|
+
}), he = {
|
|
1321
|
+
image: Le,
|
|
1322
1322
|
format: "pdf",
|
|
1323
1323
|
contentType: "application/pdf",
|
|
1324
1324
|
fileName: a
|
|
1325
1325
|
};
|
|
1326
|
-
return s.fire("editor:canvas-exported",
|
|
1326
|
+
return s.fire("editor:canvas-exported", he), he;
|
|
1327
1327
|
}
|
|
1328
1328
|
if (n) {
|
|
1329
|
-
var
|
|
1329
|
+
var ge = {
|
|
1330
1330
|
image: Z,
|
|
1331
1331
|
format: h,
|
|
1332
|
-
contentType:
|
|
1332
|
+
contentType: d,
|
|
1333
1333
|
fileName: a
|
|
1334
1334
|
};
|
|
1335
|
-
return s.fire("editor:canvas-exported",
|
|
1335
|
+
return s.fire("editor:canvas-exported", ge), ge;
|
|
1336
1336
|
}
|
|
1337
|
-
var
|
|
1338
|
-
type:
|
|
1339
|
-
}),
|
|
1337
|
+
var ve = h === "svg" && !N ? a.replace(/\.[^/.]+$/, ".png") : a, we = new File([p], ve, {
|
|
1338
|
+
type: d
|
|
1339
|
+
}), me = {
|
|
1340
1340
|
image: we,
|
|
1341
1341
|
format: h,
|
|
1342
|
-
contentType:
|
|
1343
|
-
fileName:
|
|
1342
|
+
contentType: d,
|
|
1343
|
+
fileName: ve
|
|
1344
1344
|
};
|
|
1345
|
-
return s.fire("editor:canvas-exported",
|
|
1345
|
+
return s.fire("editor:canvas-exported", me), me;
|
|
1346
1346
|
} catch (b) {
|
|
1347
1347
|
return t.editor.errorManager.emitError({
|
|
1348
1348
|
origin: "ImageManager",
|
|
@@ -1382,8 +1382,8 @@ class D {
|
|
|
1382
1382
|
} = e.length > 0 && e[0] !== void 0 ? e[0] : {}, {
|
|
1383
1383
|
canvas: c,
|
|
1384
1384
|
workerManager: u
|
|
1385
|
-
} = t.editor,
|
|
1386
|
-
if (!
|
|
1385
|
+
} = t.editor, l = a || c.getActiveObject();
|
|
1386
|
+
if (!l)
|
|
1387
1387
|
return t.editor.errorManager.emitError({
|
|
1388
1388
|
origin: "ImageManager",
|
|
1389
1389
|
method: "exportObjectAsImageFile",
|
|
@@ -1397,50 +1397,50 @@ class D {
|
|
|
1397
1397
|
}
|
|
1398
1398
|
}), "";
|
|
1399
1399
|
try {
|
|
1400
|
-
var
|
|
1401
|
-
if (
|
|
1402
|
-
var h =
|
|
1400
|
+
var d = D.getFormatFromContentType(n);
|
|
1401
|
+
if (d === "svg") {
|
|
1402
|
+
var h = l.toSVG(), g = t._exportSVGStringAsFile(h, {
|
|
1403
1403
|
exportAsBase64: i,
|
|
1404
1404
|
exportAsBlob: s,
|
|
1405
1405
|
fileName: r
|
|
1406
1406
|
}), M = {
|
|
1407
1407
|
image: g,
|
|
1408
|
-
format:
|
|
1408
|
+
format: d,
|
|
1409
1409
|
contentType: "image/svg+xml",
|
|
1410
1410
|
fileName: r.replace(/\.[^/.]+$/, ".svg")
|
|
1411
1411
|
};
|
|
1412
1412
|
return c.fire("editor:object-exported", M), M;
|
|
1413
1413
|
}
|
|
1414
1414
|
if (i) {
|
|
1415
|
-
var m = yield createImageBitmap(
|
|
1416
|
-
format:
|
|
1415
|
+
var m = yield createImageBitmap(l._element), f = yield u.post("toDataURL", {
|
|
1416
|
+
format: d,
|
|
1417
1417
|
quality: 1,
|
|
1418
1418
|
bitmap: m
|
|
1419
1419
|
}, [m]), v = {
|
|
1420
1420
|
image: f,
|
|
1421
|
-
format:
|
|
1421
|
+
format: d,
|
|
1422
1422
|
contentType: n,
|
|
1423
1423
|
fileName: r
|
|
1424
1424
|
};
|
|
1425
1425
|
return c.fire("editor:object-exported", v), v;
|
|
1426
1426
|
}
|
|
1427
|
-
var S =
|
|
1427
|
+
var S = l.toCanvasElement(), N = yield new Promise((p) => {
|
|
1428
1428
|
S.toBlob(p);
|
|
1429
1429
|
});
|
|
1430
1430
|
if (s) {
|
|
1431
|
-
var
|
|
1431
|
+
var L = {
|
|
1432
1432
|
image: N,
|
|
1433
|
-
format:
|
|
1433
|
+
format: d,
|
|
1434
1434
|
contentType: n,
|
|
1435
1435
|
fileName: r
|
|
1436
1436
|
};
|
|
1437
|
-
return c.fire("editor:object-exported",
|
|
1437
|
+
return c.fire("editor:object-exported", L), L;
|
|
1438
1438
|
}
|
|
1439
|
-
var
|
|
1439
|
+
var w = new File([N], r, {
|
|
1440
1440
|
type: n
|
|
1441
1441
|
}), y = {
|
|
1442
|
-
image:
|
|
1443
|
-
format:
|
|
1442
|
+
image: w,
|
|
1443
|
+
format: d,
|
|
1444
1444
|
contentType: n,
|
|
1445
1445
|
fileName: r
|
|
1446
1446
|
};
|
|
@@ -1629,13 +1629,13 @@ class Mt {
|
|
|
1629
1629
|
} = this.editor, {
|
|
1630
1630
|
width: c,
|
|
1631
1631
|
height: u
|
|
1632
|
-
} = i,
|
|
1633
|
-
if (!s || s === "auto" || r ? this.adaptCanvasToContainer() : s ? this.setCanvasBackstoreWidth(s) : this.setCanvasBackstoreWidth(
|
|
1634
|
-
width:
|
|
1632
|
+
} = i, l = Number(Math.max(Math.min(e, E), k));
|
|
1633
|
+
if (!s || s === "auto" || r ? this.adaptCanvasToContainer() : s ? this.setCanvasBackstoreWidth(s) : this.setCanvasBackstoreWidth(l), i.set({
|
|
1634
|
+
width: l
|
|
1635
1635
|
}), n.clipPath.set({
|
|
1636
|
-
width:
|
|
1636
|
+
width: l
|
|
1637
1637
|
}), t) {
|
|
1638
|
-
var
|
|
1638
|
+
var d = l / c, h = u * d;
|
|
1639
1639
|
this.setResolutionHeight(h);
|
|
1640
1640
|
return;
|
|
1641
1641
|
}
|
|
@@ -1673,13 +1673,13 @@ class Mt {
|
|
|
1673
1673
|
} = this.editor, {
|
|
1674
1674
|
width: c,
|
|
1675
1675
|
height: u
|
|
1676
|
-
} = i,
|
|
1677
|
-
if (!s || s === "auto" || r ? this.adaptCanvasToContainer() : s ? this.setCanvasBackstoreHeight(s) : this.setCanvasBackstoreHeight(
|
|
1678
|
-
height:
|
|
1676
|
+
} = i, l = Number(Math.max(Math.min(e, O), x));
|
|
1677
|
+
if (!s || s === "auto" || r ? this.adaptCanvasToContainer() : s ? this.setCanvasBackstoreHeight(s) : this.setCanvasBackstoreHeight(l), i.set({
|
|
1678
|
+
height: l
|
|
1679
1679
|
}), n.clipPath.set({
|
|
1680
|
-
height:
|
|
1680
|
+
height: l
|
|
1681
1681
|
}), t) {
|
|
1682
|
-
var
|
|
1682
|
+
var d = l / u, h = c * d;
|
|
1683
1683
|
this.setResolutionWidth(h);
|
|
1684
1684
|
return;
|
|
1685
1685
|
}
|
|
@@ -1700,7 +1700,7 @@ class Mt {
|
|
|
1700
1700
|
var {
|
|
1701
1701
|
canvas: e,
|
|
1702
1702
|
montageArea: t
|
|
1703
|
-
} = this.editor, a = e.getWidth(), r = e.getHeight(), n = e.getZoom(), i = new
|
|
1703
|
+
} = this.editor, a = e.getWidth(), r = e.getHeight(), n = e.getZoom(), i = new K(a / 2, r / 2);
|
|
1704
1704
|
t.set({
|
|
1705
1705
|
left: a / 2,
|
|
1706
1706
|
top: r / 2
|
|
@@ -1925,16 +1925,16 @@ class Mt {
|
|
|
1925
1925
|
}
|
|
1926
1926
|
var s = t === "width" ? "width" : "height";
|
|
1927
1927
|
if (typeof a == "string") {
|
|
1928
|
-
i.forEach((
|
|
1929
|
-
|
|
1928
|
+
i.forEach((l) => {
|
|
1929
|
+
l.style[s] = a;
|
|
1930
1930
|
});
|
|
1931
1931
|
return;
|
|
1932
1932
|
}
|
|
1933
1933
|
var c = parseFloat(a);
|
|
1934
1934
|
if (!isNaN(c)) {
|
|
1935
1935
|
var u = "".concat(c, "px");
|
|
1936
|
-
i.forEach((
|
|
1937
|
-
|
|
1936
|
+
i.forEach((l) => {
|
|
1937
|
+
l.style[s] = u;
|
|
1938
1938
|
}), r.fire("editor:display-".concat(e, "-").concat(s, "-changed"), {
|
|
1939
1939
|
element: e,
|
|
1940
1940
|
value: a
|
|
@@ -1966,21 +1966,21 @@ class Mt {
|
|
|
1966
1966
|
} = this.editor, u = e || r.getActiveObject();
|
|
1967
1967
|
if (!(!u || u.type !== "image" && u.format !== "svg")) {
|
|
1968
1968
|
var {
|
|
1969
|
-
width:
|
|
1970
|
-
height:
|
|
1971
|
-
} = u, h = Math.min(
|
|
1969
|
+
width: l,
|
|
1970
|
+
height: d
|
|
1971
|
+
} = u, h = Math.min(l, E), g = Math.min(d, O);
|
|
1972
1972
|
if (t) {
|
|
1973
1973
|
var {
|
|
1974
1974
|
width: M,
|
|
1975
1975
|
height: m
|
|
1976
|
-
} = n, f =
|
|
1976
|
+
} = n, f = l / M, v = d / m, S = Math.max(f, v);
|
|
1977
1977
|
h = M * S, g = m * S;
|
|
1978
1978
|
}
|
|
1979
1979
|
this.setResolutionWidth(h, {
|
|
1980
1980
|
withoutSave: !0
|
|
1981
1981
|
}), this.setResolutionHeight(g, {
|
|
1982
1982
|
withoutSave: !0
|
|
1983
|
-
}), (
|
|
1983
|
+
}), (l > s || d > c) && i.calculateAndApplyDefaultZoom(), i.resetObject(u, {
|
|
1984
1984
|
withoutSave: !0
|
|
1985
1985
|
}), r.centerObject(u), r.renderAll(), a || this.editor.historyManager.saveState(), r.fire("editor:montage-area-scaled-to-image", {
|
|
1986
1986
|
object: u,
|
|
@@ -2043,15 +2043,8 @@ class Mt {
|
|
|
2043
2043
|
}
|
|
2044
2044
|
}
|
|
2045
2045
|
class ft {
|
|
2046
|
-
|
|
2047
|
-
|
|
2048
|
-
* @param {ImageEditor} options.editor - экземпляр редактора с доступом к canvas
|
|
2049
|
-
*/
|
|
2050
|
-
constructor(e) {
|
|
2051
|
-
var {
|
|
2052
|
-
editor: t
|
|
2053
|
-
} = e;
|
|
2054
|
-
this.editor = t, this.options = t.options;
|
|
2046
|
+
constructor({ editor: e }) {
|
|
2047
|
+
this.editor = e, this.options = e.options, this.minZoom = this.options.minZoom || ht, this.maxZoom = this.options.maxZoom || gt, this.defaultZoom = this.options.defaultScale, this.maxZoomFactor = this.options.maxZoomFactor;
|
|
2055
2048
|
}
|
|
2056
2049
|
/**
|
|
2057
2050
|
* Метод рассчитывает и применяет зум по умолчанию для монтажной области редактора.
|
|
@@ -2060,18 +2053,11 @@ class ft {
|
|
|
2060
2053
|
* Если scale не передан, то используется значение из options.defaultScale.
|
|
2061
2054
|
* @param {Number} [scale] - Желаемый масштаб относительно размеров контейнера редактора.
|
|
2062
2055
|
*/
|
|
2063
|
-
calculateAndApplyDefaultZoom() {
|
|
2064
|
-
|
|
2065
|
-
|
|
2066
|
-
|
|
2067
|
-
|
|
2068
|
-
height: s
|
|
2069
|
-
} = this.editor.montageArea, c = r / i * e, u = n / s * e, d = Math.min(c, u), {
|
|
2070
|
-
minZoom: l,
|
|
2071
|
-
maxZoom: h,
|
|
2072
|
-
maxZoomFactor: g
|
|
2073
|
-
} = this.options;
|
|
2074
|
-
this.minZoom = Math.min(d / g, l), this.maxZoom = Math.max(d * g, h), this.defaultZoom = d, this.setZoom(d);
|
|
2056
|
+
calculateAndApplyDefaultZoom(e = this.options.defaultScale) {
|
|
2057
|
+
const { canvas: t } = this.editor, a = t.editorContainer, r = a.clientWidth, n = a.clientHeight, { width: i, height: s } = this.editor.montageArea, c = r / i * e, u = n / s * e;
|
|
2058
|
+
this.defaultZoom = Math.min(c, u);
|
|
2059
|
+
const { defaultZoom: l, maxZoomFactor: d, minZoom: h, maxZoom: g } = this;
|
|
2060
|
+
this.minZoom = Math.min(l / d, h), this.maxZoom = Math.max(l * d, g), this.setZoom();
|
|
2075
2061
|
}
|
|
2076
2062
|
/**
|
|
2077
2063
|
* Увеличение/уменьшение масштаба
|
|
@@ -2082,55 +2068,33 @@ class ft {
|
|
|
2082
2068
|
* @fires editor:zoom-changed
|
|
2083
2069
|
* Если передавать координаты курсора, то нужно быть аккуратнее, так как юзер может выйти за пределы рабочей области
|
|
2084
2070
|
*/
|
|
2085
|
-
zoom() {
|
|
2086
|
-
var
|
|
2087
|
-
if (e)
|
|
2088
|
-
|
|
2089
|
-
|
|
2090
|
-
|
|
2091
|
-
|
|
2092
|
-
|
|
2093
|
-
|
|
2094
|
-
|
|
2095
|
-
|
|
2096
|
-
|
|
2097
|
-
|
|
2098
|
-
|
|
2099
|
-
}, u), console.log({
|
|
2100
|
-
currentZoom: i,
|
|
2101
|
-
zoom: u,
|
|
2102
|
-
pointX: s,
|
|
2103
|
-
pointY: c
|
|
2104
|
-
}), a.fire("editor:zoom-changed", {
|
|
2105
|
-
currentZoom: a.getZoom(),
|
|
2106
|
-
zoom: u,
|
|
2107
|
-
pointX: s,
|
|
2108
|
-
pointY: c
|
|
2109
|
-
});
|
|
2110
|
-
}
|
|
2071
|
+
zoom(e = vt, t = {}) {
|
|
2072
|
+
var h, g;
|
|
2073
|
+
if (!e) return;
|
|
2074
|
+
const { minZoom: a, maxZoom: r } = this, { canvas: n } = this.editor, i = n.getZoom(), s = n.getCenterPoint(), c = (h = t.pointX) != null ? h : s.x, u = (g = t.pointY) != null ? g : s.y, l = new K(c, u);
|
|
2075
|
+
let d = Number((i + Number(e)).toFixed(2));
|
|
2076
|
+
d > r && (d = r), d < a && (d = a), n.zoomToPoint(l, d), console.log({
|
|
2077
|
+
currentZoom: i,
|
|
2078
|
+
zoom: d,
|
|
2079
|
+
point: l
|
|
2080
|
+
}), n.fire("editor:zoom-changed", {
|
|
2081
|
+
currentZoom: n.getZoom(),
|
|
2082
|
+
zoom: d,
|
|
2083
|
+
point: l
|
|
2084
|
+
});
|
|
2111
2085
|
}
|
|
2112
2086
|
/**
|
|
2113
2087
|
* Установка зума
|
|
2114
2088
|
* @param {Number} zoom - Зум
|
|
2115
2089
|
* @fires editor:zoom-changed
|
|
2116
2090
|
*/
|
|
2117
|
-
setZoom() {
|
|
2118
|
-
|
|
2119
|
-
|
|
2120
|
-
|
|
2121
|
-
|
|
2122
|
-
|
|
2123
|
-
|
|
2124
|
-
y: i
|
|
2125
|
-
} = t.getCenterPoint(), s = e;
|
|
2126
|
-
e > r && (s = r), e < a && (s = a), t.zoomToPoint({
|
|
2127
|
-
x: Number(n),
|
|
2128
|
-
y: Number(i)
|
|
2129
|
-
}, s), t.fire("editor:zoom-changed", {
|
|
2130
|
-
currentZoom: t.getZoom(),
|
|
2131
|
-
zoom: s,
|
|
2132
|
-
pointX: n,
|
|
2133
|
-
pointY: i
|
|
2091
|
+
setZoom(e = this.defaultZoom) {
|
|
2092
|
+
const { minZoom: t, maxZoom: a } = this, { canvas: r } = this.editor, n = new K(r.getCenterPoint());
|
|
2093
|
+
let i = e;
|
|
2094
|
+
e > a && (i = a), e < t && (i = t), r.zoomToPoint(n, i), r.fire("editor:zoom-changed", {
|
|
2095
|
+
currentZoom: r.getZoom(),
|
|
2096
|
+
zoom: i,
|
|
2097
|
+
point: n
|
|
2134
2098
|
});
|
|
2135
2099
|
}
|
|
2136
2100
|
/**
|
|
@@ -2138,20 +2102,10 @@ class ft {
|
|
|
2138
2102
|
* @fires editor:zoom-changed
|
|
2139
2103
|
*/
|
|
2140
2104
|
resetZoom() {
|
|
2141
|
-
|
|
2142
|
-
|
|
2143
|
-
defaultZoom: t
|
|
2144
|
-
} = this.editor, {
|
|
2145
|
-
x: a,
|
|
2146
|
-
y: r
|
|
2147
|
-
} = e.getCenterPoint();
|
|
2148
|
-
e.zoomToPoint({
|
|
2149
|
-
x: Number(a),
|
|
2150
|
-
y: Number(r)
|
|
2151
|
-
}, t), this.editor.canvas.fire("editor:zoom-changed", {
|
|
2105
|
+
const { canvas: e } = this.editor, t = new K(e.getCenterPoint());
|
|
2106
|
+
e.zoomToPoint(t, this.defaultZoom), this.editor.canvas.fire("editor:zoom-changed", {
|
|
2152
2107
|
currentZoom: e.getZoom(),
|
|
2153
|
-
|
|
2154
|
-
pointY: r
|
|
2108
|
+
point: t
|
|
2155
2109
|
});
|
|
2156
2110
|
}
|
|
2157
2111
|
/**
|
|
@@ -2161,21 +2115,15 @@ class ft {
|
|
|
2161
2115
|
* @param {Boolean} options.withoutSave - Не сохранять состояние
|
|
2162
2116
|
* @fires editor:object-rotated
|
|
2163
2117
|
*/
|
|
2164
|
-
rotate() {
|
|
2165
|
-
|
|
2166
|
-
|
|
2167
|
-
|
|
2168
|
-
|
|
2169
|
-
|
|
2170
|
-
|
|
2171
|
-
|
|
2172
|
-
|
|
2173
|
-
n.rotate(i), n.setCoords(), a.renderAll(), t || r.saveState(), a.fire("editor:object-rotated", {
|
|
2174
|
-
object: n,
|
|
2175
|
-
withoutSave: t,
|
|
2176
|
-
angle: i
|
|
2177
|
-
});
|
|
2178
|
-
}
|
|
2118
|
+
rotate(e = mt, { withoutSave: t } = {}) {
|
|
2119
|
+
const { canvas: a, historyManager: r } = this.editor, n = a.getActiveObject();
|
|
2120
|
+
if (!n) return;
|
|
2121
|
+
const i = n.angle + e;
|
|
2122
|
+
n.rotate(i), n.setCoords(), a.renderAll(), t || r.saveState(), a.fire("editor:object-rotated", {
|
|
2123
|
+
object: n,
|
|
2124
|
+
withoutSave: t,
|
|
2125
|
+
angle: i
|
|
2126
|
+
});
|
|
2179
2127
|
}
|
|
2180
2128
|
/**
|
|
2181
2129
|
* Отразить по горизонтали
|
|
@@ -2183,13 +2131,8 @@ class ft {
|
|
|
2183
2131
|
* @param {Boolean} options.withoutSave - Не сохранять состояние
|
|
2184
2132
|
* @fires editor:object-flipped-x
|
|
2185
2133
|
*/
|
|
2186
|
-
flipX() {
|
|
2187
|
-
|
|
2188
|
-
withoutSave: e
|
|
2189
|
-
} = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, {
|
|
2190
|
-
canvas: t,
|
|
2191
|
-
historyManager: a
|
|
2192
|
-
} = this.editor, r = t.getActiveObject();
|
|
2134
|
+
flipX({ withoutSave: e } = {}) {
|
|
2135
|
+
const { canvas: t, historyManager: a } = this.editor, r = t.getActiveObject();
|
|
2193
2136
|
r && (r.flipX = !r.flipX, t.renderAll(), e || a.saveState(), t.fire("editor:object-flipped-x", {
|
|
2194
2137
|
object: r,
|
|
2195
2138
|
withoutSave: e
|
|
@@ -2201,13 +2144,8 @@ class ft {
|
|
|
2201
2144
|
* @param {Boolean} options.withoutSave - Не сохранять состояние
|
|
2202
2145
|
* @fires editor:object-flipped-y
|
|
2203
2146
|
*/
|
|
2204
|
-
flipY() {
|
|
2205
|
-
|
|
2206
|
-
withoutSave: e
|
|
2207
|
-
} = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, {
|
|
2208
|
-
canvas: t,
|
|
2209
|
-
historyManager: a
|
|
2210
|
-
} = this.editor, r = t.getActiveObject();
|
|
2147
|
+
flipY({ withoutSave: e } = {}) {
|
|
2148
|
+
const { canvas: t, historyManager: a } = this.editor, r = t.getActiveObject();
|
|
2211
2149
|
r && (r.flipY = !r.flipY, t.renderAll(), e || a.saveState(), t.fire("editor:object-flipped-y", {
|
|
2212
2150
|
object: r,
|
|
2213
2151
|
withoutSave: e
|
|
@@ -2218,15 +2156,12 @@ class ft {
|
|
|
2218
2156
|
* @param {Number} opacity - Прозрачность от 0 до 1
|
|
2219
2157
|
* @fires editor:object-opacity-changed
|
|
2220
2158
|
*/
|
|
2221
|
-
setActiveObjectOpacity(
|
|
2222
|
-
|
|
2223
|
-
|
|
2224
|
-
|
|
2225
|
-
|
|
2226
|
-
|
|
2227
|
-
canvas: r,
|
|
2228
|
-
historyManager: n
|
|
2229
|
-
} = this.editor, i = e || r.getActiveObject();
|
|
2159
|
+
setActiveObjectOpacity({
|
|
2160
|
+
object: e,
|
|
2161
|
+
opacity: t = 1,
|
|
2162
|
+
withoutSave: a
|
|
2163
|
+
} = {}) {
|
|
2164
|
+
const { canvas: r, historyManager: n } = this.editor, i = e || r.getActiveObject();
|
|
2230
2165
|
i && (i.type === "activeselection" ? i.getObjects().forEach((s) => {
|
|
2231
2166
|
s.set("opacity", t);
|
|
2232
2167
|
}) : i.set("opacity", t), r.renderAll(), a || n.saveState(), r.fire("editor:object-opacity-changed", {
|
|
@@ -2246,37 +2181,28 @@ class ft {
|
|
|
2246
2181
|
* @param {Boolean} [options.fitAsOneObject] - Масштабировать все объекты в активной группе как один объект
|
|
2247
2182
|
* @fires editor:image-fitted
|
|
2248
2183
|
*/
|
|
2249
|
-
fitObject(
|
|
2250
|
-
|
|
2251
|
-
|
|
2252
|
-
|
|
2253
|
-
|
|
2254
|
-
|
|
2255
|
-
|
|
2256
|
-
canvas: n,
|
|
2257
|
-
imageManager: i,
|
|
2258
|
-
historyManager: s
|
|
2259
|
-
} = this.editor, c = e || n.getActiveObject();
|
|
2184
|
+
fitObject({
|
|
2185
|
+
object: e,
|
|
2186
|
+
type: t = this.options.scaleType,
|
|
2187
|
+
withoutSave: a,
|
|
2188
|
+
fitAsOneObject: r
|
|
2189
|
+
} = {}) {
|
|
2190
|
+
const { canvas: n, imageManager: i, historyManager: s } = this.editor, c = e || n.getActiveObject();
|
|
2260
2191
|
if (c) {
|
|
2261
2192
|
if (c.set("angle", 0), ["activeselection"].includes(c.type) && !r) {
|
|
2262
|
-
|
|
2263
|
-
n.discardActiveObject(), u.forEach((
|
|
2264
|
-
|
|
2265
|
-
|
|
2266
|
-
scaleType: t
|
|
2267
|
-
});
|
|
2268
|
-
h.scale(g), n.centerObject(h);
|
|
2269
|
-
});
|
|
2270
|
-
var d = new H(u, {
|
|
2271
|
-
canvas: n
|
|
2193
|
+
const u = c.getObjects();
|
|
2194
|
+
n.discardActiveObject(), u.forEach((d) => {
|
|
2195
|
+
const h = i.calculateScaleFactor({ imageObject: d, scaleType: t });
|
|
2196
|
+
d.scale(h), n.centerObject(d);
|
|
2272
2197
|
});
|
|
2273
|
-
n
|
|
2198
|
+
const l = new R(u, { canvas: n });
|
|
2199
|
+
n.setActiveObject(l);
|
|
2274
2200
|
} else {
|
|
2275
|
-
|
|
2201
|
+
const u = i.calculateScaleFactor({
|
|
2276
2202
|
imageObject: c,
|
|
2277
2203
|
scaleType: t
|
|
2278
2204
|
});
|
|
2279
|
-
c.scale(
|
|
2205
|
+
c.scale(u), n.centerObject(c);
|
|
2280
2206
|
}
|
|
2281
2207
|
n.renderAll(), a || s.saveState(), n.fire("editor:object-fitted", {
|
|
2282
2208
|
object: c,
|
|
@@ -2303,64 +2229,35 @@ class ft {
|
|
|
2303
2229
|
* @returns
|
|
2304
2230
|
* @fires editor:object-reset
|
|
2305
2231
|
*/
|
|
2306
|
-
resetObject(e) {
|
|
2307
|
-
|
|
2308
|
-
alwaysFitObject: t = !1,
|
|
2309
|
-
withoutSave: a = !1
|
|
2310
|
-
} = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {}, {
|
|
2232
|
+
resetObject(e, { alwaysFitObject: t = !1, withoutSave: a = !1 } = {}) {
|
|
2233
|
+
const {
|
|
2311
2234
|
canvas: r,
|
|
2312
2235
|
montageArea: n,
|
|
2313
2236
|
imageManager: i,
|
|
2314
2237
|
historyManager: s,
|
|
2315
|
-
options: {
|
|
2316
|
-
scaleType: c
|
|
2317
|
-
}
|
|
2238
|
+
options: { scaleType: c }
|
|
2318
2239
|
} = this.editor, u = e || r.getActiveObject();
|
|
2319
|
-
if (!
|
|
2320
|
-
|
|
2321
|
-
|
|
2322
|
-
|
|
2323
|
-
|
|
2324
|
-
|
|
2325
|
-
|
|
2326
|
-
|
|
2327
|
-
|
|
2328
|
-
|
|
2329
|
-
|
|
2330
|
-
|
|
2331
|
-
|
|
2332
|
-
fitAsOneObject: !0
|
|
2333
|
-
});
|
|
2334
|
-
else {
|
|
2335
|
-
var {
|
|
2336
|
-
width: l,
|
|
2337
|
-
height: h
|
|
2338
|
-
} = n, {
|
|
2339
|
-
width: g,
|
|
2340
|
-
height: M
|
|
2341
|
-
} = u, m = i.calculateScaleFactor({
|
|
2342
|
-
imageObject: u,
|
|
2343
|
-
scaleType: c
|
|
2344
|
-
}), f = c === "contain" && m < 1 || c === "cover" && (g > l || M > h);
|
|
2345
|
-
f ? this.fitObject({
|
|
2346
|
-
object: u,
|
|
2347
|
-
withoutSave: !0,
|
|
2348
|
-
fitAsOneObject: !0
|
|
2349
|
-
}) : u.set({
|
|
2350
|
-
scaleX: 1,
|
|
2351
|
-
scaleY: 1
|
|
2352
|
-
});
|
|
2353
|
-
}
|
|
2354
|
-
u.set({
|
|
2355
|
-
flipX: !1,
|
|
2356
|
-
flipY: !1,
|
|
2357
|
-
angle: 0
|
|
2358
|
-
}), r.centerObject(u), r.renderAll(), s.resumeHistory(), a || s.saveState(), r.fire("editor:object-reset", {
|
|
2359
|
-
object: u,
|
|
2360
|
-
withoutSave: a,
|
|
2361
|
-
alwaysFitObject: t
|
|
2240
|
+
if (!u || u.locked) return;
|
|
2241
|
+
if (s.suspendHistory(), u.type === "image" || u.format === "svg" || u.set({
|
|
2242
|
+
scaleX: 1,
|
|
2243
|
+
scaleY: 1,
|
|
2244
|
+
flipX: !1,
|
|
2245
|
+
flipY: !1,
|
|
2246
|
+
angle: 0
|
|
2247
|
+
}), t)
|
|
2248
|
+
this.fitObject({ object: u, withoutSave: !0, fitAsOneObject: !0 });
|
|
2249
|
+
else {
|
|
2250
|
+
const { width: d, height: h } = n, { width: g, height: M } = u, m = i.calculateScaleFactor({
|
|
2251
|
+
imageObject: u,
|
|
2252
|
+
scaleType: c
|
|
2362
2253
|
});
|
|
2254
|
+
c === "contain" && m < 1 || c === "cover" && (g > d || M > h) ? this.fitObject({ object: u, withoutSave: !0, fitAsOneObject: !0 }) : u.set({ scaleX: 1, scaleY: 1 });
|
|
2363
2255
|
}
|
|
2256
|
+
u.set({ flipX: !1, flipY: !1, angle: 0 }), r.centerObject(u), r.renderAll(), s.resumeHistory(), a || s.saveState(), r.fire("editor:object-reset", {
|
|
2257
|
+
object: u,
|
|
2258
|
+
withoutSave: a,
|
|
2259
|
+
alwaysFitObject: t
|
|
2260
|
+
});
|
|
2364
2261
|
}
|
|
2365
2262
|
}
|
|
2366
2263
|
class jt {
|
|
@@ -2463,7 +2360,7 @@ class jt {
|
|
|
2463
2360
|
}
|
|
2464
2361
|
}
|
|
2465
2362
|
}
|
|
2466
|
-
class
|
|
2363
|
+
class $ {
|
|
2467
2364
|
/**
|
|
2468
2365
|
* @param {object} options
|
|
2469
2366
|
* @param {ImageEditor} options.editor - экземпляр редактора с доступом к canvas
|
|
@@ -2513,7 +2410,7 @@ class K {
|
|
|
2513
2410
|
} = this.editor;
|
|
2514
2411
|
r.suspendHistory();
|
|
2515
2412
|
var n = e || a.getActiveObject();
|
|
2516
|
-
n && (n.type === "activeselection" ?
|
|
2413
|
+
n && (n.type === "activeselection" ? $._moveSelectionForward(a, n) : a.bringObjectForward(n), a.renderAll(), r.resumeHistory(), t || r.saveState(), a.fire("editor:object-bring-forward", {
|
|
2517
2414
|
object: n,
|
|
2518
2415
|
withoutSave: t
|
|
2519
2416
|
}));
|
|
@@ -2569,7 +2466,7 @@ class K {
|
|
|
2569
2466
|
} = this.editor;
|
|
2570
2467
|
n.suspendHistory();
|
|
2571
2468
|
var s = e || a.getActiveObject();
|
|
2572
|
-
s && (s.type === "activeselection" ?
|
|
2469
|
+
s && (s.type === "activeselection" ? $._moveSelectionBackwards(a, s) : a.sendObjectBackwards(s), a.sendObjectToBack(r), a.sendObjectToBack(i), a.renderAll(), n.resumeHistory(), t || n.saveState(), a.fire("editor:object-send-backwards", {
|
|
2573
2470
|
object: s,
|
|
2574
2471
|
withoutSave: t
|
|
2575
2472
|
}));
|
|
@@ -2582,20 +2479,20 @@ class K {
|
|
|
2582
2479
|
* @private
|
|
2583
2480
|
*/
|
|
2584
2481
|
static _moveSelectionForward(e, t) {
|
|
2585
|
-
for (var a = e.getObjects(), r = t.getObjects(), n = r.map((
|
|
2586
|
-
var h = a[
|
|
2587
|
-
if (!r.includes(h) && n.some((g) =>
|
|
2588
|
-
return i =
|
|
2482
|
+
for (var a = e.getObjects(), r = t.getObjects(), n = r.map((l) => a.indexOf(l)), i = -1, s = function(d) {
|
|
2483
|
+
var h = a[d];
|
|
2484
|
+
if (!r.includes(h) && n.some((g) => d > g))
|
|
2485
|
+
return i = d, 1;
|
|
2589
2486
|
}, c = 0; c < a.length && !s(c); c += 1)
|
|
2590
2487
|
;
|
|
2591
2488
|
if (i !== -1) {
|
|
2592
|
-
var u = r.map((
|
|
2593
|
-
obj:
|
|
2594
|
-
index: a.indexOf(
|
|
2595
|
-
})).sort((
|
|
2596
|
-
u.forEach((
|
|
2597
|
-
var
|
|
2598
|
-
|
|
2489
|
+
var u = r.map((l) => ({
|
|
2490
|
+
obj: l,
|
|
2491
|
+
index: a.indexOf(l)
|
|
2492
|
+
})).sort((l, d) => d.index - l.index);
|
|
2493
|
+
u.forEach((l) => {
|
|
2494
|
+
var d = a.indexOf(l.obj);
|
|
2495
|
+
d < i && (e.moveObjectTo(l.obj, i), i = d);
|
|
2599
2496
|
});
|
|
2600
2497
|
}
|
|
2601
2498
|
}
|
|
@@ -2635,15 +2532,15 @@ class yt {
|
|
|
2635
2532
|
* @param {Object} flags.withoutSelection - Не выделять объект
|
|
2636
2533
|
* @param {Object} flags.withoutAdding - Не добавлять объект в canvas
|
|
2637
2534
|
*/
|
|
2638
|
-
addRectangle(
|
|
2639
|
-
var
|
|
2535
|
+
addRectangle(l = {}, { withoutSelection: c, withoutAdding: u } = {}) {
|
|
2536
|
+
var d = l, {
|
|
2640
2537
|
id: e = `rect-${A()}`,
|
|
2641
2538
|
left: t,
|
|
2642
2539
|
top: a,
|
|
2643
2540
|
width: r = 100,
|
|
2644
2541
|
height: n = 100,
|
|
2645
2542
|
fill: i = "blue"
|
|
2646
|
-
} =
|
|
2543
|
+
} = d, s = X(d, [
|
|
2647
2544
|
"id",
|
|
2648
2545
|
"left",
|
|
2649
2546
|
"top",
|
|
@@ -2678,27 +2575,27 @@ class yt {
|
|
|
2678
2575
|
* @param {Object} flags.withoutAdding - Не добавлять объект в canvas
|
|
2679
2576
|
*/
|
|
2680
2577
|
addCircle(u = {}, { withoutSelection: s, withoutAdding: c } = {}) {
|
|
2681
|
-
var
|
|
2578
|
+
var l = u, {
|
|
2682
2579
|
id: e = `circle-${A()}`,
|
|
2683
2580
|
left: t,
|
|
2684
2581
|
top: a,
|
|
2685
2582
|
radius: r = 50,
|
|
2686
2583
|
fill: n = "green"
|
|
2687
|
-
} =
|
|
2584
|
+
} = l, i = X(l, [
|
|
2688
2585
|
"id",
|
|
2689
2586
|
"left",
|
|
2690
2587
|
"top",
|
|
2691
2588
|
"radius",
|
|
2692
2589
|
"fill"
|
|
2693
2590
|
]);
|
|
2694
|
-
const { canvas:
|
|
2591
|
+
const { canvas: d } = this.editor, h = new Be(C({
|
|
2695
2592
|
id: e,
|
|
2696
2593
|
left: t,
|
|
2697
2594
|
top: a,
|
|
2698
2595
|
fill: n,
|
|
2699
2596
|
radius: r
|
|
2700
2597
|
}, i));
|
|
2701
|
-
return !t && !a &&
|
|
2598
|
+
return !t && !a && d.centerObject(h), c || (d.add(h), s || d.setActiveObject(h), d.renderAll()), h;
|
|
2702
2599
|
}
|
|
2703
2600
|
/**
|
|
2704
2601
|
* Добавление треугольника
|
|
@@ -2717,15 +2614,15 @@ class yt {
|
|
|
2717
2614
|
* @param {Object} flags.withoutSelection - Не выделять объект
|
|
2718
2615
|
* @param {Object} flags.withoutAdding - Не добавлять объект в canvas
|
|
2719
2616
|
*/
|
|
2720
|
-
addTriangle(
|
|
2721
|
-
var
|
|
2617
|
+
addTriangle(l = {}, { withoutSelection: c, withoutAdding: u } = {}) {
|
|
2618
|
+
var d = l, {
|
|
2722
2619
|
id: e = `triangle-${A()}`,
|
|
2723
2620
|
left: t,
|
|
2724
2621
|
top: a,
|
|
2725
2622
|
width: r = 100,
|
|
2726
2623
|
height: n = 100,
|
|
2727
2624
|
fill: i = "yellow"
|
|
2728
|
-
} =
|
|
2625
|
+
} = d, s = X(d, [
|
|
2729
2626
|
"id",
|
|
2730
2627
|
"left",
|
|
2731
2628
|
"top",
|
|
@@ -2781,8 +2678,8 @@ class pt {
|
|
|
2781
2678
|
const n = a.toCanvasElement().toDataURL(), i = n.slice(5).split(";")[0], s = n.split(",")[1], c = atob(s), u = new Uint8Array(c.length);
|
|
2782
2679
|
for (let h = 0; h < c.length; h++)
|
|
2783
2680
|
u[h] = c.charCodeAt(h);
|
|
2784
|
-
const
|
|
2785
|
-
navigator.clipboard.write([
|
|
2681
|
+
const l = new Blob([u.buffer], { type: i }), d = new ClipboardItem({ [i]: l });
|
|
2682
|
+
navigator.clipboard.write([d]).catch((h) => {
|
|
2786
2683
|
t.emitWarning({
|
|
2787
2684
|
origin: "ClipboardManager",
|
|
2788
2685
|
method: "copy",
|
|
@@ -2852,7 +2749,7 @@ class pt {
|
|
|
2852
2749
|
left: t.left + 10,
|
|
2853
2750
|
top: t.top + 10,
|
|
2854
2751
|
evented: !0
|
|
2855
|
-
}), t instanceof
|
|
2752
|
+
}), t instanceof R ? (t.canvas = e, t.forEachObject((a) => {
|
|
2856
2753
|
e.add(a);
|
|
2857
2754
|
})) : e.add(t), e.setActiveObject(t), e.requestRenderAll(), e.fire("editor:object-pasted", { object: t });
|
|
2858
2755
|
});
|
|
@@ -3001,7 +2898,7 @@ class It {
|
|
|
3001
2898
|
if (!(!n || n.type !== "group")) {
|
|
3002
2899
|
var i = n.removeAll();
|
|
3003
2900
|
a.remove(n), i.forEach((c) => a.add(c));
|
|
3004
|
-
var s = new
|
|
2901
|
+
var s = new R(i, {
|
|
3005
2902
|
canvas: a
|
|
3006
2903
|
});
|
|
3007
2904
|
a.setActiveObject(s), a.renderAll(), r.resumeHistory(), t || r.saveState(), a.fire("editor:objects-ungrouped", {
|
|
@@ -3034,7 +2931,7 @@ class At {
|
|
|
3034
2931
|
objectLockManager: a
|
|
3035
2932
|
} = this.editor;
|
|
3036
2933
|
e.discardActiveObject();
|
|
3037
|
-
var r = t.getObjects(), n = r.some((s) => s.locked), i = r.length > 1 ? new
|
|
2934
|
+
var r = t.getObjects(), n = r.some((s) => s.locked), i = r.length > 1 ? new R(t.getObjects(), {
|
|
3038
2935
|
canvas: e
|
|
3039
2936
|
}) : r[0];
|
|
3040
2937
|
n && a.lockObject({
|
|
@@ -3134,7 +3031,7 @@ var Ct = {
|
|
|
3134
3031
|
CLONE_FAILED: "CLONE_FAILED"
|
|
3135
3032
|
}
|
|
3136
3033
|
};
|
|
3137
|
-
class
|
|
3034
|
+
class q {
|
|
3138
3035
|
constructor({ editor: e }) {
|
|
3139
3036
|
this._buffer = [], this.editor = e;
|
|
3140
3037
|
}
|
|
@@ -3155,7 +3052,7 @@ class $ {
|
|
|
3155
3052
|
* @fires editor:error
|
|
3156
3053
|
*/
|
|
3157
3054
|
emitError({ origin: e = "ImageEditor", method: t = "Unknown Method", code: a, data: r, message: n }) {
|
|
3158
|
-
if (
|
|
3055
|
+
if (!q.isValidErrorCode(a)) {
|
|
3159
3056
|
console.warn("Неизвестный код ошибки: ", { code: a, origin: e, method: t });
|
|
3160
3057
|
return;
|
|
3161
3058
|
}
|
|
@@ -3184,7 +3081,7 @@ class $ {
|
|
|
3184
3081
|
* @fires editor:warning
|
|
3185
3082
|
*/
|
|
3186
3083
|
emitWarning({ origin: e = "ImageEditor", method: t = "Unknown Method", code: a, message: r, data: n }) {
|
|
3187
|
-
if (
|
|
3084
|
+
if (!q.isValidErrorCode(a)) {
|
|
3188
3085
|
console.warn("Неизвестный код предупреждения: ", { code: a, origin: e, method: t });
|
|
3189
3086
|
return;
|
|
3190
3087
|
}
|
|
@@ -3205,16 +3102,14 @@ class $ {
|
|
|
3205
3102
|
return e ? Object.values(Ct).some((t) => Object.values(t).includes(e)) : !1;
|
|
3206
3103
|
}
|
|
3207
3104
|
}
|
|
3208
|
-
class
|
|
3105
|
+
class de {
|
|
3209
3106
|
/**
|
|
3210
3107
|
* Конструктор класса ImageEditor.
|
|
3211
3108
|
* @param {string} canvasId - идентификатор канваса, в котором будет создан редактор
|
|
3212
3109
|
* @param {CanvasOptions} options - опции и настройки редактора
|
|
3213
3110
|
*/
|
|
3214
3111
|
constructor(e, t) {
|
|
3215
|
-
this.options = t;
|
|
3216
|
-
const { defaultScale: a, minZoom: r, maxZoom: n } = t;
|
|
3217
|
-
this.containerId = e, this.editorId = `${e}-${A()}`, this.clipboard = null, this.defaultZoom = a, this.minZoom = r || ht, this.maxZoom = n || gt, this.init();
|
|
3112
|
+
this.options = t, this.containerId = e, this.editorId = `${e}-${A()}`, this.clipboard = null, this.init();
|
|
3218
3113
|
}
|
|
3219
3114
|
init() {
|
|
3220
3115
|
return Q(this, null, function* () {
|
|
@@ -3228,18 +3123,18 @@ class ue {
|
|
|
3228
3123
|
initialImage: s,
|
|
3229
3124
|
initialStateJSON: c,
|
|
3230
3125
|
scaleType: u,
|
|
3231
|
-
_onReadyCallback:
|
|
3126
|
+
_onReadyCallback: l
|
|
3232
3127
|
} = this.options;
|
|
3233
|
-
if (Ke.apply(), this.canvas = new Ue(this.containerId, this.options), this.moduleLoader = new
|
|
3128
|
+
if (Ke.apply(), this.canvas = new Ue(this.containerId, this.options), this.moduleLoader = new Re(), this.workerManager = new Pe(), this.errorManager = new q({ editor: this }), this.historyManager = new lt({ editor: this }), this.toolbar = new dt({ editor: this }), this.transformManager = new ft({ editor: this }), this.canvasManager = new Mt({ editor: this }), this.imageManager = new D({ editor: this }), this.layerManager = new $({ editor: this }), this.shapeManager = new yt({ editor: this }), this.interactionBlocker = new jt({ editor: this }), this.clipboardManager = new pt({ editor: this }), this.objectLockManager = new bt({ editor: this }), this.groupingManager = new It({ editor: this }), this.selectionManager = new At({ editor: this }), this.deletionManager = new St({ editor: this }), this._createMontageArea(), this._createClippingArea(), this.listeners = new H({ editor: this, options: this.options }), this.canvasManager.setEditorContainerWidth(e), this.canvasManager.setEditorContainerHeight(t), this.canvasManager.setCanvasWrapperWidth(a), this.canvasManager.setCanvasWrapperHeight(r), this.canvasManager.setCanvasCSSWidth(n), this.canvasManager.setCanvasCSSHeight(i), s != null && s.source) {
|
|
3234
3129
|
const {
|
|
3235
|
-
source:
|
|
3130
|
+
source: d,
|
|
3236
3131
|
scale: h = `image-${u}`,
|
|
3237
3132
|
withoutSave: g = !0
|
|
3238
3133
|
} = s;
|
|
3239
|
-
yield this.imageManager.importImage({ source:
|
|
3134
|
+
yield this.imageManager.importImage({ source: d, scale: h, withoutSave: g });
|
|
3240
3135
|
} else
|
|
3241
3136
|
this.canvasManager.setDefaultScale({ withoutSave: !0 });
|
|
3242
|
-
c && this.historyManager.loadStateFromFullState(c), this.historyManager.saveState(), console.log("editor:ready"), this.canvas.fire("editor:ready", this), typeof
|
|
3137
|
+
c && this.historyManager.loadStateFromFullState(c), this.historyManager.saveState(), console.log("editor:ready"), this.canvas.fire("editor:ready", this), typeof l == "function" && l(this);
|
|
3243
3138
|
});
|
|
3244
3139
|
}
|
|
3245
3140
|
_createMontageArea() {
|
|
@@ -3250,7 +3145,7 @@ class ue {
|
|
|
3250
3145
|
this.montageArea = this.shapeManager.addRectangle({
|
|
3251
3146
|
width: e,
|
|
3252
3147
|
height: t,
|
|
3253
|
-
fill:
|
|
3148
|
+
fill: de._createMosaicPattern(),
|
|
3254
3149
|
stroke: null,
|
|
3255
3150
|
strokeWidth: 0,
|
|
3256
3151
|
selectable: !1,
|
|
@@ -3395,7 +3290,7 @@ function Et(o, e = {}) {
|
|
|
3395
3290
|
const r = document.createElement("canvas");
|
|
3396
3291
|
return r.id = `${o}-canvas`, a.appendChild(r), t.editorContainer = a, new Promise((n) => {
|
|
3397
3292
|
t._onReadyCallback = n;
|
|
3398
|
-
const i = new
|
|
3293
|
+
const i = new de(r.id, t);
|
|
3399
3294
|
window[o] = i;
|
|
3400
3295
|
});
|
|
3401
3296
|
}
|