@anu3ev/fabric-image-editor 0.5.24 → 0.5.26
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 +1175 -1038
- package/package.json +1 -1
package/dist/main.js
CHANGED
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var
|
|
4
|
-
var
|
|
5
|
-
var
|
|
1
|
+
var ls = Object.defineProperty, hs = Object.defineProperties;
|
|
2
|
+
var us = Object.getOwnPropertyDescriptors;
|
|
3
|
+
var ie = Object.getOwnPropertySymbols;
|
|
4
|
+
var Ne = Object.prototype.hasOwnProperty, ke = Object.prototype.propertyIsEnumerable;
|
|
5
|
+
var Be = (h, t, e) => t in h ? ls(h, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[t] = e, P = (h, t) => {
|
|
6
6
|
for (var e in t || (t = {}))
|
|
7
|
-
|
|
8
|
-
if (
|
|
9
|
-
for (var e of
|
|
10
|
-
|
|
7
|
+
Ne.call(t, e) && Be(h, e, t[e]);
|
|
8
|
+
if (ie)
|
|
9
|
+
for (var e of ie(t))
|
|
10
|
+
ke.call(t, e) && Be(h, e, t[e]);
|
|
11
11
|
return h;
|
|
12
|
-
}, St = (h, t) =>
|
|
13
|
-
var
|
|
12
|
+
}, St = (h, t) => hs(h, us(t));
|
|
13
|
+
var gt = (h, t) => {
|
|
14
14
|
var e = {};
|
|
15
15
|
for (var s in h)
|
|
16
|
-
|
|
17
|
-
if (h != null &&
|
|
18
|
-
for (var s of
|
|
19
|
-
t.indexOf(s) < 0 &&
|
|
16
|
+
Ne.call(h, s) && t.indexOf(s) < 0 && (e[s] = h[s]);
|
|
17
|
+
if (h != null && ie)
|
|
18
|
+
for (var s of ie(h))
|
|
19
|
+
t.indexOf(s) < 0 && ke.call(h, s) && (e[s] = h[s]);
|
|
20
20
|
return e;
|
|
21
21
|
};
|
|
22
|
-
var
|
|
22
|
+
var z = (h, t, e) => new Promise((s, n) => {
|
|
23
23
|
var o = (r) => {
|
|
24
24
|
try {
|
|
25
25
|
a(e.next(r));
|
|
@@ -35,15 +35,16 @@ var P = (h, t, e) => new Promise((s, n) => {
|
|
|
35
35
|
}, a = (r) => r.done ? s(r.value) : Promise.resolve(r.value).then(o, i);
|
|
36
36
|
a((e = e.apply(h, t)).next());
|
|
37
37
|
});
|
|
38
|
-
import { ActiveSelection as
|
|
39
|
-
import { create as
|
|
38
|
+
import { ActiveSelection as F, Textbox as at, util as ht, controlsUtils as Pe, InteractiveFabricObject as ze, Point as et, FitContentLayout as We, loadSVGFromURL as fs, FabricImage as qt, Gradient as Ue, Rect as gs, Circle as ps, Triangle as ms, Group as Rt, Color as ys, classRegistry as Fe, loadSVGFromString as vs, Canvas as bs, Pattern as Ms } from "fabric";
|
|
39
|
+
import { create as Ss } from "jsondiffpatch";
|
|
40
40
|
import ws from "diff-match-patch";
|
|
41
|
-
var
|
|
41
|
+
var As = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict", K = function() {
|
|
42
42
|
for (var t = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 21, e = "", s = crypto.getRandomValues(new Uint8Array(t |= 0)); t--; )
|
|
43
|
-
e +=
|
|
43
|
+
e += As[s[t] & 63];
|
|
44
44
|
return e;
|
|
45
45
|
};
|
|
46
|
-
|
|
46
|
+
const Ye = 300;
|
|
47
|
+
class Ee {
|
|
47
48
|
/**
|
|
48
49
|
* Конструктор принимает редактор и опции.
|
|
49
50
|
* @param params
|
|
@@ -61,7 +62,7 @@ class Kt {
|
|
|
61
62
|
* @param params.options.adaptCanvasToContainerOnResize — адаптировать канвас к размерам контейнера при изменении размеров окна
|
|
62
63
|
*/
|
|
63
64
|
constructor({ editor: t, options: e = {} }) {
|
|
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 = t, this.canvas = t.canvas, this.options = e, this.handleContainerResizeBound =
|
|
65
|
+
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 = t, this.canvas = t.canvas, this.options = e, this.handleContainerResizeBound = Ee.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 = this.handleObjectModifiedHistory.bind(this), this.handleObjectRotatingHistoryBound = this.handleObjectRotatingHistory.bind(this), this.handleObjectTransformStartBound = this.handleObjectTransformStart.bind(this), this.handleObjectTransformEndBound = this.handleObjectTransformEnd.bind(this), 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
66
|
}
|
|
66
67
|
/**
|
|
67
68
|
* Инициализация всех обработчиков согласно опциям.
|
|
@@ -79,7 +80,7 @@ class Kt {
|
|
|
79
80
|
deleteObjectsByHotkey: c,
|
|
80
81
|
resetObjectFitByDoubleClick: d
|
|
81
82
|
} = this.options;
|
|
82
|
-
e && (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 })), s && this.canvas.on("mouse:wheel", this.handleMouseWheelZoomBound), n && (this.canvas.on("selection:created", this.handleBringToFrontBound), this.canvas.on("selection:updated", this.handleBringToFrontBound)), d && this.canvas.on("mouse:dblclick", this.handleResetObjectFitBound), t && window.addEventListener("resize", this.handleContainerResizeBound, { capture: !0 }), o && document.addEventListener("keydown", this.handleCopyEventBound, { capture: !0 }), i && document.addEventListener("paste", this.handlePasteEventBound, { capture: !0 }), a && (document.addEventListener("keydown", this.handleUndoRedoEventBound, { capture: !0 }), document.addEventListener("keyup", this.handleUndoRedoKeyUpBound, { capture: !0 })), r && document.addEventListener("keydown", this.handleSelectAllEventBound, { capture: !0 }), c && 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), this.canvas.on("object:added", this.handleBackgroundUpdateBound), this.canvas.on("selection:created", this.handleBackgroundUpdateBound);
|
|
83
|
+
e && (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 })), s && this.canvas.on("mouse:wheel", this.handleMouseWheelZoomBound), n && (this.canvas.on("selection:created", this.handleBringToFrontBound), this.canvas.on("selection:updated", this.handleBringToFrontBound)), d && this.canvas.on("mouse:dblclick", this.handleResetObjectFitBound), t && window.addEventListener("resize", this.handleContainerResizeBound, { capture: !0 }), o && document.addEventListener("keydown", this.handleCopyEventBound, { capture: !0 }), i && document.addEventListener("paste", this.handlePasteEventBound, { capture: !0 }), a && (document.addEventListener("keydown", this.handleUndoRedoEventBound, { capture: !0 }), document.addEventListener("keyup", this.handleUndoRedoKeyUpBound, { capture: !0 })), r && document.addEventListener("keydown", this.handleSelectAllEventBound, { capture: !0 }), c && 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:moving", this.handleObjectTransformStartBound), this.canvas.on("object:scaling", this.handleObjectTransformStartBound), this.canvas.on("object:rotating", this.handleObjectTransformStartBound), this.canvas.on("object:skewing", this.handleObjectTransformStartBound), this.canvas.on("object:resizing", this.handleObjectTransformStartBound), this.canvas.on("object:modified", this.handleObjectTransformEndBound), 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), this.canvas.on("object:added", this.handleBackgroundUpdateBound), this.canvas.on("selection:created", this.handleBackgroundUpdateBound);
|
|
83
84
|
}
|
|
84
85
|
/**
|
|
85
86
|
* При массовом выделении объектов удаляем из него залоченные.
|
|
@@ -98,7 +99,7 @@ class Kt {
|
|
|
98
99
|
if (n.length === 1)
|
|
99
100
|
this.canvas.setActiveObject(n[0]);
|
|
100
101
|
else {
|
|
101
|
-
const i = new
|
|
102
|
+
const i = new F(n, {
|
|
102
103
|
canvas: this.canvas
|
|
103
104
|
});
|
|
104
105
|
this.canvas.setActiveObject(i);
|
|
@@ -106,7 +107,7 @@ class Kt {
|
|
|
106
107
|
this.canvas.requestRenderAll();
|
|
107
108
|
return;
|
|
108
109
|
}
|
|
109
|
-
const o = new
|
|
110
|
+
const o = new F(t, {
|
|
110
111
|
canvas: this.canvas
|
|
111
112
|
});
|
|
112
113
|
this.editor.objectLockManager.lockObject({
|
|
@@ -120,10 +121,32 @@ class Kt {
|
|
|
120
121
|
* Срабатывают при изменении объектов (перемещение, изменение размера и т.д.).
|
|
121
122
|
*/
|
|
122
123
|
handleObjectModifiedHistory() {
|
|
123
|
-
|
|
124
|
+
const { historyManager: t, textManager: e } = this.editor;
|
|
125
|
+
t.skipHistory || e.isTextEditingActive || t.scheduleSaveState({
|
|
126
|
+
delayMs: Ye,
|
|
127
|
+
reason: "object-modified"
|
|
128
|
+
});
|
|
124
129
|
}
|
|
125
130
|
handleObjectRotatingHistory() {
|
|
126
|
-
|
|
131
|
+
const { historyManager: t, textManager: e } = this.editor;
|
|
132
|
+
t.skipHistory || e.isTextEditingActive || t.scheduleSaveState({
|
|
133
|
+
delayMs: Ye,
|
|
134
|
+
reason: "object-rotating"
|
|
135
|
+
});
|
|
136
|
+
}
|
|
137
|
+
/**
|
|
138
|
+
* Фиксирует старт трансформации объекта для корректного undo.
|
|
139
|
+
* @param options - параметры события
|
|
140
|
+
* @param options.target - объект, который трансформируется
|
|
141
|
+
*/
|
|
142
|
+
handleObjectTransformStart({ target: t }) {
|
|
143
|
+
t && this.editor.historyManager.beginAction({ reason: "object-transform" });
|
|
144
|
+
}
|
|
145
|
+
/**
|
|
146
|
+
* Завершает трансформацию объекта.
|
|
147
|
+
*/
|
|
148
|
+
handleObjectTransformEnd() {
|
|
149
|
+
this.editor.historyManager.endAction({ reason: "object-transform" });
|
|
127
150
|
}
|
|
128
151
|
handleObjectAddedHistory() {
|
|
129
152
|
this.editor.historyManager.skipHistory || this.editor.textManager.isTextEditingActive || this.editor.historyManager.saveState();
|
|
@@ -175,7 +198,7 @@ class Kt {
|
|
|
175
198
|
* @param event.code — код клавиши
|
|
176
199
|
*/
|
|
177
200
|
handleUndoRedoEvent(t) {
|
|
178
|
-
return
|
|
201
|
+
return z(this, null, function* () {
|
|
179
202
|
const { ctrlKey: e, metaKey: s, code: n, repeat: o } = t;
|
|
180
203
|
this._shouldIgnoreKeyboardEvent(t) || !e && !s || o || !/Mac/i.test(navigator.userAgent) && this.isUndoRedoKeyPressed || (n === "KeyZ" ? (t.preventDefault(), this.isUndoRedoKeyPressed = !0, yield this.editor.historyManager.undo()) : n === "KeyY" && (t.preventDefault(), this.isUndoRedoKeyPressed = !0, yield this.editor.historyManager.redo()));
|
|
181
204
|
});
|
|
@@ -225,7 +248,7 @@ class Kt {
|
|
|
225
248
|
if (o || i) return;
|
|
226
249
|
n.historyManager.skipHistory || n.historyManager.saveState(), n.historyManager.suspendHistory(), this.isSpacePressed = !0, t.preventDefault();
|
|
227
250
|
const a = s.getActiveObject() || null;
|
|
228
|
-
a instanceof
|
|
251
|
+
a instanceof F ? this.savedSelection = a.getObjects().slice() : a && (this.savedSelection = [a]), s.discardActiveObject(), s.set({
|
|
229
252
|
selection: !1,
|
|
230
253
|
defaultCursor: "grab"
|
|
231
254
|
}), s.setCursor("grab"), n.canvasManager.getObjects().forEach((r) => {
|
|
@@ -265,7 +288,7 @@ class Kt {
|
|
|
265
288
|
e.setActiveObject(t[0]);
|
|
266
289
|
return;
|
|
267
290
|
}
|
|
268
|
-
const n = t.filter((i) => s.canvasManager.getObjects().includes(i)), o = new
|
|
291
|
+
const n = t.filter((i) => s.canvasManager.getObjects().includes(i)), o = new F(n, { canvas: e });
|
|
269
292
|
n.some((i) => i.locked) && s.objectLockManager.lockObject({
|
|
270
293
|
object: o,
|
|
271
294
|
skipInnerObjects: !0,
|
|
@@ -347,7 +370,7 @@ class Kt {
|
|
|
347
370
|
*/
|
|
348
371
|
handleResetObjectFit(t) {
|
|
349
372
|
const e = t == null ? void 0 : t.target;
|
|
350
|
-
!e || e instanceof
|
|
373
|
+
!e || e instanceof at || this.editor.transformManager.resetObject({ object: e });
|
|
351
374
|
}
|
|
352
375
|
/**
|
|
353
376
|
* Проверяет, должно ли событие клавиатуры быть проигнорировано
|
|
@@ -391,7 +414,7 @@ class Kt {
|
|
|
391
414
|
* Метод для удаления всех слушателей
|
|
392
415
|
*/
|
|
393
416
|
destroy() {
|
|
394
|
-
window.removeEventListener("resize", this.handleContainerResizeBound, { capture: !0 }), document.removeEventListener("keydown", this.handleCopyEventBound, { capture: !0 }), document.removeEventListener("paste", this.handlePasteEventBound, { capture: !0 }), document.removeEventListener("keydown", this.handleUndoRedoEventBound, { capture: !0 }), document.removeEventListener("keyup", this.handleUndoRedoKeyUpBound, { capture: !0 }), document.removeEventListener("keydown", this.handleSelectAllEventBound, { capture: !0 }), document.removeEventListener("keydown", this.handleDeleteObjectsEventBound, { capture: !0 }), this.options.canvasDragging && (this.canvas.off("mouse:down", this.handleCanvasDragStartBound), this.canvas.off("mouse:move", this.handleCanvasDraggingBound), this.canvas.off("mouse:up", this.handleCanvasDragEndBound), document.removeEventListener("keydown", this.handleSpaceKeyDownBound, { capture: !0 }), document.removeEventListener("keyup", this.handleSpaceKeyUpBound, { capture: !0 })), this.options.mouseWheelZooming && this.canvas.off("mouse:wheel", this.handleMouseWheelZoomBound), this.options.bringToFrontOnSelection && (this.canvas.off("selection:created", this.handleBringToFrontBound), this.canvas.off("selection:updated", this.handleBringToFrontBound)), this.options.resetObjectFitByDoubleClick && this.canvas.off("mouse:dblclick", this.handleResetObjectFitBound), this.canvas.off("object:modified", this.handleObjectModifiedHistoryBound), this.canvas.off("object:rotating", this.handleObjectRotatingHistoryBound), this.canvas.off("object:added", this.handleObjectAddedHistoryBound), this.canvas.off("object:removed", this.handleObjectRemovedHistoryBound), this.canvas.off("object:added", this.handleOverlayUpdateBound), this.canvas.off("selection:created", this.handleOverlayUpdateBound), this.canvas.off("object:added", this.handleBackgroundUpdateBound), this.canvas.off("selection:created", this.handleBackgroundUpdateBound), this.canvas.off("selection:created", this.handleLockedSelectionBound), this.canvas.off("selection:updated", this.handleLockedSelectionBound);
|
|
417
|
+
window.removeEventListener("resize", this.handleContainerResizeBound, { capture: !0 }), document.removeEventListener("keydown", this.handleCopyEventBound, { capture: !0 }), document.removeEventListener("paste", this.handlePasteEventBound, { capture: !0 }), document.removeEventListener("keydown", this.handleUndoRedoEventBound, { capture: !0 }), document.removeEventListener("keyup", this.handleUndoRedoKeyUpBound, { capture: !0 }), document.removeEventListener("keydown", this.handleSelectAllEventBound, { capture: !0 }), document.removeEventListener("keydown", this.handleDeleteObjectsEventBound, { capture: !0 }), this.options.canvasDragging && (this.canvas.off("mouse:down", this.handleCanvasDragStartBound), this.canvas.off("mouse:move", this.handleCanvasDraggingBound), this.canvas.off("mouse:up", this.handleCanvasDragEndBound), document.removeEventListener("keydown", this.handleSpaceKeyDownBound, { capture: !0 }), document.removeEventListener("keyup", this.handleSpaceKeyUpBound, { capture: !0 })), this.options.mouseWheelZooming && this.canvas.off("mouse:wheel", this.handleMouseWheelZoomBound), this.options.bringToFrontOnSelection && (this.canvas.off("selection:created", this.handleBringToFrontBound), this.canvas.off("selection:updated", this.handleBringToFrontBound)), this.options.resetObjectFitByDoubleClick && this.canvas.off("mouse:dblclick", this.handleResetObjectFitBound), this.canvas.off("object:modified", this.handleObjectModifiedHistoryBound), this.canvas.off("object:rotating", this.handleObjectRotatingHistoryBound), this.canvas.off("object:added", this.handleObjectAddedHistoryBound), this.canvas.off("object:removed", this.handleObjectRemovedHistoryBound), this.canvas.off("object:moving", this.handleObjectTransformStartBound), this.canvas.off("object:scaling", this.handleObjectTransformStartBound), this.canvas.off("object:rotating", this.handleObjectTransformStartBound), this.canvas.off("object:skewing", this.handleObjectTransformStartBound), this.canvas.off("object:resizing", this.handleObjectTransformStartBound), this.canvas.off("object:modified", this.handleObjectTransformEndBound), this.canvas.off("object:added", this.handleOverlayUpdateBound), this.canvas.off("selection:created", this.handleOverlayUpdateBound), this.canvas.off("object:added", this.handleBackgroundUpdateBound), this.canvas.off("selection:created", this.handleBackgroundUpdateBound), this.canvas.off("selection:created", this.handleLockedSelectionBound), this.canvas.off("selection:updated", this.handleLockedSelectionBound);
|
|
395
418
|
}
|
|
396
419
|
/**
|
|
397
420
|
* Дебаунс для снижения частоты вызова функции.
|
|
@@ -408,7 +431,7 @@ class Kt {
|
|
|
408
431
|
};
|
|
409
432
|
}
|
|
410
433
|
}
|
|
411
|
-
class
|
|
434
|
+
class js {
|
|
412
435
|
/**
|
|
413
436
|
* Класс для динамической загрузки внешних модулей.
|
|
414
437
|
*/
|
|
@@ -426,7 +449,7 @@ class As {
|
|
|
426
449
|
return this.loaders[t] ? (this.cache.has(t) || this.cache.set(t, this.loaders[t]()), this.cache.get(t)) : Promise.reject(new Error(`Unknown module "${t}"`));
|
|
427
450
|
}
|
|
428
451
|
}
|
|
429
|
-
function
|
|
452
|
+
function Is(h) {
|
|
430
453
|
return new Worker(
|
|
431
454
|
"" + new URL("assets/worker-CN39s7P7.js", import.meta.url).href,
|
|
432
455
|
{
|
|
@@ -440,7 +463,7 @@ class Cs {
|
|
|
440
463
|
* По-умолчанию использует DefaultWorker из соседнего файла
|
|
441
464
|
*/
|
|
442
465
|
constructor(t) {
|
|
443
|
-
t ? this.worker = new Worker(t, { type: "module" }) : this.worker = new
|
|
466
|
+
t ? this.worker = new Worker(t, { type: "module" }) : this.worker = new Is(), this._callbacks = /* @__PURE__ */ new Map(), this.worker.onmessage = this._handleMessage.bind(this);
|
|
444
467
|
}
|
|
445
468
|
/**
|
|
446
469
|
* Обработчик сообщений от воркера
|
|
@@ -468,7 +491,7 @@ class Cs {
|
|
|
468
491
|
* @returns Promise, который будет выполнен, когда воркер вернет ответ
|
|
469
492
|
*/
|
|
470
493
|
post(t, e, s = []) {
|
|
471
|
-
const n = `${t}:${
|
|
494
|
+
const n = `${t}:${K(8)}`;
|
|
472
495
|
return new Promise((o, i) => {
|
|
473
496
|
this._callbacks.set(n, { resolve: o, reject: i }), this.worker.postMessage({ action: t, payload: e, requestId: n }, s);
|
|
474
497
|
});
|
|
@@ -480,95 +503,95 @@ class Cs {
|
|
|
480
503
|
this.worker.terminate();
|
|
481
504
|
}
|
|
482
505
|
}
|
|
483
|
-
const
|
|
484
|
-
function
|
|
485
|
-
const o =
|
|
486
|
-
h.save(), h.translate(t, e), h.rotate(
|
|
506
|
+
const dt = 12, Ts = 2, Me = 8, Se = 20, Es = 100, we = 20, Ae = 8, Os = 100, he = 32, Oe = 1, Ls = "#2B2D33", Le = "#3D8BF4", De = "#FFFFFF";
|
|
507
|
+
function ae(h, t, e, s, n) {
|
|
508
|
+
const o = dt, i = Ts;
|
|
509
|
+
h.save(), h.translate(t, e), h.rotate(ht.degreesToRadians(n.angle)), h.fillStyle = De, h.strokeStyle = Le, h.lineWidth = Oe, h.beginPath(), h.roundRect(-o / 2, -o / 2, o, o, i), h.fill(), h.stroke(), h.restore();
|
|
487
510
|
}
|
|
488
|
-
function
|
|
489
|
-
const o =
|
|
490
|
-
h.save(), h.translate(t, e), h.rotate(
|
|
511
|
+
function He(h, t, e, s, n) {
|
|
512
|
+
const o = Me, i = Se, a = Es;
|
|
513
|
+
h.save(), h.translate(t, e), h.rotate(ht.degreesToRadians(n.angle)), h.fillStyle = De, h.strokeStyle = Le, h.lineWidth = Oe, h.beginPath(), h.roundRect(-o / 2, -i / 2, o, i, a), h.fill(), h.stroke(), h.restore();
|
|
491
514
|
}
|
|
492
|
-
function
|
|
493
|
-
const o =
|
|
494
|
-
h.save(), h.translate(t, e), h.rotate(
|
|
515
|
+
function Ze(h, t, e, s, n) {
|
|
516
|
+
const o = we, i = Ae, a = Os;
|
|
517
|
+
h.save(), h.translate(t, e), h.rotate(ht.degreesToRadians(n.angle)), h.fillStyle = De, h.strokeStyle = Le, h.lineWidth = Oe, h.beginPath(), h.roundRect(-o / 2, -i / 2, o, i, a), h.fill(), h.stroke(), h.restore();
|
|
495
518
|
}
|
|
496
|
-
const
|
|
497
|
-
|
|
498
|
-
function
|
|
499
|
-
const i =
|
|
500
|
-
h.save(), h.translate(t, e), h.rotate(
|
|
519
|
+
const Ds = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE4Ljc1IDQuMzc1djMuNzVhLjYyNS42MjUgMCAwIDEtLjYyNS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDEgMC0xLjI1aDIuMTRsLTIuMDc3LTEuOTAzLS4wMi0uMDE5YTYuMjUgNi4yNSAwIDEgMC0uMTMgOC45NjcuNjI2LjYyNiAwIDAgMSAuODYuOTA5QTcuNDU2IDcuNDU2IDAgMCAxIDEwIDE3LjVoLS4xMDNhNy41IDcuNSAwIDEgMSA1LjM5Ni0xMi44MTJMMTcuNSA2LjcwM1Y0LjM3NWEuNjI1LjYyNSAwIDAgMSAxLjI1IDBaIi8+PC9zdmc+", is = new Image();
|
|
520
|
+
is.src = Ds;
|
|
521
|
+
function _s(h, t, e, s, n) {
|
|
522
|
+
const i = he / 2;
|
|
523
|
+
h.save(), h.translate(t, e), h.rotate(ht.degreesToRadians(n.angle)), h.fillStyle = Ls, h.beginPath(), h.arc(0, 0, i, 0, 2 * Math.PI), h.fill(), h.drawImage(is, -i / 2, -i / 2, i, i), h.restore();
|
|
501
524
|
}
|
|
502
525
|
const Rs = {
|
|
503
526
|
// Угловые точки
|
|
504
527
|
tl: {
|
|
505
|
-
render:
|
|
506
|
-
sizeX:
|
|
507
|
-
sizeY:
|
|
528
|
+
render: ae,
|
|
529
|
+
sizeX: dt,
|
|
530
|
+
sizeY: dt,
|
|
508
531
|
offsetX: 0,
|
|
509
532
|
offsetY: 0
|
|
510
533
|
},
|
|
511
534
|
tr: {
|
|
512
|
-
render:
|
|
513
|
-
sizeX:
|
|
514
|
-
sizeY:
|
|
535
|
+
render: ae,
|
|
536
|
+
sizeX: dt,
|
|
537
|
+
sizeY: dt,
|
|
515
538
|
offsetX: 0,
|
|
516
539
|
offsetY: 0
|
|
517
540
|
},
|
|
518
541
|
bl: {
|
|
519
|
-
render:
|
|
520
|
-
sizeX:
|
|
521
|
-
sizeY:
|
|
542
|
+
render: ae,
|
|
543
|
+
sizeX: dt,
|
|
544
|
+
sizeY: dt,
|
|
522
545
|
offsetX: 0,
|
|
523
546
|
offsetY: 0
|
|
524
547
|
},
|
|
525
548
|
br: {
|
|
526
|
-
render:
|
|
527
|
-
sizeX:
|
|
528
|
-
sizeY:
|
|
549
|
+
render: ae,
|
|
550
|
+
sizeX: dt,
|
|
551
|
+
sizeY: dt,
|
|
529
552
|
offsetX: 0,
|
|
530
553
|
offsetY: 0
|
|
531
554
|
},
|
|
532
555
|
// Середина вертикалей
|
|
533
556
|
ml: {
|
|
534
|
-
render:
|
|
535
|
-
sizeX:
|
|
536
|
-
sizeY:
|
|
557
|
+
render: He,
|
|
558
|
+
sizeX: Me,
|
|
559
|
+
sizeY: Se,
|
|
537
560
|
offsetX: 0,
|
|
538
561
|
offsetY: 0
|
|
539
562
|
},
|
|
540
563
|
mr: {
|
|
541
|
-
render:
|
|
542
|
-
sizeX:
|
|
543
|
-
sizeY:
|
|
564
|
+
render: He,
|
|
565
|
+
sizeX: Me,
|
|
566
|
+
sizeY: Se,
|
|
544
567
|
offsetX: 0,
|
|
545
568
|
offsetY: 0
|
|
546
569
|
},
|
|
547
570
|
// Середина горизонталей
|
|
548
571
|
mt: {
|
|
549
|
-
render:
|
|
550
|
-
sizeX:
|
|
551
|
-
sizeY:
|
|
572
|
+
render: Ze,
|
|
573
|
+
sizeX: we,
|
|
574
|
+
sizeY: Ae,
|
|
552
575
|
offsetX: 0,
|
|
553
576
|
offsetY: 0
|
|
554
577
|
},
|
|
555
578
|
mb: {
|
|
556
|
-
render:
|
|
557
|
-
sizeX:
|
|
558
|
-
sizeY:
|
|
579
|
+
render: Ze,
|
|
580
|
+
sizeX: we,
|
|
581
|
+
sizeY: Ae,
|
|
559
582
|
offsetX: 0,
|
|
560
583
|
offsetY: 0
|
|
561
584
|
},
|
|
562
585
|
// Специальный «rotate» контрол
|
|
563
586
|
mtr: {
|
|
564
|
-
render:
|
|
565
|
-
sizeX:
|
|
566
|
-
sizeY:
|
|
587
|
+
render: _s,
|
|
588
|
+
sizeX: he,
|
|
589
|
+
sizeY: he,
|
|
567
590
|
offsetX: 0,
|
|
568
|
-
offsetY: -
|
|
591
|
+
offsetY: -he
|
|
569
592
|
}
|
|
570
593
|
};
|
|
571
|
-
class
|
|
594
|
+
class ot {
|
|
572
595
|
/**
|
|
573
596
|
* Отключает изменение ширины по оси X для заблокированных объектов, сохраняя поведение остального хэндлера.
|
|
574
597
|
*/
|
|
@@ -597,24 +620,24 @@ class st {
|
|
|
597
620
|
* Регистрирует контролы и настройки поведения выделений.
|
|
598
621
|
*/
|
|
599
622
|
static apply() {
|
|
600
|
-
const t =
|
|
601
|
-
|
|
602
|
-
const e =
|
|
603
|
-
|
|
623
|
+
const t = Pe.createObjectDefaultControls();
|
|
624
|
+
ot.applyControlOverrides(t), ze.ownDefaults.controls = t;
|
|
625
|
+
const e = Pe.createTextboxDefaultControls();
|
|
626
|
+
ot.applyControlOverrides(e), e.mt && (e.mt.visible = !1), e.mb && (e.mb.visible = !1), ot.wrapWidthControl(e.ml), ot.wrapWidthControl(e.mr), at.ownDefaults.controls = e, ot.patchActiveSelectionBounds(), ze.ownDefaults.snapAngle = 1;
|
|
604
627
|
}
|
|
605
628
|
/**
|
|
606
629
|
* Обновляет алгоритм расчёта границ ActiveSelection, чтобы учитывать фон и отступы текстовых объектов.
|
|
607
630
|
*/
|
|
608
631
|
static patchActiveSelectionBounds() {
|
|
609
|
-
const t =
|
|
632
|
+
const t = F.prototype, e = t._calcBoundsFromObjects;
|
|
610
633
|
t._calcBoundsFromObjects = function(...o) {
|
|
611
634
|
var f, g;
|
|
612
635
|
const i = (g = (f = this.getObjects) == null ? void 0 : f.call(this)) != null ? g : [];
|
|
613
|
-
|
|
636
|
+
ot.applyTextSelectionScalingLock({
|
|
614
637
|
selection: this,
|
|
615
638
|
objects: i
|
|
616
639
|
});
|
|
617
|
-
const a =
|
|
640
|
+
const a = ot.calculateActiveSelectionBounds({
|
|
618
641
|
objects: i
|
|
619
642
|
});
|
|
620
643
|
if (!a)
|
|
@@ -633,11 +656,11 @@ class st {
|
|
|
633
656
|
t._onAfterObjectsChange = function(o, i) {
|
|
634
657
|
var p, m;
|
|
635
658
|
const a = s ? s.call(this, o, i) : void 0, r = (m = (p = this.getObjects) == null ? void 0 : p.call(this)) != null ? m : [];
|
|
636
|
-
|
|
659
|
+
ot.applyTextSelectionScalingLock({
|
|
637
660
|
selection: this,
|
|
638
661
|
objects: r
|
|
639
662
|
});
|
|
640
|
-
const c =
|
|
663
|
+
const c = ot.calculateActiveSelectionBounds({
|
|
641
664
|
objects: r
|
|
642
665
|
});
|
|
643
666
|
if (!c) return a;
|
|
@@ -647,18 +670,18 @@ class st {
|
|
|
647
670
|
height: f
|
|
648
671
|
}), this.setPositionByOrigin(g, "center", "center"), this.setCoords(), a;
|
|
649
672
|
};
|
|
650
|
-
const n =
|
|
651
|
-
|
|
673
|
+
const n = We.prototype.calcBoundingBox;
|
|
674
|
+
We.prototype.calcBoundingBox = function(o, i) {
|
|
652
675
|
const { target: a, type: r, overrides: c } = i;
|
|
653
676
|
if (r === "imperative" && c)
|
|
654
677
|
return c;
|
|
655
|
-
if (!(a instanceof
|
|
678
|
+
if (!(a instanceof F))
|
|
656
679
|
return n.call(this, o, i);
|
|
657
|
-
|
|
680
|
+
ot.applyTextSelectionScalingLock({
|
|
658
681
|
selection: a,
|
|
659
682
|
objects: o
|
|
660
683
|
});
|
|
661
|
-
const d =
|
|
684
|
+
const d = ot.calculateActiveSelectionBounds({ objects: o });
|
|
662
685
|
if (!d)
|
|
663
686
|
return n.call(this, o, i);
|
|
664
687
|
const { left: l, top: u, width: f, height: g } = d, p = new et(f, g), m = new et(l + f / 2, u + g / 2);
|
|
@@ -694,7 +717,7 @@ class st {
|
|
|
694
717
|
selection: t,
|
|
695
718
|
objects: e
|
|
696
719
|
}) {
|
|
697
|
-
const s = e.some((n) => n instanceof
|
|
720
|
+
const s = e.some((n) => n instanceof at);
|
|
698
721
|
t.setControlsVisibility({
|
|
699
722
|
mt: !s,
|
|
700
723
|
mb: !s,
|
|
@@ -703,7 +726,7 @@ class st {
|
|
|
703
726
|
});
|
|
704
727
|
}
|
|
705
728
|
}
|
|
706
|
-
const
|
|
729
|
+
const U = class U {
|
|
707
730
|
constructor(t = []) {
|
|
708
731
|
this.fonts = t;
|
|
709
732
|
}
|
|
@@ -711,36 +734,36 @@ const W = class W {
|
|
|
711
734
|
this.fonts = t;
|
|
712
735
|
}
|
|
713
736
|
loadFonts() {
|
|
714
|
-
return
|
|
737
|
+
return z(this, null, function* () {
|
|
715
738
|
var n;
|
|
716
739
|
const t = (n = this.fonts) != null ? n : [];
|
|
717
740
|
if (!t.length) return;
|
|
718
741
|
const e = typeof document != "undefined" ? document : void 0;
|
|
719
742
|
if (!e) return;
|
|
720
|
-
const s = t.map((o) =>
|
|
743
|
+
const s = t.map((o) => U.loadFont(o, e));
|
|
721
744
|
yield Promise.allSettled(s);
|
|
722
745
|
});
|
|
723
746
|
}
|
|
724
747
|
static loadFont(t, e) {
|
|
725
|
-
return
|
|
748
|
+
return z(this, null, function* () {
|
|
726
749
|
var c, d;
|
|
727
750
|
const s = typeof FontFace != "undefined", n = (c = t.family) == null ? void 0 : c.trim(), o = (d = t.source) == null ? void 0 : d.trim();
|
|
728
751
|
if (!n || !o) return;
|
|
729
|
-
const i =
|
|
730
|
-
if (!
|
|
731
|
-
if (
|
|
732
|
-
|
|
752
|
+
const i = U.normalizeFontSource(o), a = U.getDescriptorSnapshot(t.descriptors), r = U.getFontRegistrationKey(n, i, a);
|
|
753
|
+
if (!U.registeredFontKeys.has(r)) {
|
|
754
|
+
if (U.isFontFaceAlreadyApplied(e, n, a)) {
|
|
755
|
+
U.registeredFontKeys.add(r);
|
|
733
756
|
return;
|
|
734
757
|
}
|
|
735
758
|
if (s && e.fonts && typeof e.fonts.add == "function")
|
|
736
759
|
try {
|
|
737
760
|
const u = yield new FontFace(n, i, t.descriptors).load();
|
|
738
|
-
e.fonts.add(u),
|
|
761
|
+
e.fonts.add(u), U.registeredFontKeys.add(r);
|
|
739
762
|
return;
|
|
740
763
|
} catch (l) {
|
|
741
764
|
console.warn(`Не удалось загрузить шрифт "${n}" через FontFace API`, l);
|
|
742
765
|
}
|
|
743
|
-
|
|
766
|
+
U.injectFontFace({
|
|
744
767
|
font: t,
|
|
745
768
|
source: i,
|
|
746
769
|
doc: e,
|
|
@@ -760,15 +783,15 @@ const W = class W {
|
|
|
760
783
|
if (!i) return;
|
|
761
784
|
const a = s.createElement("style");
|
|
762
785
|
a.setAttribute("data-editor-font", i), a.setAttribute("data-editor-font-key", n);
|
|
763
|
-
const r =
|
|
786
|
+
const r = U.descriptorsToCss(o), c = [
|
|
764
787
|
"@font-face {",
|
|
765
|
-
` font-family: ${
|
|
788
|
+
` font-family: ${U.formatFontFamilyForCss(i)};`,
|
|
766
789
|
` src: ${e};`,
|
|
767
790
|
...r.map((l) => ` ${l}`),
|
|
768
791
|
"}"
|
|
769
792
|
];
|
|
770
793
|
a.textContent = c.join(`
|
|
771
|
-
`), s.head.appendChild(a),
|
|
794
|
+
`), s.head.appendChild(a), U.registeredFontKeys.add(n);
|
|
772
795
|
}
|
|
773
796
|
static normalizeFontSource(t) {
|
|
774
797
|
const e = t.trim();
|
|
@@ -791,15 +814,15 @@ const W = class W {
|
|
|
791
814
|
return t ? t.trim().replace(/^['"]+|['"]+$/g, "").toLowerCase() : "";
|
|
792
815
|
}
|
|
793
816
|
static getDescriptorSnapshot(t) {
|
|
794
|
-
const e =
|
|
817
|
+
const e = U.descriptorDefaults;
|
|
795
818
|
return {
|
|
796
|
-
style:
|
|
797
|
-
weight:
|
|
798
|
-
stretch:
|
|
799
|
-
unicodeRange:
|
|
800
|
-
variant:
|
|
801
|
-
featureSettings:
|
|
802
|
-
display:
|
|
819
|
+
style: U.normalizeDescriptorValue(t == null ? void 0 : t.style, e.style),
|
|
820
|
+
weight: U.normalizeDescriptorValue(t == null ? void 0 : t.weight, e.weight),
|
|
821
|
+
stretch: U.normalizeDescriptorValue(t == null ? void 0 : t.stretch, e.stretch),
|
|
822
|
+
unicodeRange: U.normalizeDescriptorValue(t == null ? void 0 : t.unicodeRange, e.unicodeRange),
|
|
823
|
+
variant: U.normalizeDescriptorValue(t == null ? void 0 : t.variant, e.variant),
|
|
824
|
+
featureSettings: U.normalizeDescriptorValue(t == null ? void 0 : t.featureSettings, e.featureSettings),
|
|
825
|
+
display: U.normalizeDescriptorValue(t == null ? void 0 : t.display, e.display)
|
|
803
826
|
};
|
|
804
827
|
}
|
|
805
828
|
static areDescriptorSnapshotsEqual(t, e) {
|
|
@@ -807,7 +830,7 @@ const W = class W {
|
|
|
807
830
|
}
|
|
808
831
|
static getFontRegistrationKey(t, e, s) {
|
|
809
832
|
return [
|
|
810
|
-
|
|
833
|
+
U.normalizeFamilyName(t),
|
|
811
834
|
e,
|
|
812
835
|
s.style,
|
|
813
836
|
s.weight,
|
|
@@ -821,12 +844,12 @@ const W = class W {
|
|
|
821
844
|
static isFontFaceAlreadyApplied(t, e, s) {
|
|
822
845
|
const n = t.fonts;
|
|
823
846
|
if (!n || typeof n.forEach != "function") return !1;
|
|
824
|
-
const o =
|
|
847
|
+
const o = U.normalizeFamilyName(e);
|
|
825
848
|
let i = !1;
|
|
826
849
|
try {
|
|
827
850
|
n.forEach((a) => {
|
|
828
|
-
if (i ||
|
|
829
|
-
const c =
|
|
851
|
+
if (i || U.normalizeFamilyName(a.family) !== o) return;
|
|
852
|
+
const c = U.getDescriptorSnapshot({
|
|
830
853
|
style: a.style,
|
|
831
854
|
weight: a.weight,
|
|
832
855
|
stretch: a.stretch,
|
|
@@ -835,7 +858,7 @@ const W = class W {
|
|
|
835
858
|
featureSettings: a.featureSettings,
|
|
836
859
|
display: a.display
|
|
837
860
|
});
|
|
838
|
-
|
|
861
|
+
U.areDescriptorSnapshotsEqual(s, c) && (i = !0);
|
|
839
862
|
});
|
|
840
863
|
} catch (a) {
|
|
841
864
|
return console.warn("Не удалось проверить, загружен ли шрифт ранее через FontFaceSet", a), !1;
|
|
@@ -862,7 +885,7 @@ const W = class W {
|
|
|
862
885
|
});
|
|
863
886
|
}
|
|
864
887
|
};
|
|
865
|
-
|
|
888
|
+
U.registeredFontKeys = /* @__PURE__ */ new Set(), U.descriptorDefaults = {
|
|
866
889
|
style: "normal",
|
|
867
890
|
weight: "normal",
|
|
868
891
|
stretch: "normal",
|
|
@@ -871,8 +894,8 @@ W.registeredFontKeys = /* @__PURE__ */ new Set(), W.descriptorDefaults = {
|
|
|
871
894
|
featureSettings: "normal",
|
|
872
895
|
display: "auto"
|
|
873
896
|
};
|
|
874
|
-
let
|
|
875
|
-
const
|
|
897
|
+
let je = U;
|
|
898
|
+
const xs = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNi44NzUgMi41YS42MjUuNjI1IDAgMCAwLS42MjUuNjI0VjYuMjVIMy4xMjVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2MTBjMCAuMzQ1LjI4LjYyNS42MjUuNjI1aDEwYy4zNDUgMCAuNjI1LS4yOC42MjUtLjYyNXYtMy4xMjZoMy4xMjVjLjM0NSAwIC42MjUtLjI4LjYyNS0uNjI1di0xMGEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTEwWm02Ljg3NSAxMGgyLjVWMy43NUg3LjV2Mi41aDUuNjI1Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NS42MjRabS0xMCAzLjc1VjcuNWg4Ljc1djguNzVIMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", Bs = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMi41IDcuNWMwLS42OS41Ni0xLjI1IDEuMjUtMS4yNWgxMi41Yy42OSAwIDEuMjUuNTYgMS4yNSAxLjI1djguNzVjMCAuNjktLjU2IDEuMjUtMS4yNSAxLjI1SDMuNzVjLS42OSAwLTEuMjUtLjU2LTEuMjUtMS4yNVY3LjVabTEzLjc1IDBIMy43NXY4Ljc1aDEyLjVWNy41WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTAgMS44NzVhMi4xODggMi4xODggMCAwIDAtMi4xODggMi4xODh2Mi44MTJhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyYTMuNDM3IDMuNDM3IDAgMSAxIDYuODc1IDB2Mi44MTNhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyQTIuMTg4IDIuMTg4IDAgMCAwIDEwIDEuODc2WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTEwIDEyLjgxM2EuOTM3LjkzNyAwIDEgMCAwLTEuODc1LjkzNy45MzcgMCAwIDAgMCAxLjg3NFoiLz48L3N2Zz4=", Ns = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE2LjI1IDYuMjVINy41VjQuMzc1YTIuNSAyLjUgMCAwIDEgMi41LTIuNWMxLjIgMCAyLjI4MS44NiAyLjUxMiAyYS42MjUuNjI1IDAgMCAwIDEuMjI2LS4yNWMtLjM1NC0xLjczOC0xLjkyNS0zLTMuNzM4LTNhMy43NTQgMy43NTQgMCAwIDAtMy43NSAzLjc1VjYuMjVoLTIuNUExLjI1IDEuMjUgMCAwIDAgMi41IDcuNXY4Ljc1YTEuMjUgMS4yNSAwIDAgMCAxLjI1IDEuMjVoMTIuNWExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjcuNWExLjI1IDEuMjUgMCAwIDAtMS4yNS0xLjI1Wm0wIDEwSDMuNzVWNy41aDEyLjV2OC43NVptLTUuMzEzLTQuMzc1YS45MzcuOTM3IDAgMSAxLTEuODc0IDAgLjkzNy45MzcgMCAwIDEgMS44NzQgMFoiLz48L3N2Zz4K", ks = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTIuNSA4LjEyNSAxMCAxMi41bDcuNS00LjM3NUwxMCAzLjc1IDIuNSA4LjEyNVoiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjY4NSAzLjIxYS42MjUuNjI1IDAgMCAxIC42MyAwbDcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOGw3LjUtNC4zNzVaTTMuNzQgOC4xMjUgMTAgMTEuNzc2bDYuMjYtMy42NTFMMTAgNC40NzQgMy43NCA4LjEyNVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA5LjQ2YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDExLjc3NmwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA5LjQ2Wm0tMS42NiAyLjQxNUwxMCAxNS41MjZsNi4yNi0zLjY1MS0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNi0xLjk3NSAxLjE1MVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", Ps = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMy4yMWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDguMTI1IDEwIDExLjc3Nmw2LjI2LTMuNjUxTDEwIDQuNDc0IDMuNzQgOC4xMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjcxNCAxMCAxMCAxMi41bDQuMjg2LTIuNSAzLjIxNCAxLjg3NUwxMCAxNi4yNWwtNy41LTQuMzc1TDUuNzE0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDkuNDZhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgMTEuNzc2bDMuOTctMi4zMTZhLjYyNS42MjUgMCAwIDEgLjYzIDBsMy4yMTUgMS44NzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhMNS40IDkuNDZabS0xLjY2IDIuNDE1TDEwIDE1LjUyNmw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2LTEuOTc1IDEuMTUxWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", zs = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0ibTIuNSA2LjI1IDcuNSA0LjM3NSA3LjUtNC4zNzVMMTAgMS44NzUgMi41IDYuMjVaIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMS4zMzVhLjYyNS42MjUgMCAwIDEgLjYzIDBsNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4bDcuNS00LjM3NVpNMy43NCA2LjI1IDEwIDkuOTAxbDYuMjYtMy42NTFMMTAgMi41OTkgMy43NCA2LjI1WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDExLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCAxMy42NTFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgMTEuMzM1Wk0zLjc0IDEzLjc1IDEwIDE3LjQwMWw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTMuNzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgNy41ODVhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgOS45MDFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgNy41ODVaTTMuNzQgMTAgMTAgMTMuNjUxIDE2LjI2IDEwbC0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNkwzLjc0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", Ws = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMS45NiAxMy40MzVhLjYyNS42MjUgMCAwIDEgLjg1NS0uMjI1TDEwIDE3LjQwMWw3LjE4NS00LjE5YS42MjUuNjI1IDAgMCAxIC42MyAxLjA3OWwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEtLjIyNS0uODU1Wk05LjY4NSAxLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDYuMjUgMTAgOS45MDFsNi4yNi0zLjY1MUwxMCAyLjU5OSAzLjc0IDYuMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Im01LjcxNCAxMS44NzUgNC4yODYgMi41IDQuMjg2LTIuNUwxNy41IDEzLjc1IDEwIDE4LjEyNSAyLjUgMTMuNzVsMy4yMTQtMS44NzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgMTEuMzM1YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDEzLjY1MWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCAxMS4zMzVaTTMuNzQgMTMuNzUgMTAgMTcuNDAxbDYuMjYtMy42NTEtMS45NzQtMS4xNTEtMy45NzEgMi4zMTZhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTMuOTctMi4zMTZMMy43NCAxMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA3LjU4NWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCA5LjkwMWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA3LjU4NVpNMy43NCAxMCAxMCAxMy42NTEgMTYuMjYgMTBsLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTBaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=", Us = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI0VDNEU0MCIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOC4xMjUgMS4yNUExLjg3NSAxLjg3NSAwIDAgMCA2LjI1IDMuMTI1di42MjVIMy4xMjVhLjYyNS42MjUgMCAwIDAgMCAxLjI1aC42MjV2MTEuMjVBMS4yNSAxLjI1IDAgMCAwIDUgMTcuNWgxMGExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjVoLjYyNWEuNjI1LjYyNSAwIDAgMCAwLTEuMjVIMTMuNzV2LS42MjVhMS44NzUgMS44NzUgMCAwIDAtMS44NzUtMS44NzVoLTMuNzVabTQuMzc1IDIuNXYtLjYyNWEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2LjYyNWg1Wk01IDE2LjI1VjVoMTB2MTEuMjVINVpNOC4xMjUgNy41Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NWEuNjI1LjYyNSAwIDEgMS0xLjI1IDB2LTVjMC0uMzQ1LjI4LS42MjUuNjI1LS42MjVabTQuMzc1IDUuNjI1di01YS42MjUuNjI1IDAgMCAwLTEuMjUgMHY1YS42MjUuNjI1IDAgMSAwIDEuMjUgMFoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", Jt = {
|
|
876
899
|
style: {
|
|
877
900
|
position: "absolute",
|
|
878
901
|
display: "none",
|
|
@@ -939,17 +962,17 @@ const _s = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMj
|
|
|
939
962
|
],
|
|
940
963
|
offsetTop: 50,
|
|
941
964
|
icons: {
|
|
942
|
-
copyPaste:
|
|
943
|
-
delete:
|
|
944
|
-
lock:
|
|
965
|
+
copyPaste: xs,
|
|
966
|
+
delete: Us,
|
|
967
|
+
lock: Bs,
|
|
945
968
|
unlock: Ns,
|
|
946
969
|
bringToFront: zs,
|
|
947
|
-
sendToBack:
|
|
948
|
-
bringForward:
|
|
949
|
-
sendBackwards:
|
|
970
|
+
sendToBack: Ws,
|
|
971
|
+
bringForward: ks,
|
|
972
|
+
sendBackwards: Ps
|
|
950
973
|
},
|
|
951
974
|
handlers: {
|
|
952
|
-
copyPaste: (h) =>
|
|
975
|
+
copyPaste: (h) => z(null, null, function* () {
|
|
953
976
|
h.clipboardManager.copyPaste();
|
|
954
977
|
}),
|
|
955
978
|
delete: (h) => {
|
|
@@ -975,18 +998,18 @@ const _s = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMj
|
|
|
975
998
|
}
|
|
976
999
|
}
|
|
977
1000
|
};
|
|
978
|
-
class
|
|
1001
|
+
class Fs {
|
|
979
1002
|
constructor({ editor: t }) {
|
|
980
1003
|
this.currentTarget = null, this.currentLocked = !1, this.isTransforming = !1, this.isTemporarilyHidden = !1, this.editor = t, this.canvas = t.canvas, this.options = t.options, this._initToolbar();
|
|
981
1004
|
}
|
|
982
1005
|
_initToolbar() {
|
|
983
1006
|
if (!this.options.showToolbar) return;
|
|
984
1007
|
const t = this.options.toolbar || {};
|
|
985
|
-
this.config = St(
|
|
986
|
-
style:
|
|
987
|
-
btnStyle:
|
|
988
|
-
icons:
|
|
989
|
-
handlers:
|
|
1008
|
+
this.config = St(P(P({}, Jt), t), {
|
|
1009
|
+
style: P(P({}, Jt.style), t.style || {}),
|
|
1010
|
+
btnStyle: P(P({}, Jt.btnStyle), t.btnStyle || {}),
|
|
1011
|
+
icons: P(P({}, Jt.icons), t.icons || {}),
|
|
1012
|
+
handlers: P(P({}, Jt.handlers), t.handlers || {})
|
|
990
1013
|
}), this.currentTarget = null, this.currentLocked = !1, this.isTransforming = !1, this.isTemporarilyHidden = !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 = () => {
|
|
991
1014
|
this.el.style.display = "none";
|
|
992
1015
|
}, this._createDOM(), this._bindEvents();
|
|
@@ -1103,7 +1126,7 @@ class Us {
|
|
|
1103
1126
|
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("after:render", this._onSelectionChange), this.canvas.off("selection:cleared", this._onSelectionClear), this.el.remove();
|
|
1104
1127
|
}
|
|
1105
1128
|
}
|
|
1106
|
-
const
|
|
1129
|
+
const Ys = {
|
|
1107
1130
|
position: "absolute",
|
|
1108
1131
|
display: "none",
|
|
1109
1132
|
background: "#2B2D33",
|
|
@@ -1117,8 +1140,8 @@ const Fs = {
|
|
|
1117
1140
|
"pointer-events": "none",
|
|
1118
1141
|
"white-space": "nowrap",
|
|
1119
1142
|
"box-shadow": "0 2px 8px rgba(0, 0, 0, 0.2)"
|
|
1120
|
-
},
|
|
1121
|
-
class
|
|
1143
|
+
}, Ge = 16, Ve = 16, Hs = "fabric-editor-angle-indicator";
|
|
1144
|
+
class _e {
|
|
1122
1145
|
constructor({ editor: t }) {
|
|
1123
1146
|
this.isActive = !1, this.currentAngle = 0, this.editor = t, this.canvas = t.canvas, this.options = t.options, this._createDOM(), this._bindEvents();
|
|
1124
1147
|
}
|
|
@@ -1126,7 +1149,7 @@ class Ee {
|
|
|
1126
1149
|
* Создание DOM-элемента индикатора
|
|
1127
1150
|
*/
|
|
1128
1151
|
_createDOM() {
|
|
1129
|
-
this.el = document.createElement("div"), this.el.className =
|
|
1152
|
+
this.el = document.createElement("div"), this.el.className = Hs, Object.entries(Ys).forEach(([t, e]) => {
|
|
1130
1153
|
this.el.style.setProperty(t, e);
|
|
1131
1154
|
}), this.canvas.wrapperEl.appendChild(this.el);
|
|
1132
1155
|
}
|
|
@@ -1146,7 +1169,7 @@ class Ee {
|
|
|
1146
1169
|
return;
|
|
1147
1170
|
}
|
|
1148
1171
|
const s = e.angle || 0;
|
|
1149
|
-
this.currentAngle =
|
|
1172
|
+
this.currentAngle = _e._normalizeAngle(s), this.el.textContent = `${this.currentAngle}°`, this._positionIndicator(t.e), this.isActive || this._showIndicator();
|
|
1150
1173
|
}
|
|
1151
1174
|
/**
|
|
1152
1175
|
* Обработчик отпускания кнопки мыши
|
|
@@ -1177,9 +1200,9 @@ class Ee {
|
|
|
1177
1200
|
*/
|
|
1178
1201
|
_positionIndicator(t) {
|
|
1179
1202
|
const e = this.canvas.wrapperEl.getBoundingClientRect();
|
|
1180
|
-
let s = t.clientX - e.left +
|
|
1203
|
+
let s = t.clientX - e.left + Ge, n = t.clientY - e.top + Ve;
|
|
1181
1204
|
const o = this.el.getBoundingClientRect(), i = o.width, a = o.height;
|
|
1182
|
-
s + i > e.width && (s = t.clientX - e.left - i -
|
|
1205
|
+
s + i > e.width && (s = t.clientX - e.left - i - Ge), n + a > e.height && (n = t.clientY - e.top - a - Ve), this.el.style.left = `${s}px`, this.el.style.top = `${n}px`;
|
|
1183
1206
|
}
|
|
1184
1207
|
/**
|
|
1185
1208
|
* Показать индикатор
|
|
@@ -1210,7 +1233,7 @@ class Ee {
|
|
|
1210
1233
|
this.canvas && (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:cleared", this._onSelectionCleared)), (t = this.el) != null && t.parentNode && this.el.parentNode.removeChild(this.el), this.el = null, this.editor = null, this.canvas = null, this.options = null;
|
|
1211
1234
|
}
|
|
1212
1235
|
}
|
|
1213
|
-
const
|
|
1236
|
+
const Ie = [
|
|
1214
1237
|
"id",
|
|
1215
1238
|
"backgroundId",
|
|
1216
1239
|
"customData",
|
|
@@ -1232,6 +1255,7 @@ const ns = [
|
|
|
1232
1255
|
"styles",
|
|
1233
1256
|
"textCaseRaw",
|
|
1234
1257
|
"uppercase",
|
|
1258
|
+
"autoExpand",
|
|
1235
1259
|
"linethrough",
|
|
1236
1260
|
"underline",
|
|
1237
1261
|
"fontStyle",
|
|
@@ -1246,9 +1270,9 @@ const ns = [
|
|
|
1246
1270
|
"radiusBottomRight",
|
|
1247
1271
|
"radiusBottomLeft"
|
|
1248
1272
|
];
|
|
1249
|
-
class
|
|
1273
|
+
class G {
|
|
1250
1274
|
constructor({ editor: t }) {
|
|
1251
|
-
this.editor = t, this.canvas = t.canvas, this._isSavingState = !1, this._historySuspendCount = 0, this.baseState = null, this.patches = [], this.currentIndex = 0, this.maxHistoryLength = t.options.maxHistoryLength, this.totalChangesCount = 0, this.baseStateChangesCount = 0, this._createDiffPatcher();
|
|
1275
|
+
this.editor = t, this.canvas = t.canvas, this._isSavingState = !1, this._historySuspendCount = 0, this._isActionInProgress = !1, this._actionSnapshot = null, this._actionReason = null, this._pendingSaveTimeoutId = null, this._pendingSaveReason = null, this.baseState = null, this.patches = [], this.currentIndex = 0, this.maxHistoryLength = t.options.maxHistoryLength, this.totalChangesCount = 0, this.baseStateChangesCount = 0, this._createDiffPatcher();
|
|
1252
1276
|
}
|
|
1253
1277
|
/** Проверка, нужно ли пропускать сохранение истории */
|
|
1254
1278
|
get skipHistory() {
|
|
@@ -1258,7 +1282,7 @@ class Z {
|
|
|
1258
1282
|
return this.patches[this.currentIndex - 1] || null;
|
|
1259
1283
|
}
|
|
1260
1284
|
_createDiffPatcher() {
|
|
1261
|
-
this.diffPatcher =
|
|
1285
|
+
this.diffPatcher = Ss({
|
|
1262
1286
|
objectHash(t) {
|
|
1263
1287
|
return [JSON.stringify(t)].join("-");
|
|
1264
1288
|
},
|
|
@@ -1280,6 +1304,36 @@ class Z {
|
|
|
1280
1304
|
resumeHistory() {
|
|
1281
1305
|
this._historySuspendCount = Math.max(0, this._historySuspendCount - 1);
|
|
1282
1306
|
}
|
|
1307
|
+
/**
|
|
1308
|
+
* Запоминает состояние для отмены активного действия.
|
|
1309
|
+
* @param reason - причина начала действия
|
|
1310
|
+
*/
|
|
1311
|
+
beginAction({ reason: t }) {
|
|
1312
|
+
this._isActionInProgress || this.skipHistory || (this._isActionInProgress = !0, this._actionReason = t, this._actionSnapshot = this._captureCurrentState());
|
|
1313
|
+
}
|
|
1314
|
+
/**
|
|
1315
|
+
* Завершает активное действие и очищает снимок.
|
|
1316
|
+
* @param reason - причина завершения (опционально)
|
|
1317
|
+
*/
|
|
1318
|
+
endAction({ reason: t } = {}) {
|
|
1319
|
+
this._isActionInProgress && (t && this._actionReason && t !== this._actionReason || this._clearPendingAction());
|
|
1320
|
+
}
|
|
1321
|
+
/**
|
|
1322
|
+
* Планирует сохранение состояния с отложенным вызовом.
|
|
1323
|
+
* @param delayMs - задержка перед сохранением
|
|
1324
|
+
* @param reason - причина сохранения
|
|
1325
|
+
*/
|
|
1326
|
+
scheduleSaveState({ delayMs: t, reason: e }) {
|
|
1327
|
+
this._clearPendingSave(), this._pendingSaveReason = e, this._pendingSaveTimeoutId = setTimeout(this._handlePendingSaveTimeout.bind(this), t);
|
|
1328
|
+
}
|
|
1329
|
+
/**
|
|
1330
|
+
* Принудительно сохраняет отложенное состояние.
|
|
1331
|
+
*/
|
|
1332
|
+
flushPendingSave() {
|
|
1333
|
+
if (this._pendingSaveTimeoutId === null) return !1;
|
|
1334
|
+
const t = this._pendingSaveReason;
|
|
1335
|
+
return this._clearPendingSave(), this._finalizePendingSave({ reason: t }), !0;
|
|
1336
|
+
}
|
|
1283
1337
|
/**
|
|
1284
1338
|
* Проверяет, есть ли в редакторе несохранённые изменения
|
|
1285
1339
|
*/
|
|
@@ -1302,6 +1356,70 @@ class Z {
|
|
|
1302
1356
|
n = this.diffPatcher.patch(n, s[o].diff);
|
|
1303
1357
|
return console.log("getFullState state", n), n;
|
|
1304
1358
|
}
|
|
1359
|
+
/**
|
|
1360
|
+
* Возвращает текущее состояние канваса с учётом временной разблокировки объектов.
|
|
1361
|
+
*/
|
|
1362
|
+
_captureCurrentState() {
|
|
1363
|
+
return this._withTemporaryUnlock(this._serializeCanvasState.bind(this));
|
|
1364
|
+
}
|
|
1365
|
+
/**
|
|
1366
|
+
* Сериализует текущее состояние канваса.
|
|
1367
|
+
*/
|
|
1368
|
+
_serializeCanvasState() {
|
|
1369
|
+
const { canvas: t } = this;
|
|
1370
|
+
return t.toDatalessObject([...Ie]);
|
|
1371
|
+
}
|
|
1372
|
+
/**
|
|
1373
|
+
* Обрабатывает срабатывание отложенного сохранения.
|
|
1374
|
+
*/
|
|
1375
|
+
_handlePendingSaveTimeout() {
|
|
1376
|
+
if (this._pendingSaveTimeoutId === null) return;
|
|
1377
|
+
const t = this._pendingSaveReason;
|
|
1378
|
+
this._pendingSaveTimeoutId = null, this._pendingSaveReason = null, this._finalizePendingSave({ reason: t });
|
|
1379
|
+
}
|
|
1380
|
+
/**
|
|
1381
|
+
* Завершает отложенное сохранение и применяет состояние.
|
|
1382
|
+
* @param reason - причина сохранения
|
|
1383
|
+
*/
|
|
1384
|
+
_finalizePendingSave({ reason: t }) {
|
|
1385
|
+
t === "text-edit" && this._deactivateTextEditing(), this.saveState();
|
|
1386
|
+
}
|
|
1387
|
+
/**
|
|
1388
|
+
* Сбрасывает флаг редактирования текста, если он активен.
|
|
1389
|
+
*/
|
|
1390
|
+
_deactivateTextEditing() {
|
|
1391
|
+
const { textManager: t } = this.editor;
|
|
1392
|
+
t && t.isTextEditingActive && (t.isTextEditingActive = !1);
|
|
1393
|
+
}
|
|
1394
|
+
/**
|
|
1395
|
+
* Очищает отложенное сохранение без фиксации состояния.
|
|
1396
|
+
*/
|
|
1397
|
+
_clearPendingSave() {
|
|
1398
|
+
const { _pendingSaveTimeoutId: t } = this;
|
|
1399
|
+
t !== null && (clearTimeout(t), this._pendingSaveTimeoutId = null, this._pendingSaveReason = null);
|
|
1400
|
+
}
|
|
1401
|
+
/**
|
|
1402
|
+
* Очищает состояние активного действия.
|
|
1403
|
+
*/
|
|
1404
|
+
_clearPendingAction() {
|
|
1405
|
+
this._isActionInProgress = !1, this._actionSnapshot = null, this._actionReason = null;
|
|
1406
|
+
}
|
|
1407
|
+
/**
|
|
1408
|
+
* Отменяет активное действие и возвращает состояние на момент начала.
|
|
1409
|
+
*/
|
|
1410
|
+
_cancelPendingAction() {
|
|
1411
|
+
return z(this, null, function* () {
|
|
1412
|
+
const { _isActionInProgress: t, _actionSnapshot: e } = this;
|
|
1413
|
+
if (!t || !e) return !1;
|
|
1414
|
+
const s = this._actionReason;
|
|
1415
|
+
this._clearPendingSave(), this._clearPendingAction(), this.suspendHistory();
|
|
1416
|
+
try {
|
|
1417
|
+
return yield this.loadStateFromFullState(e), s === "text-edit" && this._deactivateTextEditing(), !0;
|
|
1418
|
+
} finally {
|
|
1419
|
+
this.resumeHistory();
|
|
1420
|
+
}
|
|
1421
|
+
});
|
|
1422
|
+
}
|
|
1305
1423
|
/**
|
|
1306
1424
|
* Сохраняем текущее состояние в виде диффа от последнего сохранённого полного состояния.
|
|
1307
1425
|
*/
|
|
@@ -1310,33 +1428,31 @@ class Z {
|
|
|
1310
1428
|
this._isSavingState = !0, console.time("saveState");
|
|
1311
1429
|
try {
|
|
1312
1430
|
const t = this._withTemporaryUnlock(
|
|
1313
|
-
() => this.canvas.toDatalessObject([...
|
|
1431
|
+
() => this.canvas.toDatalessObject([...Ie])
|
|
1314
1432
|
);
|
|
1315
1433
|
if (console.timeEnd("saveState"), !this.baseState) {
|
|
1316
1434
|
this.baseState = t, this.patches = [], this.currentIndex = 0, console.log("Базовое состояние сохранено.");
|
|
1317
1435
|
return;
|
|
1318
1436
|
}
|
|
1319
|
-
const e = this.getFullState()
|
|
1320
|
-
console.log("prevState", e);
|
|
1321
|
-
const {
|
|
1437
|
+
const e = this.getFullState(), {
|
|
1322
1438
|
prevState: s,
|
|
1323
1439
|
nextState: n
|
|
1324
|
-
} =
|
|
1440
|
+
} = G._prepareStatesForDiff({
|
|
1325
1441
|
prevState: e,
|
|
1326
1442
|
nextState: t
|
|
1327
1443
|
}), o = this.diffPatcher.diff(s, n);
|
|
1328
|
-
if (!o) {
|
|
1444
|
+
if (console.log("normalizedPrevState", s), console.log("normalizedCurrentState", n), !o) {
|
|
1329
1445
|
console.log("Нет изменений для сохранения.");
|
|
1330
1446
|
return;
|
|
1331
1447
|
}
|
|
1332
|
-
if (
|
|
1448
|
+
if (G._areStatesEqual({
|
|
1333
1449
|
prevState: s,
|
|
1334
1450
|
nextState: n
|
|
1335
1451
|
})) {
|
|
1336
1452
|
console.log("statesEqual. Нет изменений для сохранения.");
|
|
1337
1453
|
return;
|
|
1338
1454
|
}
|
|
1339
|
-
console.log("baseState", this.baseState), this.currentIndex < this.patches.length && this.patches.splice(this.currentIndex), console.log("diff", o), this.totalChangesCount += 1, this.patches.push({ id:
|
|
1455
|
+
console.log("baseState", this.baseState), this.currentIndex < this.patches.length && this.patches.splice(this.currentIndex), console.log("diff", o), this.totalChangesCount += 1, this.patches.push({ id: K(), diff: o }), 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);
|
|
1340
1456
|
} finally {
|
|
1341
1457
|
this._isSavingState = !1;
|
|
1342
1458
|
}
|
|
@@ -1350,11 +1466,11 @@ class Z {
|
|
|
1350
1466
|
prevState: t,
|
|
1351
1467
|
nextState: e
|
|
1352
1468
|
}) {
|
|
1353
|
-
const s =
|
|
1354
|
-
return
|
|
1469
|
+
const s = G._cloneState({ state: t }), n = G._cloneState({ state: e });
|
|
1470
|
+
return G._normalizeTextBackground({ objects: s.objects }), G._normalizeTextBackground({ objects: n.objects }), G._normalizeCanvasSize({
|
|
1355
1471
|
prevState: s,
|
|
1356
1472
|
nextState: n
|
|
1357
|
-
}),
|
|
1473
|
+
}), G._normalizeTranslation({
|
|
1358
1474
|
prevState: s,
|
|
1359
1475
|
nextState: n
|
|
1360
1476
|
}), {
|
|
@@ -1378,7 +1494,7 @@ class Z {
|
|
|
1378
1494
|
prevState: t,
|
|
1379
1495
|
nextState: e
|
|
1380
1496
|
}) {
|
|
1381
|
-
const s =
|
|
1497
|
+
const s = G._stableStringify({ value: t }), n = G._stableStringify({ value: e });
|
|
1382
1498
|
return s === n;
|
|
1383
1499
|
}
|
|
1384
1500
|
/**
|
|
@@ -1433,10 +1549,10 @@ class Z {
|
|
|
1433
1549
|
const { width: s, height: n, objects: o } = t, { objects: i } = e, {
|
|
1434
1550
|
width: a,
|
|
1435
1551
|
height: r
|
|
1436
|
-
} =
|
|
1552
|
+
} = G._getMontageAreaSize({ objects: o }), {
|
|
1437
1553
|
width: c,
|
|
1438
1554
|
height: d
|
|
1439
|
-
} =
|
|
1555
|
+
} = G._getMontageAreaSize({ objects: i });
|
|
1440
1556
|
a !== c || r !== d || (e.width = s, e.height = n);
|
|
1441
1557
|
}
|
|
1442
1558
|
/**
|
|
@@ -1449,25 +1565,25 @@ class Z {
|
|
|
1449
1565
|
const { objects: s, clipPath: n } = t, { objects: o, clipPath: i } = e, {
|
|
1450
1566
|
left: a,
|
|
1451
1567
|
top: r
|
|
1452
|
-
} =
|
|
1568
|
+
} = G._getMontageAreaPosition({ objects: s }), {
|
|
1453
1569
|
left: c,
|
|
1454
1570
|
top: d
|
|
1455
|
-
} =
|
|
1571
|
+
} = G._getMontageAreaPosition({ objects: o }), l = c - a, u = d - r;
|
|
1456
1572
|
if (l === 0 && u === 0) return;
|
|
1457
|
-
const f =
|
|
1573
|
+
const f = G._getObjectById({
|
|
1458
1574
|
objects: o,
|
|
1459
1575
|
id: "montage-area"
|
|
1460
1576
|
});
|
|
1461
1577
|
f && (f.left = a, f.top = r);
|
|
1462
|
-
const g =
|
|
1578
|
+
const g = G._getClipPathPosition({ clipPath: n });
|
|
1463
1579
|
if (g && i && typeof i == "object") {
|
|
1464
|
-
const { left: m, top: v } = g,
|
|
1465
|
-
|
|
1580
|
+
const { left: m, top: v } = g, S = i;
|
|
1581
|
+
S.left = m, S.top = v;
|
|
1466
1582
|
}
|
|
1467
|
-
const p =
|
|
1583
|
+
const p = G._getTranslationIgnoredIds();
|
|
1468
1584
|
for (let m = 0; m < o.length; m += 1) {
|
|
1469
|
-
const v = o[m], { id:
|
|
1470
|
-
|
|
1585
|
+
const v = o[m], { id: S } = v;
|
|
1586
|
+
S && p.has(S) || (typeof v.left == "number" && (v.left -= l), typeof v.top == "number" && (v.top -= u));
|
|
1471
1587
|
}
|
|
1472
1588
|
}
|
|
1473
1589
|
/**
|
|
@@ -1486,7 +1602,7 @@ class Z {
|
|
|
1486
1602
|
static _getMontageAreaPosition({
|
|
1487
1603
|
objects: t
|
|
1488
1604
|
}) {
|
|
1489
|
-
const e =
|
|
1605
|
+
const e = G._getObjectById({
|
|
1490
1606
|
objects: t,
|
|
1491
1607
|
id: "montage-area"
|
|
1492
1608
|
});
|
|
@@ -1501,7 +1617,7 @@ class Z {
|
|
|
1501
1617
|
static _getMontageAreaSize({
|
|
1502
1618
|
objects: t
|
|
1503
1619
|
}) {
|
|
1504
|
-
const e =
|
|
1620
|
+
const e = G._getObjectById({
|
|
1505
1621
|
objects: t,
|
|
1506
1622
|
id: "montage-area"
|
|
1507
1623
|
});
|
|
@@ -1570,7 +1686,7 @@ class Z {
|
|
|
1570
1686
|
for (let c = 0; c < i.length; c += 1) {
|
|
1571
1687
|
const d = i[c], { id: l } = d;
|
|
1572
1688
|
let u;
|
|
1573
|
-
typeof l == "string" && (u = n.get(l)), u || (u = o.get(c)), u && (d.customData =
|
|
1689
|
+
typeof l == "string" && (u = n.get(l)), u || (u = o.get(c)), u && (d.customData = G._cloneCustomData({ customData: u }));
|
|
1574
1690
|
}
|
|
1575
1691
|
}
|
|
1576
1692
|
/**
|
|
@@ -1586,13 +1702,13 @@ class Z {
|
|
|
1586
1702
|
* @fires editor:history-state-loaded
|
|
1587
1703
|
*/
|
|
1588
1704
|
loadStateFromFullState(t) {
|
|
1589
|
-
return
|
|
1705
|
+
return z(this, null, function* () {
|
|
1590
1706
|
if (!t) return;
|
|
1591
1707
|
console.log("loadStateFromFullState fullState", t);
|
|
1592
1708
|
const { canvas: e, canvasManager: s, interactionBlocker: n, backgroundManager: o } = this.editor, { width: i, height: a } = e;
|
|
1593
1709
|
n.overlayMask = null;
|
|
1594
|
-
const r =
|
|
1595
|
-
yield e.loadFromJSON(r),
|
|
1710
|
+
const r = G._createLoadSafeState({ state: t });
|
|
1711
|
+
yield e.loadFromJSON(r), G._applyCustomDataFromState({ state: t, canvas: e });
|
|
1596
1712
|
const c = e.getObjects().find((u) => u.id === "montage-area");
|
|
1597
1713
|
c && (this.editor.montageArea = c, (i !== e.getWidth() || a !== e.getHeight()) && s.updateCanvas());
|
|
1598
1714
|
const d = e.getObjects().find((u) => u.id === "overlay-mask");
|
|
@@ -1613,31 +1729,31 @@ class Z {
|
|
|
1613
1729
|
* @fires editor:undo
|
|
1614
1730
|
*/
|
|
1615
1731
|
undo() {
|
|
1616
|
-
return
|
|
1617
|
-
if (!this.skipHistory) {
|
|
1618
|
-
if (this.
|
|
1732
|
+
return z(this, null, function* () {
|
|
1733
|
+
if (!(this.skipHistory || (yield this._cancelPendingAction()))) {
|
|
1734
|
+
if (this.flushPendingSave(), this.currentIndex <= 0) {
|
|
1619
1735
|
console.log("Нет предыдущих состояний для отмены.");
|
|
1620
1736
|
return;
|
|
1621
1737
|
}
|
|
1622
1738
|
this.suspendHistory();
|
|
1623
1739
|
try {
|
|
1624
1740
|
this.currentIndex -= 1, this.totalChangesCount -= 1;
|
|
1625
|
-
const
|
|
1626
|
-
yield this.loadStateFromFullState(
|
|
1627
|
-
fullState:
|
|
1741
|
+
const e = this.getFullState();
|
|
1742
|
+
yield this.loadStateFromFullState(e), console.log("Undo выполнен. Текущий индекс истории:", this.currentIndex), this.canvas.fire("editor:undo", {
|
|
1743
|
+
fullState: e,
|
|
1628
1744
|
currentIndex: this.currentIndex,
|
|
1629
1745
|
totalChangesCount: this.totalChangesCount,
|
|
1630
1746
|
baseStateChangesCount: this.baseStateChangesCount,
|
|
1631
1747
|
patchesCount: this.patches.length,
|
|
1632
1748
|
patches: this.patches
|
|
1633
1749
|
});
|
|
1634
|
-
} catch (
|
|
1750
|
+
} catch (e) {
|
|
1635
1751
|
this.editor.errorManager.emitError({
|
|
1636
1752
|
origin: "HistoryManager",
|
|
1637
1753
|
method: "undo",
|
|
1638
1754
|
code: "UNDO_ERROR",
|
|
1639
1755
|
message: "Ошибка отмены действия",
|
|
1640
|
-
data:
|
|
1756
|
+
data: e
|
|
1641
1757
|
});
|
|
1642
1758
|
} finally {
|
|
1643
1759
|
this.resumeHistory();
|
|
@@ -1650,31 +1766,31 @@ class Z {
|
|
|
1650
1766
|
* @fires editor:redo
|
|
1651
1767
|
*/
|
|
1652
1768
|
redo() {
|
|
1653
|
-
return
|
|
1654
|
-
if (!this.skipHistory) {
|
|
1655
|
-
if (this.currentIndex >= this.patches.length) {
|
|
1769
|
+
return z(this, null, function* () {
|
|
1770
|
+
if (!(this.skipHistory || (yield this._cancelPendingAction()))) {
|
|
1771
|
+
if (this.flushPendingSave(), this.currentIndex >= this.patches.length) {
|
|
1656
1772
|
console.log("Нет состояний для повтора.");
|
|
1657
1773
|
return;
|
|
1658
1774
|
}
|
|
1659
1775
|
this.suspendHistory();
|
|
1660
1776
|
try {
|
|
1661
1777
|
this.currentIndex += 1, this.totalChangesCount += 1;
|
|
1662
|
-
const
|
|
1663
|
-
console.log("fullState",
|
|
1664
|
-
fullState:
|
|
1778
|
+
const e = this.getFullState();
|
|
1779
|
+
console.log("fullState", e), yield this.loadStateFromFullState(e), console.log("Redo выполнен. Текущий индекс истории:", this.currentIndex), this.canvas.fire("editor:redo", {
|
|
1780
|
+
fullState: e,
|
|
1665
1781
|
currentIndex: this.currentIndex,
|
|
1666
1782
|
totalChangesCount: this.totalChangesCount,
|
|
1667
1783
|
baseStateChangesCount: this.baseStateChangesCount,
|
|
1668
1784
|
patchesCount: this.patches.length,
|
|
1669
1785
|
patches: this.patches
|
|
1670
1786
|
});
|
|
1671
|
-
} catch (
|
|
1787
|
+
} catch (e) {
|
|
1672
1788
|
this.editor.errorManager.emitError({
|
|
1673
1789
|
origin: "HistoryManager",
|
|
1674
1790
|
method: "redo",
|
|
1675
1791
|
code: "REDO_ERROR",
|
|
1676
1792
|
message: "Ошибка повтора действия",
|
|
1677
|
-
data:
|
|
1793
|
+
data: e
|
|
1678
1794
|
});
|
|
1679
1795
|
} finally {
|
|
1680
1796
|
this.resumeHistory();
|
|
@@ -1705,7 +1821,7 @@ class Z {
|
|
|
1705
1821
|
}
|
|
1706
1822
|
}
|
|
1707
1823
|
}
|
|
1708
|
-
const
|
|
1824
|
+
const Zs = 0.1, Gs = 2, Xe = 0.1, Vs = 90, kt = 16, Pt = 16, At = 4096, jt = 4096, Ke = "application/image-editor:", re = [
|
|
1709
1825
|
"format",
|
|
1710
1826
|
"uppercase",
|
|
1711
1827
|
"textCaseRaw",
|
|
@@ -1719,8 +1835,8 @@ const Hs = 0.1, Zs = 2, Ze = 0.1, Gs = 90, _t = 16, xt = 16, jt = 4096, Ct = 409
|
|
|
1719
1835
|
"radiusTopRight",
|
|
1720
1836
|
"radiusBottomRight",
|
|
1721
1837
|
"radiusBottomLeft"
|
|
1722
|
-
],
|
|
1723
|
-
class
|
|
1838
|
+
], Xs = 50;
|
|
1839
|
+
class lt {
|
|
1724
1840
|
constructor({ editor: t }) {
|
|
1725
1841
|
this.editor = t, this.options = t.options, this._createdBlobUrls = [], this.acceptContentTypes = this.editor.options.acceptContentTypes, this.acceptFormats = this.getAllowedFormatsFromContentTypes();
|
|
1726
1842
|
}
|
|
@@ -1737,7 +1853,7 @@ class ut {
|
|
|
1737
1853
|
* @returns возвращает Promise с объектом изображения или null в случае ошибки
|
|
1738
1854
|
*/
|
|
1739
1855
|
importImage(t) {
|
|
1740
|
-
return
|
|
1856
|
+
return z(this, null, function* () {
|
|
1741
1857
|
const {
|
|
1742
1858
|
source: e,
|
|
1743
1859
|
scale: s = `image-${this.options.scaleType}`,
|
|
@@ -1749,7 +1865,7 @@ class ut {
|
|
|
1749
1865
|
customData: c = null
|
|
1750
1866
|
} = t;
|
|
1751
1867
|
if (!e) return null;
|
|
1752
|
-
const { canvas: d, montageArea: l, transformManager: u, historyManager: f, errorManager: g } = this.editor, p = yield this.getContentType(e), m =
|
|
1868
|
+
const { canvas: d, montageArea: l, transformManager: u, historyManager: f, errorManager: g } = this.editor, p = yield this.getContentType(e), m = lt.getFormatFromContentType(p), { acceptContentTypes: v, acceptFormats: S } = this;
|
|
1753
1869
|
if (!this.isAllowedContentType(p)) {
|
|
1754
1870
|
const A = `Неверный contentType для изображения: ${p}. Ожидается один из: ${this.acceptContentTypes.join(", ")}.`;
|
|
1755
1871
|
return g.emitError({
|
|
@@ -1762,7 +1878,7 @@ class ut {
|
|
|
1762
1878
|
format: m,
|
|
1763
1879
|
contentType: p,
|
|
1764
1880
|
acceptContentTypes: v,
|
|
1765
|
-
acceptFormats:
|
|
1881
|
+
acceptFormats: S,
|
|
1766
1882
|
fromClipboard: o,
|
|
1767
1883
|
isBackground: i,
|
|
1768
1884
|
withoutSelection: a,
|
|
@@ -1790,7 +1906,7 @@ class ut {
|
|
|
1790
1906
|
format: m,
|
|
1791
1907
|
contentType: p,
|
|
1792
1908
|
acceptContentTypes: v,
|
|
1793
|
-
acceptFormats:
|
|
1909
|
+
acceptFormats: S,
|
|
1794
1910
|
fromClipboard: o,
|
|
1795
1911
|
isBackground: i,
|
|
1796
1912
|
withoutSelection: a,
|
|
@@ -1799,29 +1915,29 @@ class ut {
|
|
|
1799
1915
|
}
|
|
1800
1916
|
}), null;
|
|
1801
1917
|
if (this._createdBlobUrls.push(A), m === "svg") {
|
|
1802
|
-
const
|
|
1803
|
-
y =
|
|
1918
|
+
const w = yield fs(A);
|
|
1919
|
+
y = ht.groupSVGElements(w.objects, w.options);
|
|
1804
1920
|
} else
|
|
1805
|
-
y = yield
|
|
1806
|
-
const { width:
|
|
1807
|
-
if (y instanceof
|
|
1808
|
-
const
|
|
1921
|
+
y = yield qt.fromURL(A, { crossOrigin: "anonymous" });
|
|
1922
|
+
const { width: M, height: j } = y;
|
|
1923
|
+
if (y instanceof qt) {
|
|
1924
|
+
const w = y.getElement();
|
|
1809
1925
|
let T = "";
|
|
1810
|
-
if (
|
|
1811
|
-
const
|
|
1812
|
-
this._createdBlobUrls.push(
|
|
1813
|
-
} else if (j <
|
|
1814
|
-
const
|
|
1815
|
-
this._createdBlobUrls.push(
|
|
1926
|
+
if (w instanceof HTMLImageElement ? T = w.src : w instanceof HTMLCanvasElement && (T = w.toDataURL()), j > jt || M > At) {
|
|
1927
|
+
const b = yield this.resizeImageToBoundaries(T, "max"), C = URL.createObjectURL(b);
|
|
1928
|
+
this._createdBlobUrls.push(C), y = yield qt.fromURL(C, { crossOrigin: "anonymous" });
|
|
1929
|
+
} else if (j < Pt || M < kt) {
|
|
1930
|
+
const b = yield this.resizeImageToBoundaries(T, "min"), C = URL.createObjectURL(b);
|
|
1931
|
+
this._createdBlobUrls.push(C), y = yield qt.fromURL(C, { crossOrigin: "anonymous" });
|
|
1816
1932
|
}
|
|
1817
1933
|
}
|
|
1818
|
-
if (y.set("id", `${y.type}-${
|
|
1934
|
+
if (y.set("id", `${y.type}-${K()}`), y.set("format", m), y.set("customData", c || null), s === "scale-montage")
|
|
1819
1935
|
this.editor.canvasManager.scaleMontageAreaToImage({ object: y, withoutSave: !0 });
|
|
1820
1936
|
else {
|
|
1821
|
-
const { width:
|
|
1822
|
-
s === "image-contain" &&
|
|
1937
|
+
const { width: w, height: T } = l, b = this.calculateScaleFactor({ imageObject: y, scaleType: s });
|
|
1938
|
+
s === "image-contain" && b < 1 ? u.fitObject({ object: y, type: "contain", withoutSave: !0 }) : s === "image-cover" && (M > w || j > T) && u.fitObject({ object: y, type: "cover", withoutSave: !0 });
|
|
1823
1939
|
}
|
|
1824
|
-
const
|
|
1940
|
+
const I = {
|
|
1825
1941
|
image: y,
|
|
1826
1942
|
format: m,
|
|
1827
1943
|
contentType: p,
|
|
@@ -1834,7 +1950,7 @@ class ut {
|
|
|
1834
1950
|
withoutAdding: r,
|
|
1835
1951
|
customData: c
|
|
1836
1952
|
};
|
|
1837
|
-
return r ? (f.resumeHistory(), d.fire("editor:image-imported",
|
|
1953
|
+
return r ? (f.resumeHistory(), d.fire("editor:image-imported", I), I) : (d.add(y), d.centerObject(y), a || d.setActiveObject(y), d.renderAll(), f.resumeHistory(), n || f.saveState(), d.fire("editor:image-imported", I), I);
|
|
1838
1954
|
} catch (A) {
|
|
1839
1955
|
return g.emitError({
|
|
1840
1956
|
origin: "ImageManager",
|
|
@@ -1866,16 +1982,16 @@ class ut {
|
|
|
1866
1982
|
* @returns возвращает Promise с Blob-объектом уменьшенного изображения
|
|
1867
1983
|
*/
|
|
1868
1984
|
resizeImageToBoundaries(t, e = "max") {
|
|
1869
|
-
return
|
|
1870
|
-
let s = `Размер изображения больше максимального размера канваса, поэтому оно будет уменьшено до максимальных размеров c сохранением пропорций: ${
|
|
1871
|
-
e === "min" && (s = `Размер изображения меньше минимального размера канваса, поэтому оно будет увеличено до минимальных размеров c сохранением пропорций: ${
|
|
1985
|
+
return z(this, null, function* () {
|
|
1986
|
+
let s = `Размер изображения больше максимального размера канваса, поэтому оно будет уменьшено до максимальных размеров c сохранением пропорций: ${At}x${jt}`;
|
|
1987
|
+
e === "min" && (s = `Размер изображения меньше минимального размера канваса, поэтому оно будет увеличено до минимальных размеров c сохранением пропорций: ${kt}x${Pt}`);
|
|
1872
1988
|
const n = {
|
|
1873
1989
|
dataURL: t,
|
|
1874
1990
|
sizeType: e,
|
|
1875
|
-
maxWidth:
|
|
1876
|
-
maxHeight:
|
|
1877
|
-
minWidth:
|
|
1878
|
-
minHeight:
|
|
1991
|
+
maxWidth: At,
|
|
1992
|
+
maxHeight: jt,
|
|
1993
|
+
minWidth: kt,
|
|
1994
|
+
minHeight: Pt
|
|
1879
1995
|
};
|
|
1880
1996
|
return this.editor.errorManager.emitWarning({
|
|
1881
1997
|
origin: "ImageManager",
|
|
@@ -1898,7 +2014,7 @@ class ut {
|
|
|
1898
2014
|
* @fires editor:canvas-exported
|
|
1899
2015
|
*/
|
|
1900
2016
|
exportCanvasAsImageFile() {
|
|
1901
|
-
return
|
|
2017
|
+
return z(this, arguments, function* (t = {}) {
|
|
1902
2018
|
const {
|
|
1903
2019
|
fileName: e = "image.png",
|
|
1904
2020
|
contentType: s = "image/png",
|
|
@@ -1906,22 +2022,22 @@ class ut {
|
|
|
1906
2022
|
exportAsBlob: o = !1
|
|
1907
2023
|
} = t, { canvas: i, montageArea: a, workerManager: r, interactionBlocker: c } = this.editor;
|
|
1908
2024
|
try {
|
|
1909
|
-
const d = s === "application/pdf", l = d ? "image/jpg" : s, u =
|
|
2025
|
+
const d = s === "application/pdf", l = d ? "image/jpg" : s, u = lt.getFormatFromContentType(l);
|
|
1910
2026
|
a.setCoords();
|
|
1911
2027
|
const { left: f, top: g, width: p, height: m } = a.getBoundingRect(), v = yield i.clone(["id", "format", "locked"]);
|
|
1912
2028
|
v.enableRetinaScaling = !1, ["image/jpg", "image/jpeg"].includes(l) && (v.backgroundColor = "#ffffff");
|
|
1913
|
-
const
|
|
1914
|
-
if (
|
|
1915
|
-
const
|
|
1916
|
-
|
|
2029
|
+
const S = v.getObjects().find((b) => b.id === a.id);
|
|
2030
|
+
if (S && (S.visible = !1), c != null && c.isBlocked) {
|
|
2031
|
+
const b = v.getObjects().find((C) => C.id === c.overlayMask.id);
|
|
2032
|
+
b && (b.visible = !1);
|
|
1917
2033
|
}
|
|
1918
2034
|
v.viewportTransform = [1, 0, 0, 1, -f, -g], v.setDimensions({ width: p, height: m }, { backstoreOnly: !0 }), v.renderAll();
|
|
1919
|
-
const A = v.getObjects().filter((
|
|
2035
|
+
const A = v.getObjects().filter((b) => b.format).every((b) => b.format === "svg");
|
|
1920
2036
|
if (u === "svg" && A) {
|
|
1921
|
-
const
|
|
2037
|
+
const b = v.toSVG();
|
|
1922
2038
|
v.dispose();
|
|
1923
2039
|
const E = {
|
|
1924
|
-
image:
|
|
2040
|
+
image: lt._exportSVGStringAsFile(b, {
|
|
1925
2041
|
exportAsBase64: n,
|
|
1926
2042
|
exportAsBlob: o,
|
|
1927
2043
|
fileName: e
|
|
@@ -1932,62 +2048,62 @@ class ut {
|
|
|
1932
2048
|
};
|
|
1933
2049
|
return i.fire("editor:canvas-exported", E), E;
|
|
1934
2050
|
}
|
|
1935
|
-
const y = yield new Promise((
|
|
2051
|
+
const y = yield new Promise((b, C) => {
|
|
1936
2052
|
v.getElement().toBlob((E) => {
|
|
1937
|
-
E ?
|
|
2053
|
+
E ? b(E) : C(new Error("Failed to create Blob from canvas"));
|
|
1938
2054
|
});
|
|
1939
2055
|
});
|
|
1940
2056
|
if (v.dispose(), o) {
|
|
1941
|
-
const
|
|
2057
|
+
const b = {
|
|
1942
2058
|
image: y,
|
|
1943
2059
|
format: u,
|
|
1944
2060
|
contentType: l,
|
|
1945
2061
|
fileName: e
|
|
1946
2062
|
};
|
|
1947
|
-
return i.fire("editor:canvas-exported",
|
|
2063
|
+
return i.fire("editor:canvas-exported", b), b;
|
|
1948
2064
|
}
|
|
1949
|
-
const
|
|
2065
|
+
const M = yield createImageBitmap(y), j = yield r.post(
|
|
1950
2066
|
"toDataURL",
|
|
1951
|
-
{ format: u, quality: 1, bitmap:
|
|
1952
|
-
[
|
|
2067
|
+
{ format: u, quality: 1, bitmap: M },
|
|
2068
|
+
[M]
|
|
1953
2069
|
);
|
|
1954
2070
|
if (d) {
|
|
1955
|
-
const
|
|
1956
|
-
orientation:
|
|
2071
|
+
const C = p * 0.264583, E = m * 0.264583, x = (yield this.editor.moduleLoader.loadModule("jspdf")).jsPDF, N = new x({
|
|
2072
|
+
orientation: C > E ? "landscape" : "portrait",
|
|
1957
2073
|
unit: "mm",
|
|
1958
|
-
format: [
|
|
2074
|
+
format: [C, E]
|
|
1959
2075
|
});
|
|
1960
|
-
if (
|
|
1961
|
-
const
|
|
1962
|
-
image:
|
|
2076
|
+
if (N.addImage(String(j), "JPG", 0, 0, C, E), n) {
|
|
2077
|
+
const Y = {
|
|
2078
|
+
image: N.output("datauristring"),
|
|
1963
2079
|
format: "pdf",
|
|
1964
2080
|
contentType: "application/pdf",
|
|
1965
2081
|
fileName: e
|
|
1966
2082
|
};
|
|
1967
|
-
return i.fire("editor:canvas-exported",
|
|
2083
|
+
return i.fire("editor:canvas-exported", Y), Y;
|
|
1968
2084
|
}
|
|
1969
|
-
const
|
|
1970
|
-
image: new File([
|
|
2085
|
+
const B = N.output("blob"), Z = {
|
|
2086
|
+
image: new File([B], e, { type: "application/pdf" }),
|
|
1971
2087
|
format: "pdf",
|
|
1972
2088
|
contentType: "application/pdf",
|
|
1973
2089
|
fileName: e
|
|
1974
2090
|
};
|
|
1975
|
-
return i.fire("editor:canvas-exported",
|
|
2091
|
+
return i.fire("editor:canvas-exported", Z), Z;
|
|
1976
2092
|
}
|
|
1977
2093
|
if (n) {
|
|
1978
|
-
const
|
|
2094
|
+
const b = {
|
|
1979
2095
|
image: j,
|
|
1980
2096
|
format: u,
|
|
1981
2097
|
contentType: l,
|
|
1982
2098
|
fileName: e
|
|
1983
2099
|
};
|
|
1984
|
-
return i.fire("editor:canvas-exported",
|
|
2100
|
+
return i.fire("editor:canvas-exported", b), b;
|
|
1985
2101
|
}
|
|
1986
|
-
const
|
|
1987
|
-
image: new File([y],
|
|
2102
|
+
const I = u === "svg" && !A ? e.replace(/\.[^/.]+$/, ".png") : e, T = {
|
|
2103
|
+
image: new File([y], I, { type: l }),
|
|
1988
2104
|
format: u,
|
|
1989
2105
|
contentType: l,
|
|
1990
|
-
fileName:
|
|
2106
|
+
fileName: I
|
|
1991
2107
|
};
|
|
1992
2108
|
return i.fire("editor:canvas-exported", T), T;
|
|
1993
2109
|
} catch (d) {
|
|
@@ -2013,7 +2129,7 @@ class ut {
|
|
|
2013
2129
|
* @fires editor:object-exported
|
|
2014
2130
|
*/
|
|
2015
2131
|
exportObjectAsImageFile() {
|
|
2016
|
-
return
|
|
2132
|
+
return z(this, arguments, function* (t = {}) {
|
|
2017
2133
|
const {
|
|
2018
2134
|
object: e,
|
|
2019
2135
|
fileName: s = "image.png",
|
|
@@ -2030,9 +2146,9 @@ class ut {
|
|
|
2030
2146
|
data: { contentType: n, fileName: s, exportAsBase64: o, exportAsBlob: i }
|
|
2031
2147
|
}), null;
|
|
2032
2148
|
try {
|
|
2033
|
-
const d =
|
|
2149
|
+
const d = lt.getFormatFromContentType(n);
|
|
2034
2150
|
if (d === "svg") {
|
|
2035
|
-
const p = c.toSVG(), m =
|
|
2151
|
+
const p = c.toSVG(), m = lt._exportSVGStringAsFile(p, {
|
|
2036
2152
|
exportAsBase64: o,
|
|
2037
2153
|
exportAsBlob: i,
|
|
2038
2154
|
fileName: s
|
|
@@ -2045,7 +2161,7 @@ class ut {
|
|
|
2045
2161
|
};
|
|
2046
2162
|
return a.fire("editor:object-exported", v), v;
|
|
2047
2163
|
}
|
|
2048
|
-
if (o && c instanceof
|
|
2164
|
+
if (o && c instanceof qt) {
|
|
2049
2165
|
const p = yield createImageBitmap(c.getElement()), m = yield r.post(
|
|
2050
2166
|
"toDataURL",
|
|
2051
2167
|
{
|
|
@@ -2110,7 +2226,7 @@ class ut {
|
|
|
2110
2226
|
* @returns массив допустимых форматов изображений
|
|
2111
2227
|
*/
|
|
2112
2228
|
getAllowedFormatsFromContentTypes() {
|
|
2113
|
-
return this.acceptContentTypes.map((t) =>
|
|
2229
|
+
return this.acceptContentTypes.map((t) => lt.getFormatFromContentType(t)).filter((t) => t);
|
|
2114
2230
|
}
|
|
2115
2231
|
/**
|
|
2116
2232
|
* Проверяет, является ли contentType допустимым типом изображения.
|
|
@@ -2126,7 +2242,7 @@ class ut {
|
|
|
2126
2242
|
* @public
|
|
2127
2243
|
*/
|
|
2128
2244
|
getContentType(t) {
|
|
2129
|
-
return
|
|
2245
|
+
return z(this, null, function* () {
|
|
2130
2246
|
return typeof t == "string" ? this.getContentTypeFromUrl(t) : t.type || "application/octet-stream";
|
|
2131
2247
|
});
|
|
2132
2248
|
}
|
|
@@ -2137,7 +2253,7 @@ class ut {
|
|
|
2137
2253
|
* @public
|
|
2138
2254
|
*/
|
|
2139
2255
|
getContentTypeFromUrl(t) {
|
|
2140
|
-
return
|
|
2256
|
+
return z(this, null, function* () {
|
|
2141
2257
|
if (t.startsWith("data:")) {
|
|
2142
2258
|
const e = t.match(/^data:([^;]+)/);
|
|
2143
2259
|
return e ? e[1] : "application/octet-stream";
|
|
@@ -2163,7 +2279,7 @@ class ut {
|
|
|
2163
2279
|
try {
|
|
2164
2280
|
const n = (e = new URL(t).pathname.split(".").pop()) == null ? void 0 : e.toLowerCase(), o = {};
|
|
2165
2281
|
return this.acceptContentTypes.forEach((i) => {
|
|
2166
|
-
const a =
|
|
2282
|
+
const a = lt.getFormatFromContentType(i);
|
|
2167
2283
|
a && (o[a] = i);
|
|
2168
2284
|
}), n && o[n] || "application/octet-stream";
|
|
2169
2285
|
} catch (s) {
|
|
@@ -2216,11 +2332,11 @@ class ut {
|
|
|
2216
2332
|
return e ? e[1] : "";
|
|
2217
2333
|
}
|
|
2218
2334
|
}
|
|
2219
|
-
const
|
|
2220
|
-
function
|
|
2335
|
+
const pt = (h, t, e) => Math.max(Math.min(h, e), t), qe = (h, t) => h * t, Ks = (h, t) => new et(h / 2, t / 2);
|
|
2336
|
+
function qs(h) {
|
|
2221
2337
|
return ((h == null ? void 0 : h.type) === "image" || (h == null ? void 0 : h.format) === "svg") && typeof (h == null ? void 0 : h.width) == "number" && typeof (h == null ? void 0 : h.height) == "number";
|
|
2222
2338
|
}
|
|
2223
|
-
class
|
|
2339
|
+
class Js {
|
|
2224
2340
|
/**
|
|
2225
2341
|
* @param options
|
|
2226
2342
|
* @param options.editor – экземпляр редактора
|
|
@@ -2240,11 +2356,11 @@ class qs {
|
|
|
2240
2356
|
* Если точка находится за пределами монтажной области, она проецируется на ближайшую границу монтажной области.
|
|
2241
2357
|
*/
|
|
2242
2358
|
getVisibleCenterPoint() {
|
|
2243
|
-
const { canvas: t, montageArea: e } = this.editor, s = t.getZoom(), n = t.viewportTransform, o = t.getWidth(), i = t.getHeight(), a = (o / 2 - n[4]) / s, r = (i / 2 - n[5]) / s, c = e.width / 2, d = e.height / 2, l =
|
|
2359
|
+
const { canvas: t, montageArea: e } = this.editor, s = t.getZoom(), n = t.viewportTransform, o = t.getWidth(), i = t.getHeight(), a = (o / 2 - n[4]) / s, r = (i / 2 - n[5]) / s, c = e.width / 2, d = e.height / 2, l = pt(
|
|
2244
2360
|
a,
|
|
2245
2361
|
e.left - c,
|
|
2246
2362
|
e.left + c
|
|
2247
|
-
), u =
|
|
2363
|
+
), u = pt(
|
|
2248
2364
|
r,
|
|
2249
2365
|
e.top - d,
|
|
2250
2366
|
e.top + d
|
|
@@ -2267,9 +2383,9 @@ class qs {
|
|
|
2267
2383
|
canvas: o,
|
|
2268
2384
|
montageArea: i,
|
|
2269
2385
|
options: { canvasBackstoreWidth: a }
|
|
2270
|
-
} = this.editor, { width: r, height: c } = i, d =
|
|
2386
|
+
} = this.editor, { width: r, height: c } = i, d = pt(Number(t), kt, At);
|
|
2271
2387
|
if (!a || a === "auto" || n ? this.adaptCanvasToContainer() : a ? this.setCanvasBackstoreWidth(Number(a)) : this.setCanvasBackstoreWidth(d), i.set({ width: d }), (g = o.clipPath) == null || g.set({ width: d }), e) {
|
|
2272
|
-
const p = d / r, m =
|
|
2388
|
+
const p = d / r, m = qe(c, p);
|
|
2273
2389
|
this.setResolutionHeight(m);
|
|
2274
2390
|
return;
|
|
2275
2391
|
}
|
|
@@ -2297,9 +2413,9 @@ class qs {
|
|
|
2297
2413
|
canvas: o,
|
|
2298
2414
|
montageArea: i,
|
|
2299
2415
|
options: { canvasBackstoreHeight: a }
|
|
2300
|
-
} = this.editor, { width: r, height: c } = i, d =
|
|
2416
|
+
} = this.editor, { width: r, height: c } = i, d = pt(Number(t), Pt, jt);
|
|
2301
2417
|
if (!a || a === "auto" || n ? this.adaptCanvasToContainer() : a ? this.setCanvasBackstoreHeight(Number(a)) : this.setCanvasBackstoreHeight(d), i.set({ height: d }), (g = o.clipPath) == null || g.set({ height: d }), e) {
|
|
2302
|
-
const p = d / c, m =
|
|
2418
|
+
const p = d / c, m = qe(r, p);
|
|
2303
2419
|
this.setResolutionWidth(m);
|
|
2304
2420
|
return;
|
|
2305
2421
|
}
|
|
@@ -2317,7 +2433,7 @@ class qs {
|
|
|
2317
2433
|
*/
|
|
2318
2434
|
centerMontageArea() {
|
|
2319
2435
|
var r;
|
|
2320
|
-
const { canvas: t, montageArea: e } = this.editor, s = t.getWidth(), n = t.getHeight(), o = t.getZoom(), i =
|
|
2436
|
+
const { canvas: t, montageArea: e } = this.editor, s = t.getWidth(), n = t.getHeight(), o = t.getZoom(), i = Ks(s, n);
|
|
2321
2437
|
e.set({
|
|
2322
2438
|
left: s / 2,
|
|
2323
2439
|
top: n / 2
|
|
@@ -2350,7 +2466,7 @@ class qs {
|
|
|
2350
2466
|
*/
|
|
2351
2467
|
setCanvasBackstoreWidth(t) {
|
|
2352
2468
|
if (!t || typeof t != "number") return;
|
|
2353
|
-
const e =
|
|
2469
|
+
const e = pt(t, kt, At);
|
|
2354
2470
|
this.editor.canvas.setDimensions({ width: e }, { backstoreOnly: !0 });
|
|
2355
2471
|
}
|
|
2356
2472
|
/**
|
|
@@ -2359,7 +2475,7 @@ class qs {
|
|
|
2359
2475
|
*/
|
|
2360
2476
|
setCanvasBackstoreHeight(t) {
|
|
2361
2477
|
if (!t || typeof t != "number") return;
|
|
2362
|
-
const e =
|
|
2478
|
+
const e = pt(t, Pt, jt);
|
|
2363
2479
|
this.editor.canvas.setDimensions({ height: e }, { backstoreOnly: !0 });
|
|
2364
2480
|
}
|
|
2365
2481
|
/**
|
|
@@ -2368,7 +2484,7 @@ class qs {
|
|
|
2368
2484
|
* с учётом минимальных и максимальных значений.
|
|
2369
2485
|
*/
|
|
2370
2486
|
adaptCanvasToContainer() {
|
|
2371
|
-
const { canvas: t } = this.editor, e = this.getEditorContainer(), s = e.clientWidth, n = e.clientHeight, o =
|
|
2487
|
+
const { canvas: t } = this.editor, e = this.getEditorContainer(), s = e.clientWidth, n = e.clientHeight, o = pt(s, kt, At), i = pt(n, Pt, jt);
|
|
2372
2488
|
t.setDimensions({ width: o, height: i }, { backstoreOnly: !0 });
|
|
2373
2489
|
}
|
|
2374
2490
|
/**
|
|
@@ -2402,7 +2518,7 @@ class qs {
|
|
|
2402
2518
|
if (d.length === 1)
|
|
2403
2519
|
t.setActiveObject(d[0]);
|
|
2404
2520
|
else {
|
|
2405
|
-
const l = new
|
|
2521
|
+
const l = new F(d, {
|
|
2406
2522
|
canvas: t
|
|
2407
2523
|
});
|
|
2408
2524
|
t.setActiveObject(l);
|
|
@@ -2568,15 +2684,15 @@ class qs {
|
|
|
2568
2684
|
montageAreaHeight: r
|
|
2569
2685
|
}
|
|
2570
2686
|
} = this.editor, c = t || n.getActiveObject();
|
|
2571
|
-
if (!
|
|
2687
|
+
if (!qs(c)) return;
|
|
2572
2688
|
const { width: d, height: l } = c;
|
|
2573
|
-
let u = Math.min(d,
|
|
2689
|
+
let u = Math.min(d, At), f = Math.min(l, jt);
|
|
2574
2690
|
if (e) {
|
|
2575
2691
|
const {
|
|
2576
2692
|
width: g,
|
|
2577
2693
|
height: p
|
|
2578
|
-
} = o, m = d / g, v = l / p,
|
|
2579
|
-
u = g *
|
|
2694
|
+
} = o, m = d / g, v = l / p, S = Math.max(m, v);
|
|
2695
|
+
u = g * S, f = p * S;
|
|
2580
2696
|
}
|
|
2581
2697
|
this.setResolutionWidth(u, { withoutSave: !0 }), this.setResolutionHeight(f, { withoutSave: !0 }), this.editor.backgroundManager.backgroundObject && this.editor.backgroundManager.refresh(), (d > a || l > r) && this.editor.zoomManager.calculateAndApplyDefaultZoom(), i.resetObject({ object: c, withoutSave: !0 }), n.centerObject(c), n.renderAll(), s || this.editor.historyManager.saveState(), n.fire("editor:montage-area-scaled-to-image", {
|
|
2582
2698
|
object: c,
|
|
@@ -2628,7 +2744,7 @@ class qs {
|
|
|
2628
2744
|
);
|
|
2629
2745
|
}
|
|
2630
2746
|
}
|
|
2631
|
-
class
|
|
2747
|
+
class Qs {
|
|
2632
2748
|
constructor({ editor: t }) {
|
|
2633
2749
|
this.editor = t, this.options = t.options;
|
|
2634
2750
|
}
|
|
@@ -2639,7 +2755,7 @@ class Js {
|
|
|
2639
2755
|
* @param options.withoutSave - Не сохранять состояние
|
|
2640
2756
|
* @fires editor:object-rotated
|
|
2641
2757
|
*/
|
|
2642
|
-
rotate(t =
|
|
2758
|
+
rotate(t = Vs, { withoutSave: e } = {}) {
|
|
2643
2759
|
const { canvas: s, historyManager: n } = this.editor, o = s.getActiveObject();
|
|
2644
2760
|
if (!o) return;
|
|
2645
2761
|
const i = o.angle + t;
|
|
@@ -2689,7 +2805,7 @@ class Js {
|
|
|
2689
2805
|
withoutSave: s
|
|
2690
2806
|
} = {}) {
|
|
2691
2807
|
const { canvas: n, historyManager: o } = this.editor, i = t || n.getActiveObject();
|
|
2692
|
-
i && (i instanceof
|
|
2808
|
+
i && (i instanceof F ? i.getObjects().forEach((a) => {
|
|
2693
2809
|
a.set("opacity", e);
|
|
2694
2810
|
}) : i.set("opacity", e), n.renderAll(), s || o.saveState(), n.fire("editor:object-opacity-changed", {
|
|
2695
2811
|
object: i,
|
|
@@ -2716,12 +2832,12 @@ class Js {
|
|
|
2716
2832
|
} = {}) {
|
|
2717
2833
|
const { canvas: o, historyManager: i } = this.editor, a = t || o.getActiveObject();
|
|
2718
2834
|
if (a) {
|
|
2719
|
-
if (a instanceof
|
|
2835
|
+
if (a instanceof F && !n) {
|
|
2720
2836
|
const r = a.getObjects();
|
|
2721
2837
|
o.discardActiveObject(), r.forEach((d) => {
|
|
2722
2838
|
this._fitSingleObject(d, e);
|
|
2723
2839
|
});
|
|
2724
|
-
const c = new
|
|
2840
|
+
const c = new F(r, { canvas: o });
|
|
2725
2841
|
o.setActiveObject(c);
|
|
2726
2842
|
} else
|
|
2727
2843
|
this._fitSingleObject(a, e);
|
|
@@ -2740,9 +2856,9 @@ class Js {
|
|
|
2740
2856
|
* @private
|
|
2741
2857
|
*/
|
|
2742
2858
|
_fitSingleObject(t, e) {
|
|
2743
|
-
const { canvas: s, montageArea: n } = this.editor, { width: o, height: i, scaleX: a = 1, scaleY: r = 1, angle: c = 0 } = t, d = o * Math.abs(a), l = i * Math.abs(r), u = c * Math.PI / 180, f = Math.abs(Math.cos(u)), g = Math.abs(Math.sin(u)), p = d * f + l * g, m = d * g + l * f, v = n.width,
|
|
2859
|
+
const { canvas: s, montageArea: n } = this.editor, { width: o, height: i, scaleX: a = 1, scaleY: r = 1, angle: c = 0 } = t, d = o * Math.abs(a), l = i * Math.abs(r), u = c * Math.PI / 180, f = Math.abs(Math.cos(u)), g = Math.abs(Math.sin(u)), p = d * f + l * g, m = d * g + l * f, v = n.width, S = n.height;
|
|
2744
2860
|
let A;
|
|
2745
|
-
e === "contain" ? A = Math.min(v / p,
|
|
2861
|
+
e === "contain" ? A = Math.min(v / p, S / m) : A = Math.max(v / p, S / m), t.set({
|
|
2746
2862
|
scaleX: a * A,
|
|
2747
2863
|
scaleY: r * A
|
|
2748
2864
|
}), s.centerObject(t);
|
|
@@ -2794,9 +2910,9 @@ class Js {
|
|
|
2794
2910
|
});
|
|
2795
2911
|
}
|
|
2796
2912
|
}
|
|
2797
|
-
class
|
|
2913
|
+
class $s {
|
|
2798
2914
|
constructor({ editor: t }) {
|
|
2799
|
-
this.editor = t, this.options = t.options, this.minZoom = this.options.minZoom ||
|
|
2915
|
+
this.editor = t, this.options = t.options, this.minZoom = this.options.minZoom || Zs, this.maxZoom = this.options.maxZoom || Gs, this.defaultZoom = this._normalizeDefaultZoom(this.options.defaultScale);
|
|
2800
2916
|
}
|
|
2801
2917
|
/**
|
|
2802
2918
|
* Приводит значение defaultZoom к числу с двумя знаками после запятой, а также учитывает минимальное и максимальное значения.
|
|
@@ -2862,10 +2978,10 @@ class Qs {
|
|
|
2862
2978
|
* @private
|
|
2863
2979
|
*/
|
|
2864
2980
|
_calculateEmptySpaceRatio(t) {
|
|
2865
|
-
const { canvas: e, montageArea: s } = this.editor, n = e.viewportTransform, o = e.getWidth(), i = e.getHeight(), a = s.left - s.width / 2, r = s.left + s.width / 2, c = s.top - s.height / 2, d = s.top + s.height / 2, l = -n[4] / t, u = (-n[4] + o) / t, f = -n[5] / t, g = (-n[5] + i) / t, p = l < a, m = u > r, v = f < c,
|
|
2866
|
-
if (!(p || m || v ||
|
|
2867
|
-
const y = Math.max(0, a - l),
|
|
2868
|
-
return Math.max(
|
|
2981
|
+
const { canvas: e, montageArea: s } = this.editor, n = e.viewportTransform, o = e.getWidth(), i = e.getHeight(), a = s.left - s.width / 2, r = s.left + s.width / 2, c = s.top - s.height / 2, d = s.top + s.height / 2, l = -n[4] / t, u = (-n[4] + o) / t, f = -n[5] / t, g = (-n[5] + i) / t, p = l < a, m = u > r, v = f < c, S = g > d;
|
|
2982
|
+
if (!(p || m || v || S)) return 0;
|
|
2983
|
+
const y = Math.max(0, a - l), M = Math.max(0, u - r), j = Math.max(0, c - f), I = Math.max(0, g - d), w = Math.max(y, M), T = Math.max(j, I), b = w / o, C = T / i;
|
|
2984
|
+
return Math.max(b, C);
|
|
2869
2985
|
}
|
|
2870
2986
|
/**
|
|
2871
2987
|
* Вычисляет плавный шаг перемещения viewport к центру с ускорением
|
|
@@ -2881,8 +2997,8 @@ class Qs {
|
|
|
2881
2997
|
const { canvas: i, montageArea: a } = this.editor, r = i.viewportTransform, c = i.getWidth(), d = i.getHeight(), l = t.x - r[4], u = t.y - r[5], f = Math.abs(n), g = e - s;
|
|
2882
2998
|
if (Math.abs(g) / f <= 0.1)
|
|
2883
2999
|
return { x: l, y: u };
|
|
2884
|
-
const m = c / 2, v = d / 2,
|
|
2885
|
-
return { x: E, y:
|
|
3000
|
+
const m = c / 2, v = d / 2, S = a.left, A = a.top, y = m - S * s, M = v - A * s, j = (y - r[4]) / (e - s), I = (M - r[5]) / (e - s), w = j * f, T = I * f, b = w * o, C = T * o, E = Math.abs(b) > Math.abs(l) ? l : b, x = Math.abs(C) > Math.abs(u) ? u : C;
|
|
3001
|
+
return { x: E, y: x };
|
|
2886
3002
|
}
|
|
2887
3003
|
/**
|
|
2888
3004
|
* Применяет плавное центрирование viewport при приближении к defaultZoom.
|
|
@@ -2894,7 +3010,7 @@ class Qs {
|
|
|
2894
3010
|
* @returns true если центрирование было применено
|
|
2895
3011
|
* @private
|
|
2896
3012
|
*/
|
|
2897
|
-
_applyViewportCentering(t, e = !1, s =
|
|
3013
|
+
_applyViewportCentering(t, e = !1, s = Xe) {
|
|
2898
3014
|
const { canvas: n } = this.editor, o = this._getScaledMontageDimensions(t), i = n.getWidth(), a = n.getHeight(), r = o.width > i || o.height > a, c = this._calculateFitZoom(), d = t - c;
|
|
2899
3015
|
if (!(!r || d) && !e)
|
|
2900
3016
|
return !1;
|
|
@@ -2969,7 +3085,7 @@ class Qs {
|
|
|
2969
3085
|
* @param options.pointY - Координата Y точки зума
|
|
2970
3086
|
* @fires editor:zoom-changed
|
|
2971
3087
|
*/
|
|
2972
|
-
zoom(t =
|
|
3088
|
+
zoom(t = Xe, e = {}) {
|
|
2973
3089
|
var f, g;
|
|
2974
3090
|
if (!t) return;
|
|
2975
3091
|
const { minZoom: s, maxZoom: n } = this, { canvas: o } = this.editor, i = t < 0, a = o.getZoom(), r = o.getCenterPoint(), c = (f = e.pointX) != null ? f : r.x, d = (g = e.pointY) != null ? g : r.y, l = new et(c, d);
|
|
@@ -3007,7 +3123,7 @@ class Qs {
|
|
|
3007
3123
|
}), this.editor.panConstraintManager.updateBounds();
|
|
3008
3124
|
}
|
|
3009
3125
|
}
|
|
3010
|
-
class
|
|
3126
|
+
class tn {
|
|
3011
3127
|
constructor({ editor: t }) {
|
|
3012
3128
|
this.editor = t, this.isBlocked = !1, this.overlayMask = null, this._createOverlay();
|
|
3013
3129
|
}
|
|
@@ -3064,7 +3180,7 @@ class $s {
|
|
|
3064
3180
|
}), t.upperCanvasEl.style.pointerEvents = "", t.lowerCanvasEl.style.pointerEvents = "", this.overlayMask.visible = !1, t.requestRenderAll(), t.fire("editor:enabled"), s.resumeHistory();
|
|
3065
3181
|
}
|
|
3066
3182
|
}
|
|
3067
|
-
class
|
|
3183
|
+
class xt {
|
|
3068
3184
|
constructor({ editor: t }) {
|
|
3069
3185
|
this.editor = t, this.backgroundObject = null;
|
|
3070
3186
|
}
|
|
@@ -3090,7 +3206,7 @@ class Lt {
|
|
|
3090
3206
|
}
|
|
3091
3207
|
a.set({
|
|
3092
3208
|
fill: t,
|
|
3093
|
-
backgroundId: `background-${
|
|
3209
|
+
backgroundId: `background-${K()}`
|
|
3094
3210
|
}), this.editor.canvas.requestRenderAll();
|
|
3095
3211
|
} else
|
|
3096
3212
|
this._removeCurrentBackground(), this._createColorBackground(t);
|
|
@@ -3127,14 +3243,14 @@ class Lt {
|
|
|
3127
3243
|
try {
|
|
3128
3244
|
const { historyManager: i } = this.editor, { backgroundObject: a } = this;
|
|
3129
3245
|
if (i.suspendHistory(), a && a.backgroundType === "gradient") {
|
|
3130
|
-
const r =
|
|
3131
|
-
if (
|
|
3246
|
+
const r = xt._createFabricGradient(t);
|
|
3247
|
+
if (xt._isGradientEqual(a.fill, r)) {
|
|
3132
3248
|
i.resumeHistory();
|
|
3133
3249
|
return;
|
|
3134
3250
|
}
|
|
3135
3251
|
a.set({
|
|
3136
3252
|
fill: r,
|
|
3137
|
-
backgroundId: `background-${
|
|
3253
|
+
backgroundId: `background-${K()}`
|
|
3138
3254
|
}), this.editor.canvas.requestRenderAll();
|
|
3139
3255
|
} else
|
|
3140
3256
|
this._removeCurrentBackground(), this._createGradientBackground(t);
|
|
@@ -3222,7 +3338,7 @@ class Lt {
|
|
|
3222
3338
|
* @param options.withoutSave - Если true, не сохранять состояние в историю
|
|
3223
3339
|
*/
|
|
3224
3340
|
setImageBackground(o) {
|
|
3225
|
-
return
|
|
3341
|
+
return z(this, arguments, function* ({
|
|
3226
3342
|
imageSource: t,
|
|
3227
3343
|
customData: e = {},
|
|
3228
3344
|
fromTemplate: s = !1,
|
|
@@ -3292,7 +3408,7 @@ class Lt {
|
|
|
3292
3408
|
hasControls: !1,
|
|
3293
3409
|
id: "background",
|
|
3294
3410
|
backgroundType: "color",
|
|
3295
|
-
backgroundId: `background-${
|
|
3411
|
+
backgroundId: `background-${K()}`
|
|
3296
3412
|
}, { withoutSelection: !0 }), this.refresh();
|
|
3297
3413
|
}
|
|
3298
3414
|
/**
|
|
@@ -3309,9 +3425,9 @@ class Lt {
|
|
|
3309
3425
|
hasControls: !1,
|
|
3310
3426
|
id: "background",
|
|
3311
3427
|
backgroundType: "gradient",
|
|
3312
|
-
backgroundId: `background-${
|
|
3428
|
+
backgroundId: `background-${K()}`
|
|
3313
3429
|
}, { withoutSelection: !0 }), this.refresh();
|
|
3314
|
-
const e =
|
|
3430
|
+
const e = xt._createFabricGradient(t);
|
|
3315
3431
|
this.backgroundObject.set("fill", e), this.editor.canvas.requestRenderAll();
|
|
3316
3432
|
}
|
|
3317
3433
|
/**
|
|
@@ -3319,7 +3435,7 @@ class Lt {
|
|
|
3319
3435
|
* @param source - источник изображения (URL или File)
|
|
3320
3436
|
*/
|
|
3321
3437
|
_createImageBackground(t, e) {
|
|
3322
|
-
return
|
|
3438
|
+
return z(this, null, function* () {
|
|
3323
3439
|
var n;
|
|
3324
3440
|
const { image: s } = (n = yield this.editor.imageManager.importImage({
|
|
3325
3441
|
source: t,
|
|
@@ -3337,7 +3453,7 @@ class Lt {
|
|
|
3337
3453
|
hasControls: !1,
|
|
3338
3454
|
id: "background",
|
|
3339
3455
|
backgroundType: "image",
|
|
3340
|
-
backgroundId: `background-${
|
|
3456
|
+
backgroundId: `background-${K()}`,
|
|
3341
3457
|
customData: e
|
|
3342
3458
|
}), this._removeCurrentBackground(), this.backgroundObject = s, this.refresh();
|
|
3343
3459
|
});
|
|
@@ -3371,8 +3487,8 @@ class Lt {
|
|
|
3371
3487
|
{ offset: 0, color: "#000000" },
|
|
3372
3488
|
{ offset: 1, color: "#ffffff" }
|
|
3373
3489
|
], t.type === "linear") {
|
|
3374
|
-
const u = t.angle * Math.PI / 180, f =
|
|
3375
|
-
return new
|
|
3490
|
+
const u = t.angle * Math.PI / 180, f = xt._angleToCoords(u);
|
|
3491
|
+
return new Ue({
|
|
3376
3492
|
type: "linear",
|
|
3377
3493
|
gradientUnits: "percentage",
|
|
3378
3494
|
coords: f,
|
|
@@ -3391,7 +3507,7 @@ class Lt {
|
|
|
3391
3507
|
r1: 0,
|
|
3392
3508
|
r2: d / 100
|
|
3393
3509
|
};
|
|
3394
|
-
return new
|
|
3510
|
+
return new Ue({
|
|
3395
3511
|
type: "radial",
|
|
3396
3512
|
gradientUnits: "percentage",
|
|
3397
3513
|
coords: l,
|
|
@@ -3426,7 +3542,7 @@ class Lt {
|
|
|
3426
3542
|
}) ? !1 : t.type === "linear" && e.type === "linear" ? Math.abs(t.coords.x1 - e.coords.x1) < 1e-4 && Math.abs(t.coords.y1 - e.coords.y1) < 1e-4 && Math.abs(t.coords.x2 - e.coords.x2) < 1e-4 && Math.abs(t.coords.y2 - e.coords.y2) < 1e-4 : t.type === "radial" && e.type === "radial" ? Math.abs(t.coords.x1 - e.coords.x1) < 1e-4 && Math.abs(t.coords.y1 - e.coords.y1) < 1e-4 && Math.abs(t.coords.x2 - e.coords.x2) < 1e-4 && Math.abs(t.coords.y2 - e.coords.y2) < 1e-4 && Math.abs(t.coords.r1 - e.coords.r1) < 1e-4 && Math.abs(t.coords.r2 - e.coords.r2) < 1e-4 : !1;
|
|
3427
3543
|
}
|
|
3428
3544
|
}
|
|
3429
|
-
class
|
|
3545
|
+
class ue {
|
|
3430
3546
|
constructor({ editor: t }) {
|
|
3431
3547
|
this.editor = t;
|
|
3432
3548
|
}
|
|
@@ -3441,7 +3557,7 @@ class le {
|
|
|
3441
3557
|
const { canvas: s, historyManager: n } = this.editor;
|
|
3442
3558
|
n.suspendHistory();
|
|
3443
3559
|
const o = t || s.getActiveObject();
|
|
3444
|
-
o && (o instanceof
|
|
3560
|
+
o && (o instanceof F ? o.getObjects().forEach((i) => {
|
|
3445
3561
|
s.bringObjectToFront(i);
|
|
3446
3562
|
}) : s.bringObjectToFront(o), s.renderAll(), n.resumeHistory(), e || n.saveState(), s.fire("editor:object-bring-to-front", {
|
|
3447
3563
|
object: o,
|
|
@@ -3459,7 +3575,7 @@ class le {
|
|
|
3459
3575
|
const { canvas: s, historyManager: n } = this.editor;
|
|
3460
3576
|
n.suspendHistory();
|
|
3461
3577
|
const o = t || s.getActiveObject();
|
|
3462
|
-
o && (o instanceof
|
|
3578
|
+
o && (o instanceof F ? ue._moveSelectionForward(s, o) : s.bringObjectForward(o), s.renderAll(), n.resumeHistory(), e || n.saveState(), s.fire("editor:object-bring-forward", {
|
|
3463
3579
|
object: o,
|
|
3464
3580
|
withoutSave: e
|
|
3465
3581
|
}));
|
|
@@ -3482,7 +3598,7 @@ class le {
|
|
|
3482
3598
|
o.suspendHistory();
|
|
3483
3599
|
const r = t || s.getActiveObject();
|
|
3484
3600
|
if (r) {
|
|
3485
|
-
if (r instanceof
|
|
3601
|
+
if (r instanceof F) {
|
|
3486
3602
|
const c = r.getObjects();
|
|
3487
3603
|
for (let d = c.length - 1; d >= 0; d -= 1)
|
|
3488
3604
|
s.sendObjectToBack(c[d]);
|
|
@@ -3510,7 +3626,7 @@ class le {
|
|
|
3510
3626
|
} = this.editor;
|
|
3511
3627
|
o.suspendHistory();
|
|
3512
3628
|
const r = t || s.getActiveObject();
|
|
3513
|
-
r && (r instanceof
|
|
3629
|
+
r && (r instanceof F ? ue._moveSelectionBackwards(s, r) : s.sendObjectBackwards(r), a && s.sendObjectToBack(a), s.sendObjectToBack(n), i && s.sendObjectToBack(i), s.renderAll(), o.resumeHistory(), e || o.saveState(), s.fire("editor:object-send-backwards", {
|
|
3514
3630
|
object: r,
|
|
3515
3631
|
withoutSave: e
|
|
3516
3632
|
}));
|
|
@@ -3554,7 +3670,7 @@ class le {
|
|
|
3554
3670
|
});
|
|
3555
3671
|
}
|
|
3556
3672
|
}
|
|
3557
|
-
class
|
|
3673
|
+
class en {
|
|
3558
3674
|
/**
|
|
3559
3675
|
* Менеджер фигур для редактора.
|
|
3560
3676
|
* @param options - Опции и настройки менеджера фигур.
|
|
@@ -3580,13 +3696,13 @@ class tn {
|
|
|
3580
3696
|
*/
|
|
3581
3697
|
addRectangle(d = {}, { withoutSelection: r, withoutAdding: c } = {}) {
|
|
3582
3698
|
var l = d, {
|
|
3583
|
-
id: t = `rect-${
|
|
3699
|
+
id: t = `rect-${K()}`,
|
|
3584
3700
|
left: e,
|
|
3585
3701
|
top: s,
|
|
3586
3702
|
width: n = 100,
|
|
3587
3703
|
height: o = 100,
|
|
3588
3704
|
fill: i = "blue"
|
|
3589
|
-
} = l, a =
|
|
3705
|
+
} = l, a = gt(l, [
|
|
3590
3706
|
"id",
|
|
3591
3707
|
"left",
|
|
3592
3708
|
"top",
|
|
@@ -3594,7 +3710,7 @@ class tn {
|
|
|
3594
3710
|
"height",
|
|
3595
3711
|
"fill"
|
|
3596
3712
|
]);
|
|
3597
|
-
const { canvas: u } = this.editor, f = new
|
|
3713
|
+
const { canvas: u } = this.editor, f = new gs(P({
|
|
3598
3714
|
id: t,
|
|
3599
3715
|
left: e,
|
|
3600
3716
|
top: s,
|
|
@@ -3622,19 +3738,19 @@ class tn {
|
|
|
3622
3738
|
*/
|
|
3623
3739
|
addCircle(c = {}, { withoutSelection: a, withoutAdding: r } = {}) {
|
|
3624
3740
|
var d = c, {
|
|
3625
|
-
id: t = `circle-${
|
|
3741
|
+
id: t = `circle-${K()}`,
|
|
3626
3742
|
left: e,
|
|
3627
3743
|
top: s,
|
|
3628
3744
|
radius: n = 50,
|
|
3629
3745
|
fill: o = "green"
|
|
3630
|
-
} = d, i =
|
|
3746
|
+
} = d, i = gt(d, [
|
|
3631
3747
|
"id",
|
|
3632
3748
|
"left",
|
|
3633
3749
|
"top",
|
|
3634
3750
|
"radius",
|
|
3635
3751
|
"fill"
|
|
3636
3752
|
]);
|
|
3637
|
-
const { canvas: l } = this.editor, u = new
|
|
3753
|
+
const { canvas: l } = this.editor, u = new ps(P({
|
|
3638
3754
|
id: t,
|
|
3639
3755
|
left: e,
|
|
3640
3756
|
top: s,
|
|
@@ -3662,13 +3778,13 @@ class tn {
|
|
|
3662
3778
|
*/
|
|
3663
3779
|
addTriangle(d = {}, { withoutSelection: r, withoutAdding: c } = {}) {
|
|
3664
3780
|
var l = d, {
|
|
3665
|
-
id: t = `triangle-${
|
|
3781
|
+
id: t = `triangle-${K()}`,
|
|
3666
3782
|
left: e,
|
|
3667
3783
|
top: s,
|
|
3668
3784
|
width: n = 100,
|
|
3669
3785
|
height: o = 100,
|
|
3670
3786
|
fill: i = "yellow"
|
|
3671
|
-
} = l, a =
|
|
3787
|
+
} = l, a = gt(l, [
|
|
3672
3788
|
"id",
|
|
3673
3789
|
"left",
|
|
3674
3790
|
"top",
|
|
@@ -3676,7 +3792,7 @@ class tn {
|
|
|
3676
3792
|
"height",
|
|
3677
3793
|
"fill"
|
|
3678
3794
|
]);
|
|
3679
|
-
const { canvas: u } = this.editor, f = new
|
|
3795
|
+
const { canvas: u } = this.editor, f = new ms(P({
|
|
3680
3796
|
id: t,
|
|
3681
3797
|
left: e,
|
|
3682
3798
|
top: s,
|
|
@@ -3687,7 +3803,7 @@ class tn {
|
|
|
3687
3803
|
return !e && !s && u.centerObject(f), c || (u.add(f), r || u.setActiveObject(f), u.renderAll()), f;
|
|
3688
3804
|
}
|
|
3689
3805
|
}
|
|
3690
|
-
class
|
|
3806
|
+
class sn {
|
|
3691
3807
|
/**
|
|
3692
3808
|
* @param options
|
|
3693
3809
|
* @param options.editor - экземпляр редактора с доступом к canvas
|
|
@@ -3715,10 +3831,10 @@ class en {
|
|
|
3715
3831
|
* Асинхронное клонирование для внутреннего буфера
|
|
3716
3832
|
*/
|
|
3717
3833
|
_cloneToInternalClipboard(t) {
|
|
3718
|
-
return
|
|
3834
|
+
return z(this, null, function* () {
|
|
3719
3835
|
const { canvas: e, errorManager: s } = this.editor;
|
|
3720
3836
|
try {
|
|
3721
|
-
const n = yield t.clone(
|
|
3837
|
+
const n = yield t.clone(re);
|
|
3722
3838
|
this.clipboard = n, e.fire("editor:object-copied", { object: n });
|
|
3723
3839
|
} catch (n) {
|
|
3724
3840
|
s.emitError({
|
|
@@ -3735,7 +3851,7 @@ class en {
|
|
|
3735
3851
|
* Копирование в системный буфер обмена
|
|
3736
3852
|
*/
|
|
3737
3853
|
_copyToSystemClipboard(t) {
|
|
3738
|
-
return
|
|
3854
|
+
return z(this, null, function* () {
|
|
3739
3855
|
const { errorManager: e } = this.editor;
|
|
3740
3856
|
if (typeof ClipboardItem == "undefined" || !navigator.clipboard)
|
|
3741
3857
|
return e.emitWarning({
|
|
@@ -3745,7 +3861,7 @@ class en {
|
|
|
3745
3861
|
message: "navigator.clipboard не поддерживается в этом браузере или отсутствует HTTPS-соединение."
|
|
3746
3862
|
}), !1;
|
|
3747
3863
|
try {
|
|
3748
|
-
const s = t.toObject(
|
|
3864
|
+
const s = t.toObject(re), n = JSON.stringify(s);
|
|
3749
3865
|
return t.type === "image" ? this._copyImageToClipboard(t, n) : this._copyTextToClipboard(n);
|
|
3750
3866
|
} catch (s) {
|
|
3751
3867
|
return e.emitError({
|
|
@@ -3762,7 +3878,7 @@ class en {
|
|
|
3762
3878
|
* Копирование изображения в буфер обмена
|
|
3763
3879
|
*/
|
|
3764
3880
|
_copyImageToClipboard(t, e) {
|
|
3765
|
-
return
|
|
3881
|
+
return z(this, null, function* () {
|
|
3766
3882
|
try {
|
|
3767
3883
|
const n = t.toCanvasElement({ enableRetinaScaling: !1 }).toDataURL(), o = n.slice(5).split(";")[0], i = n.split(",")[1], a = atob(i), r = new Uint8Array(a.length);
|
|
3768
3884
|
for (let l = 0; l < a.length; l += 1)
|
|
@@ -3784,9 +3900,9 @@ class en {
|
|
|
3784
3900
|
* Копирование текста в буфер обмена
|
|
3785
3901
|
*/
|
|
3786
3902
|
_copyTextToClipboard(t) {
|
|
3787
|
-
return
|
|
3903
|
+
return z(this, null, function* () {
|
|
3788
3904
|
try {
|
|
3789
|
-
const e = `${
|
|
3905
|
+
const e = `${Ke}${t}`;
|
|
3790
3906
|
return yield navigator.clipboard.writeText(e), console.info("Text copied to clipboard successfully"), !0;
|
|
3791
3907
|
} catch (e) {
|
|
3792
3908
|
const { errorManager: s } = this.editor;
|
|
@@ -3806,7 +3922,7 @@ class en {
|
|
|
3806
3922
|
*/
|
|
3807
3923
|
_addClonedObjectToCanvas(t) {
|
|
3808
3924
|
const { canvas: e, historyManager: s } = this.editor;
|
|
3809
|
-
if (e.discardActiveObject(), t instanceof
|
|
3925
|
+
if (e.discardActiveObject(), t instanceof F) {
|
|
3810
3926
|
s.suspendHistory(), t.canvas = e, t.forEachObject((n) => {
|
|
3811
3927
|
e.add(n);
|
|
3812
3928
|
}), e.setActiveObject(t), e.requestRenderAll(), s.resumeHistory(), s.saveState();
|
|
@@ -3819,7 +3935,7 @@ class en {
|
|
|
3819
3935
|
* @param source - источник изображения (data URL или URL)
|
|
3820
3936
|
*/
|
|
3821
3937
|
_handleImageImport(t) {
|
|
3822
|
-
return
|
|
3938
|
+
return z(this, null, function* () {
|
|
3823
3939
|
var s;
|
|
3824
3940
|
const { image: e } = (s = yield this.editor.imageManager.importImage({
|
|
3825
3941
|
source: t,
|
|
@@ -3835,18 +3951,18 @@ class en {
|
|
|
3835
3951
|
* @fires editor:object-pasted
|
|
3836
3952
|
*/
|
|
3837
3953
|
copyPaste(t) {
|
|
3838
|
-
return
|
|
3954
|
+
return z(this, null, function* () {
|
|
3839
3955
|
const { canvas: e } = this.editor, s = t || e.getActiveObject();
|
|
3840
3956
|
if (!s || s.locked) return !1;
|
|
3841
3957
|
try {
|
|
3842
|
-
const n = yield s.clone(
|
|
3843
|
-
return n instanceof
|
|
3958
|
+
const n = yield s.clone(re);
|
|
3959
|
+
return n instanceof F && n.forEachObject((o) => {
|
|
3844
3960
|
o.set({
|
|
3845
|
-
id: `${o.type}-${
|
|
3961
|
+
id: `${o.type}-${K()}`,
|
|
3846
3962
|
evented: !0
|
|
3847
3963
|
});
|
|
3848
3964
|
}), n.set({
|
|
3849
|
-
id: `${n.type}-${
|
|
3965
|
+
id: `${n.type}-${K()}`,
|
|
3850
3966
|
left: n.left + 10,
|
|
3851
3967
|
top: n.top + 10,
|
|
3852
3968
|
evented: !0
|
|
@@ -3870,14 +3986,14 @@ class en {
|
|
|
3870
3986
|
* @param event.clipboardData.items — элементы буфера обмена
|
|
3871
3987
|
*/
|
|
3872
3988
|
handlePasteEvent(e) {
|
|
3873
|
-
return
|
|
3989
|
+
return z(this, arguments, function* ({ clipboardData: t }) {
|
|
3874
3990
|
var r;
|
|
3875
3991
|
if (!((r = t == null ? void 0 : t.items) != null && r.length)) {
|
|
3876
3992
|
this.paste();
|
|
3877
3993
|
return;
|
|
3878
3994
|
}
|
|
3879
3995
|
const s = t.getData("text/plain");
|
|
3880
|
-
if (s && s.startsWith(
|
|
3996
|
+
if (s && s.startsWith(Ke)) {
|
|
3881
3997
|
this.paste();
|
|
3882
3998
|
return;
|
|
3883
3999
|
}
|
|
@@ -3921,18 +4037,18 @@ class en {
|
|
|
3921
4037
|
* @fires editor:object-pasted
|
|
3922
4038
|
*/
|
|
3923
4039
|
paste() {
|
|
3924
|
-
return
|
|
4040
|
+
return z(this, null, function* () {
|
|
3925
4041
|
const { canvas: t } = this.editor;
|
|
3926
4042
|
if (!this.clipboard) return !1;
|
|
3927
4043
|
try {
|
|
3928
|
-
const e = yield this.clipboard.clone(
|
|
3929
|
-
return t.discardActiveObject(), e instanceof
|
|
4044
|
+
const e = yield this.clipboard.clone(re);
|
|
4045
|
+
return t.discardActiveObject(), e instanceof F && e.forEachObject((s) => {
|
|
3930
4046
|
s.set({
|
|
3931
|
-
id: `${s.type}-${
|
|
4047
|
+
id: `${s.type}-${K()}`,
|
|
3932
4048
|
evented: !0
|
|
3933
4049
|
});
|
|
3934
4050
|
}), e.set({
|
|
3935
|
-
id: `${e.type}-${
|
|
4051
|
+
id: `${e.type}-${K()}`,
|
|
3936
4052
|
left: e.left + 10,
|
|
3937
4053
|
top: e.top + 10,
|
|
3938
4054
|
evented: !0
|
|
@@ -3950,7 +4066,7 @@ class en {
|
|
|
3950
4066
|
});
|
|
3951
4067
|
}
|
|
3952
4068
|
}
|
|
3953
|
-
class
|
|
4069
|
+
class fe {
|
|
3954
4070
|
constructor({ editor: t }) {
|
|
3955
4071
|
this.editor = t;
|
|
3956
4072
|
}
|
|
@@ -3976,9 +4092,9 @@ class he {
|
|
|
3976
4092
|
editable: !1,
|
|
3977
4093
|
locked: !0
|
|
3978
4094
|
};
|
|
3979
|
-
i.set(a), !e &&
|
|
4095
|
+
i.set(a), !e && fe._isGroupOrSelection(i) && i.getObjects().forEach((c) => {
|
|
3980
4096
|
c.set(a);
|
|
3981
|
-
}), i instanceof
|
|
4097
|
+
}), i instanceof at && i.isEditing && i.exitEditing(), n.renderAll(), s || o.saveState(), n.fire("editor:object-locked", {
|
|
3982
4098
|
object: i,
|
|
3983
4099
|
skipInnerObjects: e,
|
|
3984
4100
|
withoutSave: s
|
|
@@ -4005,7 +4121,7 @@ class he {
|
|
|
4005
4121
|
editable: !0,
|
|
4006
4122
|
locked: !1
|
|
4007
4123
|
};
|
|
4008
|
-
o.set(i),
|
|
4124
|
+
o.set(i), fe._isGroupOrSelection(o) && o.getObjects().forEach((a) => {
|
|
4009
4125
|
a.set(i);
|
|
4010
4126
|
}), s.renderAll(), e || n.saveState(), s.fire("editor:object-unlocked", {
|
|
4011
4127
|
object: o,
|
|
@@ -4013,10 +4129,10 @@ class he {
|
|
|
4013
4129
|
});
|
|
4014
4130
|
}
|
|
4015
4131
|
static _isGroupOrSelection(t) {
|
|
4016
|
-
return t instanceof
|
|
4132
|
+
return t instanceof F || t instanceof Rt;
|
|
4017
4133
|
}
|
|
4018
4134
|
}
|
|
4019
|
-
class
|
|
4135
|
+
class nn {
|
|
4020
4136
|
constructor({ editor: t }) {
|
|
4021
4137
|
this.editor = t;
|
|
4022
4138
|
}
|
|
@@ -4028,7 +4144,7 @@ class sn {
|
|
|
4028
4144
|
if (Array.isArray(t))
|
|
4029
4145
|
return t.length > 0 ? t : null;
|
|
4030
4146
|
const e = t || this.editor.canvas.getActiveObject();
|
|
4031
|
-
return !e || !(e instanceof
|
|
4147
|
+
return !e || !(e instanceof F) ? null : e.getObjects();
|
|
4032
4148
|
}
|
|
4033
4149
|
/**
|
|
4034
4150
|
* Получить группы для разгруппировки
|
|
@@ -4036,20 +4152,20 @@ class sn {
|
|
|
4036
4152
|
*/
|
|
4037
4153
|
_getGroupsToUngroup(t) {
|
|
4038
4154
|
if (Array.isArray(t)) {
|
|
4039
|
-
const s = t.filter((n) => n instanceof
|
|
4155
|
+
const s = t.filter((n) => n instanceof Rt);
|
|
4040
4156
|
return s.length > 0 ? s : null;
|
|
4041
4157
|
}
|
|
4042
|
-
if (t instanceof
|
|
4043
|
-
const s = t.getObjects().filter((n) => n instanceof
|
|
4158
|
+
if (t instanceof F) {
|
|
4159
|
+
const s = t.getObjects().filter((n) => n instanceof Rt);
|
|
4044
4160
|
return s.length > 0 ? s : null;
|
|
4045
4161
|
}
|
|
4046
4162
|
const e = t || this.editor.canvas.getActiveObject();
|
|
4047
4163
|
if (!e) return null;
|
|
4048
|
-
if (e instanceof
|
|
4049
|
-
const s = e.getObjects().filter((n) => n instanceof
|
|
4164
|
+
if (e instanceof F) {
|
|
4165
|
+
const s = e.getObjects().filter((n) => n instanceof Rt);
|
|
4050
4166
|
return s.length > 0 ? s : null;
|
|
4051
4167
|
}
|
|
4052
|
-
return e instanceof
|
|
4168
|
+
return e instanceof Rt ? [e] : null;
|
|
4053
4169
|
}
|
|
4054
4170
|
/**
|
|
4055
4171
|
* Группировка объектов
|
|
@@ -4066,8 +4182,8 @@ class sn {
|
|
|
4066
4182
|
if (!o) return null;
|
|
4067
4183
|
try {
|
|
4068
4184
|
n.suspendHistory();
|
|
4069
|
-
const i = new
|
|
4070
|
-
id: `group-${
|
|
4185
|
+
const i = new Rt(o, {
|
|
4186
|
+
id: `group-${K()}`
|
|
4071
4187
|
});
|
|
4072
4188
|
o.forEach((r) => s.remove(r)), s.add(i), s.setActiveObject(i), s.requestRenderAll();
|
|
4073
4189
|
const a = {
|
|
@@ -4102,7 +4218,7 @@ class sn {
|
|
|
4102
4218
|
s.add(l), i.push(l);
|
|
4103
4219
|
});
|
|
4104
4220
|
});
|
|
4105
|
-
const a = new
|
|
4221
|
+
const a = new F(i, {
|
|
4106
4222
|
canvas: s
|
|
4107
4223
|
});
|
|
4108
4224
|
s.setActiveObject(a), s.requestRenderAll();
|
|
@@ -4117,7 +4233,7 @@ class sn {
|
|
|
4117
4233
|
}
|
|
4118
4234
|
}
|
|
4119
4235
|
}
|
|
4120
|
-
class
|
|
4236
|
+
class on {
|
|
4121
4237
|
constructor({ editor: t }) {
|
|
4122
4238
|
this.editor = t;
|
|
4123
4239
|
}
|
|
@@ -4128,11 +4244,11 @@ class nn {
|
|
|
4128
4244
|
selectAll() {
|
|
4129
4245
|
const { canvas: t, canvasManager: e, objectLockManager: s } = this.editor;
|
|
4130
4246
|
t.discardActiveObject();
|
|
4131
|
-
const n = e.getObjects(), o = n.some((a) => a.locked), i = n.length > 1 ? new
|
|
4247
|
+
const n = e.getObjects(), o = n.some((a) => a.locked), i = n.length > 1 ? new F(e.getObjects(), { canvas: t }) : n[0];
|
|
4132
4248
|
o && s.lockObject({ object: i, skipInnerObjects: !0, withoutSave: !0 }), t.setActiveObject(i), t.requestRenderAll(), t.fire("editor:all-objects-selected", { selected: i });
|
|
4133
4249
|
}
|
|
4134
4250
|
}
|
|
4135
|
-
class
|
|
4251
|
+
class Re {
|
|
4136
4252
|
constructor({ editor: t }) {
|
|
4137
4253
|
this.editor = t;
|
|
4138
4254
|
}
|
|
@@ -4179,7 +4295,7 @@ class Oe {
|
|
|
4179
4295
|
s || o.suspendHistory();
|
|
4180
4296
|
const r = [];
|
|
4181
4297
|
if (a.forEach((d) => {
|
|
4182
|
-
if (
|
|
4298
|
+
if (Re._isUngroupableGroup(d)) {
|
|
4183
4299
|
const l = this._handleGroupDeletion(d);
|
|
4184
4300
|
r.push(...l);
|
|
4185
4301
|
return;
|
|
@@ -4194,7 +4310,7 @@ class Oe {
|
|
|
4194
4310
|
return n.fire("editor:objects-deleted", c), c;
|
|
4195
4311
|
}
|
|
4196
4312
|
}
|
|
4197
|
-
const
|
|
4313
|
+
const wt = {
|
|
4198
4314
|
IMAGE_MANAGER: {
|
|
4199
4315
|
/**
|
|
4200
4316
|
* Некорректный Content-Type изображения
|
|
@@ -4299,7 +4415,7 @@ const At = {
|
|
|
4299
4415
|
APPLY_FAILED: "TEMPLATE_APPLY_FAILED"
|
|
4300
4416
|
}
|
|
4301
4417
|
};
|
|
4302
|
-
class
|
|
4418
|
+
class $t {
|
|
4303
4419
|
constructor({ editor: t }) {
|
|
4304
4420
|
this._buffer = [], this.editor = t;
|
|
4305
4421
|
}
|
|
@@ -4326,7 +4442,7 @@ class qt {
|
|
|
4326
4442
|
* @fires editor:error
|
|
4327
4443
|
*/
|
|
4328
4444
|
emitError({ origin: t = "ImageEditor", method: e = "Unknown Method", code: s, data: n, message: o }) {
|
|
4329
|
-
if (
|
|
4445
|
+
if (!$t.isValidErrorCode(s)) {
|
|
4330
4446
|
console.warn("Неизвестный код ошибки: ", { code: s, origin: t, method: e });
|
|
4331
4447
|
return;
|
|
4332
4448
|
}
|
|
@@ -4340,7 +4456,7 @@ class qt {
|
|
|
4340
4456
|
message: i,
|
|
4341
4457
|
data: n
|
|
4342
4458
|
};
|
|
4343
|
-
this._buffer.push(
|
|
4459
|
+
this._buffer.push(P({
|
|
4344
4460
|
type: "editor:error"
|
|
4345
4461
|
}, a)), this.editor.canvas.fire("editor:error", a);
|
|
4346
4462
|
}
|
|
@@ -4355,7 +4471,7 @@ class qt {
|
|
|
4355
4471
|
* @fires editor:warning
|
|
4356
4472
|
*/
|
|
4357
4473
|
emitWarning({ origin: t = "ImageEditor", method: e = "Unknown Method", code: s, message: n, data: o }) {
|
|
4358
|
-
if (
|
|
4474
|
+
if (!$t.isValidErrorCode(s)) {
|
|
4359
4475
|
console.warn("Неизвестный код предупреждения: ", { code: s, origin: t, method: e });
|
|
4360
4476
|
return;
|
|
4361
4477
|
}
|
|
@@ -4368,7 +4484,7 @@ class qt {
|
|
|
4368
4484
|
message: i,
|
|
4369
4485
|
data: o
|
|
4370
4486
|
};
|
|
4371
|
-
this._buffer.push(
|
|
4487
|
+
this._buffer.push(P({
|
|
4372
4488
|
type: "editor:warning"
|
|
4373
4489
|
}, a)), this.editor.canvas.fire("editor:warning", a);
|
|
4374
4490
|
}
|
|
@@ -4378,10 +4494,10 @@ class qt {
|
|
|
4378
4494
|
* @returns true, если код допустим, иначе false
|
|
4379
4495
|
*/
|
|
4380
4496
|
static isValidErrorCode(t) {
|
|
4381
|
-
return t ? Object.values(
|
|
4497
|
+
return t ? Object.values(wt).some((e) => Object.values(e).includes(t)) : !1;
|
|
4382
4498
|
}
|
|
4383
4499
|
}
|
|
4384
|
-
class
|
|
4500
|
+
class an {
|
|
4385
4501
|
constructor({ editor: t }) {
|
|
4386
4502
|
this.currentBounds = null, this.editor = t;
|
|
4387
4503
|
}
|
|
@@ -4466,11 +4582,11 @@ class on {
|
|
|
4466
4582
|
this.currentBounds = this.calculatePanBounds();
|
|
4467
4583
|
}
|
|
4468
4584
|
}
|
|
4469
|
-
const
|
|
4585
|
+
const ct = ({
|
|
4470
4586
|
value: h,
|
|
4471
4587
|
min: t,
|
|
4472
4588
|
max: e
|
|
4473
|
-
}) => Math.min(Math.max(h, t), e),
|
|
4589
|
+
}) => Math.min(Math.max(h, t), e), Nt = class Nt extends at {
|
|
4474
4590
|
constructor(t, e = {}) {
|
|
4475
4591
|
var s, n, o, i, a, r, c, d, l;
|
|
4476
4592
|
super(t, e), this.backgroundOpacity = (s = e.backgroundOpacity) != null ? s : 1, this.paddingTop = (n = e.paddingTop) != null ? n : 0, this.paddingRight = (o = e.paddingRight) != null ? o : 0, this.paddingBottom = (i = e.paddingBottom) != null ? i : 0, this.paddingLeft = (a = e.paddingLeft) != null ? a : 0, this.radiusTopLeft = (r = e.radiusTopLeft) != null ? r : 0, this.radiusTopRight = (c = e.radiusTopRight) != null ? c : 0, this.radiusBottomRight = (d = e.radiusBottomRight) != null ? d : 0, this.radiusBottomLeft = (l = e.radiusBottomLeft) != null ? l : 0, this._roundDimensions();
|
|
@@ -4495,7 +4611,7 @@ const lt = ({
|
|
|
4495
4611
|
}
|
|
4496
4612
|
_getTransformedDimensions(t = {}) {
|
|
4497
4613
|
const { width: e, height: s } = this._getBackgroundDimensions();
|
|
4498
|
-
return super._getTransformedDimensions(St(
|
|
4614
|
+
return super._getTransformedDimensions(St(P({}, t), {
|
|
4499
4615
|
width: e,
|
|
4500
4616
|
height: s
|
|
4501
4617
|
}));
|
|
@@ -4505,7 +4621,7 @@ const lt = ({
|
|
|
4505
4621
|
*/
|
|
4506
4622
|
toObject(t = []) {
|
|
4507
4623
|
const e = super.toObject(t);
|
|
4508
|
-
return St(
|
|
4624
|
+
return St(P({}, e), {
|
|
4509
4625
|
backgroundOpacity: this.backgroundOpacity,
|
|
4510
4626
|
paddingTop: this.paddingTop,
|
|
4511
4627
|
paddingRight: this.paddingRight,
|
|
@@ -4522,7 +4638,7 @@ const lt = ({
|
|
|
4522
4638
|
const e = this._getEffectiveBackgroundFill();
|
|
4523
4639
|
if (e && e) {
|
|
4524
4640
|
const o = this._getPadding(), i = (s = this.width) != null ? s : 0, a = (n = this.height) != null ? n : 0, r = i + o.left + o.right, c = a + o.top + o.bottom, d = this._getCornerRadii({ width: r, height: c }), l = this._getLeftOffset() - o.left, u = this._getTopOffset() - o.top;
|
|
4525
|
-
t.save(),
|
|
4641
|
+
t.save(), Nt._renderRoundedRect({
|
|
4526
4642
|
ctx: t,
|
|
4527
4643
|
height: c,
|
|
4528
4644
|
left: l,
|
|
@@ -4544,10 +4660,10 @@ const lt = ({
|
|
|
4544
4660
|
var i, a, r, c;
|
|
4545
4661
|
const s = t / 2, n = e / 2, o = Math.min(s, n);
|
|
4546
4662
|
return {
|
|
4547
|
-
bottomLeft:
|
|
4548
|
-
bottomRight:
|
|
4549
|
-
topLeft:
|
|
4550
|
-
topRight:
|
|
4663
|
+
bottomLeft: ct({ value: (i = this.radiusBottomLeft) != null ? i : 0, min: 0, max: o }),
|
|
4664
|
+
bottomRight: ct({ value: (a = this.radiusBottomRight) != null ? a : 0, min: 0, max: o }),
|
|
4665
|
+
topLeft: ct({ value: (r = this.radiusTopLeft) != null ? r : 0, min: 0, max: o }),
|
|
4666
|
+
topRight: ct({ value: (c = this.radiusTopRight) != null ? c : 0, min: 0, max: o })
|
|
4551
4667
|
};
|
|
4552
4668
|
}
|
|
4553
4669
|
_getPadding() {
|
|
@@ -4563,12 +4679,12 @@ const lt = ({
|
|
|
4563
4679
|
var n;
|
|
4564
4680
|
const t = this.backgroundColor;
|
|
4565
4681
|
if (!t) return null;
|
|
4566
|
-
const e =
|
|
4682
|
+
const e = ct({ value: (n = this.backgroundOpacity) != null ? n : 1, min: 0, max: 1 });
|
|
4567
4683
|
let s;
|
|
4568
4684
|
try {
|
|
4569
|
-
s = new
|
|
4685
|
+
s = new ys(t);
|
|
4570
4686
|
} catch (o) {
|
|
4571
|
-
return
|
|
4687
|
+
return $t.emitError({
|
|
4572
4688
|
origin: "BackgroundTextbox",
|
|
4573
4689
|
method: "_getEffectiveBackgroundFill",
|
|
4574
4690
|
code: "INVALID_COLOR_VALUE",
|
|
@@ -4591,7 +4707,7 @@ const lt = ({
|
|
|
4591
4707
|
topRight: d,
|
|
4592
4708
|
bottomRight: l,
|
|
4593
4709
|
bottomLeft: u
|
|
4594
|
-
} = n, f =
|
|
4710
|
+
} = n, f = ct({ value: c, min: 0, max: i }), g = ct({ value: d, min: 0, max: i }), p = ct({ value: l, min: 0, max: i }), m = ct({ value: u, min: 0, max: i });
|
|
4595
4711
|
t.beginPath(), t.moveTo(s + f, o), t.lineTo(a - g, o), t.quadraticCurveTo(a, o, a, o + g), t.lineTo(a, r - p), t.quadraticCurveTo(a, r, a - p, r), t.lineTo(s + m, r), t.quadraticCurveTo(s, r, s, r - m), t.lineTo(s, o + f), t.quadraticCurveTo(s, o, s + f, o), t.closePath();
|
|
4596
4712
|
}
|
|
4597
4713
|
/**
|
|
@@ -4605,8 +4721,8 @@ const lt = ({
|
|
|
4605
4721
|
s !== t && (this.width = Math.max(0, s)), n !== e && (this.height = Math.max(0, n));
|
|
4606
4722
|
}
|
|
4607
4723
|
};
|
|
4608
|
-
|
|
4609
|
-
...Array.isArray(
|
|
4724
|
+
Nt.type = "background-textbox", Nt.cacheProperties = [
|
|
4725
|
+
...Array.isArray(at.cacheProperties) ? at.cacheProperties : [],
|
|
4610
4726
|
"backgroundColor",
|
|
4611
4727
|
"backgroundOpacity",
|
|
4612
4728
|
"paddingTop",
|
|
@@ -4617,8 +4733,8 @@ Rt.type = "background-textbox", Rt.cacheProperties = [
|
|
|
4617
4733
|
"radiusTopRight",
|
|
4618
4734
|
"radiusBottomRight",
|
|
4619
4735
|
"radiusBottomLeft"
|
|
4620
|
-
],
|
|
4621
|
-
...Array.isArray(
|
|
4736
|
+
], Nt.stateProperties = [
|
|
4737
|
+
...Array.isArray(at.stateProperties) ? at.stateProperties : [],
|
|
4622
4738
|
"backgroundColor",
|
|
4623
4739
|
"backgroundOpacity",
|
|
4624
4740
|
"paddingTop",
|
|
@@ -4630,11 +4746,11 @@ Rt.type = "background-textbox", Rt.cacheProperties = [
|
|
|
4630
4746
|
"radiusBottomRight",
|
|
4631
4747
|
"radiusBottomLeft"
|
|
4632
4748
|
];
|
|
4633
|
-
let
|
|
4634
|
-
const
|
|
4749
|
+
let ge = Nt;
|
|
4750
|
+
const rn = () => {
|
|
4635
4751
|
var h;
|
|
4636
|
-
(h =
|
|
4637
|
-
},
|
|
4752
|
+
(h = Fe) != null && h.setClass && Fe.setClass(ge, "background-textbox");
|
|
4753
|
+
}, cn = ({ textbox: h }) => {
|
|
4638
4754
|
var s, n;
|
|
4639
4755
|
if (!h.isEditing) return null;
|
|
4640
4756
|
const t = (s = h.selectionStart) != null ? s : 0, e = (n = h.selectionEnd) != null ? n : t;
|
|
@@ -4642,16 +4758,16 @@ const an = () => {
|
|
|
4642
4758
|
start: Math.min(t, e),
|
|
4643
4759
|
end: Math.max(t, e)
|
|
4644
4760
|
};
|
|
4645
|
-
},
|
|
4761
|
+
}, dn = ({ textbox: h }) => {
|
|
4646
4762
|
var e, s;
|
|
4647
4763
|
const t = (s = (e = h.text) == null ? void 0 : e.length) != null ? s : 0;
|
|
4648
4764
|
return t <= 0 ? null : { start: 0, end: t };
|
|
4649
|
-
},
|
|
4765
|
+
}, ln = ({ textbox: h, range: t }) => {
|
|
4650
4766
|
var s, n;
|
|
4651
4767
|
if (!t) return !1;
|
|
4652
4768
|
const e = (n = (s = h.text) == null ? void 0 : s.length) != null ? n : 0;
|
|
4653
4769
|
return e <= 0 ? !1 : t.start <= 0 && t.end >= e;
|
|
4654
|
-
},
|
|
4770
|
+
}, me = ({
|
|
4655
4771
|
textbox: h,
|
|
4656
4772
|
styles: t,
|
|
4657
4773
|
range: e
|
|
@@ -4659,7 +4775,7 @@ const an = () => {
|
|
|
4659
4775
|
if (!t || !Object.keys(t).length) return !1;
|
|
4660
4776
|
const { start: s, end: n } = e;
|
|
4661
4777
|
return n <= s ? !1 : (h.setSelectionStyles(t, s, n), !0);
|
|
4662
|
-
},
|
|
4778
|
+
}, Je = ({
|
|
4663
4779
|
textbox: h,
|
|
4664
4780
|
range: t,
|
|
4665
4781
|
property: e
|
|
@@ -4673,53 +4789,61 @@ const an = () => {
|
|
|
4673
4789
|
);
|
|
4674
4790
|
if (s.length)
|
|
4675
4791
|
return (n = s[0]) == null ? void 0 : n[e];
|
|
4676
|
-
},
|
|
4677
|
-
class
|
|
4792
|
+
}, Qe = ({ strokeColor: h, width: t }) => t <= 0 ? null : h != null ? h : "#000000", $e = ({ width: h = 0 }) => h ? Math.max(0, h) : 0, ye = ({ value: h }) => typeof h == "string" ? h.toLocaleUpperCase() : "", tt = 0.01;
|
|
4793
|
+
class W {
|
|
4678
4794
|
constructor({ editor: t }) {
|
|
4679
4795
|
var e;
|
|
4680
4796
|
this._handleTextEditingEntered = (s) => {
|
|
4681
|
-
var
|
|
4797
|
+
var c;
|
|
4682
4798
|
this.isTextEditingActive = !0;
|
|
4683
4799
|
const { target: n } = s;
|
|
4684
|
-
if (!
|
|
4685
|
-
const
|
|
4800
|
+
if (!W._isTextbox(n)) return;
|
|
4801
|
+
const { historyManager: o } = this.editor;
|
|
4802
|
+
o.beginAction({ reason: "text-edit" });
|
|
4803
|
+
const i = (c = n.originY) != null ? c : "top", a = n.getPointByOrigin("center", i);
|
|
4686
4804
|
this._ensureEditingAnchorState().set(n, {
|
|
4687
|
-
originY:
|
|
4688
|
-
x:
|
|
4689
|
-
y:
|
|
4805
|
+
originY: i,
|
|
4806
|
+
x: a.x,
|
|
4807
|
+
y: a.y
|
|
4690
4808
|
});
|
|
4691
4809
|
}, this._handleTextChanged = (s) => {
|
|
4692
4810
|
const { target: n } = s;
|
|
4693
|
-
if (!
|
|
4694
|
-
const { text: o = "", uppercase: i } = n,
|
|
4695
|
-
if (
|
|
4696
|
-
const
|
|
4697
|
-
|
|
4811
|
+
if (!W._isTextbox(n)) return;
|
|
4812
|
+
const { text: o = "", uppercase: i, autoExpand: a } = n, r = !!i, c = a !== !1, d = o.toLocaleLowerCase();
|
|
4813
|
+
if (r) {
|
|
4814
|
+
const f = ye({ value: d });
|
|
4815
|
+
f !== o && n.set({ text: f }), n.textCaseRaw = d;
|
|
4698
4816
|
} else
|
|
4699
4817
|
n.textCaseRaw = o;
|
|
4700
|
-
|
|
4701
|
-
|
|
4818
|
+
a === void 0 && (n.autoExpand = !0);
|
|
4819
|
+
let l = !1;
|
|
4820
|
+
c && (l = this._autoExpandTextboxWidth(n));
|
|
4821
|
+
let u = !1;
|
|
4822
|
+
l || (u = W._roundTextboxDimensions({ textbox: n })), (l || u) && (n.setCoords(), n.dirty = !0);
|
|
4702
4823
|
}, this._handleTextEditingExited = (s) => {
|
|
4703
|
-
var
|
|
4824
|
+
var c, d, l;
|
|
4704
4825
|
const { target: n } = s;
|
|
4705
|
-
if (!
|
|
4706
|
-
(
|
|
4707
|
-
const o = (
|
|
4826
|
+
if (!W._isTextbox(n)) return;
|
|
4827
|
+
(c = this.editingAnchorState) == null || c.delete(n);
|
|
4828
|
+
const o = (d = n.text) != null ? d : "";
|
|
4708
4829
|
if (!!n.uppercase) {
|
|
4709
|
-
const
|
|
4710
|
-
n.textCaseRaw =
|
|
4830
|
+
const u = (l = n.textCaseRaw) != null ? l : o.toLocaleLowerCase();
|
|
4831
|
+
n.textCaseRaw = u;
|
|
4711
4832
|
} else
|
|
4712
4833
|
n.textCaseRaw = o;
|
|
4713
|
-
|
|
4834
|
+
W._roundTextboxDimensions({ textbox: n }) && (n.setCoords(), n.dirty = !0, this.canvas.requestRenderAll()), n.locked || n.set({
|
|
4714
4835
|
lockMovementX: !1,
|
|
4715
4836
|
lockMovementY: !1
|
|
4716
|
-
})
|
|
4717
|
-
|
|
4718
|
-
},
|
|
4837
|
+
});
|
|
4838
|
+
const { historyManager: r } = this.editor;
|
|
4839
|
+
r.endAction({ reason: "text-edit" }), r.scheduleSaveState({
|
|
4840
|
+
delayMs: Xs,
|
|
4841
|
+
reason: "text-edit"
|
|
4842
|
+
});
|
|
4719
4843
|
}, this._handleObjectScaling = (s) => {
|
|
4720
|
-
var
|
|
4844
|
+
var ee, se, ne, Tt, pe, oe, Ft, Yt, Ht, Zt, Gt, Vt, Xt;
|
|
4721
4845
|
const { target: n, transform: o } = s;
|
|
4722
|
-
if (n instanceof
|
|
4846
|
+
if (n instanceof F || !W._isTextbox(n) || !o) return;
|
|
4723
4847
|
n.isScaling = !0;
|
|
4724
4848
|
const i = this._ensureScalingState(n), {
|
|
4725
4849
|
baseWidth: a,
|
|
@@ -4728,139 +4852,139 @@ class k {
|
|
|
4728
4852
|
basePadding: d,
|
|
4729
4853
|
baseRadii: l,
|
|
4730
4854
|
baseStyles: u
|
|
4731
|
-
} = i, f = typeof ((
|
|
4732
|
-
if (!A && !y && !
|
|
4733
|
-
const
|
|
4855
|
+
} = i, f = typeof ((ee = o.original) == null ? void 0 : ee.width) == "number" ? o.original.width : void 0, g = typeof ((se = o.original) == null ? void 0 : se.left) == "number" ? o.original.left : void 0, p = f != null ? f : a, m = g != null ? g : r, v = (ne = o.corner) != null ? ne : "", S = (Tt = o.action) != null ? Tt : "", A = ["ml", "mr"].includes(v) || S === "scaleX", y = ["mt", "mb"].includes(v) || S === "scaleY", M = ["tl", "tr", "bl", "br"].includes(v) || S === "scale", j = M || y;
|
|
4856
|
+
if (!A && !y && !M) return;
|
|
4857
|
+
const I = Math.abs((oe = (pe = n.scaleX) != null ? pe : o.scaleX) != null ? oe : 1) || 1, w = Math.abs((Yt = (Ft = n.scaleY) != null ? Ft : o.scaleY) != null ? Yt : 1) || 1, T = Math.max(1, p * I), b = Math.max(1, Math.round(T)), C = Math.max(1, c * w), {
|
|
4734
4858
|
paddingTop: E = 0,
|
|
4735
|
-
paddingRight:
|
|
4736
|
-
paddingBottom:
|
|
4737
|
-
paddingLeft:
|
|
4738
|
-
radiusTopLeft:
|
|
4739
|
-
radiusTopRight:
|
|
4740
|
-
radiusBottomRight:
|
|
4741
|
-
radiusBottomLeft:
|
|
4742
|
-
fontSize:
|
|
4743
|
-
width:
|
|
4744
|
-
originX:
|
|
4745
|
-
} = n,
|
|
4746
|
-
top: Math.max(0, d.top *
|
|
4747
|
-
right: Math.max(0, d.right *
|
|
4748
|
-
bottom: Math.max(0, d.bottom *
|
|
4749
|
-
left: Math.max(0, d.left *
|
|
4750
|
-
} : d,
|
|
4751
|
-
topLeft: Math.max(0, l.topLeft *
|
|
4752
|
-
topRight: Math.max(0, l.topRight *
|
|
4753
|
-
bottomRight: Math.max(0, l.bottomRight *
|
|
4754
|
-
bottomLeft: Math.max(0, l.bottomLeft *
|
|
4755
|
-
} : l,
|
|
4859
|
+
paddingRight: x = 0,
|
|
4860
|
+
paddingBottom: N = 0,
|
|
4861
|
+
paddingLeft: B = 0,
|
|
4862
|
+
radiusTopLeft: H = 0,
|
|
4863
|
+
radiusTopRight: Z = 0,
|
|
4864
|
+
radiusBottomRight: $ = 0,
|
|
4865
|
+
radiusBottomLeft: Y = 0,
|
|
4866
|
+
fontSize: st,
|
|
4867
|
+
width: _,
|
|
4868
|
+
originX: O = "left"
|
|
4869
|
+
} = n, it = M || y, X = M || y, V = it ? {
|
|
4870
|
+
top: Math.max(0, d.top * w),
|
|
4871
|
+
right: Math.max(0, d.right * w),
|
|
4872
|
+
bottom: Math.max(0, d.bottom * w),
|
|
4873
|
+
left: Math.max(0, d.left * w)
|
|
4874
|
+
} : d, k = X ? {
|
|
4875
|
+
topLeft: Math.max(0, l.topLeft * w),
|
|
4876
|
+
topRight: Math.max(0, l.topRight * w),
|
|
4877
|
+
bottomRight: Math.max(0, l.bottomRight * w),
|
|
4878
|
+
bottomLeft: Math.max(0, l.bottomLeft * w)
|
|
4879
|
+
} : l, zt = Object.keys(u).length > 0;
|
|
4756
4880
|
let Q;
|
|
4757
|
-
if (j &&
|
|
4758
|
-
const
|
|
4759
|
-
Object.entries(u).forEach(([
|
|
4760
|
-
if (!
|
|
4761
|
-
const
|
|
4762
|
-
Object.entries(
|
|
4763
|
-
if (!
|
|
4764
|
-
const
|
|
4765
|
-
typeof
|
|
4766
|
-
}), Object.keys(
|
|
4767
|
-
}), Object.keys(
|
|
4881
|
+
if (j && zt) {
|
|
4882
|
+
const Et = {};
|
|
4883
|
+
Object.entries(u).forEach(([q, Ot]) => {
|
|
4884
|
+
if (!Ot) return;
|
|
4885
|
+
const Kt = {};
|
|
4886
|
+
Object.entries(Ot).forEach(([Lt, Dt]) => {
|
|
4887
|
+
if (!Dt) return;
|
|
4888
|
+
const _t = P({}, Dt);
|
|
4889
|
+
typeof Dt.fontSize == "number" && (_t.fontSize = Math.max(1, Dt.fontSize * w)), Kt[Lt] = _t;
|
|
4890
|
+
}), Object.keys(Kt).length && (Et[q] = Kt);
|
|
4891
|
+
}), Object.keys(Et).length && (Q = Et);
|
|
4768
4892
|
}
|
|
4769
|
-
const
|
|
4770
|
-
if (!
|
|
4893
|
+
const nt = (Zt = (Ht = o.originX) != null ? Ht : O) != null ? Zt : "left", It = m + p, ut = m + p / 2, ft = _ != null ? _ : p, rt = b !== ft, Ct = Math.abs(C - (st != null ? st : c)) > tt, Wt = Math.abs(V.top - E) > tt || Math.abs(V.right - x) > tt || Math.abs(V.bottom - N) > tt || Math.abs(V.left - B) > tt, yt = Math.abs(k.topLeft - H) > tt || Math.abs(k.topRight - Z) > tt || Math.abs(k.bottomRight - $) > tt || Math.abs(k.bottomLeft - Y) > tt;
|
|
4894
|
+
if (!rt && !Ct && !Wt && !yt) {
|
|
4771
4895
|
n.set({ scaleX: 1, scaleY: 1 }), o.scaleX = 1, o.scaleY = 1;
|
|
4772
4896
|
return;
|
|
4773
4897
|
}
|
|
4774
4898
|
Q && (n.styles = Q), n.set({
|
|
4775
|
-
width:
|
|
4776
|
-
fontSize: j ?
|
|
4777
|
-
paddingTop:
|
|
4778
|
-
paddingRight:
|
|
4779
|
-
paddingBottom:
|
|
4780
|
-
paddingLeft:
|
|
4781
|
-
radiusTopLeft:
|
|
4782
|
-
radiusTopRight:
|
|
4783
|
-
radiusBottomRight:
|
|
4784
|
-
radiusBottomLeft:
|
|
4899
|
+
width: b,
|
|
4900
|
+
fontSize: j ? C : c,
|
|
4901
|
+
paddingTop: V.top,
|
|
4902
|
+
paddingRight: V.right,
|
|
4903
|
+
paddingBottom: V.bottom,
|
|
4904
|
+
paddingLeft: V.left,
|
|
4905
|
+
radiusTopLeft: k.topLeft,
|
|
4906
|
+
radiusTopRight: k.topRight,
|
|
4907
|
+
radiusBottomRight: k.bottomRight,
|
|
4908
|
+
radiusBottomLeft: k.bottomLeft,
|
|
4785
4909
|
scaleX: 1,
|
|
4786
4910
|
scaleY: 1
|
|
4787
4911
|
});
|
|
4788
|
-
const
|
|
4789
|
-
|
|
4790
|
-
const
|
|
4791
|
-
let
|
|
4792
|
-
|
|
4912
|
+
const te = W._roundTextboxDimensions({ textbox: n });
|
|
4913
|
+
te && (n.dirty = !0);
|
|
4914
|
+
const vt = (Gt = n.width) != null ? Gt : b, Ut = vt !== ft;
|
|
4915
|
+
let bt = m;
|
|
4916
|
+
Ut && (A || M) && (nt === "right" ? bt = It - vt : nt === "center" && (bt = ut - vt / 2)), n.set({ left: bt }), i.baseLeft = bt, o.scaleX = 1, o.scaleY = 1;
|
|
4793
4917
|
const { original: Mt } = o;
|
|
4794
|
-
Mt && (Mt.scaleX = 1, Mt.scaleY = 1, Mt.width =
|
|
4795
|
-
top:
|
|
4796
|
-
right:
|
|
4797
|
-
bottom:
|
|
4798
|
-
left:
|
|
4918
|
+
Mt && (Mt.scaleX = 1, Mt.scaleY = 1, Mt.width = vt, Mt.height = n.height, Mt.left = bt), n.setCoords(), this.canvas.requestRenderAll(), i.baseWidth = vt, i.baseFontSize = (Vt = n.fontSize) != null ? Vt : C, i.baseStyles = JSON.parse(JSON.stringify((Xt = n.styles) != null ? Xt : {})), i.basePadding = {
|
|
4919
|
+
top: V.top,
|
|
4920
|
+
right: V.right,
|
|
4921
|
+
bottom: V.bottom,
|
|
4922
|
+
left: V.left
|
|
4799
4923
|
}, i.baseRadii = {
|
|
4800
|
-
topLeft:
|
|
4801
|
-
topRight:
|
|
4802
|
-
bottomRight:
|
|
4803
|
-
bottomLeft:
|
|
4804
|
-
}, i.hasWidthChange =
|
|
4924
|
+
topLeft: k.topLeft,
|
|
4925
|
+
topRight: k.topRight,
|
|
4926
|
+
bottomRight: k.bottomRight,
|
|
4927
|
+
bottomLeft: k.bottomLeft
|
|
4928
|
+
}, i.hasWidthChange = Ut || Ct || Wt || yt || te;
|
|
4805
4929
|
}, this._handleObjectModified = (s) => {
|
|
4806
|
-
var
|
|
4930
|
+
var S, A, y;
|
|
4807
4931
|
const { target: n } = s;
|
|
4808
|
-
if (n instanceof
|
|
4809
|
-
const
|
|
4810
|
-
if (!
|
|
4811
|
-
const { scaleX:
|
|
4812
|
-
if (Math.abs(
|
|
4813
|
-
this.canvas.discardActiveObject(),
|
|
4814
|
-
var
|
|
4815
|
-
if (
|
|
4816
|
-
const
|
|
4817
|
-
paddingTop:
|
|
4818
|
-
paddingRight:
|
|
4819
|
-
paddingBottom:
|
|
4820
|
-
paddingLeft:
|
|
4821
|
-
radiusTopLeft:
|
|
4822
|
-
radiusTopRight:
|
|
4823
|
-
radiusBottomRight:
|
|
4824
|
-
radiusBottomLeft:
|
|
4932
|
+
if (n instanceof F) {
|
|
4933
|
+
const M = n.getObjects();
|
|
4934
|
+
if (!M.some((b) => W._isTextbox(b))) return;
|
|
4935
|
+
const { scaleX: I = 1, scaleY: w = 1 } = n;
|
|
4936
|
+
if (Math.abs(I - 1) < tt && Math.abs(w - 1) < tt) return;
|
|
4937
|
+
this.canvas.discardActiveObject(), M.forEach((b) => {
|
|
4938
|
+
var C, E, x, N;
|
|
4939
|
+
if (W._isTextbox(b)) {
|
|
4940
|
+
const B = (C = b.scaleX) != null ? C : 1, H = (E = b.scaleY) != null ? E : 1, Z = ((x = b.fontSize) != null ? x : 16) * H, $ = ((N = b.width) != null ? N : 0) * B, Y = H, {
|
|
4941
|
+
paddingTop: st = 0,
|
|
4942
|
+
paddingRight: _ = 0,
|
|
4943
|
+
paddingBottom: O = 0,
|
|
4944
|
+
paddingLeft: it = 0,
|
|
4945
|
+
radiusTopLeft: X = 0,
|
|
4946
|
+
radiusTopRight: V = 0,
|
|
4947
|
+
radiusBottomRight: k = 0,
|
|
4948
|
+
radiusBottomLeft: zt = 0,
|
|
4825
4949
|
styles: Q
|
|
4826
|
-
} =
|
|
4827
|
-
paddingTop: Math.max(0,
|
|
4828
|
-
paddingRight: Math.max(0,
|
|
4829
|
-
paddingBottom: Math.max(0,
|
|
4830
|
-
paddingLeft: Math.max(0,
|
|
4950
|
+
} = b, nt = {
|
|
4951
|
+
paddingTop: Math.max(0, st * Y),
|
|
4952
|
+
paddingRight: Math.max(0, _ * Y),
|
|
4953
|
+
paddingBottom: Math.max(0, O * Y),
|
|
4954
|
+
paddingLeft: Math.max(0, it * Y)
|
|
4831
4955
|
}, It = {
|
|
4832
|
-
radiusTopLeft: Math.max(0,
|
|
4833
|
-
radiusTopRight: Math.max(0,
|
|
4834
|
-
radiusBottomRight: Math.max(0,
|
|
4835
|
-
radiusBottomLeft: Math.max(0,
|
|
4956
|
+
radiusTopLeft: Math.max(0, X * Y),
|
|
4957
|
+
radiusTopRight: Math.max(0, V * Y),
|
|
4958
|
+
radiusBottomRight: Math.max(0, k * Y),
|
|
4959
|
+
radiusBottomLeft: Math.max(0, zt * Y)
|
|
4836
4960
|
};
|
|
4837
|
-
let
|
|
4838
|
-
Q && Object.keys(Q).length > 0 && (
|
|
4839
|
-
Object.values(
|
|
4840
|
-
typeof
|
|
4961
|
+
let ut = Q;
|
|
4962
|
+
Q && Object.keys(Q).length > 0 && (ut = JSON.parse(JSON.stringify(Q)), Object.values(ut).forEach((ft) => {
|
|
4963
|
+
Object.values(ft).forEach((rt) => {
|
|
4964
|
+
typeof rt.fontSize == "number" && (rt.fontSize = Math.max(1, rt.fontSize * Y));
|
|
4841
4965
|
});
|
|
4842
|
-
})),
|
|
4843
|
-
fontSize:
|
|
4844
|
-
width:
|
|
4966
|
+
})), b.set(St(P(P({
|
|
4967
|
+
fontSize: Z,
|
|
4968
|
+
width: $,
|
|
4845
4969
|
scaleX: 1,
|
|
4846
4970
|
scaleY: 1
|
|
4847
|
-
},
|
|
4848
|
-
styles:
|
|
4849
|
-
})),
|
|
4971
|
+
}, nt), It), {
|
|
4972
|
+
styles: ut
|
|
4973
|
+
})), W._roundTextboxDimensions({ textbox: b });
|
|
4850
4974
|
}
|
|
4851
|
-
|
|
4975
|
+
b.setCoords();
|
|
4852
4976
|
});
|
|
4853
|
-
const T = new
|
|
4977
|
+
const T = new F(M, {
|
|
4854
4978
|
canvas: this.canvas
|
|
4855
4979
|
});
|
|
4856
4980
|
this.canvas.setActiveObject(T), this.canvas.requestRenderAll();
|
|
4857
4981
|
return;
|
|
4858
4982
|
}
|
|
4859
|
-
if (!
|
|
4983
|
+
if (!W._isTextbox(n)) return;
|
|
4860
4984
|
n.isScaling = !1;
|
|
4861
4985
|
const o = this.scalingState.get(n);
|
|
4862
4986
|
if (this.scalingState.delete(n), !(o != null && o.hasWidthChange)) return;
|
|
4863
|
-
const i = (
|
|
4987
|
+
const i = (S = n.width) != null ? S : n.calcTextWidth(), a = (y = (A = n.fontSize) != null ? A : o == null ? void 0 : o.baseFontSize) != null ? y : 16, r = !!(o.baseStyles && Object.keys(o.baseStyles).length), {
|
|
4864
4988
|
paddingTop: c = 0,
|
|
4865
4989
|
paddingRight: d = 0,
|
|
4866
4990
|
paddingBottom: l = 0,
|
|
@@ -4884,42 +5008,44 @@ class k {
|
|
|
4884
5008
|
target: n,
|
|
4885
5009
|
style: v
|
|
4886
5010
|
}), n.set({ scaleX: 1, scaleY: 1 }), n.setCoords();
|
|
4887
|
-
}, this.editor = t, this.canvas = t.canvas, this.fonts = (e = t.options.fonts) != null ? e : [], this.scalingState = /* @__PURE__ */ new WeakMap(), this.editingAnchorState = /* @__PURE__ */ new WeakMap(), this.isTextEditingActive = !1, this._bindEvents(),
|
|
5011
|
+
}, this.editor = t, this.canvas = t.canvas, this.fonts = (e = t.options.fonts) != null ? e : [], this.scalingState = /* @__PURE__ */ new WeakMap(), this.editingAnchorState = /* @__PURE__ */ new WeakMap(), this.isTextEditingActive = !1, this._bindEvents(), rn();
|
|
4888
5012
|
}
|
|
4889
5013
|
/**
|
|
4890
5014
|
* Добавляет новый текстовый объект на канвас.
|
|
4891
5015
|
* @param options — настройки текста
|
|
4892
5016
|
* @param flags — флаги поведения
|
|
4893
5017
|
*/
|
|
4894
|
-
addText(
|
|
4895
|
-
var
|
|
4896
|
-
id: t = `text-${
|
|
5018
|
+
addText(N = {}, { withoutSelection: C = !1, withoutSave: E = !1, withoutAdding: x = !1 } = {}) {
|
|
5019
|
+
var B = N, {
|
|
5020
|
+
id: t = `text-${K()}`,
|
|
4897
5021
|
text: e = "Новый текст",
|
|
4898
|
-
|
|
4899
|
-
|
|
4900
|
-
|
|
4901
|
-
|
|
4902
|
-
|
|
4903
|
-
|
|
4904
|
-
|
|
4905
|
-
|
|
4906
|
-
|
|
4907
|
-
|
|
4908
|
-
|
|
4909
|
-
|
|
4910
|
-
|
|
4911
|
-
|
|
4912
|
-
|
|
4913
|
-
|
|
4914
|
-
|
|
4915
|
-
|
|
4916
|
-
|
|
4917
|
-
|
|
4918
|
-
|
|
4919
|
-
|
|
4920
|
-
|
|
5022
|
+
autoExpand: s = !0,
|
|
5023
|
+
fontFamily: n,
|
|
5024
|
+
fontSize: o = 48,
|
|
5025
|
+
bold: i = !1,
|
|
5026
|
+
italic: a = !1,
|
|
5027
|
+
underline: r = !1,
|
|
5028
|
+
uppercase: c = !1,
|
|
5029
|
+
strikethrough: d = !1,
|
|
5030
|
+
align: l = "left",
|
|
5031
|
+
color: u = "#000000",
|
|
5032
|
+
strokeColor: f,
|
|
5033
|
+
strokeWidth: g = 0,
|
|
5034
|
+
opacity: p = 1,
|
|
5035
|
+
backgroundColor: m,
|
|
5036
|
+
backgroundOpacity: v = 1,
|
|
5037
|
+
paddingTop: S = 0,
|
|
5038
|
+
paddingRight: A = 0,
|
|
5039
|
+
paddingBottom: y = 0,
|
|
5040
|
+
paddingLeft: M = 0,
|
|
5041
|
+
radiusTopLeft: j = 0,
|
|
5042
|
+
radiusTopRight: I = 0,
|
|
5043
|
+
radiusBottomRight: w = 0,
|
|
5044
|
+
radiusBottomLeft: T = 0
|
|
5045
|
+
} = B, b = gt(B, [
|
|
4921
5046
|
"id",
|
|
4922
5047
|
"text",
|
|
5048
|
+
"autoExpand",
|
|
4923
5049
|
"fontFamily",
|
|
4924
5050
|
"fontSize",
|
|
4925
5051
|
"bold",
|
|
@@ -4943,58 +5069,58 @@ class k {
|
|
|
4943
5069
|
"radiusBottomRight",
|
|
4944
5070
|
"radiusBottomLeft"
|
|
4945
5071
|
]);
|
|
4946
|
-
var
|
|
4947
|
-
const { historyManager:
|
|
4948
|
-
|
|
4949
|
-
const
|
|
4950
|
-
strokeColor:
|
|
4951
|
-
width:
|
|
4952
|
-
}),
|
|
5072
|
+
var V;
|
|
5073
|
+
const { historyManager: H } = this.editor, { canvas: Z } = this;
|
|
5074
|
+
H.suspendHistory();
|
|
5075
|
+
const $ = n != null ? n : this._getDefaultFontFamily(), Y = $e({ width: g }), st = Qe({
|
|
5076
|
+
strokeColor: f,
|
|
5077
|
+
width: Y
|
|
5078
|
+
}), _ = P({
|
|
4953
5079
|
id: t,
|
|
4954
|
-
fontFamily:
|
|
4955
|
-
fontSize:
|
|
4956
|
-
fontWeight:
|
|
4957
|
-
fontStyle:
|
|
4958
|
-
underline:
|
|
4959
|
-
uppercase:
|
|
4960
|
-
linethrough:
|
|
4961
|
-
textAlign:
|
|
4962
|
-
fill:
|
|
4963
|
-
stroke:
|
|
4964
|
-
strokeWidth:
|
|
5080
|
+
fontFamily: $,
|
|
5081
|
+
fontSize: o,
|
|
5082
|
+
fontWeight: i ? "bold" : "normal",
|
|
5083
|
+
fontStyle: a ? "italic" : "normal",
|
|
5084
|
+
underline: r,
|
|
5085
|
+
uppercase: c,
|
|
5086
|
+
linethrough: d,
|
|
5087
|
+
textAlign: l,
|
|
5088
|
+
fill: u,
|
|
5089
|
+
stroke: st,
|
|
5090
|
+
strokeWidth: Y,
|
|
4965
5091
|
strokeUniform: !0,
|
|
4966
|
-
opacity:
|
|
4967
|
-
backgroundColor:
|
|
4968
|
-
backgroundOpacity:
|
|
4969
|
-
paddingTop:
|
|
4970
|
-
paddingRight:
|
|
4971
|
-
paddingBottom:
|
|
4972
|
-
paddingLeft:
|
|
4973
|
-
radiusTopLeft:
|
|
4974
|
-
radiusTopRight:
|
|
4975
|
-
radiusBottomRight:
|
|
4976
|
-
radiusBottomLeft:
|
|
4977
|
-
},
|
|
4978
|
-
if (O.textCaseRaw = (
|
|
4979
|
-
const
|
|
4980
|
-
|
|
4981
|
-
}
|
|
4982
|
-
return
|
|
5092
|
+
opacity: p,
|
|
5093
|
+
backgroundColor: m,
|
|
5094
|
+
backgroundOpacity: v,
|
|
5095
|
+
paddingTop: S,
|
|
5096
|
+
paddingRight: A,
|
|
5097
|
+
paddingBottom: y,
|
|
5098
|
+
paddingLeft: M,
|
|
5099
|
+
radiusTopLeft: j,
|
|
5100
|
+
radiusTopRight: I,
|
|
5101
|
+
radiusBottomRight: w,
|
|
5102
|
+
radiusBottomLeft: T
|
|
5103
|
+
}, b), O = new ge(e, _), it = s !== !1;
|
|
5104
|
+
if (O.autoExpand = it, O.textCaseRaw = (V = O.text) != null ? V : "", c) {
|
|
5105
|
+
const k = ye({ value: O.textCaseRaw });
|
|
5106
|
+
k !== O.text && O.set({ text: k });
|
|
5107
|
+
}
|
|
5108
|
+
return W._roundTextboxDimensions({ textbox: O }) && (O.dirty = !0), b.left === void 0 && b.top === void 0 && Z.centerObject(O), x || Z.add(O), C || Z.setActiveObject(O), Z.requestRenderAll(), H.resumeHistory(), E || H.saveState(), Z.fire("editor:text-added", {
|
|
4983
5109
|
textbox: O,
|
|
4984
|
-
options: St(
|
|
5110
|
+
options: St(P({}, _), {
|
|
4985
5111
|
text: e,
|
|
4986
|
-
bold:
|
|
4987
|
-
italic:
|
|
4988
|
-
strikethrough:
|
|
4989
|
-
align:
|
|
4990
|
-
color:
|
|
4991
|
-
strokeColor:
|
|
4992
|
-
strokeWidth:
|
|
5112
|
+
bold: i,
|
|
5113
|
+
italic: a,
|
|
5114
|
+
strikethrough: d,
|
|
5115
|
+
align: l,
|
|
5116
|
+
color: u,
|
|
5117
|
+
strokeColor: st,
|
|
5118
|
+
strokeWidth: Y
|
|
4993
5119
|
}),
|
|
4994
5120
|
flags: {
|
|
4995
|
-
withoutSelection: !!
|
|
4996
|
-
withoutSave: !!
|
|
4997
|
-
withoutAdding: !!
|
|
5121
|
+
withoutSelection: !!C,
|
|
5122
|
+
withoutSave: !!E,
|
|
5123
|
+
withoutAdding: !!x
|
|
4998
5124
|
}
|
|
4999
5125
|
}), O;
|
|
5000
5126
|
}
|
|
@@ -5006,42 +5132,49 @@ class k {
|
|
|
5006
5132
|
* @param options.withoutSave — не сохранять состояние в историю
|
|
5007
5133
|
* @param options.skipRender — не вызывать перерисовку канваса
|
|
5008
5134
|
*/
|
|
5009
|
-
updateText({
|
|
5010
|
-
|
|
5135
|
+
updateText({
|
|
5136
|
+
target: t,
|
|
5137
|
+
style: e = {},
|
|
5138
|
+
withoutSave: s,
|
|
5139
|
+
skipRender: n
|
|
5140
|
+
} = {}) {
|
|
5141
|
+
var Ft, Ht, Zt, Gt, Vt, Xt, Et;
|
|
5011
5142
|
const o = this._resolveTextObject(t);
|
|
5012
5143
|
if (!o) return null;
|
|
5013
5144
|
const { historyManager: i } = this.editor, { canvas: a } = this;
|
|
5014
5145
|
i.suspendHistory();
|
|
5015
|
-
const r =
|
|
5146
|
+
const r = W._getSnapshot(o), c = (Ft = o.originY) != null ? Ft : "top", d = o.getPointByOrigin("center", c), l = {
|
|
5016
5147
|
originY: c,
|
|
5017
5148
|
x: d.x,
|
|
5018
5149
|
y: d.y
|
|
5019
|
-
},
|
|
5150
|
+
}, Yt = e, {
|
|
5020
5151
|
text: u,
|
|
5021
|
-
|
|
5022
|
-
|
|
5023
|
-
|
|
5024
|
-
|
|
5025
|
-
|
|
5026
|
-
|
|
5027
|
-
|
|
5028
|
-
|
|
5029
|
-
|
|
5030
|
-
|
|
5031
|
-
|
|
5032
|
-
|
|
5033
|
-
|
|
5034
|
-
|
|
5035
|
-
|
|
5036
|
-
|
|
5037
|
-
|
|
5038
|
-
|
|
5039
|
-
|
|
5040
|
-
|
|
5041
|
-
|
|
5042
|
-
|
|
5043
|
-
|
|
5152
|
+
autoExpand: f,
|
|
5153
|
+
fontFamily: g,
|
|
5154
|
+
fontSize: p,
|
|
5155
|
+
bold: m,
|
|
5156
|
+
italic: v,
|
|
5157
|
+
underline: S,
|
|
5158
|
+
uppercase: A,
|
|
5159
|
+
strikethrough: y,
|
|
5160
|
+
align: M,
|
|
5161
|
+
color: j,
|
|
5162
|
+
strokeColor: I,
|
|
5163
|
+
strokeWidth: w,
|
|
5164
|
+
opacity: T,
|
|
5165
|
+
backgroundColor: b,
|
|
5166
|
+
backgroundOpacity: C,
|
|
5167
|
+
paddingTop: E,
|
|
5168
|
+
paddingRight: x,
|
|
5169
|
+
paddingBottom: N,
|
|
5170
|
+
paddingLeft: B,
|
|
5171
|
+
radiusTopLeft: H,
|
|
5172
|
+
radiusTopRight: Z,
|
|
5173
|
+
radiusBottomRight: $,
|
|
5174
|
+
radiusBottomLeft: Y
|
|
5175
|
+
} = Yt, st = gt(Yt, [
|
|
5044
5176
|
"text",
|
|
5177
|
+
"autoExpand",
|
|
5045
5178
|
"fontFamily",
|
|
5046
5179
|
"fontSize",
|
|
5047
5180
|
"bold",
|
|
@@ -5064,58 +5197,60 @@ class k {
|
|
|
5064
5197
|
"radiusTopRight",
|
|
5065
5198
|
"radiusBottomRight",
|
|
5066
5199
|
"radiusBottomLeft"
|
|
5067
|
-
]),
|
|
5068
|
-
if (
|
|
5069
|
-
const
|
|
5070
|
-
O && (
|
|
5071
|
-
}
|
|
5072
|
-
if (
|
|
5073
|
-
const
|
|
5074
|
-
O && (
|
|
5075
|
-
}
|
|
5076
|
-
if (
|
|
5077
|
-
const
|
|
5078
|
-
strokeColor:
|
|
5079
|
-
width:
|
|
5200
|
+
]), _ = P({}, st), O = cn({ textbox: o }), it = O ? W._expandRangeToFullLines({ textbox: o, range: O }) : null, X = {}, V = {}, k = {}, zt = ln({ textbox: o, range: O }), Q = !O || zt, nt = !O;
|
|
5201
|
+
if (g !== void 0 && (it && (V.fontFamily = g), Q && (_.fontFamily = g, nt && (k.fontFamily = g))), p !== void 0 && (it && (V.fontSize = p), Q && (_.fontSize = p, nt && (k.fontSize = p))), m !== void 0) {
|
|
5202
|
+
const q = m ? "bold" : "normal";
|
|
5203
|
+
O && (X.fontWeight = q), Q && (_.fontWeight = q, nt && (k.fontWeight = q));
|
|
5204
|
+
}
|
|
5205
|
+
if (v !== void 0) {
|
|
5206
|
+
const q = v ? "italic" : "normal";
|
|
5207
|
+
O && (X.fontStyle = q), Q && (_.fontStyle = q, nt && (k.fontStyle = q));
|
|
5208
|
+
}
|
|
5209
|
+
if (S !== void 0 && (O && (X.underline = S), Q && (_.underline = S, nt && (k.underline = S))), y !== void 0 && (O && (X.linethrough = y), Q && (_.linethrough = y, nt && (k.linethrough = y))), M !== void 0 && (_.textAlign = M), j !== void 0 && (O && (X.fill = j), Q && (_.fill = j, nt && (k.fill = j))), I !== void 0 || w !== void 0) {
|
|
5210
|
+
const q = O ? Je({ textbox: o, range: O, property: "strokeWidth" }) : void 0, Ot = O ? Je({ textbox: o, range: O, property: "stroke" }) : void 0, Kt = (Zt = (Ht = w != null ? w : q) != null ? Ht : o.strokeWidth) != null ? Zt : 0, Lt = $e({ width: Kt }), Dt = (Vt = (Gt = I != null ? I : Ot) != null ? Gt : o.stroke) != null ? Vt : void 0, _t = Qe({
|
|
5211
|
+
strokeColor: Dt,
|
|
5212
|
+
width: Lt
|
|
5080
5213
|
});
|
|
5081
|
-
O && (
|
|
5082
|
-
}
|
|
5083
|
-
|
|
5084
|
-
const
|
|
5085
|
-
if (
|
|
5086
|
-
const
|
|
5087
|
-
|
|
5088
|
-
} else o.textCaseRaw === void 0 && (o.textCaseRaw =
|
|
5089
|
-
o.uppercase =
|
|
5090
|
-
let
|
|
5214
|
+
O && (X.stroke = _t, X.strokeWidth = Lt), Q && (_.stroke = _t, _.strokeWidth = Lt, nt && (k.stroke = _t, k.strokeWidth = Lt));
|
|
5215
|
+
}
|
|
5216
|
+
T !== void 0 && (_.opacity = T), b !== void 0 && (_.backgroundColor = b), C !== void 0 && (_.backgroundOpacity = C), E !== void 0 && (_.paddingTop = E), x !== void 0 && (_.paddingRight = x), N !== void 0 && (_.paddingBottom = N), B !== void 0 && (_.paddingLeft = B), H !== void 0 && (_.radiusTopLeft = H), Z !== void 0 && (_.radiusTopRight = Z), $ !== void 0 && (_.radiusBottomRight = $), Y !== void 0 && (_.radiusBottomLeft = Y);
|
|
5217
|
+
const It = (Et = o.textCaseRaw) != null ? Et : (Xt = o.text) != null ? Xt : "", ut = !!o.uppercase, ft = u !== void 0, rt = ft ? u != null ? u : "" : It, Ct = A != null ? A : ut, Wt = Ct !== ut;
|
|
5218
|
+
if (ft || Wt) {
|
|
5219
|
+
const q = Ct ? ye({ value: rt }) : rt;
|
|
5220
|
+
_.text = q, o.textCaseRaw = rt;
|
|
5221
|
+
} else o.textCaseRaw === void 0 && (o.textCaseRaw = It);
|
|
5222
|
+
o.uppercase = Ct, o.set(_);
|
|
5223
|
+
let yt = !1;
|
|
5091
5224
|
if (O) {
|
|
5092
|
-
const
|
|
5093
|
-
|
|
5094
|
-
} else if (Object.keys(
|
|
5095
|
-
const
|
|
5096
|
-
|
|
5225
|
+
const q = me({ textbox: o, styles: X, range: O }), Ot = it ? me({ textbox: o, styles: V, range: it }) : !1;
|
|
5226
|
+
yt = q || Ot;
|
|
5227
|
+
} else if (Object.keys(k).length) {
|
|
5228
|
+
const q = dn({ textbox: o });
|
|
5229
|
+
q && (yt = me({ textbox: o, styles: k, range: q }));
|
|
5097
5230
|
}
|
|
5098
|
-
const
|
|
5231
|
+
const te = yt && W._hasLayoutAffectingStyles({
|
|
5099
5232
|
stylesList: [
|
|
5100
|
-
|
|
5101
|
-
|
|
5102
|
-
|
|
5233
|
+
X,
|
|
5234
|
+
V,
|
|
5235
|
+
k
|
|
5103
5236
|
]
|
|
5104
5237
|
});
|
|
5105
|
-
|
|
5106
|
-
const
|
|
5238
|
+
yt && (o.dirty = !0), te && (o.initDimensions(), o.dirty = !0), (b !== void 0 || C !== void 0 || E !== void 0 || x !== void 0 || N !== void 0 || B !== void 0 || H !== void 0 || Z !== void 0 || $ !== void 0 || Y !== void 0) && (o.dirty = !0);
|
|
5239
|
+
const vt = W._hasLayoutAffectingStyles({
|
|
5107
5240
|
stylesList: [
|
|
5108
|
-
|
|
5109
|
-
|
|
5110
|
-
|
|
5111
|
-
|
|
5241
|
+
_,
|
|
5242
|
+
X,
|
|
5243
|
+
V,
|
|
5244
|
+
k
|
|
5112
5245
|
]
|
|
5113
|
-
}),
|
|
5114
|
-
|
|
5115
|
-
|
|
5246
|
+
}), { autoExpand: Ut } = o, bt = f !== void 0, ee = (f != null ? f : Ut) !== !1;
|
|
5247
|
+
bt ? o.autoExpand = f !== !1 : Ut === void 0 && (o.autoExpand = !0);
|
|
5248
|
+
const se = Object.prototype.hasOwnProperty.call(_, "width"), ne = ee && !se && (ft || Wt || vt);
|
|
5249
|
+
let Tt = !1;
|
|
5250
|
+
ne && (Tt = this._autoExpandTextboxWidth(o, {
|
|
5116
5251
|
anchor: l
|
|
5117
|
-
}),
|
|
5118
|
-
const
|
|
5252
|
+
}), Tt && (o.dirty = !0)), (Tt ? !1 : W._roundTextboxDimensions({ textbox: o })) && (o.dirty = !0), o.setCoords(), n || a.requestRenderAll(), i.resumeHistory(), s || i.saveState();
|
|
5253
|
+
const oe = W._getSnapshot(o);
|
|
5119
5254
|
return a.fire("editor:text-updated", {
|
|
5120
5255
|
textbox: o,
|
|
5121
5256
|
target: t,
|
|
@@ -5124,11 +5259,11 @@ class k {
|
|
|
5124
5259
|
withoutSave: !!s,
|
|
5125
5260
|
skipRender: !!n
|
|
5126
5261
|
},
|
|
5127
|
-
updates:
|
|
5262
|
+
updates: _,
|
|
5128
5263
|
before: r,
|
|
5129
|
-
after:
|
|
5264
|
+
after: oe,
|
|
5130
5265
|
selectionRange: O != null ? O : void 0,
|
|
5131
|
-
selectionStyles: O && Object.keys(
|
|
5266
|
+
selectionStyles: O && Object.keys(X).length ? X : void 0
|
|
5132
5267
|
}), o;
|
|
5133
5268
|
}
|
|
5134
5269
|
/**
|
|
@@ -5136,20 +5271,20 @@ class k {
|
|
|
5136
5271
|
*/
|
|
5137
5272
|
destroy() {
|
|
5138
5273
|
const { canvas: t } = this;
|
|
5139
|
-
t.off("object:scaling", this._handleObjectScaling), t.off("object:resizing",
|
|
5274
|
+
t.off("object:scaling", this._handleObjectScaling), t.off("object:resizing", W._handleObjectResizing), t.off("object:modified", this._handleObjectModified), t.off("text:editing:exited", this._handleTextEditingExited), t.off("text:editing:entered", this._handleTextEditingEntered), t.off("text:changed", this._handleTextChanged);
|
|
5140
5275
|
}
|
|
5141
5276
|
/**
|
|
5142
5277
|
* Возвращает активный текст или ищет по id.
|
|
5143
5278
|
*/
|
|
5144
5279
|
_resolveTextObject(t) {
|
|
5145
|
-
if (t instanceof
|
|
5280
|
+
if (t instanceof at) return t;
|
|
5146
5281
|
const { canvas: e } = this;
|
|
5147
5282
|
if (!t) {
|
|
5148
5283
|
const s = e.getActiveObject();
|
|
5149
|
-
return
|
|
5284
|
+
return W._isTextbox(s) ? s : null;
|
|
5150
5285
|
}
|
|
5151
5286
|
if (typeof t == "string") {
|
|
5152
|
-
const s = e.getObjects().find((n) =>
|
|
5287
|
+
const s = e.getObjects().find((n) => W._isTextbox(n) && n.id === t);
|
|
5153
5288
|
return s != null ? s : null;
|
|
5154
5289
|
}
|
|
5155
5290
|
return null;
|
|
@@ -5158,29 +5293,29 @@ class k {
|
|
|
5158
5293
|
* Проверяет, является ли объект текстовым блоком редактора.
|
|
5159
5294
|
*/
|
|
5160
5295
|
static _isTextbox(t) {
|
|
5161
|
-
return !!t && t instanceof
|
|
5296
|
+
return !!t && t instanceof at;
|
|
5162
5297
|
}
|
|
5163
5298
|
/**
|
|
5164
5299
|
* Вешает обработчики событий Fabric для работы с текстом.
|
|
5165
5300
|
*/
|
|
5166
5301
|
_bindEvents() {
|
|
5167
5302
|
const { canvas: t } = this;
|
|
5168
|
-
t.on("object:scaling", this._handleObjectScaling), t.on("object:resizing",
|
|
5303
|
+
t.on("object:scaling", this._handleObjectScaling), t.on("object:resizing", W._handleObjectResizing), t.on("object:modified", this._handleObjectModified), t.on("text:editing:entered", this._handleTextEditingEntered), t.on("text:editing:exited", this._handleTextEditingExited), t.on("text:changed", this._handleTextChanged);
|
|
5169
5304
|
}
|
|
5170
5305
|
/**
|
|
5171
5306
|
* Автоматически увеличивает ширину текстового объекта до ширины текста,
|
|
5172
5307
|
* но не шире монтажной области, и удерживает объект в её пределах.
|
|
5173
5308
|
*/
|
|
5174
5309
|
_autoExpandTextboxWidth(t, { anchor: e } = {}) {
|
|
5175
|
-
var
|
|
5310
|
+
var I, w, T, b, C, E, x, N, B, H, Z, $, Y;
|
|
5176
5311
|
const { montageArea: s } = this.editor;
|
|
5177
5312
|
if (!s) return !1;
|
|
5178
5313
|
const n = typeof t.text == "string" ? t.text : "";
|
|
5179
5314
|
if (!n.length) return !1;
|
|
5180
5315
|
s.setCoords();
|
|
5181
|
-
const o = s.getBoundingRect(!1, !0), i = (
|
|
5316
|
+
const o = s.getBoundingRect(!1, !0), i = (I = o.width) != null ? I : 0;
|
|
5182
5317
|
if (!Number.isFinite(i) || i <= 0) return !1;
|
|
5183
|
-
const a = e != null ? e : (
|
|
5318
|
+
const a = e != null ? e : (w = this.editingAnchorState) == null ? void 0 : w.get(t), r = (b = (T = a == null ? void 0 : a.originY) != null ? T : t.originY) != null ? b : "top", c = Math.abs((C = t.scaleX) != null ? C : 1) || 1, d = (E = t.paddingLeft) != null ? E : 0, l = (x = t.paddingRight) != null ? x : 0, u = (N = t.strokeWidth) != null ? N : 0, f = Math.max(
|
|
5184
5319
|
1,
|
|
5185
5320
|
i / c - d - l - u
|
|
5186
5321
|
);
|
|
@@ -5188,19 +5323,19 @@ class k {
|
|
|
5188
5323
|
const g = n.split(`
|
|
5189
5324
|
`).length;
|
|
5190
5325
|
let p = !1;
|
|
5191
|
-
Math.abs(((
|
|
5192
|
-
const { textLines: m } = t, v = Array.isArray(m) && m.length > g,
|
|
5193
|
-
|
|
5194
|
-
), A = Math.min((
|
|
5326
|
+
Math.abs(((B = t.width) != null ? B : 0) - f) > tt && (t.set({ width: f }), p = !0), t.initDimensions();
|
|
5327
|
+
const { textLines: m } = t, v = Array.isArray(m) && m.length > g, S = Math.ceil(
|
|
5328
|
+
W._getLongestLineWidth({ textbox: t, text: n })
|
|
5329
|
+
), A = Math.min((H = t.minWidth) != null ? H : 1, f);
|
|
5195
5330
|
let y = Math.min(
|
|
5196
5331
|
f,
|
|
5197
|
-
Math.max(
|
|
5332
|
+
Math.max(S, A)
|
|
5198
5333
|
);
|
|
5199
|
-
v && (y = f), Math.abs(((
|
|
5200
|
-
const j =
|
|
5334
|
+
v && (y = f), Math.abs(((Z = t.width) != null ? Z : 0) - y) > tt && (t.set({ width: y }), t.initDimensions(), p = !0), W._roundTextboxDimensions({ textbox: t }) && (p = !0), a && (t.setPositionByOrigin(new et(a.x, a.y), "center", r), p = !0);
|
|
5335
|
+
const j = W._clampTextboxToMontage({
|
|
5201
5336
|
textbox: t,
|
|
5202
|
-
montageLeft: (
|
|
5203
|
-
montageRight: ((
|
|
5337
|
+
montageLeft: ($ = o.left) != null ? $ : 0,
|
|
5338
|
+
montageRight: ((Y = o.left) != null ? Y : 0) + i
|
|
5204
5339
|
});
|
|
5205
5340
|
return p || j;
|
|
5206
5341
|
}
|
|
@@ -5245,7 +5380,7 @@ class k {
|
|
|
5245
5380
|
static _handleObjectResizing(t) {
|
|
5246
5381
|
var l, u, f, g, p, m;
|
|
5247
5382
|
const { target: e, transform: s } = t;
|
|
5248
|
-
if (!
|
|
5383
|
+
if (!W._isTextbox(e)) return;
|
|
5249
5384
|
const {
|
|
5250
5385
|
paddingLeft: n = 0,
|
|
5251
5386
|
paddingRight: o = 0
|
|
@@ -5256,7 +5391,7 @@ class k {
|
|
|
5256
5391
|
e.set({ width: r });
|
|
5257
5392
|
const c = (u = e.width) != null ? u : 0, d = a - c;
|
|
5258
5393
|
if (d !== 0 && s && s.corner === "ml") {
|
|
5259
|
-
const
|
|
5394
|
+
const S = ((f = e.angle) != null ? f : 0) * Math.PI / 180, A = Math.cos(S), y = Math.sin(S), M = (g = e.scaleX) != null ? g : 1, j = d * M;
|
|
5260
5395
|
e.set({
|
|
5261
5396
|
left: ((p = e.left) != null ? p : 0) + j * A,
|
|
5262
5397
|
top: ((m = e.top) != null ? m : 0) + j * y
|
|
@@ -5291,7 +5426,7 @@ class k {
|
|
|
5291
5426
|
textbox: t,
|
|
5292
5427
|
range: e
|
|
5293
5428
|
}) {
|
|
5294
|
-
const s =
|
|
5429
|
+
const s = W._getLineRanges({ textbox: t });
|
|
5295
5430
|
if (!s.length) return e;
|
|
5296
5431
|
let { start: n } = e, { end: o } = e;
|
|
5297
5432
|
return s.forEach(({ start: i, end: a }) => {
|
|
@@ -5376,10 +5511,10 @@ class k {
|
|
|
5376
5511
|
static _roundTextboxDimensions({
|
|
5377
5512
|
textbox: t
|
|
5378
5513
|
}) {
|
|
5379
|
-
const { width: e, height: s, calcTextWidth: n, calcTextHeight: o } = t, i = typeof n == "function" ? n.call(t) : void 0, a = typeof o == "function" ? o.call(t) : void 0, r =
|
|
5514
|
+
const { width: e, height: s, calcTextWidth: n, calcTextHeight: o } = t, i = typeof n == "function" ? n.call(t) : void 0, a = typeof o == "function" ? o.call(t) : void 0, r = W._resolveDimension({
|
|
5380
5515
|
rawValue: e,
|
|
5381
5516
|
calculatedValue: i
|
|
5382
|
-
}), c =
|
|
5517
|
+
}), c = W._resolveDimension({
|
|
5383
5518
|
rawValue: s,
|
|
5384
5519
|
calculatedValue: a
|
|
5385
5520
|
}), d = Number.isFinite(r) ? Math.round(r) : null, l = Number.isFinite(c) ? Math.round(c) : null, u = {};
|
|
@@ -5390,84 +5525,86 @@ class k {
|
|
|
5390
5525
|
*/
|
|
5391
5526
|
static _getSnapshot(t) {
|
|
5392
5527
|
const e = ({
|
|
5393
|
-
snapshot:
|
|
5528
|
+
snapshot: _,
|
|
5394
5529
|
entries: O
|
|
5395
5530
|
}) => {
|
|
5396
|
-
Object.entries(O).forEach(([
|
|
5397
|
-
|
|
5531
|
+
Object.entries(O).forEach(([it, X]) => {
|
|
5532
|
+
X != null && (_[it] = X);
|
|
5398
5533
|
});
|
|
5399
5534
|
}, {
|
|
5400
5535
|
id: s,
|
|
5401
5536
|
text: n,
|
|
5402
5537
|
textCaseRaw: o,
|
|
5403
5538
|
uppercase: i,
|
|
5404
|
-
|
|
5405
|
-
|
|
5406
|
-
|
|
5407
|
-
|
|
5408
|
-
|
|
5409
|
-
|
|
5410
|
-
|
|
5411
|
-
|
|
5412
|
-
|
|
5413
|
-
|
|
5414
|
-
|
|
5415
|
-
|
|
5416
|
-
|
|
5417
|
-
|
|
5418
|
-
|
|
5419
|
-
|
|
5420
|
-
|
|
5421
|
-
|
|
5422
|
-
|
|
5423
|
-
|
|
5424
|
-
|
|
5425
|
-
|
|
5426
|
-
|
|
5427
|
-
|
|
5428
|
-
|
|
5429
|
-
|
|
5430
|
-
|
|
5431
|
-
|
|
5432
|
-
|
|
5539
|
+
autoExpand: a,
|
|
5540
|
+
fontFamily: r,
|
|
5541
|
+
fontSize: c,
|
|
5542
|
+
fontWeight: d,
|
|
5543
|
+
fontStyle: l,
|
|
5544
|
+
underline: u,
|
|
5545
|
+
linethrough: f,
|
|
5546
|
+
textAlign: g,
|
|
5547
|
+
fill: p,
|
|
5548
|
+
stroke: m,
|
|
5549
|
+
strokeWidth: v,
|
|
5550
|
+
opacity: S,
|
|
5551
|
+
backgroundColor: A,
|
|
5552
|
+
backgroundOpacity: y,
|
|
5553
|
+
paddingTop: M,
|
|
5554
|
+
paddingRight: j,
|
|
5555
|
+
paddingBottom: I,
|
|
5556
|
+
paddingLeft: w,
|
|
5557
|
+
radiusTopLeft: T,
|
|
5558
|
+
radiusTopRight: b,
|
|
5559
|
+
radiusBottomRight: C,
|
|
5560
|
+
radiusBottomLeft: E,
|
|
5561
|
+
left: x,
|
|
5562
|
+
top: N,
|
|
5563
|
+
width: B,
|
|
5564
|
+
height: H,
|
|
5565
|
+
angle: Z,
|
|
5566
|
+
scaleX: $,
|
|
5567
|
+
scaleY: Y
|
|
5568
|
+
} = t, st = {
|
|
5433
5569
|
id: s,
|
|
5434
5570
|
uppercase: !!i,
|
|
5435
|
-
textAlign:
|
|
5571
|
+
textAlign: g
|
|
5436
5572
|
};
|
|
5437
5573
|
return e({
|
|
5438
|
-
snapshot:
|
|
5574
|
+
snapshot: st,
|
|
5439
5575
|
entries: {
|
|
5440
5576
|
text: n,
|
|
5441
5577
|
textCaseRaw: o,
|
|
5442
|
-
|
|
5443
|
-
|
|
5444
|
-
|
|
5445
|
-
|
|
5446
|
-
|
|
5447
|
-
|
|
5448
|
-
|
|
5449
|
-
|
|
5450
|
-
|
|
5451
|
-
|
|
5452
|
-
|
|
5453
|
-
|
|
5454
|
-
|
|
5455
|
-
|
|
5456
|
-
|
|
5457
|
-
|
|
5458
|
-
|
|
5459
|
-
|
|
5460
|
-
|
|
5461
|
-
|
|
5462
|
-
|
|
5463
|
-
|
|
5464
|
-
|
|
5465
|
-
|
|
5466
|
-
|
|
5467
|
-
|
|
5468
|
-
|
|
5578
|
+
autoExpand: a,
|
|
5579
|
+
fontFamily: r,
|
|
5580
|
+
fontSize: c,
|
|
5581
|
+
fontWeight: d,
|
|
5582
|
+
fontStyle: l,
|
|
5583
|
+
underline: u,
|
|
5584
|
+
linethrough: f,
|
|
5585
|
+
fill: p,
|
|
5586
|
+
stroke: m,
|
|
5587
|
+
strokeWidth: v,
|
|
5588
|
+
opacity: S,
|
|
5589
|
+
backgroundColor: A,
|
|
5590
|
+
backgroundOpacity: y,
|
|
5591
|
+
paddingTop: M,
|
|
5592
|
+
paddingRight: j,
|
|
5593
|
+
paddingBottom: I,
|
|
5594
|
+
paddingLeft: w,
|
|
5595
|
+
radiusTopLeft: T,
|
|
5596
|
+
radiusTopRight: b,
|
|
5597
|
+
radiusBottomRight: C,
|
|
5598
|
+
radiusBottomLeft: E,
|
|
5599
|
+
left: x,
|
|
5600
|
+
top: N,
|
|
5601
|
+
width: B,
|
|
5602
|
+
height: H,
|
|
5603
|
+
angle: Z,
|
|
5604
|
+
scaleX: $,
|
|
5605
|
+
scaleY: Y
|
|
5469
5606
|
}
|
|
5470
|
-
}),
|
|
5607
|
+
}), st;
|
|
5471
5608
|
}
|
|
5472
5609
|
/**
|
|
5473
5610
|
* Возвращает первый доступный шрифт или дефолтный Arial.
|
|
@@ -5480,14 +5617,14 @@ class k {
|
|
|
5480
5617
|
const J = ({
|
|
5481
5618
|
value: h,
|
|
5482
5619
|
fallback: t = 0
|
|
5483
|
-
}) => typeof h == "number" && Number.isFinite(h) ? h : typeof t == "number" && Number.isFinite(t) ? t : 0,
|
|
5620
|
+
}) => typeof h == "number" && Number.isFinite(h) ? h : typeof t == "number" && Number.isFinite(t) ? t : 0, ce = ({
|
|
5484
5621
|
value: h,
|
|
5485
5622
|
dimension: t,
|
|
5486
5623
|
useRelativePositions: e
|
|
5487
5624
|
}) => {
|
|
5488
5625
|
const s = J({ value: h });
|
|
5489
5626
|
return e ? s : s / (t || 1);
|
|
5490
|
-
},
|
|
5627
|
+
}, hn = ({
|
|
5491
5628
|
object: h,
|
|
5492
5629
|
baseWidth: t,
|
|
5493
5630
|
baseHeight: e,
|
|
@@ -5497,22 +5634,22 @@ const J = ({
|
|
|
5497
5634
|
const o = h;
|
|
5498
5635
|
if (typeof o[n.x] == "number" && typeof o[n.y] == "number")
|
|
5499
5636
|
return {
|
|
5500
|
-
x:
|
|
5637
|
+
x: ce({
|
|
5501
5638
|
value: o[n.x],
|
|
5502
5639
|
dimension: t,
|
|
5503
5640
|
useRelativePositions: s
|
|
5504
5641
|
}),
|
|
5505
|
-
y:
|
|
5642
|
+
y: ce({
|
|
5506
5643
|
value: o[n.y],
|
|
5507
5644
|
dimension: e,
|
|
5508
5645
|
useRelativePositions: s
|
|
5509
5646
|
})
|
|
5510
5647
|
};
|
|
5511
|
-
const { left: a, top: r, width: c, height: d } = h, l =
|
|
5648
|
+
const { left: a, top: r, width: c, height: d } = h, l = ce({
|
|
5512
5649
|
value: a,
|
|
5513
5650
|
dimension: t,
|
|
5514
5651
|
useRelativePositions: s
|
|
5515
|
-
}), u =
|
|
5652
|
+
}), u = ce({
|
|
5516
5653
|
value: r,
|
|
5517
5654
|
dimension: e,
|
|
5518
5655
|
useRelativePositions: s
|
|
@@ -5521,7 +5658,7 @@ const J = ({
|
|
|
5521
5658
|
x: l + f / 2,
|
|
5522
5659
|
y: u + g / 2
|
|
5523
5660
|
};
|
|
5524
|
-
},
|
|
5661
|
+
}, un = ({
|
|
5525
5662
|
normalizedX: h,
|
|
5526
5663
|
normalizedY: t,
|
|
5527
5664
|
bounds: e,
|
|
@@ -5535,7 +5672,7 @@ const J = ({
|
|
|
5535
5672
|
}
|
|
5536
5673
|
const c = o + h * a, d = i + t * r;
|
|
5537
5674
|
return new et(c, d);
|
|
5538
|
-
},
|
|
5675
|
+
}, fn = ({
|
|
5539
5676
|
object: h,
|
|
5540
5677
|
montageArea: t,
|
|
5541
5678
|
bounds: e
|
|
@@ -5550,7 +5687,7 @@ const J = ({
|
|
|
5550
5687
|
} catch (s) {
|
|
5551
5688
|
return null;
|
|
5552
5689
|
}
|
|
5553
|
-
},
|
|
5690
|
+
}, mt = ({
|
|
5554
5691
|
object: h
|
|
5555
5692
|
}) => {
|
|
5556
5693
|
if (!h) return null;
|
|
@@ -5573,12 +5710,12 @@ const J = ({
|
|
|
5573
5710
|
} catch (t) {
|
|
5574
5711
|
return null;
|
|
5575
5712
|
}
|
|
5576
|
-
},
|
|
5713
|
+
}, gn = ({
|
|
5577
5714
|
x1: h,
|
|
5578
5715
|
y1: t,
|
|
5579
5716
|
x2: e,
|
|
5580
5717
|
y2: s
|
|
5581
|
-
}) => (Math.atan2(s - t, e - h) * 180 / Math.PI + 360) % 360,
|
|
5718
|
+
}) => (Math.atan2(s - t, e - h) * 180 / Math.PI + 360) % 360, pn = (h) => {
|
|
5582
5719
|
if (!h || typeof h != "object") return null;
|
|
5583
5720
|
const { type: t, coords: e, colorStops: s } = h, n = Array.isArray(s) ? s : [], o = n[0], i = n[n.length - 1], a = typeof (o == null ? void 0 : o.color) == "string" ? o.color : void 0, r = typeof (i == null ? void 0 : i.color) == "string" ? i.color : a, c = typeof (o == null ? void 0 : o.offset) == "number" ? o.offset * 100 : void 0, d = typeof (i == null ? void 0 : i.offset) == "number" ? i.offset * 100 : void 0, l = n.map((u) => ({
|
|
5584
5721
|
color: typeof u.color == "string" ? u.color : "#000000",
|
|
@@ -5590,7 +5727,7 @@ const J = ({
|
|
|
5590
5727
|
if (typeof u == "number" && typeof f == "number" && typeof g == "number" && typeof p == "number")
|
|
5591
5728
|
return {
|
|
5592
5729
|
type: "linear",
|
|
5593
|
-
angle:
|
|
5730
|
+
angle: gn({ x1: u, y1: f, x2: g, y2: p }),
|
|
5594
5731
|
startColor: a,
|
|
5595
5732
|
endColor: r,
|
|
5596
5733
|
startPosition: c,
|
|
@@ -5614,8 +5751,8 @@ const J = ({
|
|
|
5614
5751
|
};
|
|
5615
5752
|
}
|
|
5616
5753
|
return null;
|
|
5617
|
-
},
|
|
5618
|
-
class
|
|
5754
|
+
}, Qt = "_templateCenterX", ve = "_templateCenterY", de = "_templateAnchorX", be = "_templateAnchorY";
|
|
5755
|
+
class R {
|
|
5619
5756
|
constructor({ editor: t }) {
|
|
5620
5757
|
this.editor = t;
|
|
5621
5758
|
}
|
|
@@ -5634,30 +5771,30 @@ class _ {
|
|
|
5634
5771
|
montageArea: i,
|
|
5635
5772
|
errorManager: a,
|
|
5636
5773
|
backgroundManager: r
|
|
5637
|
-
} = this.editor, c = o.getActiveObject(), d =
|
|
5774
|
+
} = this.editor, c = o.getActiveObject(), d = R._collectObjects(c), { backgroundObject: l } = r != null ? r : {}, u = n && l ? [l] : [], f = [...d, ...u];
|
|
5638
5775
|
if (!f.length)
|
|
5639
5776
|
return a.emitWarning({
|
|
5640
5777
|
origin: "TemplateManager",
|
|
5641
5778
|
method: "serializeSelection",
|
|
5642
|
-
code:
|
|
5779
|
+
code: wt.TEMPLATE_MANAGER.NO_OBJECTS_SELECTED,
|
|
5643
5780
|
message: "Нет объектов для сериализации шаблона"
|
|
5644
5781
|
}), null;
|
|
5645
|
-
const g =
|
|
5646
|
-
object:
|
|
5782
|
+
const g = R._getBounds(i), p = R._getMontageSize({ montageArea: i, bounds: g }), m = p.width, v = p.height, S = f.map((M) => R._serializeObject({
|
|
5783
|
+
object: M,
|
|
5647
5784
|
bounds: g,
|
|
5648
5785
|
baseWidth: m,
|
|
5649
5786
|
baseHeight: v,
|
|
5650
5787
|
montageArea: i != null ? i : null
|
|
5651
|
-
})), A = St(
|
|
5788
|
+
})), A = St(P({}, s), {
|
|
5652
5789
|
baseWidth: m,
|
|
5653
5790
|
baseHeight: v,
|
|
5654
5791
|
positionsNormalized: !0,
|
|
5655
5792
|
previewId: e != null ? e : s.previewId
|
|
5656
5793
|
});
|
|
5657
5794
|
return {
|
|
5658
|
-
id: t != null ? t : `template-${
|
|
5795
|
+
id: t != null ? t : `template-${K()}`,
|
|
5659
5796
|
meta: A,
|
|
5660
|
-
objects:
|
|
5797
|
+
objects: S
|
|
5661
5798
|
};
|
|
5662
5799
|
}
|
|
5663
5800
|
/**
|
|
@@ -5667,7 +5804,7 @@ class _ {
|
|
|
5667
5804
|
* @param options.data - данные для заполнения текстов по customData.templateField
|
|
5668
5805
|
*/
|
|
5669
5806
|
applyTemplate(s) {
|
|
5670
|
-
return
|
|
5807
|
+
return z(this, arguments, function* ({
|
|
5671
5808
|
template: t,
|
|
5672
5809
|
data: e
|
|
5673
5810
|
}) {
|
|
@@ -5682,40 +5819,40 @@ class _ {
|
|
|
5682
5819
|
return a.emitWarning({
|
|
5683
5820
|
origin: "TemplateManager",
|
|
5684
5821
|
method: "applyTemplate",
|
|
5685
|
-
code:
|
|
5822
|
+
code: wt.TEMPLATE_MANAGER.INVALID_TEMPLATE,
|
|
5686
5823
|
message: "Шаблон не содержит объектов"
|
|
5687
5824
|
}), null;
|
|
5688
|
-
const u =
|
|
5825
|
+
const u = R._getBounds(o);
|
|
5689
5826
|
if (!u)
|
|
5690
5827
|
return a.emitWarning({
|
|
5691
5828
|
origin: "TemplateManager",
|
|
5692
5829
|
method: "applyTemplate",
|
|
5693
|
-
code:
|
|
5830
|
+
code: wt.TEMPLATE_MANAGER.INVALID_TARGET,
|
|
5694
5831
|
message: "Не удалось определить границы монтажной области"
|
|
5695
5832
|
}), null;
|
|
5696
|
-
const f =
|
|
5697
|
-
let v = !1,
|
|
5833
|
+
const f = R._getMontageSize({ montageArea: o, bounds: u }), g = R._normalizeMeta({ meta: d, fallback: f }), p = R._calculateScale({ meta: g, target: f }), m = !!g.positionsNormalized;
|
|
5834
|
+
let v = !1, S = !1;
|
|
5698
5835
|
i.suspendHistory();
|
|
5699
5836
|
try {
|
|
5700
|
-
const A = yield
|
|
5837
|
+
const A = yield R._enlivenObjects(c);
|
|
5701
5838
|
if (!A.length)
|
|
5702
5839
|
return a.emitWarning({
|
|
5703
5840
|
origin: "TemplateManager",
|
|
5704
5841
|
method: "applyTemplate",
|
|
5705
|
-
code:
|
|
5842
|
+
code: wt.TEMPLATE_MANAGER.INVALID_TEMPLATE,
|
|
5706
5843
|
message: "Не удалось создать объекты шаблона"
|
|
5707
5844
|
}), null;
|
|
5708
|
-
const { backgroundObject: y, contentObjects:
|
|
5709
|
-
y && (
|
|
5845
|
+
const { backgroundObject: y, contentObjects: M } = R._extractBackgroundObject(A);
|
|
5846
|
+
y && (S = yield R._applyBackgroundFromObject({
|
|
5710
5847
|
backgroundObject: y,
|
|
5711
5848
|
backgroundManager: r,
|
|
5712
5849
|
errorManager: a
|
|
5713
5850
|
}));
|
|
5714
|
-
const j =
|
|
5715
|
-
object:
|
|
5851
|
+
const j = M.map((I) => (this._adaptTextboxWidth({
|
|
5852
|
+
object: I,
|
|
5716
5853
|
baseWidth: g.baseWidth
|
|
5717
|
-
}),
|
|
5718
|
-
object:
|
|
5854
|
+
}), R._transformObject({
|
|
5855
|
+
object: I,
|
|
5719
5856
|
scale: p,
|
|
5720
5857
|
bounds: u,
|
|
5721
5858
|
targetSize: f,
|
|
@@ -5723,11 +5860,11 @@ class _ {
|
|
|
5723
5860
|
baseHeight: g.baseHeight,
|
|
5724
5861
|
montageArea: o,
|
|
5725
5862
|
useRelativePositions: m
|
|
5726
|
-
}),
|
|
5727
|
-
id: `${
|
|
5863
|
+
}), I.set({
|
|
5864
|
+
id: `${I.type}-${K()}`,
|
|
5728
5865
|
evented: !0
|
|
5729
|
-
}), n.add(
|
|
5730
|
-
return !j.length && !
|
|
5866
|
+
}), n.add(I), I));
|
|
5867
|
+
return !j.length && !S ? null : (v = j.length > 0 || S, j.length && R._activateObjects({ canvas: n, objects: j }), n.requestRenderAll(), n.fire("editor:template-applied", {
|
|
5731
5868
|
template: t,
|
|
5732
5869
|
objects: j,
|
|
5733
5870
|
bounds: u
|
|
@@ -5736,7 +5873,7 @@ class _ {
|
|
|
5736
5873
|
return a.emitError({
|
|
5737
5874
|
origin: "TemplateManager",
|
|
5738
5875
|
method: "applyTemplate",
|
|
5739
|
-
code:
|
|
5876
|
+
code: wt.TEMPLATE_MANAGER.APPLY_FAILED,
|
|
5740
5877
|
message: "Ошибка применения шаблона",
|
|
5741
5878
|
data: {
|
|
5742
5879
|
templateId: l,
|
|
@@ -5752,7 +5889,7 @@ class _ {
|
|
|
5752
5889
|
* Подготавливает объекты для сериализации.
|
|
5753
5890
|
*/
|
|
5754
5891
|
static _collectObjects(t) {
|
|
5755
|
-
return t ? t instanceof
|
|
5892
|
+
return t ? t instanceof F ? t.getObjects() : [t] : [];
|
|
5756
5893
|
}
|
|
5757
5894
|
/**
|
|
5758
5895
|
* Возвращает габариты объекта.
|
|
@@ -5776,15 +5913,15 @@ class _ {
|
|
|
5776
5913
|
* Превращает plain-описание объектов в Fabric объекты.
|
|
5777
5914
|
*/
|
|
5778
5915
|
static _enlivenObjects(t) {
|
|
5779
|
-
return
|
|
5780
|
-
return (yield Promise.all(t.map((s) =>
|
|
5781
|
-
if (
|
|
5782
|
-
const i = yield
|
|
5916
|
+
return z(this, null, function* () {
|
|
5917
|
+
return (yield Promise.all(t.map((s) => z(null, null, function* () {
|
|
5918
|
+
if (R._hasSerializedSvgMarkup(s)) {
|
|
5919
|
+
const i = yield R._reviveSvgObject(s);
|
|
5783
5920
|
if (i)
|
|
5784
|
-
return
|
|
5921
|
+
return R._restoreImageScale({ revived: i, serialized: s }), i;
|
|
5785
5922
|
}
|
|
5786
|
-
const n = yield
|
|
5787
|
-
return o ? (
|
|
5923
|
+
const n = yield ht.enlivenObjects([s]), o = n == null ? void 0 : n[0];
|
|
5924
|
+
return o ? (R._restoreImageScale({ revived: o, serialized: s }), o) : null;
|
|
5788
5925
|
})))).filter((s) => !!s);
|
|
5789
5926
|
});
|
|
5790
5927
|
}
|
|
@@ -5812,22 +5949,22 @@ class _ {
|
|
|
5812
5949
|
naturalHeight: 0,
|
|
5813
5950
|
width: 0,
|
|
5814
5951
|
height: 0
|
|
5815
|
-
}, p = J({ value: l || f || c.width, fallback: 0 }), m = J({ value: u || g || c.height, fallback: 0 }), v = J({ value: n, fallback: p }),
|
|
5816
|
-
if (
|
|
5952
|
+
}, p = J({ value: l || f || c.width, fallback: 0 }), m = J({ value: u || g || c.height, fallback: 0 }), v = J({ value: n, fallback: p }), S = J({ value: o, fallback: m }), A = J({ value: i, fallback: c.scaleX || 1 }), y = J({ value: a, fallback: c.scaleY || 1 }), M = v * A, j = S * y, I = p > 0, w = m > 0, T = M > 0, b = j > 0, C = R._resolveImageFit({ customData: r }), E = {};
|
|
5953
|
+
if (I && (E.width = p), w && (E.height = m), !I || !w) {
|
|
5817
5954
|
c.set(E);
|
|
5818
5955
|
return;
|
|
5819
5956
|
}
|
|
5820
|
-
if (
|
|
5821
|
-
const
|
|
5822
|
-
|
|
5957
|
+
if (C === "stretch") {
|
|
5958
|
+
const N = T ? M / p : null, B = b ? j / m : null;
|
|
5959
|
+
N && N > 0 && (E.scaleX = N), B && B > 0 && (E.scaleY = B), c.set(E);
|
|
5823
5960
|
return;
|
|
5824
5961
|
}
|
|
5825
|
-
if (!T || !
|
|
5962
|
+
if (!T || !b) {
|
|
5826
5963
|
c.set(E);
|
|
5827
5964
|
return;
|
|
5828
5965
|
}
|
|
5829
|
-
const
|
|
5830
|
-
Number.isFinite(
|
|
5966
|
+
const x = Math.min(M / p, j / m);
|
|
5967
|
+
Number.isFinite(x) && x > 0 && (E.scaleX = x, E.scaleY = x), c.set(E);
|
|
5831
5968
|
}
|
|
5832
5969
|
/**
|
|
5833
5970
|
* Определяет режим вписывания изображения при восстановлении.
|
|
@@ -5849,12 +5986,12 @@ class _ {
|
|
|
5849
5986
|
* Восстанавливает SVG-объект из компактного описания.
|
|
5850
5987
|
*/
|
|
5851
5988
|
static _reviveSvgObject(t) {
|
|
5852
|
-
return
|
|
5989
|
+
return z(this, null, function* () {
|
|
5853
5990
|
const e = typeof t.svgMarkup == "string" ? t.svgMarkup : null;
|
|
5854
5991
|
if (!e) return null;
|
|
5855
5992
|
try {
|
|
5856
|
-
const s = yield
|
|
5857
|
-
|
|
5993
|
+
const s = yield vs(e), n = ht.groupSVGElements(s.objects, s.options), o = yield ht.enlivenObjectEnlivables(
|
|
5994
|
+
R._prepareSerializableProps(t)
|
|
5858
5995
|
);
|
|
5859
5996
|
return n.set(o), n.setCoords(), n;
|
|
5860
5997
|
} catch (s) {
|
|
@@ -5866,7 +6003,7 @@ class _ {
|
|
|
5866
6003
|
* Убирает технические поля сериализации, оставляя только применимые свойства.
|
|
5867
6004
|
*/
|
|
5868
6005
|
static _prepareSerializableProps(t) {
|
|
5869
|
-
const e =
|
|
6006
|
+
const e = P({}, t);
|
|
5870
6007
|
return delete e.svgMarkup, delete e.objects, delete e.path, delete e.paths, delete e.type, delete e.version, e;
|
|
5871
6008
|
}
|
|
5872
6009
|
/**
|
|
@@ -5912,34 +6049,34 @@ class _ {
|
|
|
5912
6049
|
montageArea: a,
|
|
5913
6050
|
useRelativePositions: r
|
|
5914
6051
|
}) {
|
|
5915
|
-
const c = t, { x: d, y: l } =
|
|
6052
|
+
const c = t, { x: d, y: l } = hn({
|
|
5916
6053
|
object: t,
|
|
5917
6054
|
baseWidth: o,
|
|
5918
6055
|
baseHeight: i,
|
|
5919
6056
|
useRelativePositions: r,
|
|
5920
6057
|
centerKeys: {
|
|
5921
|
-
x:
|
|
5922
|
-
y:
|
|
6058
|
+
x: Qt,
|
|
6059
|
+
y: ve
|
|
5923
6060
|
}
|
|
5924
|
-
}), { scaleX: u, scaleY: f } = t, g = J({ value: u, fallback: 1 }), p = J({ value: f, fallback: 1 }), m =
|
|
6061
|
+
}), { scaleX: u, scaleY: f } = t, g = J({ value: u, fallback: 1 }), p = J({ value: f, fallback: 1 }), m = R._getPositioningBounds({
|
|
5925
6062
|
bounds: s,
|
|
5926
6063
|
baseWidth: o,
|
|
5927
6064
|
baseHeight: i,
|
|
5928
6065
|
scale: e,
|
|
5929
6066
|
useRelativePositions: r,
|
|
5930
|
-
anchorX:
|
|
5931
|
-
anchorY:
|
|
5932
|
-
}), v =
|
|
6067
|
+
anchorX: R._resolveAnchor(c, de),
|
|
6068
|
+
anchorY: R._resolveAnchor(c, be)
|
|
6069
|
+
}), v = un({
|
|
5933
6070
|
normalizedX: d,
|
|
5934
6071
|
normalizedY: l,
|
|
5935
6072
|
bounds: m,
|
|
5936
6073
|
targetSize: n,
|
|
5937
6074
|
montageArea: a
|
|
5938
|
-
}),
|
|
6075
|
+
}), S = g * e, A = p * e;
|
|
5939
6076
|
t.set({
|
|
5940
|
-
scaleX:
|
|
6077
|
+
scaleX: S,
|
|
5941
6078
|
scaleY: A
|
|
5942
|
-
}), t.setPositionByOrigin(v, "center", "center"), t.setCoords(), delete c[
|
|
6079
|
+
}), t.setPositionByOrigin(v, "center", "center"), t.setCoords(), delete c[Qt], delete c[ve], delete c[de], delete c[be];
|
|
5943
6080
|
}
|
|
5944
6081
|
/**
|
|
5945
6082
|
* Возвращает bounds, в которых должны позиционироваться нормализованные объекты.
|
|
@@ -5955,7 +6092,7 @@ class _ {
|
|
|
5955
6092
|
anchorY: a
|
|
5956
6093
|
}) {
|
|
5957
6094
|
if (!o) return t;
|
|
5958
|
-
const r = (e || t.width) * n, c = (s || t.height) * n, d = t.width - r, l = t.height - c, u = t.left +
|
|
6095
|
+
const r = (e || t.width) * n, c = (s || t.height) * n, d = t.width - r, l = t.height - c, u = t.left + R._calculateAnchorOffset(i, d), f = t.top + R._calculateAnchorOffset(a, l);
|
|
5959
6096
|
return {
|
|
5960
6097
|
left: u,
|
|
5961
6098
|
top: f,
|
|
@@ -5986,8 +6123,8 @@ class _ {
|
|
|
5986
6123
|
meta: t,
|
|
5987
6124
|
fallback: e
|
|
5988
6125
|
}) {
|
|
5989
|
-
const { width: s, height: n } = e, r = t || {}, { baseWidth: o = s, baseHeight: i = n } = r, a =
|
|
5990
|
-
return
|
|
6126
|
+
const { width: s, height: n } = e, r = t || {}, { baseWidth: o = s, baseHeight: i = n } = r, a = gt(r, ["baseWidth", "baseHeight"]);
|
|
6127
|
+
return P({
|
|
5991
6128
|
baseWidth: o,
|
|
5992
6129
|
baseHeight: i
|
|
5993
6130
|
}, a);
|
|
@@ -6014,7 +6151,7 @@ class _ {
|
|
|
6014
6151
|
t.setActiveObject(e[0]);
|
|
6015
6152
|
return;
|
|
6016
6153
|
}
|
|
6017
|
-
const s = new
|
|
6154
|
+
const s = new F(e, { canvas: t });
|
|
6018
6155
|
t.setActiveObject(s);
|
|
6019
6156
|
}
|
|
6020
6157
|
/**
|
|
@@ -6024,30 +6161,30 @@ class _ {
|
|
|
6024
6161
|
object: t,
|
|
6025
6162
|
baseWidth: e
|
|
6026
6163
|
}) {
|
|
6027
|
-
var
|
|
6028
|
-
if (!(t instanceof
|
|
6164
|
+
var H, Z;
|
|
6165
|
+
if (!(t instanceof at)) return;
|
|
6029
6166
|
const s = typeof t.text == "string" ? t.text : "";
|
|
6030
6167
|
if (!s) return;
|
|
6031
6168
|
const n = J({
|
|
6032
|
-
value: (
|
|
6169
|
+
value: (Z = (H = this.editor) == null ? void 0 : H.montageArea) == null ? void 0 : Z.width,
|
|
6033
6170
|
fallback: 0
|
|
6034
6171
|
}), {
|
|
6035
6172
|
width: o = 0,
|
|
6036
6173
|
scaleX: i = 1,
|
|
6037
6174
|
strokeWidth: a = 0
|
|
6038
|
-
} = t, r = J({ value: e, fallback: 0 }), c = t, d = J({ value: c.paddingLeft, fallback: 0 }), l = J({ value: c.paddingRight, fallback: 0 }), u = J({ value: i, fallback: 1 }), f = J({ value: a, fallback: 0 }) * u, g = J({ value: o, fallback: 0 }), p = g * u, m = d * u, v = l * u,
|
|
6175
|
+
} = t, r = J({ value: e, fallback: 0 }), c = t, d = J({ value: c.paddingLeft, fallback: 0 }), l = J({ value: c.paddingRight, fallback: 0 }), u = J({ value: i, fallback: 1 }), f = J({ value: a, fallback: 0 }) * u, g = J({ value: o, fallback: 0 }), p = g * u, m = d * u, v = l * u, S = p + m + v + f;
|
|
6039
6176
|
if (!n || !g || !r) return;
|
|
6040
6177
|
t.setCoords();
|
|
6041
|
-
const A = t, y = A[
|
|
6178
|
+
const A = t, y = A[Qt], M = typeof y == "number" ? y : null, j = R._resolveAnchor(A, de), I = S / r, w = M !== null ? M - I / 2 : null, T = M !== null ? M + I / 2 : null, b = t.getCenterPoint();
|
|
6042
6179
|
t.set("width", n), t.initDimensions();
|
|
6043
|
-
const
|
|
6180
|
+
const C = R._getLongestLineWidth({
|
|
6044
6181
|
textbox: t,
|
|
6045
6182
|
text: s
|
|
6046
|
-
}), E =
|
|
6047
|
-
t.set("width", E), t.initDimensions(), t.setPositionByOrigin(
|
|
6048
|
-
const
|
|
6049
|
-
let
|
|
6050
|
-
j === "start" &&
|
|
6183
|
+
}), E = C > g ? C + 1 : g;
|
|
6184
|
+
t.set("width", E), t.initDimensions(), t.setPositionByOrigin(b, "center", "center"), t.setCoords();
|
|
6185
|
+
const N = (E * u + m + v + f) / r;
|
|
6186
|
+
let B = M;
|
|
6187
|
+
j === "start" && w !== null ? B = Math.max(0, w) + N / 2 : j === "end" && T !== null && (B = Math.min(1, T) - N / 2), typeof B == "number" && (A[Qt] = B);
|
|
6051
6188
|
}
|
|
6052
6189
|
/**
|
|
6053
6190
|
* Возвращает ширину самой длинной строки текстового объекта.
|
|
@@ -6077,9 +6214,9 @@ class _ {
|
|
|
6077
6214
|
baseHeight: n,
|
|
6078
6215
|
montageArea: o
|
|
6079
6216
|
}) {
|
|
6080
|
-
const i = t.toDatalessObject([...
|
|
6081
|
-
if (
|
|
6082
|
-
const y =
|
|
6217
|
+
const i = t.toDatalessObject([...Ie]);
|
|
6218
|
+
if (R._isSvgObject(t)) {
|
|
6219
|
+
const y = R._extractSvgMarkup(t);
|
|
6083
6220
|
y && (i.svgMarkup = y, delete i.objects, delete i.path);
|
|
6084
6221
|
}
|
|
6085
6222
|
if (!e) return i;
|
|
@@ -6088,7 +6225,7 @@ class _ {
|
|
|
6088
6225
|
top: r,
|
|
6089
6226
|
width: c,
|
|
6090
6227
|
height: d
|
|
6091
|
-
} = e, l = t.getBoundingRect(!1, !0), u = s || c || 1, f = n || d || 1, g =
|
|
6228
|
+
} = e, l = t.getBoundingRect(!1, !0), u = s || c || 1, f = n || d || 1, g = fn({
|
|
6092
6229
|
object: t,
|
|
6093
6230
|
montageArea: o,
|
|
6094
6231
|
bounds: e
|
|
@@ -6098,12 +6235,12 @@ class _ {
|
|
|
6098
6235
|
x: (y.x - a) / u,
|
|
6099
6236
|
y: (y.y - r) / f
|
|
6100
6237
|
};
|
|
6101
|
-
})(), m = (l.left - a) / u, v = (l.top - r) / f,
|
|
6102
|
-
return i[
|
|
6238
|
+
})(), m = (l.left - a) / u, v = (l.top - r) / f, S = m + l.width / u, A = v + l.height / f;
|
|
6239
|
+
return i[Qt] = p.x, i[ve] = p.y, i[de] = R._detectAnchor({
|
|
6103
6240
|
center: p.x,
|
|
6104
6241
|
start: m,
|
|
6105
|
-
end:
|
|
6106
|
-
}), i[
|
|
6242
|
+
end: S
|
|
6243
|
+
}), i[be] = R._detectAnchor({
|
|
6107
6244
|
center: p.y,
|
|
6108
6245
|
start: v,
|
|
6109
6246
|
end: A
|
|
@@ -6123,13 +6260,13 @@ class _ {
|
|
|
6123
6260
|
* Применяет фоновый объект шаблона к текущему холсту через BackgroundManager.
|
|
6124
6261
|
*/
|
|
6125
6262
|
static _applyBackgroundFromObject(n) {
|
|
6126
|
-
return
|
|
6263
|
+
return z(this, arguments, function* ({
|
|
6127
6264
|
backgroundObject: t,
|
|
6128
6265
|
backgroundManager: e,
|
|
6129
6266
|
errorManager: s
|
|
6130
6267
|
}) {
|
|
6131
6268
|
try {
|
|
6132
|
-
const { fill: o, customData: i } = t, { backgroundType: a } = t, r =
|
|
6269
|
+
const { fill: o, customData: i } = t, { backgroundType: a } = t, r = R._cloneCustomData(i);
|
|
6133
6270
|
if (a === "color" && typeof o == "string")
|
|
6134
6271
|
return e.setColorBackground({
|
|
6135
6272
|
color: o,
|
|
@@ -6138,7 +6275,7 @@ class _ {
|
|
|
6138
6275
|
withoutSave: !0
|
|
6139
6276
|
}), !0;
|
|
6140
6277
|
if (a === "gradient") {
|
|
6141
|
-
const c =
|
|
6278
|
+
const c = pn(o);
|
|
6142
6279
|
if (c)
|
|
6143
6280
|
return e.setGradientBackground({
|
|
6144
6281
|
gradient: c,
|
|
@@ -6148,7 +6285,7 @@ class _ {
|
|
|
6148
6285
|
}), !0;
|
|
6149
6286
|
}
|
|
6150
6287
|
if (a === "image") {
|
|
6151
|
-
const c =
|
|
6288
|
+
const c = R._getImageSource(t);
|
|
6152
6289
|
if (c)
|
|
6153
6290
|
return yield e.setImageBackground({
|
|
6154
6291
|
imageSource: c,
|
|
@@ -6161,7 +6298,7 @@ class _ {
|
|
|
6161
6298
|
s.emitWarning({
|
|
6162
6299
|
origin: "TemplateManager",
|
|
6163
6300
|
method: "applyTemplate",
|
|
6164
|
-
code:
|
|
6301
|
+
code: wt.TEMPLATE_MANAGER.APPLY_FAILED,
|
|
6165
6302
|
message: "Не удалось применить фон из шаблона",
|
|
6166
6303
|
data: o
|
|
6167
6304
|
});
|
|
@@ -6191,7 +6328,7 @@ class _ {
|
|
|
6191
6328
|
*/
|
|
6192
6329
|
static _cloneCustomData(t) {
|
|
6193
6330
|
if (!(!t || typeof t != "object"))
|
|
6194
|
-
return
|
|
6331
|
+
return P({}, t);
|
|
6195
6332
|
}
|
|
6196
6333
|
/**
|
|
6197
6334
|
* Извлекает src изображения из FabricImage или его исходного элемента.
|
|
@@ -6217,10 +6354,10 @@ class _ {
|
|
|
6217
6354
|
*/
|
|
6218
6355
|
// eslint-disable-next-line class-methods-use-this
|
|
6219
6356
|
enlivenObjectEnlivables(t) {
|
|
6220
|
-
return
|
|
6357
|
+
return ht.enlivenObjectEnlivables(t);
|
|
6221
6358
|
}
|
|
6222
6359
|
}
|
|
6223
|
-
const
|
|
6360
|
+
const mn = 5, as = "#3D8BF4", Ce = 1, le = 1, ts = ({
|
|
6224
6361
|
anchors: h,
|
|
6225
6362
|
positions: t,
|
|
6226
6363
|
threshold: e
|
|
@@ -6235,16 +6372,16 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6235
6372
|
delta: s,
|
|
6236
6373
|
guidePosition: o
|
|
6237
6374
|
};
|
|
6238
|
-
},
|
|
6375
|
+
}, yn = ({
|
|
6239
6376
|
activeBounds: h,
|
|
6240
6377
|
threshold: t,
|
|
6241
6378
|
anchors: e
|
|
6242
6379
|
}) => {
|
|
6243
|
-
const { left: s, right: n, centerX: o, top: i, bottom: a, centerY: r } = h, c =
|
|
6380
|
+
const { left: s, right: n, centerX: o, top: i, bottom: a, centerY: r } = h, c = ts({
|
|
6244
6381
|
anchors: e.vertical,
|
|
6245
6382
|
positions: [s, o, n],
|
|
6246
6383
|
threshold: t
|
|
6247
|
-
}), d =
|
|
6384
|
+
}), d = ts({
|
|
6248
6385
|
anchors: e.horizontal,
|
|
6249
6386
|
positions: [i, r, a],
|
|
6250
6387
|
threshold: t
|
|
@@ -6260,7 +6397,7 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6260
6397
|
deltaY: d.delta,
|
|
6261
6398
|
guides: l
|
|
6262
6399
|
};
|
|
6263
|
-
},
|
|
6400
|
+
}, rs = ({
|
|
6264
6401
|
activeBounds: h,
|
|
6265
6402
|
aligned: t,
|
|
6266
6403
|
threshold: e,
|
|
@@ -6332,7 +6469,7 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6332
6469
|
}
|
|
6333
6470
|
}
|
|
6334
6471
|
return c;
|
|
6335
|
-
},
|
|
6472
|
+
}, vn = ({
|
|
6336
6473
|
activeBounds: h,
|
|
6337
6474
|
candidates: t,
|
|
6338
6475
|
threshold: e,
|
|
@@ -6351,74 +6488,74 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6351
6488
|
...c.map((y) => ({ bounds: y, isActive: !1 })),
|
|
6352
6489
|
{ bounds: h, isActive: !0 }
|
|
6353
6490
|
];
|
|
6354
|
-
d.sort((y,
|
|
6491
|
+
d.sort((y, M) => y.bounds.top - M.bounds.top);
|
|
6355
6492
|
const l = d.findIndex((y) => y.isActive);
|
|
6356
6493
|
if (l === -1)
|
|
6357
6494
|
return { delta: 0, guide: null };
|
|
6358
6495
|
const u = d[l - 1], f = d[l - 2], g = d[l + 1], p = d[l + 2], m = [], v = i - o;
|
|
6359
6496
|
if (u && f) {
|
|
6360
|
-
const { bounds: y } = u, { bounds:
|
|
6361
|
-
if (
|
|
6362
|
-
const T = j -
|
|
6497
|
+
const { bounds: y } = u, { bounds: M } = f, j = y.top - M.bottom, I = o - y.bottom, w = Math.abs(I - j);
|
|
6498
|
+
if (w <= e) {
|
|
6499
|
+
const T = j - I, b = o + T, C = {
|
|
6363
6500
|
type: "vertical",
|
|
6364
6501
|
axis: n,
|
|
6365
|
-
refStart:
|
|
6502
|
+
refStart: M.bottom,
|
|
6366
6503
|
refEnd: y.top,
|
|
6367
6504
|
activeStart: y.bottom,
|
|
6368
|
-
activeEnd:
|
|
6505
|
+
activeEnd: b,
|
|
6369
6506
|
distance: j
|
|
6370
6507
|
};
|
|
6371
|
-
m.push({ delta: T, guide:
|
|
6508
|
+
m.push({ delta: T, guide: C, diff: w });
|
|
6372
6509
|
}
|
|
6373
6510
|
}
|
|
6374
6511
|
if (g && p) {
|
|
6375
|
-
const { bounds: y } = g, { bounds:
|
|
6376
|
-
if (
|
|
6377
|
-
const T =
|
|
6512
|
+
const { bounds: y } = g, { bounds: M } = p, j = M.top - y.bottom, I = y.top - i, w = Math.abs(I - j);
|
|
6513
|
+
if (w <= e) {
|
|
6514
|
+
const T = I - j, b = i + T, C = {
|
|
6378
6515
|
type: "vertical",
|
|
6379
6516
|
axis: n,
|
|
6380
6517
|
refStart: y.bottom,
|
|
6381
|
-
refEnd:
|
|
6382
|
-
activeStart:
|
|
6518
|
+
refEnd: M.top,
|
|
6519
|
+
activeStart: b,
|
|
6383
6520
|
activeEnd: y.top,
|
|
6384
6521
|
distance: j
|
|
6385
6522
|
};
|
|
6386
|
-
m.push({ delta: T, guide:
|
|
6523
|
+
m.push({ delta: T, guide: C, diff: w });
|
|
6387
6524
|
}
|
|
6388
6525
|
}
|
|
6389
6526
|
if (u && g) {
|
|
6390
|
-
const { bounds: y } = u, { bounds:
|
|
6391
|
-
if (
|
|
6392
|
-
const
|
|
6393
|
-
if (
|
|
6394
|
-
const
|
|
6527
|
+
const { bounds: y } = u, { bounds: M } = g, I = M.top - y.bottom - v;
|
|
6528
|
+
if (I >= 0) {
|
|
6529
|
+
const w = I / 2, T = o - y.bottom, b = M.top - i, C = Math.abs(T - w), E = Math.abs(b - w), x = Math.max(C, E);
|
|
6530
|
+
if (x <= e) {
|
|
6531
|
+
const N = w - T, B = i + N, H = {
|
|
6395
6532
|
type: "vertical",
|
|
6396
6533
|
axis: n,
|
|
6397
6534
|
refStart: y.bottom,
|
|
6398
|
-
refEnd: y.bottom +
|
|
6399
|
-
activeStart:
|
|
6400
|
-
activeEnd:
|
|
6401
|
-
distance:
|
|
6535
|
+
refEnd: y.bottom + w,
|
|
6536
|
+
activeStart: B,
|
|
6537
|
+
activeEnd: B + w,
|
|
6538
|
+
distance: w
|
|
6402
6539
|
};
|
|
6403
|
-
m.push({ delta:
|
|
6540
|
+
m.push({ delta: N, guide: H, diff: x });
|
|
6404
6541
|
}
|
|
6405
6542
|
}
|
|
6406
6543
|
}
|
|
6407
|
-
const
|
|
6544
|
+
const S = rs({
|
|
6408
6545
|
activeBounds: h,
|
|
6409
6546
|
aligned: c,
|
|
6410
6547
|
threshold: e,
|
|
6411
6548
|
patterns: s,
|
|
6412
6549
|
type: "vertical"
|
|
6413
6550
|
});
|
|
6414
|
-
if (m.push(...
|
|
6551
|
+
if (m.push(...S), !m.length)
|
|
6415
6552
|
return { delta: 0, guide: null };
|
|
6416
|
-
const A = m.reduce((y,
|
|
6553
|
+
const A = m.reduce((y, M) => M.diff < y.diff ? M : y, m[0]);
|
|
6417
6554
|
return {
|
|
6418
6555
|
delta: A.delta,
|
|
6419
6556
|
guide: A.guide
|
|
6420
6557
|
};
|
|
6421
|
-
},
|
|
6558
|
+
}, bn = ({
|
|
6422
6559
|
activeBounds: h,
|
|
6423
6560
|
candidates: t,
|
|
6424
6561
|
threshold: e,
|
|
@@ -6437,85 +6574,85 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6437
6574
|
...c.map((y) => ({ bounds: y, isActive: !1 })),
|
|
6438
6575
|
{ bounds: h, isActive: !0 }
|
|
6439
6576
|
];
|
|
6440
|
-
d.sort((y,
|
|
6577
|
+
d.sort((y, M) => y.bounds.left - M.bounds.left);
|
|
6441
6578
|
const l = d.findIndex((y) => y.isActive);
|
|
6442
6579
|
if (l === -1)
|
|
6443
6580
|
return { delta: 0, guide: null };
|
|
6444
6581
|
const u = d[l - 1], f = d[l - 2], g = d[l + 1], p = d[l + 2], m = [], v = i - o;
|
|
6445
6582
|
if (u && f) {
|
|
6446
|
-
const { bounds: y } = u, { bounds:
|
|
6447
|
-
if (
|
|
6448
|
-
const T = j -
|
|
6583
|
+
const { bounds: y } = u, { bounds: M } = f, j = y.left - M.right, I = o - y.right, w = Math.abs(I - j);
|
|
6584
|
+
if (w <= e) {
|
|
6585
|
+
const T = j - I, b = o + T, C = {
|
|
6449
6586
|
type: "horizontal",
|
|
6450
6587
|
axis: n,
|
|
6451
|
-
refStart:
|
|
6588
|
+
refStart: M.right,
|
|
6452
6589
|
refEnd: y.left,
|
|
6453
6590
|
activeStart: y.right,
|
|
6454
|
-
activeEnd:
|
|
6591
|
+
activeEnd: b,
|
|
6455
6592
|
distance: j
|
|
6456
6593
|
};
|
|
6457
|
-
m.push({ delta: T, guide:
|
|
6594
|
+
m.push({ delta: T, guide: C, diff: w });
|
|
6458
6595
|
}
|
|
6459
6596
|
}
|
|
6460
6597
|
if (g && p) {
|
|
6461
|
-
const { bounds: y } = g, { bounds:
|
|
6462
|
-
if (
|
|
6463
|
-
const T =
|
|
6598
|
+
const { bounds: y } = g, { bounds: M } = p, j = M.left - y.right, I = y.left - i, w = Math.abs(I - j);
|
|
6599
|
+
if (w <= e) {
|
|
6600
|
+
const T = I - j, b = i + T, C = {
|
|
6464
6601
|
type: "horizontal",
|
|
6465
6602
|
axis: n,
|
|
6466
6603
|
refStart: y.right,
|
|
6467
|
-
refEnd:
|
|
6468
|
-
activeStart:
|
|
6604
|
+
refEnd: M.left,
|
|
6605
|
+
activeStart: b,
|
|
6469
6606
|
activeEnd: y.left,
|
|
6470
6607
|
distance: j
|
|
6471
6608
|
};
|
|
6472
|
-
m.push({ delta: T, guide:
|
|
6609
|
+
m.push({ delta: T, guide: C, diff: w });
|
|
6473
6610
|
}
|
|
6474
6611
|
}
|
|
6475
6612
|
if (u && g) {
|
|
6476
|
-
const { bounds: y } = u, { bounds:
|
|
6477
|
-
if (
|
|
6478
|
-
const
|
|
6479
|
-
if (
|
|
6480
|
-
const
|
|
6613
|
+
const { bounds: y } = u, { bounds: M } = g, I = M.left - y.right - v;
|
|
6614
|
+
if (I >= 0) {
|
|
6615
|
+
const w = I / 2, T = o - y.right, b = M.left - i, C = Math.abs(T - w), E = Math.abs(b - w), x = Math.max(C, E);
|
|
6616
|
+
if (x <= e) {
|
|
6617
|
+
const N = w - T, B = i + N, H = {
|
|
6481
6618
|
type: "horizontal",
|
|
6482
6619
|
axis: n,
|
|
6483
6620
|
refStart: y.right,
|
|
6484
|
-
refEnd: y.right +
|
|
6485
|
-
activeStart:
|
|
6486
|
-
activeEnd:
|
|
6487
|
-
distance:
|
|
6621
|
+
refEnd: y.right + w,
|
|
6622
|
+
activeStart: B,
|
|
6623
|
+
activeEnd: B + w,
|
|
6624
|
+
distance: w
|
|
6488
6625
|
};
|
|
6489
|
-
m.push({ delta:
|
|
6626
|
+
m.push({ delta: N, guide: H, diff: x });
|
|
6490
6627
|
}
|
|
6491
6628
|
}
|
|
6492
6629
|
}
|
|
6493
|
-
const
|
|
6630
|
+
const S = rs({
|
|
6494
6631
|
activeBounds: h,
|
|
6495
6632
|
aligned: c,
|
|
6496
6633
|
threshold: e,
|
|
6497
6634
|
patterns: s,
|
|
6498
6635
|
type: "horizontal"
|
|
6499
6636
|
});
|
|
6500
|
-
if (m.push(...
|
|
6637
|
+
if (m.push(...S), !m.length)
|
|
6501
6638
|
return { delta: 0, guide: null };
|
|
6502
|
-
const A = m.reduce((y,
|
|
6639
|
+
const A = m.reduce((y, M) => M.diff < y.diff ? M : y, m[0]);
|
|
6503
6640
|
return {
|
|
6504
6641
|
delta: A.delta,
|
|
6505
6642
|
guide: A.guide
|
|
6506
6643
|
};
|
|
6507
|
-
},
|
|
6644
|
+
}, Mn = ({
|
|
6508
6645
|
activeBounds: h,
|
|
6509
6646
|
candidates: t,
|
|
6510
6647
|
threshold: e,
|
|
6511
6648
|
spacingPatterns: s
|
|
6512
6649
|
}) => {
|
|
6513
|
-
const n =
|
|
6650
|
+
const n = vn({
|
|
6514
6651
|
activeBounds: h,
|
|
6515
6652
|
candidates: t,
|
|
6516
6653
|
threshold: e,
|
|
6517
6654
|
patterns: s.vertical
|
|
6518
|
-
}), o =
|
|
6655
|
+
}), o = bn({
|
|
6519
6656
|
activeBounds: h,
|
|
6520
6657
|
candidates: t,
|
|
6521
6658
|
threshold: e,
|
|
@@ -6526,7 +6663,7 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6526
6663
|
deltaY: n.delta,
|
|
6527
6664
|
guides: i
|
|
6528
6665
|
};
|
|
6529
|
-
},
|
|
6666
|
+
}, Sn = ({
|
|
6530
6667
|
context: h,
|
|
6531
6668
|
x: t,
|
|
6532
6669
|
y: e,
|
|
@@ -6536,7 +6673,7 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6536
6673
|
}) => {
|
|
6537
6674
|
const i = Math.min(o, s / 2, n / 2);
|
|
6538
6675
|
h.moveTo(t + i, e), h.lineTo(t + s - i, e), h.quadraticCurveTo(t + s, e, t + s, e + i), h.lineTo(t + s, e + n - i), h.quadraticCurveTo(t + s, e + n, t + s - i, e + n), h.lineTo(t + i, e + n), h.quadraticCurveTo(t, e + n, t, e + n - i), h.lineTo(t, e + i), h.quadraticCurveTo(t, e, t + i, e), h.closePath();
|
|
6539
|
-
},
|
|
6676
|
+
}, Te = ({
|
|
6540
6677
|
context: h,
|
|
6541
6678
|
type: t,
|
|
6542
6679
|
axis: e,
|
|
@@ -6553,17 +6690,17 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6553
6690
|
offsetAlongAxis: f = 0,
|
|
6554
6691
|
offsetPerpendicular: g = 0
|
|
6555
6692
|
}) => {
|
|
6556
|
-
const p = i || 1, m = 12 / p, v = l / p,
|
|
6693
|
+
const p = i || 1, m = 12 / p, v = l / p, S = u / p, A = (s + n) / 2 + f, y = t === "vertical" ? e + g : A, M = t === "vertical" ? A : e + g;
|
|
6557
6694
|
h.save(), h.setLineDash([]), h.fillStyle = a, h.strokeStyle = a, h.lineWidth = d / p, h.font = `${m}px ${c}`, h.textAlign = "center", h.textBaseline = "middle";
|
|
6558
|
-
const
|
|
6559
|
-
h.beginPath(),
|
|
6695
|
+
const I = h.measureText(o).width + v * 2, w = m + v * 2, T = y - I / 2, b = M - w / 2;
|
|
6696
|
+
h.beginPath(), Sn({
|
|
6560
6697
|
context: h,
|
|
6561
6698
|
x: T,
|
|
6562
|
-
y:
|
|
6563
|
-
width:
|
|
6564
|
-
height:
|
|
6565
|
-
radius:
|
|
6566
|
-
}), h.fill(), h.fillStyle = r, h.fillText(o, y,
|
|
6699
|
+
y: b,
|
|
6700
|
+
width: I,
|
|
6701
|
+
height: w,
|
|
6702
|
+
radius: S
|
|
6703
|
+
}), h.fill(), h.fillStyle = r, h.fillText(o, y, M), h.restore();
|
|
6567
6704
|
}, wn = ({
|
|
6568
6705
|
context: h,
|
|
6569
6706
|
guide: t,
|
|
@@ -6579,8 +6716,8 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6579
6716
|
distance: c
|
|
6580
6717
|
} = t, d = Math.round(c).toString();
|
|
6581
6718
|
h.beginPath(), s === "vertical" ? (h.moveTo(n, o), h.lineTo(n, i), h.moveTo(n, a), h.lineTo(n, r)) : (h.moveTo(o, n), h.lineTo(i, n), h.moveTo(a, n), h.lineTo(r, n)), h.stroke();
|
|
6582
|
-
const l =
|
|
6583
|
-
|
|
6719
|
+
const l = as;
|
|
6720
|
+
Te({
|
|
6584
6721
|
context: h,
|
|
6585
6722
|
type: s,
|
|
6586
6723
|
axis: n,
|
|
@@ -6589,8 +6726,8 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6589
6726
|
text: d,
|
|
6590
6727
|
zoom: e,
|
|
6591
6728
|
color: l,
|
|
6592
|
-
lineWidth:
|
|
6593
|
-
}),
|
|
6729
|
+
lineWidth: Ce
|
|
6730
|
+
}), Te({
|
|
6594
6731
|
context: h,
|
|
6595
6732
|
type: s,
|
|
6596
6733
|
axis: n,
|
|
@@ -6599,9 +6736,9 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6599
6736
|
text: d,
|
|
6600
6737
|
zoom: e,
|
|
6601
6738
|
color: l,
|
|
6602
|
-
lineWidth:
|
|
6739
|
+
lineWidth: Ce
|
|
6603
6740
|
});
|
|
6604
|
-
},
|
|
6741
|
+
}, es = ({
|
|
6605
6742
|
anchors: h,
|
|
6606
6743
|
bounds: t
|
|
6607
6744
|
}) => {
|
|
@@ -6614,7 +6751,7 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6614
6751
|
centerY: a
|
|
6615
6752
|
} = t;
|
|
6616
6753
|
h.vertical.push(e, n, s), h.horizontal.push(o, a, i);
|
|
6617
|
-
},
|
|
6754
|
+
}, ss = ({
|
|
6618
6755
|
bounds: h,
|
|
6619
6756
|
type: t,
|
|
6620
6757
|
primaryStart: e,
|
|
@@ -6627,8 +6764,8 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6627
6764
|
for (let p = r + 1; p < a.length; p += 1) {
|
|
6628
6765
|
const m = a[p];
|
|
6629
6766
|
if (Math.min(c[i], m[i]) - Math.max(c[o], m[o]) < 0) continue;
|
|
6630
|
-
const
|
|
6631
|
-
|
|
6767
|
+
const S = m[e] - c[s];
|
|
6768
|
+
S < 0 || S < l && (l = S, d = m);
|
|
6632
6769
|
}
|
|
6633
6770
|
if (!d || l === Number.POSITIVE_INFINITY) continue;
|
|
6634
6771
|
const u = Math.max(c[o], d[o]), f = Math.min(c[i], d[i]), g = (u + f) / 2;
|
|
@@ -6641,30 +6778,30 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6641
6778
|
});
|
|
6642
6779
|
}
|
|
6643
6780
|
return n;
|
|
6644
|
-
},
|
|
6781
|
+
}, An = ({
|
|
6645
6782
|
bounds: h
|
|
6646
6783
|
}) => {
|
|
6647
|
-
const t =
|
|
6784
|
+
const t = ss({
|
|
6648
6785
|
bounds: h,
|
|
6649
6786
|
type: "vertical",
|
|
6650
6787
|
primaryStart: "top",
|
|
6651
6788
|
primaryEnd: "bottom"
|
|
6652
|
-
}), e =
|
|
6789
|
+
}), e = ss({
|
|
6653
6790
|
bounds: h,
|
|
6654
6791
|
type: "horizontal",
|
|
6655
6792
|
primaryStart: "left",
|
|
6656
6793
|
primaryEnd: "right"
|
|
6657
6794
|
});
|
|
6658
6795
|
return { vertical: t, horizontal: e };
|
|
6659
|
-
},
|
|
6796
|
+
}, jn = ["montage-area", "background", "interaction-blocker"], cs = ({
|
|
6660
6797
|
activeObject: h
|
|
6661
6798
|
}) => {
|
|
6662
6799
|
const t = /* @__PURE__ */ new Set();
|
|
6663
|
-
return h && (t.add(h), h instanceof
|
|
6664
|
-
},
|
|
6800
|
+
return h && (t.add(h), h instanceof F && h.getObjects().forEach((e) => t.add(e))), t;
|
|
6801
|
+
}, ds = ({
|
|
6665
6802
|
object: h,
|
|
6666
6803
|
excluded: t,
|
|
6667
|
-
ignoredIds: e =
|
|
6804
|
+
ignoredIds: e = jn
|
|
6668
6805
|
}) => {
|
|
6669
6806
|
if (t.has(h)) return !0;
|
|
6670
6807
|
const { visible: s = !0 } = h;
|
|
@@ -6672,7 +6809,7 @@ const pn = 5, os = "#3D8BF4", Ae = 1, ce = 1, Je = ({
|
|
|
6672
6809
|
const { id: n } = h;
|
|
6673
6810
|
return !!(n && e.includes(n));
|
|
6674
6811
|
};
|
|
6675
|
-
class
|
|
6812
|
+
class In {
|
|
6676
6813
|
/**
|
|
6677
6814
|
* Создаёт менеджер прилипания и инициализирует слушатели событий.
|
|
6678
6815
|
*/
|
|
@@ -6730,35 +6867,35 @@ class jn {
|
|
|
6730
6867
|
return;
|
|
6731
6868
|
}
|
|
6732
6869
|
!this.anchors.vertical.length && !this.anchors.horizontal.length && this._cacheAnchors({ activeObject: e });
|
|
6733
|
-
let o =
|
|
6870
|
+
let o = mt({ object: e });
|
|
6734
6871
|
if (!o) {
|
|
6735
6872
|
this._clearGuides();
|
|
6736
6873
|
return;
|
|
6737
6874
|
}
|
|
6738
|
-
const { canvas: i } = this, a = i.getZoom() || 1, r =
|
|
6875
|
+
const { canvas: i } = this, a = i.getZoom() || 1, r = mn / a, c = yn({
|
|
6739
6876
|
activeBounds: o,
|
|
6740
6877
|
threshold: r,
|
|
6741
6878
|
anchors: this.anchors
|
|
6742
6879
|
}), { deltaX: d, deltaY: l, guides: u } = c;
|
|
6743
6880
|
if (d !== 0 || l !== 0) {
|
|
6744
|
-
const { left: v = 0, top:
|
|
6881
|
+
const { left: v = 0, top: S = 0 } = e;
|
|
6745
6882
|
e.set({
|
|
6746
6883
|
left: v + d,
|
|
6747
|
-
top:
|
|
6748
|
-
}), e.setCoords(), o = (p =
|
|
6884
|
+
top: S + l
|
|
6885
|
+
}), e.setCoords(), o = (p = mt({ object: e })) != null ? p : o;
|
|
6749
6886
|
}
|
|
6750
|
-
const f = this.cachedTargetBounds.length ? this.cachedTargetBounds : this._collectTargets({ activeObject: e }).map((v) =>
|
|
6887
|
+
const f = this.cachedTargetBounds.length ? this.cachedTargetBounds : this._collectTargets({ activeObject: e }).map((v) => mt({ object: v })).filter((v) => !!v), g = Mn({
|
|
6751
6888
|
activeBounds: o,
|
|
6752
6889
|
candidates: f,
|
|
6753
6890
|
threshold: r,
|
|
6754
6891
|
spacingPatterns: this.spacingPatterns
|
|
6755
6892
|
});
|
|
6756
6893
|
if (g.deltaX !== 0 || g.deltaY !== 0) {
|
|
6757
|
-
const { left: v = 0, top:
|
|
6894
|
+
const { left: v = 0, top: S = 0 } = e;
|
|
6758
6895
|
e.set({
|
|
6759
6896
|
left: v + g.deltaX,
|
|
6760
|
-
top:
|
|
6761
|
-
}), e.setCoords(), o = (m =
|
|
6897
|
+
top: S + g.deltaY
|
|
6898
|
+
}), e.setCoords(), o = (m = mt({ object: e })) != null ? m : o;
|
|
6762
6899
|
}
|
|
6763
6900
|
this._applyGuides({
|
|
6764
6901
|
guides: u,
|
|
@@ -6786,7 +6923,7 @@ class jn {
|
|
|
6786
6923
|
const { canvas: t, guideBounds: e } = this, s = t.getSelectionContext();
|
|
6787
6924
|
if (!s) return;
|
|
6788
6925
|
const n = e != null ? e : this._calculateViewportBounds(), { left: o, right: i, top: a, bottom: r } = n, { viewportTransform: c } = t, d = t.getZoom() || 1;
|
|
6789
|
-
s.save(), Array.isArray(c) && s.transform(...c), s.lineWidth =
|
|
6926
|
+
s.save(), Array.isArray(c) && s.transform(...c), s.lineWidth = Ce / d, s.strokeStyle = as, s.setLineDash([4, 4]);
|
|
6790
6927
|
for (const l of this.activeGuides)
|
|
6791
6928
|
s.beginPath(), l.type === "vertical" ? (s.moveTo(l.position, a), s.lineTo(l.position, r)) : (s.moveTo(o, l.position), s.lineTo(i, l.position)), s.stroke();
|
|
6792
6929
|
for (const l of this.activeSpacingGuides)
|
|
@@ -6826,7 +6963,7 @@ class jn {
|
|
|
6826
6963
|
* Применяет шаг перемещения, округляя координаты объекта к сетке MOVE_SNAP_STEP.
|
|
6827
6964
|
*/
|
|
6828
6965
|
_applyMovementStep({ target: t }) {
|
|
6829
|
-
const { left: e = 0, top: s = 0 } = t, n = Math.round(e /
|
|
6966
|
+
const { left: e = 0, top: s = 0 } = t, n = Math.round(e / le) * le, o = Math.round(s / le) * le;
|
|
6830
6967
|
n === e && o === s || (t.set({
|
|
6831
6968
|
left: n,
|
|
6832
6969
|
top: o
|
|
@@ -6838,12 +6975,12 @@ class jn {
|
|
|
6838
6975
|
_cacheAnchors({ activeObject: t }) {
|
|
6839
6976
|
const e = this._collectTargets({ activeObject: t }), s = { vertical: [], horizontal: [] }, n = [];
|
|
6840
6977
|
for (const a of e) {
|
|
6841
|
-
const r =
|
|
6842
|
-
r && (
|
|
6978
|
+
const r = mt({ object: a });
|
|
6979
|
+
r && (es({ anchors: s, bounds: r }), n.push(r));
|
|
6843
6980
|
}
|
|
6844
|
-
const { montageArea: o } = this.editor, i =
|
|
6981
|
+
const { montageArea: o } = this.editor, i = mt({ object: o });
|
|
6845
6982
|
if (i) {
|
|
6846
|
-
|
|
6983
|
+
es({ anchors: s, bounds: i });
|
|
6847
6984
|
const { left: a, right: r, top: c, bottom: d } = i;
|
|
6848
6985
|
this.guideBounds = {
|
|
6849
6986
|
left: a,
|
|
@@ -6853,15 +6990,15 @@ class jn {
|
|
|
6853
6990
|
};
|
|
6854
6991
|
} else
|
|
6855
6992
|
this.guideBounds = this._calculateViewportBounds();
|
|
6856
|
-
this.anchors = s, this.spacingPatterns =
|
|
6993
|
+
this.anchors = s, this.spacingPatterns = An({ bounds: n }), this.cachedTargetBounds = n;
|
|
6857
6994
|
}
|
|
6858
6995
|
/**
|
|
6859
6996
|
* Собирает объекты, подходящие для прилипания, исключая активный объект и запрещённые id.
|
|
6860
6997
|
*/
|
|
6861
6998
|
_collectTargets({ activeObject: t }) {
|
|
6862
|
-
const e =
|
|
6999
|
+
const e = cs({ activeObject: t }), s = [];
|
|
6863
7000
|
return this.canvas.forEachObject((n) => {
|
|
6864
|
-
|
|
7001
|
+
ds({ object: n, excluded: e }) || s.push(n);
|
|
6865
7002
|
}), s;
|
|
6866
7003
|
}
|
|
6867
7004
|
/**
|
|
@@ -6884,8 +7021,8 @@ class jn {
|
|
|
6884
7021
|
};
|
|
6885
7022
|
}
|
|
6886
7023
|
}
|
|
6887
|
-
const
|
|
6888
|
-
class
|
|
7024
|
+
const ns = "#3D8BF4", os = 1;
|
|
7025
|
+
class Bt {
|
|
6889
7026
|
/**
|
|
6890
7027
|
* Создаёт менеджер измерений и инициализирует события.
|
|
6891
7028
|
*/
|
|
@@ -6990,15 +7127,15 @@ class Dt {
|
|
|
6990
7127
|
this._clearGuides();
|
|
6991
7128
|
return;
|
|
6992
7129
|
}
|
|
6993
|
-
const o =
|
|
7130
|
+
const o = mt({ object: n });
|
|
6994
7131
|
if (!o) {
|
|
6995
7132
|
this._clearGuides();
|
|
6996
7133
|
return;
|
|
6997
7134
|
}
|
|
6998
|
-
const i =
|
|
7135
|
+
const i = Bt._resolveTarget({
|
|
6999
7136
|
event: t,
|
|
7000
7137
|
activeObject: n
|
|
7001
|
-
}), { montageArea: a } = s, r = i != null ? i : a, c = r === a, d =
|
|
7138
|
+
}), { montageArea: a } = s, r = i != null ? i : a, c = r === a, d = mt({ object: r });
|
|
7002
7139
|
if (!d) {
|
|
7003
7140
|
this._clearGuides();
|
|
7004
7141
|
return;
|
|
@@ -7007,7 +7144,7 @@ class Dt {
|
|
|
7007
7144
|
this._clearGuides();
|
|
7008
7145
|
return;
|
|
7009
7146
|
}
|
|
7010
|
-
const u =
|
|
7147
|
+
const u = Bt._buildGuides({
|
|
7011
7148
|
activeBounds: o,
|
|
7012
7149
|
targetBounds: d,
|
|
7013
7150
|
targetIsMontageArea: c
|
|
@@ -7025,8 +7162,8 @@ class Dt {
|
|
|
7025
7162
|
event: t,
|
|
7026
7163
|
activeObject: e
|
|
7027
7164
|
}) {
|
|
7028
|
-
const { target: s } = t, n =
|
|
7029
|
-
return s && !
|
|
7165
|
+
const { target: s } = t, n = cs({ activeObject: e });
|
|
7166
|
+
return s && !ds({ object: s, excluded: n }) ? s : null;
|
|
7030
7167
|
}
|
|
7031
7168
|
/**
|
|
7032
7169
|
* Собирает вертикальные и горизонтальные направляющие расстояний.
|
|
@@ -7036,11 +7173,11 @@ class Dt {
|
|
|
7036
7173
|
targetBounds: e,
|
|
7037
7174
|
targetIsMontageArea: s
|
|
7038
7175
|
}) {
|
|
7039
|
-
const n =
|
|
7176
|
+
const n = Bt._buildHorizontalGuides({
|
|
7040
7177
|
activeBounds: t,
|
|
7041
7178
|
targetBounds: e,
|
|
7042
7179
|
targetIsMontageArea: s
|
|
7043
|
-
}), o =
|
|
7180
|
+
}), o = Bt._buildVerticalGuides({
|
|
7044
7181
|
activeBounds: t,
|
|
7045
7182
|
targetBounds: e,
|
|
7046
7183
|
targetIsMontageArea: s
|
|
@@ -7067,45 +7204,45 @@ class Dt {
|
|
|
7067
7204
|
top: u = 0,
|
|
7068
7205
|
bottom: f = 0,
|
|
7069
7206
|
centerY: g = 0
|
|
7070
|
-
} = e, p = Math.max(a, u), m = Math.min(r, f),
|
|
7207
|
+
} = e, p = Math.max(a, u), m = Math.min(r, f), S = m >= p ? (p + m) / 2 : (c + g) / 2;
|
|
7071
7208
|
if (d >= i) {
|
|
7072
7209
|
if (s) return n;
|
|
7073
|
-
const
|
|
7074
|
-
return
|
|
7210
|
+
const C = d - i;
|
|
7211
|
+
return C > 0 && n.push({
|
|
7075
7212
|
type: "horizontal",
|
|
7076
|
-
axis:
|
|
7213
|
+
axis: S,
|
|
7077
7214
|
start: i,
|
|
7078
7215
|
end: d,
|
|
7079
|
-
distance:
|
|
7216
|
+
distance: C
|
|
7080
7217
|
}), n;
|
|
7081
7218
|
}
|
|
7082
7219
|
if (l <= o) {
|
|
7083
7220
|
if (s) return n;
|
|
7084
|
-
const
|
|
7085
|
-
return
|
|
7221
|
+
const C = o - l;
|
|
7222
|
+
return C > 0 && n.push({
|
|
7086
7223
|
type: "horizontal",
|
|
7087
|
-
axis:
|
|
7224
|
+
axis: S,
|
|
7088
7225
|
start: l,
|
|
7089
7226
|
end: o,
|
|
7090
|
-
distance:
|
|
7227
|
+
distance: C
|
|
7091
7228
|
}), n;
|
|
7092
7229
|
}
|
|
7093
7230
|
if (!s) return n;
|
|
7094
|
-
const A = o < d, y = i > l,
|
|
7095
|
-
|
|
7231
|
+
const A = o < d, y = i > l, M = Math.min(o, d), j = Math.max(o, d), I = j - M;
|
|
7232
|
+
I > 0 && !A && n.push({
|
|
7096
7233
|
type: "horizontal",
|
|
7097
|
-
axis:
|
|
7098
|
-
start:
|
|
7234
|
+
axis: S,
|
|
7235
|
+
start: M,
|
|
7099
7236
|
end: j,
|
|
7100
|
-
distance:
|
|
7237
|
+
distance: I
|
|
7101
7238
|
});
|
|
7102
|
-
const
|
|
7103
|
-
return
|
|
7239
|
+
const w = Math.min(i, l), T = Math.max(i, l), b = T - w;
|
|
7240
|
+
return b > 0 && !y && n.push({
|
|
7104
7241
|
type: "horizontal",
|
|
7105
|
-
axis:
|
|
7106
|
-
start:
|
|
7242
|
+
axis: S,
|
|
7243
|
+
start: w,
|
|
7107
7244
|
end: T,
|
|
7108
|
-
distance:
|
|
7245
|
+
distance: b
|
|
7109
7246
|
}), n;
|
|
7110
7247
|
}
|
|
7111
7248
|
/**
|
|
@@ -7128,45 +7265,45 @@ class Dt {
|
|
|
7128
7265
|
left: u = 0,
|
|
7129
7266
|
right: f = 0,
|
|
7130
7267
|
centerX: g = 0
|
|
7131
|
-
} = e, p = Math.max(a, u), m = Math.min(r, f),
|
|
7268
|
+
} = e, p = Math.max(a, u), m = Math.min(r, f), S = m >= p ? (p + m) / 2 : (c + g) / 2;
|
|
7132
7269
|
if (d >= i) {
|
|
7133
7270
|
if (s) return n;
|
|
7134
|
-
const
|
|
7135
|
-
return
|
|
7271
|
+
const C = d - i;
|
|
7272
|
+
return C > 0 && n.push({
|
|
7136
7273
|
type: "vertical",
|
|
7137
|
-
axis:
|
|
7274
|
+
axis: S,
|
|
7138
7275
|
start: i,
|
|
7139
7276
|
end: d,
|
|
7140
|
-
distance:
|
|
7277
|
+
distance: C
|
|
7141
7278
|
}), n;
|
|
7142
7279
|
}
|
|
7143
7280
|
if (l <= o) {
|
|
7144
7281
|
if (s) return n;
|
|
7145
|
-
const
|
|
7146
|
-
return
|
|
7282
|
+
const C = o - l;
|
|
7283
|
+
return C > 0 && n.push({
|
|
7147
7284
|
type: "vertical",
|
|
7148
|
-
axis:
|
|
7285
|
+
axis: S,
|
|
7149
7286
|
start: l,
|
|
7150
7287
|
end: o,
|
|
7151
|
-
distance:
|
|
7288
|
+
distance: C
|
|
7152
7289
|
}), n;
|
|
7153
7290
|
}
|
|
7154
7291
|
if (!s) return n;
|
|
7155
|
-
const A = o < d, y = i > l,
|
|
7156
|
-
|
|
7292
|
+
const A = o < d, y = i > l, M = Math.min(o, d), j = Math.max(o, d), I = j - M;
|
|
7293
|
+
I > 0 && !A && n.push({
|
|
7157
7294
|
type: "vertical",
|
|
7158
|
-
axis:
|
|
7159
|
-
start:
|
|
7295
|
+
axis: S,
|
|
7296
|
+
start: M,
|
|
7160
7297
|
end: j,
|
|
7161
|
-
distance:
|
|
7298
|
+
distance: I
|
|
7162
7299
|
});
|
|
7163
|
-
const
|
|
7164
|
-
return
|
|
7300
|
+
const w = Math.min(i, l), T = Math.max(i, l), b = T - w;
|
|
7301
|
+
return b > 0 && !y && n.push({
|
|
7165
7302
|
type: "vertical",
|
|
7166
|
-
axis:
|
|
7167
|
-
start:
|
|
7303
|
+
axis: S,
|
|
7304
|
+
start: w,
|
|
7168
7305
|
end: T,
|
|
7169
|
-
distance:
|
|
7306
|
+
distance: b
|
|
7170
7307
|
}), n;
|
|
7171
7308
|
}
|
|
7172
7309
|
/**
|
|
@@ -7194,10 +7331,10 @@ class Dt {
|
|
|
7194
7331
|
const { canvas: t } = this, e = t.getSelectionContext();
|
|
7195
7332
|
if (!e) return;
|
|
7196
7333
|
const { viewportTransform: s } = t, n = t.getZoom() || 1, o = this.activeGuides.some((c) => c.type === "vertical"), i = this.activeGuides.some((c) => c.type === "horizontal"), a = o && i && !this.isTargetMontageArea, r = a ? 12 / n : 0;
|
|
7197
|
-
e.save(), Array.isArray(s) && e.transform(...s), e.lineWidth =
|
|
7334
|
+
e.save(), Array.isArray(s) && e.transform(...s), e.lineWidth = os / n, e.strokeStyle = ns, e.setLineDash([]);
|
|
7198
7335
|
for (const c of this.activeGuides) {
|
|
7199
|
-
const { type: d, axis: l, start: u, end: f, distance: g } = c, p = Math.abs(f - u), m = u <= f ? -1 : 1, v = a ? m * (p / 2 + r) : 0,
|
|
7200
|
-
e.beginPath(), d === "vertical" ? (e.moveTo(l, u), e.lineTo(l, f)) : (e.moveTo(u, l), e.lineTo(f, l)), e.stroke(),
|
|
7336
|
+
const { type: d, axis: l, start: u, end: f, distance: g } = c, p = Math.abs(f - u), m = u <= f ? -1 : 1, v = a ? m * (p / 2 + r) : 0, S = 0;
|
|
7337
|
+
e.beginPath(), d === "vertical" ? (e.moveTo(l, u), e.lineTo(l, f)) : (e.moveTo(u, l), e.lineTo(f, l)), e.stroke(), Te({
|
|
7201
7338
|
context: e,
|
|
7202
7339
|
type: d,
|
|
7203
7340
|
axis: l,
|
|
@@ -7205,10 +7342,10 @@ class Dt {
|
|
|
7205
7342
|
end: f,
|
|
7206
7343
|
text: Math.round(g).toString(),
|
|
7207
7344
|
zoom: n,
|
|
7208
|
-
color:
|
|
7209
|
-
lineWidth:
|
|
7345
|
+
color: ns,
|
|
7346
|
+
lineWidth: os,
|
|
7210
7347
|
offsetAlongAxis: v,
|
|
7211
|
-
offsetPerpendicular:
|
|
7348
|
+
offsetPerpendicular: S
|
|
7212
7349
|
});
|
|
7213
7350
|
}
|
|
7214
7351
|
e.restore();
|
|
@@ -7232,14 +7369,14 @@ class Dt {
|
|
|
7232
7369
|
(e = t == null ? void 0 : t.showAfterTemporary) == null || e.call(t), this.isToolbarHidden = !1;
|
|
7233
7370
|
}
|
|
7234
7371
|
}
|
|
7235
|
-
class
|
|
7372
|
+
class xe {
|
|
7236
7373
|
/**
|
|
7237
7374
|
* Конструктор класса ImageEditor.
|
|
7238
7375
|
* @param canvasId - идентификатор канваса, в котором будет создан редактор
|
|
7239
7376
|
* @param options - опции и настройки редактора
|
|
7240
7377
|
*/
|
|
7241
7378
|
constructor(t, e) {
|
|
7242
|
-
this.options = e, this.containerId = t, this.editorId = `${t}-${
|
|
7379
|
+
this.options = e, this.containerId = t, this.editorId = `${t}-${K()}`, this.clipboard = null, this.init();
|
|
7243
7380
|
}
|
|
7244
7381
|
/**
|
|
7245
7382
|
* Инициализация редактора.
|
|
@@ -7247,7 +7384,7 @@ class Le {
|
|
|
7247
7384
|
* @fires editor:ready
|
|
7248
7385
|
*/
|
|
7249
7386
|
init() {
|
|
7250
|
-
return
|
|
7387
|
+
return z(this, null, function* () {
|
|
7251
7388
|
var u;
|
|
7252
7389
|
const {
|
|
7253
7390
|
editorContainerWidth: t,
|
|
@@ -7262,17 +7399,17 @@ class Le {
|
|
|
7262
7399
|
showRotationAngle: d,
|
|
7263
7400
|
_onReadyCallback: l
|
|
7264
7401
|
} = this.options;
|
|
7265
|
-
if (
|
|
7402
|
+
if (ot.apply(), this.canvas = new bs(this.containerId, this.options), this.moduleLoader = new js(), this.workerManager = new Cs(), this.errorManager = new $t({ editor: this }), this.historyManager = new G({ editor: this }), this.toolbar = new Fs({ editor: this }), this.transformManager = new Qs({ editor: this }), this.zoomManager = new $s({ editor: this }), this.canvasManager = new Js({ editor: this }), this.imageManager = new lt({ editor: this }), this.layerManager = new ue({ editor: this }), this.shapeManager = new en({ editor: this }), this.interactionBlocker = new tn({ editor: this }), this.backgroundManager = new xt({ editor: this }), this.clipboardManager = new sn({ editor: this }), this.objectLockManager = new fe({ editor: this }), this.groupingManager = new nn({ editor: this }), this.selectionManager = new on({ editor: this }), this.deletionManager = new Re({ editor: this }), this.panConstraintManager = new an({ editor: this }), this.snappingManager = new In({ editor: this }), this.measurementManager = new Bt({ editor: this }), this.fontManager = new je((u = this.options.fonts) != null ? u : []), this.textManager = new W({ editor: this }), this.templateManager = new R({ editor: this }), d && (this.angleIndicator = new _e({ editor: this })), this._createMontageArea(), this._createClippingArea(), this.listeners = new Ee({ editor: this, options: this.options }), this.canvasManager.setEditorContainerWidth(t), this.canvasManager.setEditorContainerHeight(e), this.canvasManager.setCanvasWrapperWidth(s), this.canvasManager.setCanvasWrapperHeight(n), this.canvasManager.setCanvasCSSWidth(o), this.canvasManager.setCanvasCSSHeight(i), this.canvasManager.updateCanvas(), this.zoomManager.calculateAndApplyDefaultZoom(), yield this.fontManager.loadFonts(), a != null && a.source) {
|
|
7266
7403
|
const f = a, {
|
|
7267
7404
|
source: g,
|
|
7268
7405
|
scale: p = `image-${c}`,
|
|
7269
7406
|
withoutSave: m = !0
|
|
7270
|
-
} = f, v =
|
|
7407
|
+
} = f, v = gt(f, [
|
|
7271
7408
|
"source",
|
|
7272
7409
|
"scale",
|
|
7273
7410
|
"withoutSave"
|
|
7274
7411
|
]);
|
|
7275
|
-
yield this.imageManager.importImage(
|
|
7412
|
+
yield this.imageManager.importImage(P({ source: g, scale: p, withoutSave: m }, v));
|
|
7276
7413
|
}
|
|
7277
7414
|
r && this.historyManager.loadStateFromFullState(r), this.historyManager.saveState(), console.log("editor:ready"), this.canvas.fire("editor:ready", this), typeof l == "function" && l(this);
|
|
7278
7415
|
});
|
|
@@ -7288,7 +7425,7 @@ class Le {
|
|
|
7288
7425
|
this.montageArea = this.shapeManager.addRectangle({
|
|
7289
7426
|
width: t,
|
|
7290
7427
|
height: e,
|
|
7291
|
-
fill:
|
|
7428
|
+
fill: xe._createMosaicPattern(),
|
|
7292
7429
|
stroke: null,
|
|
7293
7430
|
strokeWidth: 0,
|
|
7294
7431
|
selectable: !1,
|
|
@@ -7339,7 +7476,7 @@ class Le {
|
|
|
7339
7476
|
const t = document.createElement("canvas");
|
|
7340
7477
|
t.width = 20, t.height = 20;
|
|
7341
7478
|
const e = t.getContext("2d");
|
|
7342
|
-
return e.fillStyle = "#ddd", e.fillRect(0, 0, 40, 40), e.fillStyle = "#ccc", e.fillRect(0, 0, 10, 10), e.fillRect(10, 10, 10, 10), new
|
|
7479
|
+
return e.fillStyle = "#ddd", e.fillRect(0, 0, 40, 40), e.fillStyle = "#ccc", e.fillRect(0, 0, 10, 10), e.fillRect(10, 10, 10, 10), new Ms({
|
|
7343
7480
|
source: t,
|
|
7344
7481
|
repeat: "repeat"
|
|
7345
7482
|
});
|
|
@@ -8174,7 +8311,7 @@ const L = [
|
|
|
8174
8311
|
unicodeRange: L
|
|
8175
8312
|
}
|
|
8176
8313
|
}
|
|
8177
|
-
],
|
|
8314
|
+
], Tn = {
|
|
8178
8315
|
/**
|
|
8179
8316
|
* Опции редактора
|
|
8180
8317
|
*/
|
|
@@ -8268,18 +8405,18 @@ const L = [
|
|
|
8268
8405
|
*/
|
|
8269
8406
|
fonts: Cn
|
|
8270
8407
|
};
|
|
8271
|
-
function
|
|
8272
|
-
const e =
|
|
8408
|
+
function _n(h, t = {}) {
|
|
8409
|
+
const e = P(P({}, Tn), t), s = document.getElementById(h);
|
|
8273
8410
|
if (!s)
|
|
8274
8411
|
return Promise.reject(new Error(`Контейнер с ID "${h}" не найден.`));
|
|
8275
8412
|
const n = document.createElement("canvas");
|
|
8276
8413
|
return n.id = `${h}-canvas`, s.appendChild(n), e.editorContainer = s, new Promise((o) => {
|
|
8277
8414
|
e._onReadyCallback = o;
|
|
8278
|
-
const i = new
|
|
8415
|
+
const i = new xe(n.id, e);
|
|
8279
8416
|
window[h] = i;
|
|
8280
8417
|
});
|
|
8281
8418
|
}
|
|
8282
8419
|
export {
|
|
8283
|
-
|
|
8420
|
+
_n as default
|
|
8284
8421
|
};
|
|
8285
8422
|
//# sourceMappingURL=main.js.map
|