@anu3ev/fabric-image-editor 0.5.4 → 0.5.5
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 +447 -485
- package/package.json +1 -1
package/dist/main.js
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var
|
|
4
|
-
var
|
|
5
|
-
var
|
|
1
|
+
var hs = Object.defineProperty, us = Object.defineProperties;
|
|
2
|
+
var gs = Object.getOwnPropertyDescriptors;
|
|
3
|
+
var Vt = Object.getOwnPropertySymbols;
|
|
4
|
+
var Be = Object.prototype.hasOwnProperty, ze = Object.prototype.propertyIsEnumerable;
|
|
5
|
+
var ke = (h, t, e) => t in h ? hs(h, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[t] = e, k = (h, t) => {
|
|
6
6
|
for (var e in t || (t = {}))
|
|
7
|
-
|
|
8
|
-
if (
|
|
9
|
-
for (var e of
|
|
10
|
-
|
|
7
|
+
Be.call(t, e) && ke(h, e, t[e]);
|
|
8
|
+
if (Vt)
|
|
9
|
+
for (var e of Vt(t))
|
|
10
|
+
ze.call(t, e) && ke(h, e, t[e]);
|
|
11
11
|
return h;
|
|
12
|
-
},
|
|
12
|
+
}, jt = (h, t) => us(h, gs(t));
|
|
13
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
|
+
Be.call(h, s) && t.indexOf(s) < 0 && (e[s] = h[s]);
|
|
17
|
+
if (h != null && Vt)
|
|
18
|
+
for (var s of Vt(h))
|
|
19
|
+
t.indexOf(s) < 0 && ze.call(h, s) && (e[s] = h[s]);
|
|
20
20
|
return e;
|
|
21
21
|
};
|
|
22
22
|
var _ = (h, t, e) => new Promise((s, o) => {
|
|
@@ -35,15 +35,15 @@ var _ = (h, t, e) => new Promise((s, o) => {
|
|
|
35
35
|
}, a = (r) => r.done ? s(r.value) : Promise.resolve(r.value).then(n, i);
|
|
36
36
|
a((e = e.apply(h, t)).next());
|
|
37
37
|
});
|
|
38
|
-
import { ActiveSelection as
|
|
39
|
-
import { create as
|
|
40
|
-
import
|
|
41
|
-
var
|
|
38
|
+
import { ActiveSelection as x, Textbox as st, util as ct, controlsUtils as Pe, InteractiveFabricObject as Ue, Point as J, FitContentLayout as Ye, loadSVGFromURL as fs, FabricImage as Bt, Gradient as Fe, Rect as ps, Circle as ms, Triangle as ys, Group as Ct, Color as vs, classRegistry as He, loadSVGFromString as bs, Canvas as Ms, Pattern as ws } from "fabric";
|
|
39
|
+
import { create as Ss } from "jsondiffpatch";
|
|
40
|
+
import As from "diff-match-patch";
|
|
41
|
+
var js = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict", Y = 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 += js[s[t] & 63];
|
|
44
44
|
return e;
|
|
45
45
|
};
|
|
46
|
-
class
|
|
46
|
+
class Pt {
|
|
47
47
|
/**
|
|
48
48
|
* Конструктор принимает редактор и опции.
|
|
49
49
|
* @param params
|
|
@@ -61,7 +61,7 @@ class Bt {
|
|
|
61
61
|
* @param params.options.adaptCanvasToContainerOnResize — адаптировать канвас к размерам контейнера при изменении размеров окна
|
|
62
62
|
*/
|
|
63
63
|
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 =
|
|
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 = Pt.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 = Pt.debounce(this.handleObjectModifiedHistory.bind(this), 300), this.handleObjectRotatingHistoryBound = Pt.debounce(this.handleObjectRotatingHistory.bind(this), 300), this.handleObjectAddedHistoryBound = this.handleObjectAddedHistory.bind(this), this.handleObjectRemovedHistoryBound = this.handleObjectRemovedHistory.bind(this), this.handleOverlayUpdateBound = this.handleOverlayUpdate.bind(this), this.handleBackgroundUpdateBound = this.handleBackgroundUpdate.bind(this), this.handleCanvasDragStartBound = this.handleCanvasDragStart.bind(this), this.handleCanvasDraggingBound = this.handleCanvasDragging.bind(this), this.handleCanvasDragEndBound = this.handleCanvasDragEnd.bind(this), this.handleMouseWheelZoomBound = this.handleMouseWheelZoom.bind(this), this.handleBringToFrontBound = this.handleBringToFront.bind(this), this.handleResetObjectFitBound = this.handleResetObjectFit.bind(this), this.handleLockedSelectionBound = this._filterLockedSelection.bind(this), this.init();
|
|
65
65
|
}
|
|
66
66
|
/**
|
|
67
67
|
* Инициализация всех обработчиков согласно опциям.
|
|
@@ -98,7 +98,7 @@ class Bt {
|
|
|
98
98
|
if (o.length === 1)
|
|
99
99
|
this.canvas.setActiveObject(o[0]);
|
|
100
100
|
else {
|
|
101
|
-
const i = new
|
|
101
|
+
const i = new x(o, {
|
|
102
102
|
canvas: this.canvas
|
|
103
103
|
});
|
|
104
104
|
this.canvas.setActiveObject(i);
|
|
@@ -106,7 +106,7 @@ class Bt {
|
|
|
106
106
|
this.canvas.requestRenderAll();
|
|
107
107
|
return;
|
|
108
108
|
}
|
|
109
|
-
const n = new
|
|
109
|
+
const n = new x(t, {
|
|
110
110
|
canvas: this.canvas
|
|
111
111
|
});
|
|
112
112
|
this.editor.objectLockManager.lockObject({
|
|
@@ -220,7 +220,7 @@ class Bt {
|
|
|
220
220
|
if (o || n) return;
|
|
221
221
|
this.isSpacePressed = !0, t.preventDefault();
|
|
222
222
|
const i = e.getActiveObject() || null;
|
|
223
|
-
i instanceof
|
|
223
|
+
i instanceof x ? this.savedSelection = i.getObjects().slice() : i && (this.savedSelection = [i]), e.discardActiveObject(), e.set({
|
|
224
224
|
selection: !1,
|
|
225
225
|
defaultCursor: "grab"
|
|
226
226
|
}), e.setCursor("grab"), s.canvasManager.getObjects().forEach((a) => {
|
|
@@ -259,7 +259,7 @@ class Bt {
|
|
|
259
259
|
e.setActiveObject(t[0]);
|
|
260
260
|
return;
|
|
261
261
|
}
|
|
262
|
-
const o = t.filter((i) => s.canvasManager.getObjects().includes(i)), n = new
|
|
262
|
+
const o = t.filter((i) => s.canvasManager.getObjects().includes(i)), n = new x(o, { canvas: e });
|
|
263
263
|
e.setActiveObject(n);
|
|
264
264
|
}
|
|
265
265
|
// --- Обработчики для событий canvas (Fabric) ---
|
|
@@ -391,7 +391,7 @@ class Bt {
|
|
|
391
391
|
};
|
|
392
392
|
}
|
|
393
393
|
}
|
|
394
|
-
class
|
|
394
|
+
class Is {
|
|
395
395
|
/**
|
|
396
396
|
* Класс для динамической загрузки внешних модулей.
|
|
397
397
|
*/
|
|
@@ -409,7 +409,7 @@ class As {
|
|
|
409
409
|
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}"`));
|
|
410
410
|
}
|
|
411
411
|
}
|
|
412
|
-
function
|
|
412
|
+
function Cs(h) {
|
|
413
413
|
return new Worker(
|
|
414
414
|
"" + new URL("assets/worker-CN39s7P7.js", import.meta.url).href,
|
|
415
415
|
{
|
|
@@ -417,13 +417,13 @@ function js(h) {
|
|
|
417
417
|
}
|
|
418
418
|
);
|
|
419
419
|
}
|
|
420
|
-
class
|
|
420
|
+
class Ts {
|
|
421
421
|
/**
|
|
422
422
|
* @param scriptUrl — URL скрипта воркера.
|
|
423
423
|
* По-умолчанию использует DefaultWorker из соседнего файла
|
|
424
424
|
*/
|
|
425
425
|
constructor(t) {
|
|
426
|
-
t ? this.worker = new Worker(t, { type: "module" }) : this.worker = new
|
|
426
|
+
t ? this.worker = new Worker(t, { type: "module" }) : this.worker = new Cs(), this._callbacks = /* @__PURE__ */ new Map(), this.worker.onmessage = this._handleMessage.bind(this);
|
|
427
427
|
}
|
|
428
428
|
/**
|
|
429
429
|
* Обработчик сообщений от воркера
|
|
@@ -451,7 +451,7 @@ class Is {
|
|
|
451
451
|
* @returns Promise, который будет выполнен, когда воркер вернет ответ
|
|
452
452
|
*/
|
|
453
453
|
post(t, e, s = []) {
|
|
454
|
-
const o = `${t}:${
|
|
454
|
+
const o = `${t}:${Y(8)}`;
|
|
455
455
|
return new Promise((n, i) => {
|
|
456
456
|
this._callbacks.set(o, { resolve: n, reject: i }), this.worker.postMessage({ action: t, payload: e, requestId: o }, s);
|
|
457
457
|
});
|
|
@@ -463,50 +463,50 @@ class Is {
|
|
|
463
463
|
this.worker.terminate();
|
|
464
464
|
}
|
|
465
465
|
}
|
|
466
|
-
const at = 12,
|
|
467
|
-
function
|
|
468
|
-
const n = at, i =
|
|
469
|
-
h.save(), h.translate(t, e), h.rotate(ct.degreesToRadians(o.angle)), h.fillStyle =
|
|
466
|
+
const at = 12, Es = 2, de = 8, le = 20, Os = 100, he = 20, ue = 8, Ds = 100, $t = 32, me = 1, Ls = "#2B2D33", ye = "#3D8BF4", ve = "#FFFFFF";
|
|
467
|
+
function Xt(h, t, e, s, o) {
|
|
468
|
+
const n = at, i = Es;
|
|
469
|
+
h.save(), h.translate(t, e), h.rotate(ct.degreesToRadians(o.angle)), h.fillStyle = ve, h.strokeStyle = ye, h.lineWidth = me, h.beginPath(), h.roundRect(-n / 2, -n / 2, n, n, i), h.fill(), h.stroke(), h.restore();
|
|
470
470
|
}
|
|
471
|
-
function
|
|
472
|
-
const n =
|
|
473
|
-
h.save(), h.translate(t, e), h.rotate(ct.degreesToRadians(o.angle)), h.fillStyle =
|
|
471
|
+
function We(h, t, e, s, o) {
|
|
472
|
+
const n = de, i = le, a = Os;
|
|
473
|
+
h.save(), h.translate(t, e), h.rotate(ct.degreesToRadians(o.angle)), h.fillStyle = ve, h.strokeStyle = ye, h.lineWidth = me, h.beginPath(), h.roundRect(-n / 2, -i / 2, n, i, a), h.fill(), h.stroke(), h.restore();
|
|
474
474
|
}
|
|
475
|
-
function
|
|
476
|
-
const n =
|
|
477
|
-
h.save(), h.translate(t, e), h.rotate(ct.degreesToRadians(o.angle)), h.fillStyle =
|
|
475
|
+
function Ze(h, t, e, s, o) {
|
|
476
|
+
const n = he, i = ue, a = Ds;
|
|
477
|
+
h.save(), h.translate(t, e), h.rotate(ct.degreesToRadians(o.angle)), h.fillStyle = ve, h.strokeStyle = ye, h.lineWidth = me, h.beginPath(), h.roundRect(-n / 2, -i / 2, n, i, a), h.fill(), h.stroke(), h.restore();
|
|
478
478
|
}
|
|
479
|
-
const
|
|
480
|
-
|
|
481
|
-
function
|
|
482
|
-
const i =
|
|
483
|
-
h.save(), h.translate(t, e), h.rotate(ct.degreesToRadians(o.angle)), h.fillStyle =
|
|
479
|
+
const Rs = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE4Ljc1IDQuMzc1djMuNzVhLjYyNS42MjUgMCAwIDEtLjYyNS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDEgMC0xLjI1aDIuMTRsLTIuMDc3LTEuOTAzLS4wMi0uMDE5YTYuMjUgNi4yNSAwIDEgMC0uMTMgOC45NjcuNjI2LjYyNiAwIDAgMSAuODYuOTA5QTcuNDU2IDcuNDU2IDAgMCAxIDEwIDE3LjVoLS4xMDNhNy41IDcuNSAwIDEgMSA1LjM5Ni0xMi44MTJMMTcuNSA2LjcwM1Y0LjM3NWEuNjI1LjYyNSAwIDAgMSAxLjI1IDBaIi8+PC9zdmc+", is = new Image();
|
|
480
|
+
is.src = Rs;
|
|
481
|
+
function _s(h, t, e, s, o) {
|
|
482
|
+
const i = $t / 2;
|
|
483
|
+
h.save(), h.translate(t, e), h.rotate(ct.degreesToRadians(o.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();
|
|
484
484
|
}
|
|
485
|
-
const
|
|
485
|
+
const Ns = {
|
|
486
486
|
// Угловые точки
|
|
487
487
|
tl: {
|
|
488
|
-
render:
|
|
488
|
+
render: Xt,
|
|
489
489
|
sizeX: at,
|
|
490
490
|
sizeY: at,
|
|
491
491
|
offsetX: 0,
|
|
492
492
|
offsetY: 0
|
|
493
493
|
},
|
|
494
494
|
tr: {
|
|
495
|
-
render:
|
|
495
|
+
render: Xt,
|
|
496
496
|
sizeX: at,
|
|
497
497
|
sizeY: at,
|
|
498
498
|
offsetX: 0,
|
|
499
499
|
offsetY: 0
|
|
500
500
|
},
|
|
501
501
|
bl: {
|
|
502
|
-
render:
|
|
502
|
+
render: Xt,
|
|
503
503
|
sizeX: at,
|
|
504
504
|
sizeY: at,
|
|
505
505
|
offsetX: 0,
|
|
506
506
|
offsetY: 0
|
|
507
507
|
},
|
|
508
508
|
br: {
|
|
509
|
-
render:
|
|
509
|
+
render: Xt,
|
|
510
510
|
sizeX: at,
|
|
511
511
|
sizeY: at,
|
|
512
512
|
offsetX: 0,
|
|
@@ -514,41 +514,41 @@ const Rs = {
|
|
|
514
514
|
},
|
|
515
515
|
// Середина вертикалей
|
|
516
516
|
ml: {
|
|
517
|
-
render:
|
|
518
|
-
sizeX:
|
|
519
|
-
sizeY:
|
|
517
|
+
render: We,
|
|
518
|
+
sizeX: de,
|
|
519
|
+
sizeY: le,
|
|
520
520
|
offsetX: 0,
|
|
521
521
|
offsetY: 0
|
|
522
522
|
},
|
|
523
523
|
mr: {
|
|
524
|
-
render:
|
|
525
|
-
sizeX:
|
|
526
|
-
sizeY:
|
|
524
|
+
render: We,
|
|
525
|
+
sizeX: de,
|
|
526
|
+
sizeY: le,
|
|
527
527
|
offsetX: 0,
|
|
528
528
|
offsetY: 0
|
|
529
529
|
},
|
|
530
530
|
// Середина горизонталей
|
|
531
531
|
mt: {
|
|
532
|
-
render:
|
|
533
|
-
sizeX:
|
|
534
|
-
sizeY:
|
|
532
|
+
render: Ze,
|
|
533
|
+
sizeX: he,
|
|
534
|
+
sizeY: ue,
|
|
535
535
|
offsetX: 0,
|
|
536
536
|
offsetY: 0
|
|
537
537
|
},
|
|
538
538
|
mb: {
|
|
539
|
-
render:
|
|
540
|
-
sizeX:
|
|
541
|
-
sizeY:
|
|
539
|
+
render: Ze,
|
|
540
|
+
sizeX: he,
|
|
541
|
+
sizeY: ue,
|
|
542
542
|
offsetX: 0,
|
|
543
543
|
offsetY: 0
|
|
544
544
|
},
|
|
545
545
|
// Специальный «rotate» контрол
|
|
546
546
|
mtr: {
|
|
547
|
-
render:
|
|
548
|
-
sizeX:
|
|
549
|
-
sizeY:
|
|
547
|
+
render: _s,
|
|
548
|
+
sizeX: $t,
|
|
549
|
+
sizeY: $t,
|
|
550
550
|
offsetX: 0,
|
|
551
|
-
offsetY:
|
|
551
|
+
offsetY: -$t
|
|
552
552
|
}
|
|
553
553
|
};
|
|
554
554
|
class $ {
|
|
@@ -567,7 +567,7 @@ class $ {
|
|
|
567
567
|
* Применяет конфигурацию контролов к набору по ключам из DEFAULT_CONTROLS.
|
|
568
568
|
*/
|
|
569
569
|
static applyControlOverrides(t) {
|
|
570
|
-
Object.entries(
|
|
570
|
+
Object.entries(Ns).forEach(([e, s]) => {
|
|
571
571
|
const o = t[e];
|
|
572
572
|
o && (Object.assign(o, s), e === "mtr" && (o.cursorStyle = "grab", o.mouseDownHandler = (n, i, a, r) => {
|
|
573
573
|
var d;
|
|
@@ -580,16 +580,16 @@ class $ {
|
|
|
580
580
|
* Регистрирует контролы и настройки поведения выделений.
|
|
581
581
|
*/
|
|
582
582
|
static apply() {
|
|
583
|
-
const t =
|
|
584
|
-
$.applyControlOverrides(t),
|
|
585
|
-
const e =
|
|
586
|
-
$.applyControlOverrides(e), e.mt && (e.mt.visible = !1), e.mb && (e.mb.visible = !1), $.wrapWidthControl(e.ml), $.wrapWidthControl(e.mr), st.ownDefaults.controls = e, $.patchActiveSelectionBounds(),
|
|
583
|
+
const t = Pe.createObjectDefaultControls();
|
|
584
|
+
$.applyControlOverrides(t), Ue.ownDefaults.controls = t;
|
|
585
|
+
const e = Pe.createTextboxDefaultControls();
|
|
586
|
+
$.applyControlOverrides(e), e.mt && (e.mt.visible = !1), e.mb && (e.mb.visible = !1), $.wrapWidthControl(e.ml), $.wrapWidthControl(e.mr), st.ownDefaults.controls = e, $.patchActiveSelectionBounds(), Ue.ownDefaults.snapAngle = 1;
|
|
587
587
|
}
|
|
588
588
|
/**
|
|
589
589
|
* Обновляет алгоритм расчёта границ ActiveSelection, чтобы учитывать фон и отступы текстовых объектов.
|
|
590
590
|
*/
|
|
591
591
|
static patchActiveSelectionBounds() {
|
|
592
|
-
const t =
|
|
592
|
+
const t = x.prototype, e = t._calcBoundsFromObjects;
|
|
593
593
|
t._calcBoundsFromObjects = function(...n) {
|
|
594
594
|
var g, f;
|
|
595
595
|
const i = (f = (g = this.getObjects) == null ? void 0 : g.call(this)) != null ? f : [];
|
|
@@ -630,12 +630,12 @@ class $ {
|
|
|
630
630
|
height: g
|
|
631
631
|
}), this.setPositionByOrigin(f, "center", "center"), this.setCoords(), a;
|
|
632
632
|
};
|
|
633
|
-
const o =
|
|
634
|
-
|
|
633
|
+
const o = Ye.prototype.calcBoundingBox;
|
|
634
|
+
Ye.prototype.calcBoundingBox = function(n, i) {
|
|
635
635
|
const { target: a, type: r, overrides: c } = i;
|
|
636
636
|
if (r === "imperative" && c)
|
|
637
637
|
return c;
|
|
638
|
-
if (!(a instanceof
|
|
638
|
+
if (!(a instanceof x))
|
|
639
639
|
return o.call(this, n, i);
|
|
640
640
|
$.applyTextSelectionScalingLock({
|
|
641
641
|
selection: a,
|
|
@@ -671,18 +671,21 @@ class $ {
|
|
|
671
671
|
};
|
|
672
672
|
}
|
|
673
673
|
/**
|
|
674
|
-
* Блокирует
|
|
674
|
+
* Блокирует горизонтальное масштабирование ActiveSelection, если в выделении есть текстовые объекты.
|
|
675
675
|
*/
|
|
676
676
|
static applyTextSelectionScalingLock({
|
|
677
677
|
selection: t,
|
|
678
678
|
objects: e
|
|
679
679
|
}) {
|
|
680
|
-
const s = e.some((
|
|
680
|
+
const s = e.some((i) => i instanceof st), o = t instanceof x && e.length > 1, n = s && o;
|
|
681
681
|
t.set({
|
|
682
|
-
lockScalingY: s
|
|
682
|
+
lockScalingY: s,
|
|
683
|
+
lockScalingX: n
|
|
683
684
|
}), t.setControlsVisibility({
|
|
684
685
|
mt: !s,
|
|
685
|
-
mb: !s
|
|
686
|
+
mb: !s,
|
|
687
|
+
ml: !n,
|
|
688
|
+
mr: !n
|
|
686
689
|
});
|
|
687
690
|
}
|
|
688
691
|
}
|
|
@@ -854,8 +857,8 @@ N.registeredFontKeys = /* @__PURE__ */ new Set(), N.descriptorDefaults = {
|
|
|
854
857
|
featureSettings: "normal",
|
|
855
858
|
display: "auto"
|
|
856
859
|
};
|
|
857
|
-
let
|
|
858
|
-
const
|
|
860
|
+
let ge = N;
|
|
861
|
+
const xs = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNi44NzUgMi41YS42MjUuNjI1IDAgMCAwLS42MjUuNjI0VjYuMjVIMy4xMjVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2MTBjMCAuMzQ1LjI4LjYyNS42MjUuNjI1aDEwYy4zNDUgMCAuNjI1LS4yOC42MjUtLjYyNXYtMy4xMjZoMy4xMjVjLjM0NSAwIC42MjUtLjI4LjYyNS0uNjI1di0xMGEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTEwWm02Ljg3NSAxMGgyLjVWMy43NUg3LjV2Mi41aDUuNjI1Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NS42MjRabS0xMCAzLjc1VjcuNWg4Ljc1djguNzVIMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", ks = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMi41IDcuNWMwLS42OS41Ni0xLjI1IDEuMjUtMS4yNWgxMi41Yy42OSAwIDEuMjUuNTYgMS4yNSAxLjI1djguNzVjMCAuNjktLjU2IDEuMjUtMS4yNSAxLjI1SDMuNzVjLS42OSAwLTEuMjUtLjU2LTEuMjUtMS4yNVY3LjVabTEzLjc1IDBIMy43NXY4Ljc1aDEyLjVWNy41WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTAgMS44NzVhMi4xODggMi4xODggMCAwIDAtMi4xODggMi4xODh2Mi44MTJhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyYTMuNDM3IDMuNDM3IDAgMSAxIDYuODc1IDB2Mi44MTNhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyQTIuMTg4IDIuMTg4IDAgMCAwIDEwIDEuODc2WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTEwIDEyLjgxM2EuOTM3LjkzNyAwIDEgMCAwLTEuODc1LjkzNy45MzcgMCAwIDAgMCAxLjg3NFoiLz48L3N2Zz4=", Bs = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE2LjI1IDYuMjVINy41VjQuMzc1YTIuNSAyLjUgMCAwIDEgMi41LTIuNWMxLjIgMCAyLjI4MS44NiAyLjUxMiAyYS42MjUuNjI1IDAgMCAwIDEuMjI2LS4yNWMtLjM1NC0xLjczOC0xLjkyNS0zLTMuNzM4LTNhMy43NTQgMy43NTQgMCAwIDAtMy43NSAzLjc1VjYuMjVoLTIuNUExLjI1IDEuMjUgMCAwIDAgMi41IDcuNXY4Ljc1YTEuMjUgMS4yNSAwIDAgMCAxLjI1IDEuMjVoMTIuNWExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjcuNWExLjI1IDEuMjUgMCAwIDAtMS4yNS0xLjI1Wm0wIDEwSDMuNzVWNy41aDEyLjV2OC43NVptLTUuMzEzLTQuMzc1YS45MzcuOTM3IDAgMSAxLTEuODc0IDAgLjkzNy45MzcgMCAwIDEgMS44NzQgMFoiLz48L3N2Zz4K", zs = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTIuNSA4LjEyNSAxMCAxMi41bDcuNS00LjM3NUwxMCAzLjc1IDIuNSA4LjEyNVoiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjY4NSAzLjIxYS42MjUuNjI1IDAgMCAxIC42MyAwbDcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOGw3LjUtNC4zNzVaTTMuNzQgOC4xMjUgMTAgMTEuNzc2bDYuMjYtMy42NTFMMTAgNC40NzQgMy43NCA4LjEyNVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA5LjQ2YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDExLjc3NmwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA5LjQ2Wm0tMS42NiAyLjQxNUwxMCAxNS41MjZsNi4yNi0zLjY1MS0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNi0xLjk3NSAxLjE1MVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", Ps = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMy4yMWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDguMTI1IDEwIDExLjc3Nmw2LjI2LTMuNjUxTDEwIDQuNDc0IDMuNzQgOC4xMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjcxNCAxMCAxMCAxMi41bDQuMjg2LTIuNSAzLjIxNCAxLjg3NUwxMCAxNi4yNWwtNy41LTQuMzc1TDUuNzE0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDkuNDZhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgMTEuNzc2bDMuOTctMi4zMTZhLjYyNS42MjUgMCAwIDEgLjYzIDBsMy4yMTUgMS44NzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhMNS40IDkuNDZabS0xLjY2IDIuNDE1TDEwIDE1LjUyNmw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2LTEuOTc1IDEuMTUxWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", Us = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0ibTIuNSA2LjI1IDcuNSA0LjM3NSA3LjUtNC4zNzVMMTAgMS44NzUgMi41IDYuMjVaIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMS4zMzVhLjYyNS42MjUgMCAwIDEgLjYzIDBsNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4bDcuNS00LjM3NVpNMy43NCA2LjI1IDEwIDkuOTAxbDYuMjYtMy42NTFMMTAgMi41OTkgMy43NCA2LjI1WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDExLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCAxMy42NTFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgMTEuMzM1Wk0zLjc0IDEzLjc1IDEwIDE3LjQwMWw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTMuNzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgNy41ODVhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgOS45MDFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgNy41ODVaTTMuNzQgMTAgMTAgMTMuNjUxIDE2LjI2IDEwbC0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNkwzLjc0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", Ys = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMS45NiAxMy40MzVhLjYyNS42MjUgMCAwIDEgLjg1NS0uMjI1TDEwIDE3LjQwMWw3LjE4NS00LjE5YS42MjUuNjI1IDAgMCAxIC42MyAxLjA3OWwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEtLjIyNS0uODU1Wk05LjY4NSAxLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDYuMjUgMTAgOS45MDFsNi4yNi0zLjY1MUwxMCAyLjU5OSAzLjc0IDYuMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Im01LjcxNCAxMS44NzUgNC4yODYgMi41IDQuMjg2LTIuNUwxNy41IDEzLjc1IDEwIDE4LjEyNSAyLjUgMTMuNzVsMy4yMTQtMS44NzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgMTEuMzM1YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDEzLjY1MWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCAxMS4zMzVaTTMuNzQgMTMuNzUgMTAgMTcuNDAxbDYuMjYtMy42NTEtMS45NzQtMS4xNTEtMy45NzEgMi4zMTZhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTMuOTctMi4zMTZMMy43NCAxMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA3LjU4NWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCA5LjkwMWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA3LjU4NVpNMy43NCAxMCAxMCAxMy42NTEgMTYuMjYgMTBsLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTBaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=", Fs = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI0VDNEU0MCIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOC4xMjUgMS4yNUExLjg3NSAxLjg3NSAwIDAgMCA2LjI1IDMuMTI1di42MjVIMy4xMjVhLjYyNS42MjUgMCAwIDAgMCAxLjI1aC42MjV2MTEuMjVBMS4yNSAxLjI1IDAgMCAwIDUgMTcuNWgxMGExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjVoLjYyNWEuNjI1LjYyNSAwIDAgMCAwLTEuMjVIMTMuNzV2LS42MjVhMS44NzUgMS44NzUgMCAwIDAtMS44NzUtMS44NzVoLTMuNzVabTQuMzc1IDIuNXYtLjYyNWEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2LjYyNWg1Wk01IDE2LjI1VjVoMTB2MTEuMjVINVpNOC4xMjUgNy41Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NWEuNjI1LjYyNSAwIDEgMS0xLjI1IDB2LTVjMC0uMzQ1LjI4LS42MjUuNjI1LS42MjVabTQuMzc1IDUuNjI1di01YS42MjUuNjI1IDAgMCAwLTEuMjUgMHY1YS42MjUuNjI1IDAgMSAwIDEuMjUgMFoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", zt = {
|
|
859
862
|
style: {
|
|
860
863
|
position: "absolute",
|
|
861
864
|
display: "none",
|
|
@@ -922,14 +925,14 @@ const _s = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMj
|
|
|
922
925
|
],
|
|
923
926
|
offsetTop: 50,
|
|
924
927
|
icons: {
|
|
925
|
-
copyPaste:
|
|
926
|
-
delete:
|
|
927
|
-
lock:
|
|
928
|
-
unlock:
|
|
929
|
-
bringToFront:
|
|
930
|
-
sendToBack:
|
|
931
|
-
bringForward:
|
|
932
|
-
sendBackwards:
|
|
928
|
+
copyPaste: xs,
|
|
929
|
+
delete: Fs,
|
|
930
|
+
lock: ks,
|
|
931
|
+
unlock: Bs,
|
|
932
|
+
bringToFront: Us,
|
|
933
|
+
sendToBack: Ys,
|
|
934
|
+
bringForward: zs,
|
|
935
|
+
sendBackwards: Ps
|
|
933
936
|
},
|
|
934
937
|
handlers: {
|
|
935
938
|
copyPaste: (h) => _(null, null, function* () {
|
|
@@ -958,18 +961,18 @@ const _s = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMj
|
|
|
958
961
|
}
|
|
959
962
|
}
|
|
960
963
|
};
|
|
961
|
-
class
|
|
964
|
+
class Hs {
|
|
962
965
|
constructor({ editor: t }) {
|
|
963
966
|
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();
|
|
964
967
|
}
|
|
965
968
|
_initToolbar() {
|
|
966
969
|
if (!this.options.showToolbar) return;
|
|
967
970
|
const t = this.options.toolbar || {};
|
|
968
|
-
this.config =
|
|
969
|
-
style:
|
|
970
|
-
btnStyle:
|
|
971
|
-
icons:
|
|
972
|
-
handlers:
|
|
971
|
+
this.config = jt(k(k({}, zt), t), {
|
|
972
|
+
style: k(k({}, zt.style), t.style || {}),
|
|
973
|
+
btnStyle: k(k({}, zt.btnStyle), t.btnStyle || {}),
|
|
974
|
+
icons: k(k({}, zt.icons), t.icons || {}),
|
|
975
|
+
handlers: k(k({}, zt.handlers), t.handlers || {})
|
|
973
976
|
}), 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 = () => {
|
|
974
977
|
this.el.style.display = "none";
|
|
975
978
|
}, this._createDOM(), this._bindEvents();
|
|
@@ -1086,7 +1089,7 @@ class Ys {
|
|
|
1086
1089
|
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();
|
|
1087
1090
|
}
|
|
1088
1091
|
}
|
|
1089
|
-
const
|
|
1092
|
+
const Ws = {
|
|
1090
1093
|
position: "absolute",
|
|
1091
1094
|
display: "none",
|
|
1092
1095
|
background: "#2B2D33",
|
|
@@ -1100,8 +1103,8 @@ const Fs = {
|
|
|
1100
1103
|
"pointer-events": "none",
|
|
1101
1104
|
"white-space": "nowrap",
|
|
1102
1105
|
"box-shadow": "0 2px 8px rgba(0, 0, 0, 0.2)"
|
|
1103
|
-
},
|
|
1104
|
-
class
|
|
1106
|
+
}, Ge = 16, Ve = 16, Zs = "fabric-editor-angle-indicator";
|
|
1107
|
+
class be {
|
|
1105
1108
|
constructor({ editor: t }) {
|
|
1106
1109
|
this.isActive = !1, this.currentAngle = 0, this.editor = t, this.canvas = t.canvas, this.options = t.options, this._createDOM(), this._bindEvents();
|
|
1107
1110
|
}
|
|
@@ -1109,7 +1112,7 @@ class ve {
|
|
|
1109
1112
|
* Создание DOM-элемента индикатора
|
|
1110
1113
|
*/
|
|
1111
1114
|
_createDOM() {
|
|
1112
|
-
this.el = document.createElement("div"), this.el.className =
|
|
1115
|
+
this.el = document.createElement("div"), this.el.className = Zs, Object.entries(Ws).forEach(([t, e]) => {
|
|
1113
1116
|
this.el.style.setProperty(t, e);
|
|
1114
1117
|
}), this.canvas.wrapperEl.appendChild(this.el);
|
|
1115
1118
|
}
|
|
@@ -1129,7 +1132,7 @@ class ve {
|
|
|
1129
1132
|
return;
|
|
1130
1133
|
}
|
|
1131
1134
|
const s = e.angle || 0;
|
|
1132
|
-
this.currentAngle =
|
|
1135
|
+
this.currentAngle = be._normalizeAngle(s), this.el.textContent = `${this.currentAngle}°`, this._positionIndicator(t.e), this.isActive || this._showIndicator();
|
|
1133
1136
|
}
|
|
1134
1137
|
/**
|
|
1135
1138
|
* Обработчик отпускания кнопки мыши
|
|
@@ -1160,9 +1163,9 @@ class ve {
|
|
|
1160
1163
|
*/
|
|
1161
1164
|
_positionIndicator(t) {
|
|
1162
1165
|
const e = this.canvas.wrapperEl.getBoundingClientRect();
|
|
1163
|
-
let s = t.clientX - e.left +
|
|
1166
|
+
let s = t.clientX - e.left + Ge, o = t.clientY - e.top + Ve;
|
|
1164
1167
|
const n = this.el.getBoundingClientRect(), i = n.width, a = n.height;
|
|
1165
|
-
s + i > e.width && (s = t.clientX - e.left - i -
|
|
1168
|
+
s + i > e.width && (s = t.clientX - e.left - i - Ge), o + a > e.height && (o = t.clientY - e.top - a - Ve), this.el.style.left = `${s}px`, this.el.style.top = `${o}px`;
|
|
1166
1169
|
}
|
|
1167
1170
|
/**
|
|
1168
1171
|
* Показать индикатор
|
|
@@ -1193,7 +1196,7 @@ class ve {
|
|
|
1193
1196
|
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;
|
|
1194
1197
|
}
|
|
1195
1198
|
}
|
|
1196
|
-
const
|
|
1199
|
+
const as = [
|
|
1197
1200
|
"selectable",
|
|
1198
1201
|
"evented",
|
|
1199
1202
|
"id",
|
|
@@ -1229,7 +1232,7 @@ const ss = [
|
|
|
1229
1232
|
"radiusBottomRight",
|
|
1230
1233
|
"radiusBottomLeft"
|
|
1231
1234
|
];
|
|
1232
|
-
class
|
|
1235
|
+
class Jt {
|
|
1233
1236
|
constructor({ editor: t }) {
|
|
1234
1237
|
this.editor = t, this.canvas = t.canvas, this._historySuspendCount = 0, this.baseState = null, this.patches = [], this.currentIndex = 0, this.maxHistoryLength = t.options.maxHistoryLength, this.totalChangesCount = 0, this.baseStateChangesCount = 0, this._createDiffPatcher();
|
|
1235
1238
|
}
|
|
@@ -1241,7 +1244,7 @@ class Qt {
|
|
|
1241
1244
|
return this.patches[this.currentIndex - 1] || null;
|
|
1242
1245
|
}
|
|
1243
1246
|
_createDiffPatcher() {
|
|
1244
|
-
this.diffPatcher =
|
|
1247
|
+
this.diffPatcher = Ss({
|
|
1245
1248
|
objectHash(t) {
|
|
1246
1249
|
const e = t, s = t, o = s.styles ? JSON.stringify(s.styles) : "";
|
|
1247
1250
|
return [
|
|
@@ -1291,7 +1294,7 @@ class Qt {
|
|
|
1291
1294
|
includeValueOnMove: !1
|
|
1292
1295
|
},
|
|
1293
1296
|
textDiff: {
|
|
1294
|
-
diffMatchPatch:
|
|
1297
|
+
diffMatchPatch: As,
|
|
1295
1298
|
minLength: 60
|
|
1296
1299
|
}
|
|
1297
1300
|
});
|
|
@@ -1333,7 +1336,7 @@ class Qt {
|
|
|
1333
1336
|
if (console.log("saveState"), this.skipHistory) return;
|
|
1334
1337
|
console.time("saveState");
|
|
1335
1338
|
const t = this._withTemporaryUnlock(
|
|
1336
|
-
() => this.canvas.toDatalessObject([...
|
|
1339
|
+
() => this.canvas.toDatalessObject([...as])
|
|
1337
1340
|
);
|
|
1338
1341
|
if (console.timeEnd("saveState"), !this.baseState) {
|
|
1339
1342
|
this.baseState = t, this.patches = [], this.currentIndex = 0, console.log("Базовое состояние сохранено.");
|
|
@@ -1344,7 +1347,7 @@ class Qt {
|
|
|
1344
1347
|
console.log("Нет изменений для сохранения.");
|
|
1345
1348
|
return;
|
|
1346
1349
|
}
|
|
1347
|
-
console.log("baseState", this.baseState), this.currentIndex < this.patches.length && this.patches.splice(this.currentIndex), console.log("diff", s), this.totalChangesCount += 1, this.patches.push({ id:
|
|
1350
|
+
console.log("baseState", this.baseState), this.currentIndex < this.patches.length && this.patches.splice(this.currentIndex), console.log("diff", s), this.totalChangesCount += 1, this.patches.push({ id: Y(), diff: s }), this.currentIndex += 1, this.patches.length > this.maxHistoryLength && (this.baseState = this.diffPatcher.patch(this.baseState, this.patches[0].diff), this.patches.shift(), this.currentIndex -= 1, this.baseStateChangesCount += 1), console.log("Состояние сохранено. Текущий индекс истории:", this.currentIndex);
|
|
1348
1351
|
}
|
|
1349
1352
|
/**
|
|
1350
1353
|
* Сериализует customData объектов в строку. Это необходимо чтобы при вызове loadFromJSON fabricjs не пытался обрабатывать свойства внутри customData, как свойства FabricObject, если их названия совпадают с зарезервированными.
|
|
@@ -1381,8 +1384,8 @@ class Qt {
|
|
|
1381
1384
|
if (!t) return;
|
|
1382
1385
|
console.log("loadStateFromFullState fullState", t);
|
|
1383
1386
|
const { canvas: e, canvasManager: s, interactionBlocker: o, backgroundManager: n } = this.editor, { width: i, height: a } = e;
|
|
1384
|
-
o.overlayMask = null,
|
|
1385
|
-
|
|
1387
|
+
o.overlayMask = null, Jt._serializeCustomData(t), yield e.loadFromJSON(t, (l, u) => {
|
|
1388
|
+
Jt._deserializeCustomData(l, u);
|
|
1386
1389
|
});
|
|
1387
1390
|
const r = e.getObjects().find((l) => l.id === "montage-area");
|
|
1388
1391
|
r && (this.editor.montageArea = r, (i !== e.getWidth() || a !== e.getHeight()) && s.updateCanvas());
|
|
@@ -1496,7 +1499,7 @@ class Qt {
|
|
|
1496
1499
|
}
|
|
1497
1500
|
}
|
|
1498
1501
|
}
|
|
1499
|
-
const
|
|
1502
|
+
const Gs = 0.1, Vs = 2, Xe = 0.1, Xs = 90, Dt = 16, Lt = 16, pt = 4096, mt = 4096, Ke = "application/image-editor:", Kt = [
|
|
1500
1503
|
"format",
|
|
1501
1504
|
"uppercase",
|
|
1502
1505
|
"textCaseRaw",
|
|
@@ -1510,7 +1513,7 @@ const Ws = 0.1, Zs = 2, We = 0.1, Gs = 90, Et = 16, Ot = 16, pt = 4096, mt = 409
|
|
|
1510
1513
|
"radiusTopRight",
|
|
1511
1514
|
"radiusBottomRight",
|
|
1512
1515
|
"radiusBottomLeft"
|
|
1513
|
-
],
|
|
1516
|
+
], Ks = 50;
|
|
1514
1517
|
class rt {
|
|
1515
1518
|
constructor({ editor: t }) {
|
|
1516
1519
|
this.editor = t, this.options = t.options, this._createdBlobUrls = [], this.acceptContentTypes = this.editor.options.acceptContentTypes, this.acceptFormats = this.getAllowedFormatsFromContentTypes();
|
|
@@ -1584,23 +1587,23 @@ class rt {
|
|
|
1584
1587
|
}
|
|
1585
1588
|
}), null;
|
|
1586
1589
|
if (this._createdBlobUrls.push(v), f === "svg") {
|
|
1587
|
-
const S = yield
|
|
1590
|
+
const S = yield fs(v);
|
|
1588
1591
|
b = ct.groupSVGElements(S.objects, S.options);
|
|
1589
1592
|
} else
|
|
1590
|
-
b = yield
|
|
1593
|
+
b = yield Bt.fromURL(v, { crossOrigin: "anonymous" });
|
|
1591
1594
|
const { width: I, height: y } = b;
|
|
1592
|
-
if (b instanceof
|
|
1595
|
+
if (b instanceof Bt) {
|
|
1593
1596
|
const S = b.getElement();
|
|
1594
1597
|
let A = "";
|
|
1595
1598
|
if (S instanceof HTMLImageElement ? A = S.src : S instanceof HTMLCanvasElement && (A = S.toDataURL()), y > mt || I > pt) {
|
|
1596
1599
|
const M = yield this.resizeImageToBoundaries(A, "max"), C = URL.createObjectURL(M);
|
|
1597
|
-
this._createdBlobUrls.push(C), b = yield
|
|
1598
|
-
} else if (y <
|
|
1600
|
+
this._createdBlobUrls.push(C), b = yield Bt.fromURL(C, { crossOrigin: "anonymous" });
|
|
1601
|
+
} else if (y < Lt || I < Dt) {
|
|
1599
1602
|
const M = yield this.resizeImageToBoundaries(A, "min"), C = URL.createObjectURL(M);
|
|
1600
|
-
this._createdBlobUrls.push(C), b = yield
|
|
1603
|
+
this._createdBlobUrls.push(C), b = yield Bt.fromURL(C, { crossOrigin: "anonymous" });
|
|
1601
1604
|
}
|
|
1602
1605
|
}
|
|
1603
|
-
if (b.set("id", `${b.type}-${
|
|
1606
|
+
if (b.set("id", `${b.type}-${Y()}`), b.set("format", f), s === "scale-montage")
|
|
1604
1607
|
this.editor.canvasManager.scaleMontageAreaToImage({ object: b, withoutSave: !0 });
|
|
1605
1608
|
else {
|
|
1606
1609
|
const { width: S, height: A } = c, M = this.calculateScaleFactor({ imageObject: b, scaleType: s });
|
|
@@ -1650,14 +1653,14 @@ class rt {
|
|
|
1650
1653
|
resizeImageToBoundaries(t, e = "max") {
|
|
1651
1654
|
return _(this, null, function* () {
|
|
1652
1655
|
let s = `Размер изображения больше максимального размера канваса, поэтому оно будет уменьшено до максимальных размеров c сохранением пропорций: ${pt}x${mt}`;
|
|
1653
|
-
e === "min" && (s = `Размер изображения меньше минимального размера канваса, поэтому оно будет увеличено до минимальных размеров c сохранением пропорций: ${
|
|
1656
|
+
e === "min" && (s = `Размер изображения меньше минимального размера канваса, поэтому оно будет увеличено до минимальных размеров c сохранением пропорций: ${Dt}x${Lt}`);
|
|
1654
1657
|
const o = {
|
|
1655
1658
|
dataURL: t,
|
|
1656
1659
|
sizeType: e,
|
|
1657
1660
|
maxWidth: pt,
|
|
1658
1661
|
maxHeight: mt,
|
|
1659
|
-
minWidth:
|
|
1660
|
-
minHeight:
|
|
1662
|
+
minWidth: Dt,
|
|
1663
|
+
minHeight: Lt
|
|
1661
1664
|
};
|
|
1662
1665
|
return this.editor.errorManager.emitWarning({
|
|
1663
1666
|
origin: "ImageManager",
|
|
@@ -1734,22 +1737,22 @@ class rt {
|
|
|
1734
1737
|
[w]
|
|
1735
1738
|
);
|
|
1736
1739
|
if (d) {
|
|
1737
|
-
const T = p * 0.264583, B = m * 0.264583,
|
|
1740
|
+
const T = p * 0.264583, B = m * 0.264583, Z = (yield this.editor.moduleLoader.loadModule("jspdf")).jsPDF, U = new Z({
|
|
1738
1741
|
orientation: T > B ? "landscape" : "portrait",
|
|
1739
1742
|
unit: "mm",
|
|
1740
1743
|
format: [T, B]
|
|
1741
1744
|
});
|
|
1742
|
-
if (
|
|
1745
|
+
if (U.addImage(String(S), "JPG", 0, 0, T, B), o) {
|
|
1743
1746
|
const K = {
|
|
1744
|
-
image:
|
|
1747
|
+
image: U.output("datauristring"),
|
|
1745
1748
|
format: "pdf",
|
|
1746
1749
|
contentType: "application/pdf",
|
|
1747
1750
|
fileName: e
|
|
1748
1751
|
};
|
|
1749
1752
|
return i.fire("editor:canvas-exported", K), K;
|
|
1750
1753
|
}
|
|
1751
|
-
const
|
|
1752
|
-
image: new File([
|
|
1754
|
+
const F = U.output("blob"), D = {
|
|
1755
|
+
image: new File([F], e, { type: "application/pdf" }),
|
|
1753
1756
|
format: "pdf",
|
|
1754
1757
|
contentType: "application/pdf",
|
|
1755
1758
|
fileName: e
|
|
@@ -1827,7 +1830,7 @@ class rt {
|
|
|
1827
1830
|
};
|
|
1828
1831
|
return a.fire("editor:object-exported", v), v;
|
|
1829
1832
|
}
|
|
1830
|
-
if (n && c instanceof
|
|
1833
|
+
if (n && c instanceof Bt) {
|
|
1831
1834
|
const p = yield createImageBitmap(c.getElement()), m = yield r.post(
|
|
1832
1835
|
"toDataURL",
|
|
1833
1836
|
{
|
|
@@ -1998,11 +2001,11 @@ class rt {
|
|
|
1998
2001
|
return e ? e[1] : "";
|
|
1999
2002
|
}
|
|
2000
2003
|
}
|
|
2001
|
-
const
|
|
2002
|
-
function
|
|
2004
|
+
const It = (h, t, e) => Math.max(Math.min(h, e), t), Qe = (h, t) => h * t, Qs = (h, t) => new J(h / 2, t / 2);
|
|
2005
|
+
function qs(h) {
|
|
2003
2006
|
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";
|
|
2004
2007
|
}
|
|
2005
|
-
class
|
|
2008
|
+
class $s {
|
|
2006
2009
|
/**
|
|
2007
2010
|
* @param options
|
|
2008
2011
|
* @param options.editor – экземпляр редактора
|
|
@@ -2033,9 +2036,9 @@ class Qs {
|
|
|
2033
2036
|
canvas: n,
|
|
2034
2037
|
montageArea: i,
|
|
2035
2038
|
options: { canvasBackstoreWidth: a }
|
|
2036
|
-
} = this.editor, { width: r, height: c } = i, d =
|
|
2039
|
+
} = this.editor, { width: r, height: c } = i, d = It(Number(t), Dt, pt);
|
|
2037
2040
|
if (!a || a === "auto" || o ? this.adaptCanvasToContainer() : a ? this.setCanvasBackstoreWidth(Number(a)) : this.setCanvasBackstoreWidth(d), i.set({ width: d }), (f = n.clipPath) == null || f.set({ width: d }), e) {
|
|
2038
|
-
const p = d / r, m =
|
|
2041
|
+
const p = d / r, m = Qe(c, p);
|
|
2039
2042
|
this.setResolutionHeight(m);
|
|
2040
2043
|
return;
|
|
2041
2044
|
}
|
|
@@ -2063,9 +2066,9 @@ class Qs {
|
|
|
2063
2066
|
canvas: n,
|
|
2064
2067
|
montageArea: i,
|
|
2065
2068
|
options: { canvasBackstoreHeight: a }
|
|
2066
|
-
} = this.editor, { width: r, height: c } = i, d =
|
|
2069
|
+
} = this.editor, { width: r, height: c } = i, d = It(Number(t), Lt, mt);
|
|
2067
2070
|
if (!a || a === "auto" || o ? this.adaptCanvasToContainer() : a ? this.setCanvasBackstoreHeight(Number(a)) : this.setCanvasBackstoreHeight(d), i.set({ height: d }), (f = n.clipPath) == null || f.set({ height: d }), e) {
|
|
2068
|
-
const p = d / c, m =
|
|
2071
|
+
const p = d / c, m = Qe(r, p);
|
|
2069
2072
|
this.setResolutionWidth(m);
|
|
2070
2073
|
return;
|
|
2071
2074
|
}
|
|
@@ -2083,7 +2086,7 @@ class Qs {
|
|
|
2083
2086
|
*/
|
|
2084
2087
|
centerMontageArea() {
|
|
2085
2088
|
var r;
|
|
2086
|
-
const { canvas: t, montageArea: e } = this.editor, s = t.getWidth(), o = t.getHeight(), n = t.getZoom(), i =
|
|
2089
|
+
const { canvas: t, montageArea: e } = this.editor, s = t.getWidth(), o = t.getHeight(), n = t.getZoom(), i = Qs(s, o);
|
|
2087
2090
|
e.set({
|
|
2088
2091
|
left: s / 2,
|
|
2089
2092
|
top: o / 2
|
|
@@ -2116,7 +2119,7 @@ class Qs {
|
|
|
2116
2119
|
*/
|
|
2117
2120
|
setCanvasBackstoreWidth(t) {
|
|
2118
2121
|
if (!t || typeof t != "number") return;
|
|
2119
|
-
const e =
|
|
2122
|
+
const e = It(t, Dt, pt);
|
|
2120
2123
|
this.editor.canvas.setDimensions({ width: e }, { backstoreOnly: !0 });
|
|
2121
2124
|
}
|
|
2122
2125
|
/**
|
|
@@ -2125,7 +2128,7 @@ class Qs {
|
|
|
2125
2128
|
*/
|
|
2126
2129
|
setCanvasBackstoreHeight(t) {
|
|
2127
2130
|
if (!t || typeof t != "number") return;
|
|
2128
|
-
const e =
|
|
2131
|
+
const e = It(t, Lt, mt);
|
|
2129
2132
|
this.editor.canvas.setDimensions({ height: e }, { backstoreOnly: !0 });
|
|
2130
2133
|
}
|
|
2131
2134
|
/**
|
|
@@ -2134,7 +2137,7 @@ class Qs {
|
|
|
2134
2137
|
* с учётом минимальных и максимальных значений.
|
|
2135
2138
|
*/
|
|
2136
2139
|
adaptCanvasToContainer() {
|
|
2137
|
-
const { canvas: t } = this.editor, e = this.getEditorContainer(), s = e.clientWidth, o = e.clientHeight, n =
|
|
2140
|
+
const { canvas: t } = this.editor, e = this.getEditorContainer(), s = e.clientWidth, o = e.clientHeight, n = It(s, Dt, pt), i = It(o, Lt, mt);
|
|
2138
2141
|
t.setDimensions({ width: n, height: i }, { backstoreOnly: !0 });
|
|
2139
2142
|
}
|
|
2140
2143
|
/**
|
|
@@ -2168,7 +2171,7 @@ class Qs {
|
|
|
2168
2171
|
if (d.length === 1)
|
|
2169
2172
|
t.setActiveObject(d[0]);
|
|
2170
2173
|
else {
|
|
2171
|
-
const l = new
|
|
2174
|
+
const l = new x(d, {
|
|
2172
2175
|
canvas: t
|
|
2173
2176
|
});
|
|
2174
2177
|
t.setActiveObject(l);
|
|
@@ -2334,7 +2337,7 @@ class Qs {
|
|
|
2334
2337
|
montageAreaHeight: r
|
|
2335
2338
|
}
|
|
2336
2339
|
} = this.editor, c = t || o.getActiveObject();
|
|
2337
|
-
if (!
|
|
2340
|
+
if (!qs(c)) return;
|
|
2338
2341
|
const { width: d, height: l } = c;
|
|
2339
2342
|
let u = Math.min(d, pt), g = Math.min(l, mt);
|
|
2340
2343
|
if (e) {
|
|
@@ -2394,7 +2397,7 @@ class Qs {
|
|
|
2394
2397
|
);
|
|
2395
2398
|
}
|
|
2396
2399
|
}
|
|
2397
|
-
class
|
|
2400
|
+
class Js {
|
|
2398
2401
|
constructor({ editor: t }) {
|
|
2399
2402
|
this.editor = t, this.options = t.options;
|
|
2400
2403
|
}
|
|
@@ -2405,7 +2408,7 @@ class qs {
|
|
|
2405
2408
|
* @param options.withoutSave - Не сохранять состояние
|
|
2406
2409
|
* @fires editor:object-rotated
|
|
2407
2410
|
*/
|
|
2408
|
-
rotate(t =
|
|
2411
|
+
rotate(t = Xs, { withoutSave: e } = {}) {
|
|
2409
2412
|
const { canvas: s, historyManager: o } = this.editor, n = s.getActiveObject();
|
|
2410
2413
|
if (!n) return;
|
|
2411
2414
|
const i = n.angle + t;
|
|
@@ -2455,7 +2458,7 @@ class qs {
|
|
|
2455
2458
|
withoutSave: s
|
|
2456
2459
|
} = {}) {
|
|
2457
2460
|
const { canvas: o, historyManager: n } = this.editor, i = t || o.getActiveObject();
|
|
2458
|
-
i && (i instanceof
|
|
2461
|
+
i && (i instanceof x ? i.getObjects().forEach((a) => {
|
|
2459
2462
|
a.set("opacity", e);
|
|
2460
2463
|
}) : i.set("opacity", e), o.renderAll(), s || n.saveState(), o.fire("editor:object-opacity-changed", {
|
|
2461
2464
|
object: i,
|
|
@@ -2482,12 +2485,12 @@ class qs {
|
|
|
2482
2485
|
} = {}) {
|
|
2483
2486
|
const { canvas: n, historyManager: i } = this.editor, a = t || n.getActiveObject();
|
|
2484
2487
|
if (a) {
|
|
2485
|
-
if (a instanceof
|
|
2488
|
+
if (a instanceof x && !o) {
|
|
2486
2489
|
const r = a.getObjects();
|
|
2487
2490
|
n.discardActiveObject(), r.forEach((d) => {
|
|
2488
2491
|
this._fitSingleObject(d, e);
|
|
2489
2492
|
});
|
|
2490
|
-
const c = new
|
|
2493
|
+
const c = new x(r, { canvas: n });
|
|
2491
2494
|
n.setActiveObject(c);
|
|
2492
2495
|
} else
|
|
2493
2496
|
this._fitSingleObject(a, e);
|
|
@@ -2560,9 +2563,9 @@ class qs {
|
|
|
2560
2563
|
});
|
|
2561
2564
|
}
|
|
2562
2565
|
}
|
|
2563
|
-
class
|
|
2566
|
+
class to {
|
|
2564
2567
|
constructor({ editor: t }) {
|
|
2565
|
-
this.editor = t, this.options = t.options, this.minZoom = this.options.minZoom ||
|
|
2568
|
+
this.editor = t, this.options = t.options, this.minZoom = this.options.minZoom || Gs, this.maxZoom = this.options.maxZoom || Vs, this.defaultZoom = this.options.defaultScale;
|
|
2566
2569
|
}
|
|
2567
2570
|
/**
|
|
2568
2571
|
* Вспомогательный метод для вычисления размеров масштабированной монтажной области
|
|
@@ -2638,8 +2641,8 @@ class $s {
|
|
|
2638
2641
|
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], g = Math.abs(o), f = e - s;
|
|
2639
2642
|
if (Math.abs(f) / g <= 0.1)
|
|
2640
2643
|
return { x: l, y: u };
|
|
2641
|
-
const m = c / 2, v = d / 2, b = a.left, I = a.top, y = m - b * s, w = v - I * s, S = (y - r[4]) / (e - s), A = (w - r[5]) / (e - s), M = S * g, C = A * g, j = M * n, T = C * n, B = Math.abs(j) > Math.abs(l) ? l : j,
|
|
2642
|
-
return { x: B, y:
|
|
2644
|
+
const m = c / 2, v = d / 2, b = a.left, I = a.top, y = m - b * s, w = v - I * s, S = (y - r[4]) / (e - s), A = (w - r[5]) / (e - s), M = S * g, C = A * g, j = M * n, T = C * n, B = Math.abs(j) > Math.abs(l) ? l : j, Z = Math.abs(T) > Math.abs(u) ? u : T;
|
|
2645
|
+
return { x: B, y: Z };
|
|
2643
2646
|
}
|
|
2644
2647
|
/**
|
|
2645
2648
|
* Применяет плавное центрирование viewport при приближении к defaultZoom.
|
|
@@ -2651,7 +2654,7 @@ class $s {
|
|
|
2651
2654
|
* @returns true если центрирование было применено
|
|
2652
2655
|
* @private
|
|
2653
2656
|
*/
|
|
2654
|
-
_applyViewportCentering(t, e = !1, s =
|
|
2657
|
+
_applyViewportCentering(t, e = !1, s = Xe) {
|
|
2655
2658
|
const { canvas: o } = this.editor, n = this._getScaledMontageDimensions(t), i = o.getWidth(), a = o.getHeight(), r = n.width > i || n.height > a, c = this._calculateFitZoom(), d = t - c;
|
|
2656
2659
|
if (!(!r || d) && !e)
|
|
2657
2660
|
return !1;
|
|
@@ -2726,7 +2729,7 @@ class $s {
|
|
|
2726
2729
|
* @param options.pointY - Координата Y точки зума
|
|
2727
2730
|
* @fires editor:zoom-changed
|
|
2728
2731
|
*/
|
|
2729
|
-
zoom(t =
|
|
2732
|
+
zoom(t = Xe, e = {}) {
|
|
2730
2733
|
var g, f;
|
|
2731
2734
|
if (!t) return;
|
|
2732
2735
|
const { minZoom: s, maxZoom: o } = this, { canvas: n } = this.editor, i = t < 0, a = n.getZoom(), r = n.getCenterPoint(), c = (g = e.pointX) != null ? g : r.x, d = (f = e.pointY) != null ? f : r.y, l = new J(c, d);
|
|
@@ -2764,7 +2767,7 @@ class $s {
|
|
|
2764
2767
|
}), this.editor.panConstraintManager.updateBounds();
|
|
2765
2768
|
}
|
|
2766
2769
|
}
|
|
2767
|
-
class
|
|
2770
|
+
class eo {
|
|
2768
2771
|
constructor({ editor: t }) {
|
|
2769
2772
|
this.editor = t, this.isBlocked = !1, this.overlayMask = null, this._createOverlay();
|
|
2770
2773
|
}
|
|
@@ -2821,7 +2824,7 @@ class Js {
|
|
|
2821
2824
|
}), t.upperCanvasEl.style.pointerEvents = "", t.lowerCanvasEl.style.pointerEvents = "", this.overlayMask.visible = !1, t.requestRenderAll(), t.fire("editor:enabled"), s.resumeHistory();
|
|
2822
2825
|
}
|
|
2823
2826
|
}
|
|
2824
|
-
class
|
|
2827
|
+
class Tt {
|
|
2825
2828
|
constructor({ editor: t }) {
|
|
2826
2829
|
this.editor = t, this.backgroundObject = null;
|
|
2827
2830
|
}
|
|
@@ -2846,7 +2849,7 @@ class It {
|
|
|
2846
2849
|
}
|
|
2847
2850
|
i.set({
|
|
2848
2851
|
fill: t,
|
|
2849
|
-
backgroundId: `background-${
|
|
2852
|
+
backgroundId: `background-${Y()}`
|
|
2850
2853
|
}), this.editor.canvas.requestRenderAll();
|
|
2851
2854
|
} else
|
|
2852
2855
|
this._removeCurrentBackground(), this._createColorBackground(t);
|
|
@@ -2876,14 +2879,14 @@ class It {
|
|
|
2876
2879
|
try {
|
|
2877
2880
|
const { historyManager: n } = this.editor, { backgroundObject: i } = this;
|
|
2878
2881
|
if (n.suspendHistory(), i && i.backgroundType === "gradient") {
|
|
2879
|
-
const a =
|
|
2880
|
-
if (
|
|
2882
|
+
const a = Tt._createFabricGradient(t);
|
|
2883
|
+
if (Tt._isGradientEqual(i.fill, a)) {
|
|
2881
2884
|
n.resumeHistory();
|
|
2882
2885
|
return;
|
|
2883
2886
|
}
|
|
2884
2887
|
i.set({
|
|
2885
2888
|
fill: a,
|
|
2886
|
-
backgroundId: `background-${
|
|
2889
|
+
backgroundId: `background-${Y()}`
|
|
2887
2890
|
}), this.editor.canvas.requestRenderAll();
|
|
2888
2891
|
} else
|
|
2889
2892
|
this._removeCurrentBackground(), this._createGradientBackground(t);
|
|
@@ -3030,7 +3033,7 @@ class It {
|
|
|
3030
3033
|
hasControls: !1,
|
|
3031
3034
|
id: "background",
|
|
3032
3035
|
backgroundType: "color",
|
|
3033
|
-
backgroundId: `background-${
|
|
3036
|
+
backgroundId: `background-${Y()}`
|
|
3034
3037
|
}, { withoutSelection: !0 }), this.refresh();
|
|
3035
3038
|
}
|
|
3036
3039
|
/**
|
|
@@ -3047,9 +3050,9 @@ class It {
|
|
|
3047
3050
|
hasControls: !1,
|
|
3048
3051
|
id: "background",
|
|
3049
3052
|
backgroundType: "gradient",
|
|
3050
|
-
backgroundId: `background-${
|
|
3053
|
+
backgroundId: `background-${Y()}`
|
|
3051
3054
|
}, { withoutSelection: !0 }), this.refresh();
|
|
3052
|
-
const e =
|
|
3055
|
+
const e = Tt._createFabricGradient(t);
|
|
3053
3056
|
this.backgroundObject.set("fill", e), this.editor.canvas.requestRenderAll();
|
|
3054
3057
|
}
|
|
3055
3058
|
/**
|
|
@@ -3075,7 +3078,7 @@ class It {
|
|
|
3075
3078
|
hasControls: !1,
|
|
3076
3079
|
id: "background",
|
|
3077
3080
|
backgroundType: "image",
|
|
3078
|
-
backgroundId: `background-${
|
|
3081
|
+
backgroundId: `background-${Y()}`,
|
|
3079
3082
|
customData: e
|
|
3080
3083
|
}), this._removeCurrentBackground(), this.backgroundObject = s, this.refresh();
|
|
3081
3084
|
});
|
|
@@ -3101,8 +3104,8 @@ class It {
|
|
|
3101
3104
|
{ offset: n / 100, color: s }
|
|
3102
3105
|
];
|
|
3103
3106
|
if (t.type === "linear") {
|
|
3104
|
-
const l = t.angle * Math.PI / 180, u =
|
|
3105
|
-
return new
|
|
3107
|
+
const l = t.angle * Math.PI / 180, u = Tt._angleToCoords(l);
|
|
3108
|
+
return new Fe({
|
|
3106
3109
|
type: "linear",
|
|
3107
3110
|
gradientUnits: "percentage",
|
|
3108
3111
|
coords: u,
|
|
@@ -3121,7 +3124,7 @@ class It {
|
|
|
3121
3124
|
r1: 0,
|
|
3122
3125
|
r2: c / 100
|
|
3123
3126
|
};
|
|
3124
|
-
return new
|
|
3127
|
+
return new Fe({
|
|
3125
3128
|
type: "radial",
|
|
3126
3129
|
gradientUnits: "percentage",
|
|
3127
3130
|
coords: d,
|
|
@@ -3156,7 +3159,7 @@ class It {
|
|
|
3156
3159
|
}) ? !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;
|
|
3157
3160
|
}
|
|
3158
3161
|
}
|
|
3159
|
-
class
|
|
3162
|
+
class te {
|
|
3160
3163
|
constructor({ editor: t }) {
|
|
3161
3164
|
this.editor = t;
|
|
3162
3165
|
}
|
|
@@ -3171,7 +3174,7 @@ class qt {
|
|
|
3171
3174
|
const { canvas: s, historyManager: o } = this.editor;
|
|
3172
3175
|
o.suspendHistory();
|
|
3173
3176
|
const n = t || s.getActiveObject();
|
|
3174
|
-
n && (n instanceof
|
|
3177
|
+
n && (n instanceof x ? n.getObjects().forEach((i) => {
|
|
3175
3178
|
s.bringObjectToFront(i);
|
|
3176
3179
|
}) : s.bringObjectToFront(n), s.renderAll(), o.resumeHistory(), e || o.saveState(), s.fire("editor:object-bring-to-front", {
|
|
3177
3180
|
object: n,
|
|
@@ -3189,7 +3192,7 @@ class qt {
|
|
|
3189
3192
|
const { canvas: s, historyManager: o } = this.editor;
|
|
3190
3193
|
o.suspendHistory();
|
|
3191
3194
|
const n = t || s.getActiveObject();
|
|
3192
|
-
n && (n instanceof
|
|
3195
|
+
n && (n instanceof x ? te._moveSelectionForward(s, n) : s.bringObjectForward(n), s.renderAll(), o.resumeHistory(), e || o.saveState(), s.fire("editor:object-bring-forward", {
|
|
3193
3196
|
object: n,
|
|
3194
3197
|
withoutSave: e
|
|
3195
3198
|
}));
|
|
@@ -3212,7 +3215,7 @@ class qt {
|
|
|
3212
3215
|
n.suspendHistory();
|
|
3213
3216
|
const r = t || s.getActiveObject();
|
|
3214
3217
|
if (r) {
|
|
3215
|
-
if (r instanceof
|
|
3218
|
+
if (r instanceof x) {
|
|
3216
3219
|
const c = r.getObjects();
|
|
3217
3220
|
for (let d = c.length - 1; d >= 0; d -= 1)
|
|
3218
3221
|
s.sendObjectToBack(c[d]);
|
|
@@ -3240,7 +3243,7 @@ class qt {
|
|
|
3240
3243
|
} = this.editor;
|
|
3241
3244
|
n.suspendHistory();
|
|
3242
3245
|
const r = t || s.getActiveObject();
|
|
3243
|
-
r && (r instanceof
|
|
3246
|
+
r && (r instanceof x ? te._moveSelectionBackwards(s, r) : s.sendObjectBackwards(r), a && s.sendObjectToBack(a), s.sendObjectToBack(o), i && s.sendObjectToBack(i), s.renderAll(), n.resumeHistory(), e || n.saveState(), s.fire("editor:object-send-backwards", {
|
|
3244
3247
|
object: r,
|
|
3245
3248
|
withoutSave: e
|
|
3246
3249
|
}));
|
|
@@ -3284,7 +3287,7 @@ class qt {
|
|
|
3284
3287
|
});
|
|
3285
3288
|
}
|
|
3286
3289
|
}
|
|
3287
|
-
class
|
|
3290
|
+
class so {
|
|
3288
3291
|
/**
|
|
3289
3292
|
* Менеджер фигур для редактора.
|
|
3290
3293
|
* @param options - Опции и настройки менеджера фигур.
|
|
@@ -3310,7 +3313,7 @@ class to {
|
|
|
3310
3313
|
*/
|
|
3311
3314
|
addRectangle(d = {}, { withoutSelection: r, withoutAdding: c } = {}) {
|
|
3312
3315
|
var l = d, {
|
|
3313
|
-
id: t = `rect-${
|
|
3316
|
+
id: t = `rect-${Y()}`,
|
|
3314
3317
|
left: e,
|
|
3315
3318
|
top: s,
|
|
3316
3319
|
width: o = 100,
|
|
@@ -3324,7 +3327,7 @@ class to {
|
|
|
3324
3327
|
"height",
|
|
3325
3328
|
"fill"
|
|
3326
3329
|
]);
|
|
3327
|
-
const { canvas: u } = this.editor, g = new
|
|
3330
|
+
const { canvas: u } = this.editor, g = new ps(k({
|
|
3328
3331
|
id: t,
|
|
3329
3332
|
left: e,
|
|
3330
3333
|
top: s,
|
|
@@ -3352,7 +3355,7 @@ class to {
|
|
|
3352
3355
|
*/
|
|
3353
3356
|
addCircle(c = {}, { withoutSelection: a, withoutAdding: r } = {}) {
|
|
3354
3357
|
var d = c, {
|
|
3355
|
-
id: t = `circle-${
|
|
3358
|
+
id: t = `circle-${Y()}`,
|
|
3356
3359
|
left: e,
|
|
3357
3360
|
top: s,
|
|
3358
3361
|
radius: o = 50,
|
|
@@ -3364,7 +3367,7 @@ class to {
|
|
|
3364
3367
|
"radius",
|
|
3365
3368
|
"fill"
|
|
3366
3369
|
]);
|
|
3367
|
-
const { canvas: l } = this.editor, u = new
|
|
3370
|
+
const { canvas: l } = this.editor, u = new ms(k({
|
|
3368
3371
|
id: t,
|
|
3369
3372
|
left: e,
|
|
3370
3373
|
top: s,
|
|
@@ -3392,7 +3395,7 @@ class to {
|
|
|
3392
3395
|
*/
|
|
3393
3396
|
addTriangle(d = {}, { withoutSelection: r, withoutAdding: c } = {}) {
|
|
3394
3397
|
var l = d, {
|
|
3395
|
-
id: t = `triangle-${
|
|
3398
|
+
id: t = `triangle-${Y()}`,
|
|
3396
3399
|
left: e,
|
|
3397
3400
|
top: s,
|
|
3398
3401
|
width: o = 100,
|
|
@@ -3406,7 +3409,7 @@ class to {
|
|
|
3406
3409
|
"height",
|
|
3407
3410
|
"fill"
|
|
3408
3411
|
]);
|
|
3409
|
-
const { canvas: u } = this.editor, g = new
|
|
3412
|
+
const { canvas: u } = this.editor, g = new ys(k({
|
|
3410
3413
|
id: t,
|
|
3411
3414
|
left: e,
|
|
3412
3415
|
top: s,
|
|
@@ -3417,7 +3420,7 @@ class to {
|
|
|
3417
3420
|
return !e && !s && u.centerObject(g), c || (u.add(g), r || u.setActiveObject(g), u.renderAll()), g;
|
|
3418
3421
|
}
|
|
3419
3422
|
}
|
|
3420
|
-
class
|
|
3423
|
+
class oo {
|
|
3421
3424
|
/**
|
|
3422
3425
|
* @param options
|
|
3423
3426
|
* @param options.editor - экземпляр редактора с доступом к canvas
|
|
@@ -3448,7 +3451,7 @@ class eo {
|
|
|
3448
3451
|
return _(this, null, function* () {
|
|
3449
3452
|
const { canvas: e, errorManager: s } = this.editor;
|
|
3450
3453
|
try {
|
|
3451
|
-
const o = yield t.clone(
|
|
3454
|
+
const o = yield t.clone(Kt);
|
|
3452
3455
|
this.clipboard = o, e.fire("editor:object-copied", { object: o });
|
|
3453
3456
|
} catch (o) {
|
|
3454
3457
|
s.emitError({
|
|
@@ -3475,7 +3478,7 @@ class eo {
|
|
|
3475
3478
|
message: "navigator.clipboard не поддерживается в этом браузере или отсутствует HTTPS-соединение."
|
|
3476
3479
|
}), !1;
|
|
3477
3480
|
try {
|
|
3478
|
-
const s = t.toObject(
|
|
3481
|
+
const s = t.toObject(Kt), o = JSON.stringify(s);
|
|
3479
3482
|
return t.type === "image" ? this._copyImageToClipboard(t, o) : this._copyTextToClipboard(o);
|
|
3480
3483
|
} catch (s) {
|
|
3481
3484
|
return e.emitError({
|
|
@@ -3516,7 +3519,7 @@ class eo {
|
|
|
3516
3519
|
_copyTextToClipboard(t) {
|
|
3517
3520
|
return _(this, null, function* () {
|
|
3518
3521
|
try {
|
|
3519
|
-
const e = `${
|
|
3522
|
+
const e = `${Ke}${t}`;
|
|
3520
3523
|
return yield navigator.clipboard.writeText(e), console.info("Text copied to clipboard successfully"), !0;
|
|
3521
3524
|
} catch (e) {
|
|
3522
3525
|
const { errorManager: s } = this.editor;
|
|
@@ -3536,7 +3539,7 @@ class eo {
|
|
|
3536
3539
|
*/
|
|
3537
3540
|
_addClonedObjectToCanvas(t) {
|
|
3538
3541
|
const { canvas: e, historyManager: s } = this.editor;
|
|
3539
|
-
if (e.discardActiveObject(), t instanceof
|
|
3542
|
+
if (e.discardActiveObject(), t instanceof x) {
|
|
3540
3543
|
s.suspendHistory(), t.canvas = e, t.forEachObject((o) => {
|
|
3541
3544
|
e.add(o);
|
|
3542
3545
|
}), e.setActiveObject(t), e.requestRenderAll(), s.resumeHistory(), s.saveState();
|
|
@@ -3569,14 +3572,14 @@ class eo {
|
|
|
3569
3572
|
const { canvas: e } = this.editor, s = t || e.getActiveObject();
|
|
3570
3573
|
if (!s || s.locked) return !1;
|
|
3571
3574
|
try {
|
|
3572
|
-
const o = yield s.clone(
|
|
3573
|
-
return o instanceof
|
|
3575
|
+
const o = yield s.clone(Kt);
|
|
3576
|
+
return o instanceof x && o.forEachObject((n) => {
|
|
3574
3577
|
n.set({
|
|
3575
|
-
id: `${n.type}-${
|
|
3578
|
+
id: `${n.type}-${Y()}`,
|
|
3576
3579
|
evented: !0
|
|
3577
3580
|
});
|
|
3578
3581
|
}), o.set({
|
|
3579
|
-
id: `${o.type}-${
|
|
3582
|
+
id: `${o.type}-${Y()}`,
|
|
3580
3583
|
left: o.left + 10,
|
|
3581
3584
|
top: o.top + 10,
|
|
3582
3585
|
evented: !0
|
|
@@ -3607,7 +3610,7 @@ class eo {
|
|
|
3607
3610
|
return;
|
|
3608
3611
|
}
|
|
3609
3612
|
const s = t.getData("text/plain");
|
|
3610
|
-
if (s && s.startsWith(
|
|
3613
|
+
if (s && s.startsWith(Ke)) {
|
|
3611
3614
|
this.paste();
|
|
3612
3615
|
return;
|
|
3613
3616
|
}
|
|
@@ -3655,14 +3658,14 @@ class eo {
|
|
|
3655
3658
|
const { canvas: t } = this.editor;
|
|
3656
3659
|
if (!this.clipboard) return !1;
|
|
3657
3660
|
try {
|
|
3658
|
-
const e = yield this.clipboard.clone(
|
|
3659
|
-
return t.discardActiveObject(), e instanceof
|
|
3661
|
+
const e = yield this.clipboard.clone(Kt);
|
|
3662
|
+
return t.discardActiveObject(), e instanceof x && e.forEachObject((s) => {
|
|
3660
3663
|
s.set({
|
|
3661
|
-
id: `${s.type}-${
|
|
3664
|
+
id: `${s.type}-${Y()}`,
|
|
3662
3665
|
evented: !0
|
|
3663
3666
|
});
|
|
3664
3667
|
}), e.set({
|
|
3665
|
-
id: `${e.type}-${
|
|
3668
|
+
id: `${e.type}-${Y()}`,
|
|
3666
3669
|
left: e.left + 10,
|
|
3667
3670
|
top: e.top + 10,
|
|
3668
3671
|
evented: !0
|
|
@@ -3680,7 +3683,7 @@ class eo {
|
|
|
3680
3683
|
});
|
|
3681
3684
|
}
|
|
3682
3685
|
}
|
|
3683
|
-
class
|
|
3686
|
+
class ee {
|
|
3684
3687
|
constructor({ editor: t }) {
|
|
3685
3688
|
this.editor = t;
|
|
3686
3689
|
}
|
|
@@ -3706,7 +3709,7 @@ class $t {
|
|
|
3706
3709
|
editable: !1,
|
|
3707
3710
|
locked: !0
|
|
3708
3711
|
};
|
|
3709
|
-
i.set(a), !e &&
|
|
3712
|
+
i.set(a), !e && ee._isGroupOrSelection(i) && i.getObjects().forEach((c) => {
|
|
3710
3713
|
c.set(a);
|
|
3711
3714
|
}), o.renderAll(), s || n.saveState(), o.fire("editor:object-locked", {
|
|
3712
3715
|
object: i,
|
|
@@ -3735,7 +3738,7 @@ class $t {
|
|
|
3735
3738
|
editable: !0,
|
|
3736
3739
|
locked: !1
|
|
3737
3740
|
};
|
|
3738
|
-
n.set(i),
|
|
3741
|
+
n.set(i), ee._isGroupOrSelection(n) && n.getObjects().forEach((a) => {
|
|
3739
3742
|
a.set(i);
|
|
3740
3743
|
}), s.renderAll(), e || o.saveState(), s.fire("editor:object-unlocked", {
|
|
3741
3744
|
object: n,
|
|
@@ -3743,10 +3746,10 @@ class $t {
|
|
|
3743
3746
|
});
|
|
3744
3747
|
}
|
|
3745
3748
|
static _isGroupOrSelection(t) {
|
|
3746
|
-
return t instanceof
|
|
3749
|
+
return t instanceof x || t instanceof Ct;
|
|
3747
3750
|
}
|
|
3748
3751
|
}
|
|
3749
|
-
class
|
|
3752
|
+
class no {
|
|
3750
3753
|
constructor({ editor: t }) {
|
|
3751
3754
|
this.editor = t;
|
|
3752
3755
|
}
|
|
@@ -3758,7 +3761,7 @@ class so {
|
|
|
3758
3761
|
if (Array.isArray(t))
|
|
3759
3762
|
return t.length > 0 ? t : null;
|
|
3760
3763
|
const e = t || this.editor.canvas.getActiveObject();
|
|
3761
|
-
return !e || !(e instanceof
|
|
3764
|
+
return !e || !(e instanceof x) ? null : e.getObjects();
|
|
3762
3765
|
}
|
|
3763
3766
|
/**
|
|
3764
3767
|
* Получить группы для разгруппировки
|
|
@@ -3766,20 +3769,20 @@ class so {
|
|
|
3766
3769
|
*/
|
|
3767
3770
|
_getGroupsToUngroup(t) {
|
|
3768
3771
|
if (Array.isArray(t)) {
|
|
3769
|
-
const s = t.filter((o) => o instanceof
|
|
3772
|
+
const s = t.filter((o) => o instanceof Ct);
|
|
3770
3773
|
return s.length > 0 ? s : null;
|
|
3771
3774
|
}
|
|
3772
|
-
if (t instanceof
|
|
3773
|
-
const s = t.getObjects().filter((o) => o instanceof
|
|
3775
|
+
if (t instanceof x) {
|
|
3776
|
+
const s = t.getObjects().filter((o) => o instanceof Ct);
|
|
3774
3777
|
return s.length > 0 ? s : null;
|
|
3775
3778
|
}
|
|
3776
3779
|
const e = t || this.editor.canvas.getActiveObject();
|
|
3777
3780
|
if (!e) return null;
|
|
3778
|
-
if (e instanceof
|
|
3779
|
-
const s = e.getObjects().filter((o) => o instanceof
|
|
3781
|
+
if (e instanceof x) {
|
|
3782
|
+
const s = e.getObjects().filter((o) => o instanceof Ct);
|
|
3780
3783
|
return s.length > 0 ? s : null;
|
|
3781
3784
|
}
|
|
3782
|
-
return e instanceof
|
|
3785
|
+
return e instanceof Ct ? [e] : null;
|
|
3783
3786
|
}
|
|
3784
3787
|
/**
|
|
3785
3788
|
* Группировка объектов
|
|
@@ -3796,8 +3799,8 @@ class so {
|
|
|
3796
3799
|
if (!n) return null;
|
|
3797
3800
|
try {
|
|
3798
3801
|
o.suspendHistory();
|
|
3799
|
-
const i = new
|
|
3800
|
-
id: `group-${
|
|
3802
|
+
const i = new Ct(n, {
|
|
3803
|
+
id: `group-${Y()}`
|
|
3801
3804
|
});
|
|
3802
3805
|
n.forEach((r) => s.remove(r)), s.add(i), s.setActiveObject(i), s.requestRenderAll();
|
|
3803
3806
|
const a = {
|
|
@@ -3832,7 +3835,7 @@ class so {
|
|
|
3832
3835
|
s.add(l), i.push(l);
|
|
3833
3836
|
});
|
|
3834
3837
|
});
|
|
3835
|
-
const a = new
|
|
3838
|
+
const a = new x(i, {
|
|
3836
3839
|
canvas: s
|
|
3837
3840
|
});
|
|
3838
3841
|
s.setActiveObject(a), s.requestRenderAll();
|
|
@@ -3847,7 +3850,7 @@ class so {
|
|
|
3847
3850
|
}
|
|
3848
3851
|
}
|
|
3849
3852
|
}
|
|
3850
|
-
class
|
|
3853
|
+
class io {
|
|
3851
3854
|
constructor({ editor: t }) {
|
|
3852
3855
|
this.editor = t;
|
|
3853
3856
|
}
|
|
@@ -3858,11 +3861,11 @@ class oo {
|
|
|
3858
3861
|
selectAll() {
|
|
3859
3862
|
const { canvas: t, canvasManager: e, objectLockManager: s } = this.editor;
|
|
3860
3863
|
t.discardActiveObject();
|
|
3861
|
-
const o = e.getObjects(), n = o.some((a) => a.locked), i = o.length > 1 ? new
|
|
3864
|
+
const o = e.getObjects(), n = o.some((a) => a.locked), i = o.length > 1 ? new x(e.getObjects(), { canvas: t }) : o[0];
|
|
3862
3865
|
n && s.lockObject({ object: i, skipInnerObjects: !0, withoutSave: !0 }), t.setActiveObject(i), t.requestRenderAll(), t.fire("editor:all-objects-selected", { selected: i });
|
|
3863
3866
|
}
|
|
3864
3867
|
}
|
|
3865
|
-
class
|
|
3868
|
+
class Me {
|
|
3866
3869
|
constructor({ editor: t }) {
|
|
3867
3870
|
this.editor = t;
|
|
3868
3871
|
}
|
|
@@ -3909,7 +3912,7 @@ class be {
|
|
|
3909
3912
|
s || n.suspendHistory();
|
|
3910
3913
|
const r = [];
|
|
3911
3914
|
if (a.forEach((d) => {
|
|
3912
|
-
if (
|
|
3915
|
+
if (Me._isUngroupableGroup(d)) {
|
|
3913
3916
|
const l = this._handleGroupDeletion(d);
|
|
3914
3917
|
r.push(...l);
|
|
3915
3918
|
return;
|
|
@@ -4029,7 +4032,7 @@ const ft = {
|
|
|
4029
4032
|
APPLY_FAILED: "TEMPLATE_APPLY_FAILED"
|
|
4030
4033
|
}
|
|
4031
4034
|
};
|
|
4032
|
-
class
|
|
4035
|
+
class Ut {
|
|
4033
4036
|
constructor({ editor: t }) {
|
|
4034
4037
|
this._buffer = [], this.editor = t;
|
|
4035
4038
|
}
|
|
@@ -4056,7 +4059,7 @@ class zt {
|
|
|
4056
4059
|
* @fires editor:error
|
|
4057
4060
|
*/
|
|
4058
4061
|
emitError({ origin: t = "ImageEditor", method: e = "Unknown Method", code: s, data: o, message: n }) {
|
|
4059
|
-
if (!
|
|
4062
|
+
if (!Ut.isValidErrorCode(s)) {
|
|
4060
4063
|
console.warn("Неизвестный код ошибки: ", { code: s, origin: t, method: e });
|
|
4061
4064
|
return;
|
|
4062
4065
|
}
|
|
@@ -4070,7 +4073,7 @@ class zt {
|
|
|
4070
4073
|
message: i,
|
|
4071
4074
|
data: o
|
|
4072
4075
|
};
|
|
4073
|
-
this._buffer.push(
|
|
4076
|
+
this._buffer.push(k({
|
|
4074
4077
|
type: "editor:error"
|
|
4075
4078
|
}, a)), this.editor.canvas.fire("editor:error", a);
|
|
4076
4079
|
}
|
|
@@ -4085,7 +4088,7 @@ class zt {
|
|
|
4085
4088
|
* @fires editor:warning
|
|
4086
4089
|
*/
|
|
4087
4090
|
emitWarning({ origin: t = "ImageEditor", method: e = "Unknown Method", code: s, message: o, data: n }) {
|
|
4088
|
-
if (!
|
|
4091
|
+
if (!Ut.isValidErrorCode(s)) {
|
|
4089
4092
|
console.warn("Неизвестный код предупреждения: ", { code: s, origin: t, method: e });
|
|
4090
4093
|
return;
|
|
4091
4094
|
}
|
|
@@ -4098,7 +4101,7 @@ class zt {
|
|
|
4098
4101
|
message: i,
|
|
4099
4102
|
data: n
|
|
4100
4103
|
};
|
|
4101
|
-
this._buffer.push(
|
|
4104
|
+
this._buffer.push(k({
|
|
4102
4105
|
type: "editor:warning"
|
|
4103
4106
|
}, a)), this.editor.canvas.fire("editor:warning", a);
|
|
4104
4107
|
}
|
|
@@ -4111,7 +4114,7 @@ class zt {
|
|
|
4111
4114
|
return t ? Object.values(ft).some((e) => Object.values(e).includes(t)) : !1;
|
|
4112
4115
|
}
|
|
4113
4116
|
}
|
|
4114
|
-
class
|
|
4117
|
+
class ao {
|
|
4115
4118
|
constructor({ editor: t }) {
|
|
4116
4119
|
this.currentBounds = null, this.editor = t;
|
|
4117
4120
|
}
|
|
@@ -4200,7 +4203,7 @@ const nt = ({
|
|
|
4200
4203
|
value: h,
|
|
4201
4204
|
min: t,
|
|
4202
4205
|
max: e
|
|
4203
|
-
}) => Math.min(Math.max(h, t), e),
|
|
4206
|
+
}) => Math.min(Math.max(h, t), e), Ot = class Ot extends st {
|
|
4204
4207
|
constructor(t, e = {}) {
|
|
4205
4208
|
var s, o, n, i, a, r, c, d, l;
|
|
4206
4209
|
super(t, e), this.backgroundOpacity = (s = e.backgroundOpacity) != null ? s : 1, this.paddingTop = (o = e.paddingTop) != null ? o : 0, this.paddingRight = (n = e.paddingRight) != null ? n : 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();
|
|
@@ -4225,7 +4228,7 @@ const nt = ({
|
|
|
4225
4228
|
}
|
|
4226
4229
|
_getTransformedDimensions(t = {}) {
|
|
4227
4230
|
const { width: e, height: s } = this._getBackgroundDimensions();
|
|
4228
|
-
return super._getTransformedDimensions(
|
|
4231
|
+
return super._getTransformedDimensions(jt(k({}, t), {
|
|
4229
4232
|
width: e,
|
|
4230
4233
|
height: s
|
|
4231
4234
|
}));
|
|
@@ -4235,7 +4238,7 @@ const nt = ({
|
|
|
4235
4238
|
*/
|
|
4236
4239
|
toObject(t = []) {
|
|
4237
4240
|
const e = super.toObject(t);
|
|
4238
|
-
return
|
|
4241
|
+
return jt(k({}, e), {
|
|
4239
4242
|
backgroundOpacity: this.backgroundOpacity,
|
|
4240
4243
|
paddingTop: this.paddingTop,
|
|
4241
4244
|
paddingRight: this.paddingRight,
|
|
@@ -4252,7 +4255,7 @@ const nt = ({
|
|
|
4252
4255
|
const e = this._getEffectiveBackgroundFill();
|
|
4253
4256
|
if (e && e) {
|
|
4254
4257
|
const n = this._getPadding(), i = (s = this.width) != null ? s : 0, a = (o = this.height) != null ? o : 0, r = i + n.left + n.right, c = a + n.top + n.bottom, d = this._getCornerRadii({ width: r, height: c }), l = this._getLeftOffset() - n.left, u = this._getTopOffset() - n.top;
|
|
4255
|
-
t.save(),
|
|
4258
|
+
t.save(), Ot._renderRoundedRect({
|
|
4256
4259
|
ctx: t,
|
|
4257
4260
|
height: c,
|
|
4258
4261
|
left: l,
|
|
@@ -4296,9 +4299,9 @@ const nt = ({
|
|
|
4296
4299
|
const e = nt({ value: (o = this.backgroundOpacity) != null ? o : 1, min: 0, max: 1 });
|
|
4297
4300
|
let s;
|
|
4298
4301
|
try {
|
|
4299
|
-
s = new
|
|
4302
|
+
s = new vs(t);
|
|
4300
4303
|
} catch (n) {
|
|
4301
|
-
return
|
|
4304
|
+
return Ut.emitError({
|
|
4302
4305
|
origin: "BackgroundTextbox",
|
|
4303
4306
|
method: "_getEffectiveBackgroundFill",
|
|
4304
4307
|
code: "INVALID_COLOR_VALUE",
|
|
@@ -4335,7 +4338,7 @@ const nt = ({
|
|
|
4335
4338
|
s !== t && (this.width = Math.max(0, s)), o !== e && (this.height = Math.max(0, o));
|
|
4336
4339
|
}
|
|
4337
4340
|
};
|
|
4338
|
-
|
|
4341
|
+
Ot.type = "background-textbox", Ot.cacheProperties = [
|
|
4339
4342
|
...Array.isArray(st.cacheProperties) ? st.cacheProperties : [],
|
|
4340
4343
|
"backgroundColor",
|
|
4341
4344
|
"backgroundOpacity",
|
|
@@ -4347,7 +4350,7 @@ Tt.type = "background-textbox", Tt.cacheProperties = [
|
|
|
4347
4350
|
"radiusTopRight",
|
|
4348
4351
|
"radiusBottomRight",
|
|
4349
4352
|
"radiusBottomLeft"
|
|
4350
|
-
],
|
|
4353
|
+
], Ot.stateProperties = [
|
|
4351
4354
|
...Array.isArray(st.stateProperties) ? st.stateProperties : [],
|
|
4352
4355
|
"backgroundColor",
|
|
4353
4356
|
"backgroundOpacity",
|
|
@@ -4360,11 +4363,11 @@ Tt.type = "background-textbox", Tt.cacheProperties = [
|
|
|
4360
4363
|
"radiusBottomRight",
|
|
4361
4364
|
"radiusBottomLeft"
|
|
4362
4365
|
];
|
|
4363
|
-
let
|
|
4364
|
-
const
|
|
4366
|
+
let se = Ot;
|
|
4367
|
+
const ro = () => {
|
|
4365
4368
|
var h;
|
|
4366
|
-
(h =
|
|
4367
|
-
},
|
|
4369
|
+
(h = He) != null && h.setClass && He.setClass(se, "background-textbox");
|
|
4370
|
+
}, co = ({ textbox: h }) => {
|
|
4368
4371
|
var s, o;
|
|
4369
4372
|
if (!h.isEditing) return null;
|
|
4370
4373
|
const t = (s = h.selectionStart) != null ? s : 0, e = (o = h.selectionEnd) != null ? o : t;
|
|
@@ -4372,16 +4375,16 @@ const io = () => {
|
|
|
4372
4375
|
start: Math.min(t, e),
|
|
4373
4376
|
end: Math.max(t, e)
|
|
4374
4377
|
};
|
|
4375
|
-
},
|
|
4378
|
+
}, lo = ({ textbox: h }) => {
|
|
4376
4379
|
var e, s;
|
|
4377
4380
|
const t = (s = (e = h.text) == null ? void 0 : e.length) != null ? s : 0;
|
|
4378
4381
|
return t <= 0 ? null : { start: 0, end: t };
|
|
4379
|
-
},
|
|
4382
|
+
}, ho = ({ textbox: h, range: t }) => {
|
|
4380
4383
|
var s, o;
|
|
4381
4384
|
if (!t) return !1;
|
|
4382
4385
|
const e = (o = (s = h.text) == null ? void 0 : s.length) != null ? o : 0;
|
|
4383
4386
|
return e <= 0 ? !1 : t.start <= 0 && t.end >= e;
|
|
4384
|
-
},
|
|
4387
|
+
}, oe = ({
|
|
4385
4388
|
textbox: h,
|
|
4386
4389
|
styles: t,
|
|
4387
4390
|
range: e
|
|
@@ -4389,7 +4392,7 @@ const io = () => {
|
|
|
4389
4392
|
if (!t || !Object.keys(t).length) return !1;
|
|
4390
4393
|
const { start: s, end: o } = e;
|
|
4391
4394
|
return o <= s ? !1 : (h.setSelectionStyles(t, s, o), !0);
|
|
4392
|
-
},
|
|
4395
|
+
}, qe = ({
|
|
4393
4396
|
textbox: h,
|
|
4394
4397
|
range: t,
|
|
4395
4398
|
property: e
|
|
@@ -4403,52 +4406,57 @@ const io = () => {
|
|
|
4403
4406
|
);
|
|
4404
4407
|
if (s.length)
|
|
4405
4408
|
return (o = s[0]) == null ? void 0 : o[e];
|
|
4406
|
-
},
|
|
4409
|
+
}, $e = ({ strokeColor: h, width: t }) => {
|
|
4407
4410
|
if (!(t <= 0))
|
|
4408
4411
|
return h != null ? h : "#000000";
|
|
4409
|
-
},
|
|
4410
|
-
class
|
|
4412
|
+
}, Je = ({ width: h = 0 }) => h ? Math.max(0, h) : 0, ne = ({ value: h }) => typeof h == "string" ? h.toLocaleUpperCase() : "", it = 0.01;
|
|
4413
|
+
class G {
|
|
4411
4414
|
constructor({ editor: t }) {
|
|
4412
4415
|
var e;
|
|
4413
4416
|
this._handleTextEditingEntered = () => {
|
|
4414
4417
|
this.isTextEditingActive = !0;
|
|
4415
4418
|
}, this._handleTextChanged = (s) => {
|
|
4416
4419
|
const { target: o } = s;
|
|
4417
|
-
if (!
|
|
4420
|
+
if (!G._isTextbox(o)) return;
|
|
4418
4421
|
const { text: n = "", uppercase: i } = o, a = !!i, r = n.toLocaleLowerCase();
|
|
4419
4422
|
if (a) {
|
|
4420
|
-
const d =
|
|
4423
|
+
const d = ne({ value: r });
|
|
4421
4424
|
d !== n && o.set({ text: d }), o.textCaseRaw = r;
|
|
4422
4425
|
} else
|
|
4423
4426
|
o.textCaseRaw = n;
|
|
4424
|
-
|
|
4427
|
+
G._roundTextboxDimensions({ textbox: o }) && (o.setCoords(), o.dirty = !0);
|
|
4425
4428
|
}, this._handleTextEditingExited = (s) => {
|
|
4426
4429
|
var r, c;
|
|
4427
4430
|
const { target: o } = s;
|
|
4428
|
-
if (!
|
|
4431
|
+
if (!G._isTextbox(o)) return;
|
|
4429
4432
|
const n = (r = o.text) != null ? r : "";
|
|
4430
4433
|
if (!!o.uppercase) {
|
|
4431
4434
|
const d = (c = o.textCaseRaw) != null ? c : n.toLocaleLowerCase();
|
|
4432
4435
|
o.textCaseRaw = d;
|
|
4433
4436
|
} else
|
|
4434
4437
|
o.textCaseRaw = n;
|
|
4435
|
-
|
|
4438
|
+
G._roundTextboxDimensions({ textbox: o }) && (o.setCoords(), o.dirty = !0, this.canvas.requestRenderAll()), o.locked || o.set({
|
|
4436
4439
|
lockMovementX: !1,
|
|
4437
4440
|
lockMovementY: !1
|
|
4438
4441
|
}), setTimeout(() => {
|
|
4439
4442
|
this.isTextEditingActive = !1, this.editor.historyManager.saveState();
|
|
4440
|
-
},
|
|
4443
|
+
}, Ks);
|
|
4441
4444
|
}, this._handleObjectScaling = (s) => {
|
|
4442
|
-
var
|
|
4445
|
+
var W, Mt, Ht, ut, Wt, wt, je, Ie, Ce, Te, Ee, Oe, De, Le, Re;
|
|
4443
4446
|
const { target: o, transform: n } = s;
|
|
4444
|
-
if (o instanceof
|
|
4445
|
-
|
|
4446
|
-
|
|
4447
|
-
|
|
4448
|
-
|
|
4447
|
+
if (o instanceof x) {
|
|
4448
|
+
if (!((Mt = (W = o.getObjects) == null ? void 0 : W.call(o)) != null ? Mt : []).some((At) => G._isTextbox(At))) return;
|
|
4449
|
+
const {
|
|
4450
|
+
corner: Gt = "",
|
|
4451
|
+
action: St = ""
|
|
4452
|
+
} = n != null ? n : {};
|
|
4453
|
+
if (!(["ml", "mr", "tl", "tr", "bl", "br"].includes(Gt) || St === "scaleX" || St === "scale") || !n) return;
|
|
4454
|
+
o.set({
|
|
4455
|
+
scaleX: 1
|
|
4456
|
+
}), n.scaleX = 1, n.original && (n.original.scaleX = 1), o.setCoords(), this.canvas.requestRenderAll();
|
|
4449
4457
|
return;
|
|
4450
4458
|
}
|
|
4451
|
-
if (!
|
|
4459
|
+
if (!G._isTextbox(o) || !n) return;
|
|
4452
4460
|
o.isScaling = !0;
|
|
4453
4461
|
const i = this._ensureScalingState(o), {
|
|
4454
4462
|
baseWidth: a,
|
|
@@ -4457,18 +4465,18 @@ class U {
|
|
|
4457
4465
|
basePadding: d,
|
|
4458
4466
|
baseRadii: l,
|
|
4459
4467
|
baseStyles: u
|
|
4460
|
-
} = i, g = typeof ((
|
|
4468
|
+
} = i, g = typeof ((Ht = n.original) == null ? void 0 : Ht.width) == "number" ? n.original.width : void 0, f = typeof ((ut = n.original) == null ? void 0 : ut.left) == "number" ? n.original.left : void 0, p = g != null ? g : a, m = f != null ? f : r, v = (Wt = n.corner) != null ? Wt : "", b = (wt = n.action) != null ? wt : "", I = ["ml", "mr"].includes(v) || b === "scaleX", y = ["mt", "mb"].includes(v) || b === "scaleY", w = ["tl", "tr", "bl", "br"].includes(v) || b === "scale", S = w || y;
|
|
4461
4469
|
if (!I && !y && !w) return;
|
|
4462
|
-
const A = Math.abs((
|
|
4470
|
+
const A = Math.abs((Ie = (je = o.scaleX) != null ? je : n.scaleX) != null ? Ie : 1) || 1, M = Math.abs((Te = (Ce = o.scaleY) != null ? Ce : n.scaleY) != null ? Te : 1) || 1, C = Math.max(1, p * A), j = Math.max(1, Math.round(C)), T = Math.max(1, c * M), {
|
|
4463
4471
|
paddingTop: B = 0,
|
|
4464
|
-
paddingRight:
|
|
4465
|
-
paddingBottom:
|
|
4466
|
-
paddingLeft:
|
|
4472
|
+
paddingRight: Z = 0,
|
|
4473
|
+
paddingBottom: U = 0,
|
|
4474
|
+
paddingLeft: F = 0,
|
|
4467
4475
|
radiusTopLeft: V = 0,
|
|
4468
4476
|
radiusTopRight: D = 0,
|
|
4469
4477
|
radiusBottomRight: R = 0,
|
|
4470
4478
|
radiusBottomLeft: K = 0,
|
|
4471
|
-
fontSize:
|
|
4479
|
+
fontSize: H,
|
|
4472
4480
|
width: z,
|
|
4473
4481
|
originX: X = "left"
|
|
4474
4482
|
} = o, et = w || y, q = w || y, P = et ? {
|
|
@@ -4481,22 +4489,22 @@ class U {
|
|
|
4481
4489
|
topRight: Math.max(0, l.topRight * M),
|
|
4482
4490
|
bottomRight: Math.max(0, l.bottomRight * M),
|
|
4483
4491
|
bottomLeft: Math.max(0, l.bottomLeft * M)
|
|
4484
|
-
} : l,
|
|
4492
|
+
} : l, Yt = Object.keys(u).length > 0;
|
|
4485
4493
|
let yt;
|
|
4486
|
-
if (S &&
|
|
4487
|
-
const
|
|
4488
|
-
Object.entries(u).forEach(([
|
|
4489
|
-
if (!
|
|
4490
|
-
const
|
|
4491
|
-
Object.entries(
|
|
4492
|
-
if (!
|
|
4493
|
-
const
|
|
4494
|
-
typeof
|
|
4495
|
-
}), Object.keys(
|
|
4496
|
-
}), Object.keys(
|
|
4494
|
+
if (S && Yt) {
|
|
4495
|
+
const Zt = {};
|
|
4496
|
+
Object.entries(u).forEach(([_e, Gt]) => {
|
|
4497
|
+
if (!Gt) return;
|
|
4498
|
+
const St = {};
|
|
4499
|
+
Object.entries(Gt).forEach(([Ne, At]) => {
|
|
4500
|
+
if (!At) return;
|
|
4501
|
+
const xe = k({}, At);
|
|
4502
|
+
typeof At.fontSize == "number" && (xe.fontSize = Math.max(1, At.fontSize * M)), St[Ne] = xe;
|
|
4503
|
+
}), Object.keys(St).length && (Zt[_e] = St);
|
|
4504
|
+
}), Object.keys(Zt).length && (yt = Zt);
|
|
4497
4505
|
}
|
|
4498
|
-
const vt = (
|
|
4499
|
-
if (!
|
|
4506
|
+
const vt = (Oe = (Ee = n.originX) != null ? Ee : X) != null ? Oe : "left", Rt = m + p, Se = m + p / 2, bt = z != null ? z : p, Ae = j !== bt, Ft = Math.abs(T - (H != null ? H : c)) > it, _t = Math.abs(P.top - B) > it || Math.abs(P.right - Z) > it || Math.abs(P.bottom - U) > it || Math.abs(P.left - F) > it, Nt = Math.abs(Q.topLeft - V) > it || Math.abs(Q.topRight - D) > it || Math.abs(Q.bottomRight - R) > it || Math.abs(Q.bottomLeft - K) > it;
|
|
4507
|
+
if (!Ae && !Ft && !_t && !Nt) {
|
|
4500
4508
|
o.set({ scaleX: 1, scaleY: 1 }), n.scaleX = 1, n.scaleY = 1;
|
|
4501
4509
|
return;
|
|
4502
4510
|
}
|
|
@@ -4514,13 +4522,13 @@ class U {
|
|
|
4514
4522
|
scaleX: 1,
|
|
4515
4523
|
scaleY: 1
|
|
4516
4524
|
});
|
|
4517
|
-
const
|
|
4518
|
-
|
|
4519
|
-
const dt = (
|
|
4525
|
+
const xt = G._roundTextboxDimensions({ textbox: o });
|
|
4526
|
+
xt && (o.dirty = !0);
|
|
4527
|
+
const dt = (De = o.width) != null ? De : j, kt = dt !== bt;
|
|
4520
4528
|
let lt = m;
|
|
4521
|
-
|
|
4529
|
+
kt && (I || w) && (vt === "right" ? lt = Rt - dt : vt === "center" && (lt = Se - dt / 2)), o.set({ left: lt }), i.baseLeft = lt, n.scaleX = 1, n.scaleY = 1;
|
|
4522
4530
|
const { original: ot } = n;
|
|
4523
|
-
ot && (ot.scaleX = 1, ot.scaleY = 1, ot.width = dt, ot.height = o.height, ot.left = lt), o.setCoords(), this.canvas.requestRenderAll(), i.baseWidth = dt, i.baseFontSize = (
|
|
4531
|
+
ot && (ot.scaleX = 1, ot.scaleY = 1, ot.width = dt, ot.height = o.height, ot.left = lt), o.setCoords(), this.canvas.requestRenderAll(), i.baseWidth = dt, i.baseFontSize = (Le = o.fontSize) != null ? Le : T, i.baseStyles = JSON.parse(JSON.stringify((Re = o.styles) != null ? Re : {})), i.basePadding = {
|
|
4524
4532
|
top: P.top,
|
|
4525
4533
|
right: P.right,
|
|
4526
4534
|
bottom: P.bottom,
|
|
@@ -4530,17 +4538,11 @@ class U {
|
|
|
4530
4538
|
topRight: Q.topRight,
|
|
4531
4539
|
bottomRight: Q.bottomRight,
|
|
4532
4540
|
bottomLeft: Q.bottomLeft
|
|
4533
|
-
}, i.hasWidthChange =
|
|
4541
|
+
}, i.hasWidthChange = kt || Ft || _t || Nt || xt;
|
|
4534
4542
|
}, this._handleObjectModified = (s) => {
|
|
4535
4543
|
var b, I, y;
|
|
4536
4544
|
const { target: o } = s;
|
|
4537
|
-
if (o instanceof
|
|
4538
|
-
this._finalizeActiveSelectionScaling({
|
|
4539
|
-
selection: o
|
|
4540
|
-
});
|
|
4541
|
-
return;
|
|
4542
|
-
}
|
|
4543
|
-
if (!U._isTextbox(o)) return;
|
|
4545
|
+
if (o instanceof x || !G._isTextbox(o)) return;
|
|
4544
4546
|
o.isScaling = !1;
|
|
4545
4547
|
const n = this.scalingState.get(o);
|
|
4546
4548
|
if (this.scalingState.delete(o), !(n != null && n.hasWidthChange)) return;
|
|
@@ -4568,16 +4570,16 @@ class U {
|
|
|
4568
4570
|
target: o,
|
|
4569
4571
|
style: v
|
|
4570
4572
|
}), o.set({ scaleX: 1, scaleY: 1 }), o.setCoords();
|
|
4571
|
-
}, this.editor = t, this.canvas = t.canvas, this.fonts = (e = t.options.fonts) != null ? e : [], this.scalingState = /* @__PURE__ */ new WeakMap(), this.isTextEditingActive = !1, this._bindEvents(),
|
|
4573
|
+
}, this.editor = t, this.canvas = t.canvas, this.fonts = (e = t.options.fonts) != null ? e : [], this.scalingState = /* @__PURE__ */ new WeakMap(), this.isTextEditingActive = !1, this._bindEvents(), ro();
|
|
4572
4574
|
}
|
|
4573
4575
|
/**
|
|
4574
4576
|
* Добавляет новый текстовый объект на канвас.
|
|
4575
4577
|
* @param options — настройки текста
|
|
4576
4578
|
* @param flags — флаги поведения
|
|
4577
4579
|
*/
|
|
4578
|
-
addText(
|
|
4579
|
-
var
|
|
4580
|
-
id: t = `text-${
|
|
4580
|
+
addText(Z = {}, { withoutSelection: j = !1, withoutSave: T = !1, withoutAdding: B = !1 } = {}) {
|
|
4581
|
+
var U = Z, {
|
|
4582
|
+
id: t = `text-${Y()}`,
|
|
4581
4583
|
text: e = "Новый текст",
|
|
4582
4584
|
fontFamily: s,
|
|
4583
4585
|
fontSize: o = 48,
|
|
@@ -4601,7 +4603,7 @@ class U {
|
|
|
4601
4603
|
radiusTopRight: S = 0,
|
|
4602
4604
|
radiusBottomRight: A = 0,
|
|
4603
4605
|
radiusBottomLeft: M = 0
|
|
4604
|
-
} =
|
|
4606
|
+
} = U, C = gt(U, [
|
|
4605
4607
|
"id",
|
|
4606
4608
|
"text",
|
|
4607
4609
|
"fontFamily",
|
|
@@ -4628,12 +4630,12 @@ class U {
|
|
|
4628
4630
|
"radiusBottomLeft"
|
|
4629
4631
|
]);
|
|
4630
4632
|
var et;
|
|
4631
|
-
const { historyManager:
|
|
4632
|
-
|
|
4633
|
-
const D = s != null ? s : this._getDefaultFontFamily(), R =
|
|
4633
|
+
const { historyManager: F } = this.editor, { canvas: V } = this;
|
|
4634
|
+
F.suspendHistory();
|
|
4635
|
+
const D = s != null ? s : this._getDefaultFontFamily(), R = Je({ width: g }), K = $e({
|
|
4634
4636
|
strokeColor: u,
|
|
4635
4637
|
width: R
|
|
4636
|
-
}),
|
|
4638
|
+
}), H = k({
|
|
4637
4639
|
id: t,
|
|
4638
4640
|
fontFamily: D,
|
|
4639
4641
|
fontSize: o,
|
|
@@ -4658,14 +4660,14 @@ class U {
|
|
|
4658
4660
|
radiusTopRight: S,
|
|
4659
4661
|
radiusBottomRight: A,
|
|
4660
4662
|
radiusBottomLeft: M
|
|
4661
|
-
}, C), z = new
|
|
4663
|
+
}, C), z = new se(e, H);
|
|
4662
4664
|
if (z.textCaseRaw = (et = z.text) != null ? et : "", r) {
|
|
4663
|
-
const q =
|
|
4665
|
+
const q = ne({ value: z.textCaseRaw });
|
|
4664
4666
|
q !== z.text && z.set({ text: q });
|
|
4665
4667
|
}
|
|
4666
|
-
return
|
|
4668
|
+
return G._roundTextboxDimensions({ textbox: z }) && (z.dirty = !0), C.left === void 0 && C.top === void 0 && V.centerObject(z), B || V.add(z), j || V.setActiveObject(z), V.requestRenderAll(), F.resumeHistory(), T || F.saveState(), V.fire("editor:text-added", {
|
|
4667
4669
|
textbox: z,
|
|
4668
|
-
options:
|
|
4670
|
+
options: jt(k({}, H), {
|
|
4669
4671
|
text: e,
|
|
4670
4672
|
bold: n,
|
|
4671
4673
|
italic: i,
|
|
@@ -4691,12 +4693,12 @@ class U {
|
|
|
4691
4693
|
* @param options.skipRender — не вызывать перерисовку канваса
|
|
4692
4694
|
*/
|
|
4693
4695
|
updateText({ target: t, style: e = {}, withoutSave: s, skipRender: o } = {}) {
|
|
4694
|
-
var
|
|
4696
|
+
var Nt, xt, dt, kt, lt, ot;
|
|
4695
4697
|
const n = this._resolveTextObject(t);
|
|
4696
4698
|
if (!n) return null;
|
|
4697
4699
|
const { historyManager: i } = this.editor, { canvas: a } = this;
|
|
4698
4700
|
i.suspendHistory();
|
|
4699
|
-
const r =
|
|
4701
|
+
const r = G._getSnapshot(n), _t = e, {
|
|
4700
4702
|
text: c,
|
|
4701
4703
|
fontFamily: d,
|
|
4702
4704
|
fontSize: l,
|
|
@@ -4717,10 +4719,10 @@ class U {
|
|
|
4717
4719
|
paddingBottom: j,
|
|
4718
4720
|
paddingLeft: T,
|
|
4719
4721
|
radiusTopLeft: B,
|
|
4720
|
-
radiusTopRight:
|
|
4721
|
-
radiusBottomRight:
|
|
4722
|
-
radiusBottomLeft:
|
|
4723
|
-
} =
|
|
4722
|
+
radiusTopRight: Z,
|
|
4723
|
+
radiusBottomRight: U,
|
|
4724
|
+
radiusBottomLeft: F
|
|
4725
|
+
} = _t, V = gt(_t, [
|
|
4724
4726
|
"text",
|
|
4725
4727
|
"fontFamily",
|
|
4726
4728
|
"fontSize",
|
|
@@ -4744,39 +4746,39 @@ class U {
|
|
|
4744
4746
|
"radiusTopRight",
|
|
4745
4747
|
"radiusBottomRight",
|
|
4746
4748
|
"radiusBottomLeft"
|
|
4747
|
-
]), D =
|
|
4749
|
+
]), D = k({}, V), R = co({ textbox: n }), K = R ? this._expandRangeToFullLines({ textbox: n, range: R }) : null, H = {}, z = {}, X = {}, et = ho({ textbox: n, range: R }), q = !R || et, P = !R;
|
|
4748
4750
|
if (d !== void 0 && (K && (z.fontFamily = d), q && (D.fontFamily = d, P && (X.fontFamily = d))), l !== void 0 && (K && (z.fontSize = l), q && (D.fontSize = l, P && (X.fontSize = l))), u !== void 0) {
|
|
4749
|
-
const
|
|
4750
|
-
R && (
|
|
4751
|
+
const W = u ? "bold" : "normal";
|
|
4752
|
+
R && (H.fontWeight = W), q && (D.fontWeight = W, P && (X.fontWeight = W));
|
|
4751
4753
|
}
|
|
4752
4754
|
if (g !== void 0) {
|
|
4753
|
-
const
|
|
4754
|
-
R && (
|
|
4755
|
+
const W = g ? "italic" : "normal";
|
|
4756
|
+
R && (H.fontStyle = W), q && (D.fontStyle = W, P && (X.fontStyle = W));
|
|
4755
4757
|
}
|
|
4756
|
-
if (f !== void 0 && (R && (
|
|
4757
|
-
const
|
|
4758
|
-
strokeColor:
|
|
4758
|
+
if (f !== void 0 && (R && (H.underline = f), q && (D.underline = f, P && (X.underline = f))), m !== void 0 && (R && (H.linethrough = m), q && (D.linethrough = m, P && (X.linethrough = m))), v !== void 0 && (D.textAlign = v), b !== void 0 && (R && (H.fill = b), q && (D.fill = b, P && (X.fill = b))), I !== void 0 || y !== void 0) {
|
|
4759
|
+
const W = R ? qe({ textbox: n, range: R, property: "strokeWidth" }) : void 0, Mt = R ? qe({ textbox: n, range: R, property: "stroke" }) : void 0, Ht = (xt = (Nt = y != null ? y : W) != null ? Nt : n.strokeWidth) != null ? xt : 0, ut = Je({ width: Ht }), Wt = (kt = (dt = I != null ? I : Mt) != null ? dt : n.stroke) != null ? kt : void 0, wt = $e({
|
|
4760
|
+
strokeColor: Wt,
|
|
4759
4761
|
width: ut
|
|
4760
4762
|
});
|
|
4761
|
-
R && (
|
|
4763
|
+
R && (H.stroke = wt, H.strokeWidth = ut), q && (D.stroke = wt, D.strokeWidth = ut, P && (X.stroke = wt, X.strokeWidth = ut));
|
|
4762
4764
|
}
|
|
4763
|
-
w !== void 0 && (D.opacity = w), S !== void 0 && (D.backgroundColor = S), A !== void 0 && (D.backgroundOpacity = A), M !== void 0 && (D.paddingTop = M), C !== void 0 && (D.paddingRight = C), j !== void 0 && (D.paddingBottom = j), T !== void 0 && (D.paddingLeft = T), B !== void 0 && (D.radiusTopLeft = B),
|
|
4764
|
-
const Q = (ot = n.textCaseRaw) != null ? ot : (lt = n.text) != null ? lt : "",
|
|
4765
|
-
if (yt ||
|
|
4766
|
-
const
|
|
4767
|
-
D.text =
|
|
4765
|
+
w !== void 0 && (D.opacity = w), S !== void 0 && (D.backgroundColor = S), A !== void 0 && (D.backgroundOpacity = A), M !== void 0 && (D.paddingTop = M), C !== void 0 && (D.paddingRight = C), j !== void 0 && (D.paddingBottom = j), T !== void 0 && (D.paddingLeft = T), B !== void 0 && (D.radiusTopLeft = B), Z !== void 0 && (D.radiusTopRight = Z), U !== void 0 && (D.radiusBottomRight = U), F !== void 0 && (D.radiusBottomLeft = F);
|
|
4766
|
+
const Q = (ot = n.textCaseRaw) != null ? ot : (lt = n.text) != null ? lt : "", Yt = !!n.uppercase, yt = c !== void 0, vt = yt ? c != null ? c : "" : Q, Rt = p != null ? p : Yt;
|
|
4767
|
+
if (yt || Rt !== Yt) {
|
|
4768
|
+
const W = Rt ? ne({ value: vt }) : vt;
|
|
4769
|
+
D.text = W, n.textCaseRaw = vt;
|
|
4768
4770
|
} else n.textCaseRaw === void 0 && (n.textCaseRaw = Q);
|
|
4769
|
-
n.uppercase =
|
|
4771
|
+
n.uppercase = Rt, n.set(D);
|
|
4770
4772
|
let bt = !1;
|
|
4771
4773
|
if (R) {
|
|
4772
|
-
const
|
|
4773
|
-
bt =
|
|
4774
|
+
const W = oe({ textbox: n, styles: H, range: R }), Mt = K ? oe({ textbox: n, styles: z, range: K }) : !1;
|
|
4775
|
+
bt = W || Mt;
|
|
4774
4776
|
} else if (Object.keys(X).length) {
|
|
4775
|
-
const
|
|
4776
|
-
|
|
4777
|
+
const W = lo({ textbox: n });
|
|
4778
|
+
W && (bt = oe({ textbox: n, styles: X, range: W }));
|
|
4777
4779
|
}
|
|
4778
|
-
bt && (n.dirty = !0), (S !== void 0 || A !== void 0 || M !== void 0 || C !== void 0 || j !== void 0 || T !== void 0 || B !== void 0 ||
|
|
4779
|
-
const
|
|
4780
|
+
bt && (n.dirty = !0), (S !== void 0 || A !== void 0 || M !== void 0 || C !== void 0 || j !== void 0 || T !== void 0 || B !== void 0 || Z !== void 0 || U !== void 0 || F !== void 0) && (n.dirty = !0), G._roundTextboxDimensions({ textbox: n }) && (n.dirty = !0), n.setCoords(), o || a.requestRenderAll(), i.resumeHistory(), s || i.saveState();
|
|
4781
|
+
const Ft = G._getSnapshot(n);
|
|
4780
4782
|
return a.fire("editor:text-updated", {
|
|
4781
4783
|
textbox: n,
|
|
4782
4784
|
target: t,
|
|
@@ -4787,9 +4789,9 @@ class U {
|
|
|
4787
4789
|
},
|
|
4788
4790
|
updates: D,
|
|
4789
4791
|
before: r,
|
|
4790
|
-
after:
|
|
4792
|
+
after: Ft,
|
|
4791
4793
|
selectionRange: R != null ? R : void 0,
|
|
4792
|
-
selectionStyles: R && Object.keys(
|
|
4794
|
+
selectionStyles: R && Object.keys(H).length ? H : void 0
|
|
4793
4795
|
}), n;
|
|
4794
4796
|
}
|
|
4795
4797
|
/**
|
|
@@ -4807,10 +4809,10 @@ class U {
|
|
|
4807
4809
|
const { canvas: e } = this;
|
|
4808
4810
|
if (!t) {
|
|
4809
4811
|
const s = e.getActiveObject();
|
|
4810
|
-
return
|
|
4812
|
+
return G._isTextbox(s) ? s : null;
|
|
4811
4813
|
}
|
|
4812
4814
|
if (typeof t == "string") {
|
|
4813
|
-
const s = e.getObjects().find((o) =>
|
|
4815
|
+
const s = e.getObjects().find((o) => G._isTextbox(o) && o.id === t);
|
|
4814
4816
|
return s != null ? s : null;
|
|
4815
4817
|
}
|
|
4816
4818
|
return null;
|
|
@@ -4828,46 +4830,6 @@ class U {
|
|
|
4828
4830
|
const { canvas: t } = this;
|
|
4829
4831
|
t.on("object:scaling", this._handleObjectScaling), 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);
|
|
4830
4832
|
}
|
|
4831
|
-
/**
|
|
4832
|
-
* Обрабатывает горизонтальное масштабирование ActiveSelection: расширяет текстовые блоки по ширине без растяжения шрифта.
|
|
4833
|
-
*/
|
|
4834
|
-
_handleActiveSelectionScaling({
|
|
4835
|
-
selection: t,
|
|
4836
|
-
transform: e
|
|
4837
|
-
}) {
|
|
4838
|
-
var r, c, d, l;
|
|
4839
|
-
const s = (r = e == null ? void 0 : e.corner) != null ? r : "", o = (c = e == null ? void 0 : e.action) != null ? c : "";
|
|
4840
|
-
if (!(["ml", "mr", "tl", "tr", "bl", "br"].includes(s) || o === "scaleX" || o === "scale")) return;
|
|
4841
|
-
const i = Math.abs((l = (d = t.scaleX) != null ? d : e == null ? void 0 : e.scaleX) != null ? l : 1) || 1, a = i === 0 ? 1 : 1 / i;
|
|
4842
|
-
t.getObjects().forEach((u) => {
|
|
4843
|
-
if (!U._isTextbox(u)) return;
|
|
4844
|
-
const g = this._ensureScalingState(u), f = Math.max(1, Math.round(g.baseWidth * i));
|
|
4845
|
-
u.set({
|
|
4846
|
-
width: f,
|
|
4847
|
-
scaleX: a,
|
|
4848
|
-
scaleY: 1
|
|
4849
|
-
}), U._roundTextboxDimensions({ textbox: u }), u.setCoords(), u.dirty = !0;
|
|
4850
|
-
}), t.setCoords(), this.canvas.requestRenderAll();
|
|
4851
|
-
}
|
|
4852
|
-
/**
|
|
4853
|
-
* Завершает масштабирование ActiveSelection: фиксирует новую ширину текстовых объектов и сбрасывает компенсационный scale.
|
|
4854
|
-
*/
|
|
4855
|
-
_finalizeActiveSelectionScaling({
|
|
4856
|
-
selection: t
|
|
4857
|
-
}) {
|
|
4858
|
-
var o;
|
|
4859
|
-
const e = Math.abs((o = t.scaleX) != null ? o : 1) || 1, s = t.getObjects().filter((n) => U._isTextbox(n));
|
|
4860
|
-
s.length && (s.forEach((n) => {
|
|
4861
|
-
const i = this._ensureScalingState(n), a = Math.max(1, Math.round(i.baseWidth * e));
|
|
4862
|
-
n.set({
|
|
4863
|
-
width: a,
|
|
4864
|
-
scaleX: 1,
|
|
4865
|
-
scaleY: 1
|
|
4866
|
-
}), U._roundTextboxDimensions({ textbox: n }), n.setCoords(), n.dirty = !0, this.scalingState.delete(n);
|
|
4867
|
-
}), t.set({
|
|
4868
|
-
scaleX: 1
|
|
4869
|
-
}), t.setCoords(), this.canvas.requestRenderAll());
|
|
4870
|
-
}
|
|
4871
4833
|
/**
|
|
4872
4834
|
* Возвращает диапазоны символов для каждой строки текста без учёта символов переноса.
|
|
4873
4835
|
*/
|
|
@@ -4952,10 +4914,10 @@ class U {
|
|
|
4952
4914
|
static _roundTextboxDimensions({
|
|
4953
4915
|
textbox: t
|
|
4954
4916
|
}) {
|
|
4955
|
-
const { width: e, height: s, calcTextWidth: o, calcTextHeight: n } = t, i = typeof o == "function" ? o.call(t) : void 0, a = typeof n == "function" ? n.call(t) : void 0, r =
|
|
4917
|
+
const { width: e, height: s, calcTextWidth: o, calcTextHeight: n } = t, i = typeof o == "function" ? o.call(t) : void 0, a = typeof n == "function" ? n.call(t) : void 0, r = G._resolveDimension({
|
|
4956
4918
|
rawValue: e,
|
|
4957
4919
|
calculatedValue: i
|
|
4958
|
-
}), c =
|
|
4920
|
+
}), c = G._resolveDimension({
|
|
4959
4921
|
rawValue: s,
|
|
4960
4922
|
calculatedValue: a
|
|
4961
4923
|
}), d = Number.isFinite(r) ? Math.round(r) : null, l = Number.isFinite(c) ? Math.round(c) : null, u = {};
|
|
@@ -4966,11 +4928,11 @@ class U {
|
|
|
4966
4928
|
*/
|
|
4967
4929
|
static _getSnapshot(t) {
|
|
4968
4930
|
const e = ({
|
|
4969
|
-
snapshot:
|
|
4931
|
+
snapshot: H,
|
|
4970
4932
|
entries: z
|
|
4971
4933
|
}) => {
|
|
4972
4934
|
Object.entries(z).forEach(([X, et]) => {
|
|
4973
|
-
et != null && (
|
|
4935
|
+
et != null && (H[X] = et);
|
|
4974
4936
|
});
|
|
4975
4937
|
}, {
|
|
4976
4938
|
id: s,
|
|
@@ -4999,9 +4961,9 @@ class U {
|
|
|
4999
4961
|
radiusBottomRight: j,
|
|
5000
4962
|
radiusBottomLeft: T,
|
|
5001
4963
|
left: B,
|
|
5002
|
-
top:
|
|
5003
|
-
width:
|
|
5004
|
-
height:
|
|
4964
|
+
top: Z,
|
|
4965
|
+
width: U,
|
|
4966
|
+
height: F,
|
|
5005
4967
|
angle: V,
|
|
5006
4968
|
scaleX: D,
|
|
5007
4969
|
scaleY: R
|
|
@@ -5036,9 +4998,9 @@ class U {
|
|
|
5036
4998
|
radiusBottomRight: j,
|
|
5037
4999
|
radiusBottomLeft: T,
|
|
5038
5000
|
left: B,
|
|
5039
|
-
top:
|
|
5040
|
-
width:
|
|
5041
|
-
height:
|
|
5001
|
+
top: Z,
|
|
5002
|
+
width: U,
|
|
5003
|
+
height: F,
|
|
5042
5004
|
angle: V,
|
|
5043
5005
|
scaleX: D,
|
|
5044
5006
|
scaleY: R
|
|
@@ -5056,14 +5018,14 @@ class U {
|
|
|
5056
5018
|
const tt = ({
|
|
5057
5019
|
value: h,
|
|
5058
5020
|
fallback: t = 0
|
|
5059
|
-
}) => typeof h == "number" && Number.isFinite(h) ? h : typeof t == "number" && Number.isFinite(t) ? t : 0,
|
|
5021
|
+
}) => typeof h == "number" && Number.isFinite(h) ? h : typeof t == "number" && Number.isFinite(t) ? t : 0, Qt = ({
|
|
5060
5022
|
value: h,
|
|
5061
5023
|
dimension: t,
|
|
5062
5024
|
useRelativePositions: e
|
|
5063
5025
|
}) => {
|
|
5064
5026
|
const s = tt({ value: h });
|
|
5065
5027
|
return e ? s : s / (t || 1);
|
|
5066
|
-
},
|
|
5028
|
+
}, uo = ({
|
|
5067
5029
|
object: h,
|
|
5068
5030
|
baseWidth: t,
|
|
5069
5031
|
baseHeight: e,
|
|
@@ -5073,22 +5035,22 @@ const tt = ({
|
|
|
5073
5035
|
const n = h;
|
|
5074
5036
|
if (typeof n[o.x] == "number" && typeof n[o.y] == "number")
|
|
5075
5037
|
return {
|
|
5076
|
-
x:
|
|
5038
|
+
x: Qt({
|
|
5077
5039
|
value: n[o.x],
|
|
5078
5040
|
dimension: t,
|
|
5079
5041
|
useRelativePositions: s
|
|
5080
5042
|
}),
|
|
5081
|
-
y:
|
|
5043
|
+
y: Qt({
|
|
5082
5044
|
value: n[o.y],
|
|
5083
5045
|
dimension: e,
|
|
5084
5046
|
useRelativePositions: s
|
|
5085
5047
|
})
|
|
5086
5048
|
};
|
|
5087
|
-
const { left: a, top: r, width: c, height: d } = h, l =
|
|
5049
|
+
const { left: a, top: r, width: c, height: d } = h, l = Qt({
|
|
5088
5050
|
value: a,
|
|
5089
5051
|
dimension: t,
|
|
5090
5052
|
useRelativePositions: s
|
|
5091
|
-
}), u =
|
|
5053
|
+
}), u = Qt({
|
|
5092
5054
|
value: r,
|
|
5093
5055
|
dimension: e,
|
|
5094
5056
|
useRelativePositions: s
|
|
@@ -5097,7 +5059,7 @@ const tt = ({
|
|
|
5097
5059
|
x: l + g / 2,
|
|
5098
5060
|
y: u + f / 2
|
|
5099
5061
|
};
|
|
5100
|
-
},
|
|
5062
|
+
}, go = ({
|
|
5101
5063
|
normalizedX: h,
|
|
5102
5064
|
normalizedY: t,
|
|
5103
5065
|
bounds: e,
|
|
@@ -5111,7 +5073,7 @@ const tt = ({
|
|
|
5111
5073
|
}
|
|
5112
5074
|
const c = n + h * a, d = i + t * r;
|
|
5113
5075
|
return new J(c, d);
|
|
5114
|
-
},
|
|
5076
|
+
}, fo = ({
|
|
5115
5077
|
object: h,
|
|
5116
5078
|
montageArea: t,
|
|
5117
5079
|
bounds: e
|
|
@@ -5149,12 +5111,12 @@ const tt = ({
|
|
|
5149
5111
|
} catch (t) {
|
|
5150
5112
|
return null;
|
|
5151
5113
|
}
|
|
5152
|
-
},
|
|
5114
|
+
}, po = ({
|
|
5153
5115
|
x1: h,
|
|
5154
5116
|
y1: t,
|
|
5155
5117
|
x2: e,
|
|
5156
5118
|
y2: s
|
|
5157
|
-
}) => (Math.atan2(s - t, e - h) * 180 / Math.PI + 360) % 360,
|
|
5119
|
+
}) => (Math.atan2(s - t, e - h) * 180 / Math.PI + 360) % 360, mo = (h) => {
|
|
5158
5120
|
if (!h || typeof h != "object") return null;
|
|
5159
5121
|
const { type: t, coords: e, colorStops: s } = h, o = Array.isArray(s) ? s : [], n = o[0], i = o[o.length - 1], a = typeof (n == null ? void 0 : n.color) == "string" ? n.color : void 0, r = typeof (i == null ? void 0 : i.color) == "string" ? i.color : a, c = typeof (n == null ? void 0 : n.offset) == "number" ? n.offset * 100 : void 0, d = typeof (i == null ? void 0 : i.offset) == "number" ? i.offset * 100 : void 0;
|
|
5160
5122
|
if (!a || !r || !e) return null;
|
|
@@ -5163,7 +5125,7 @@ const tt = ({
|
|
|
5163
5125
|
if (typeof l == "number" && typeof u == "number" && typeof g == "number" && typeof f == "number")
|
|
5164
5126
|
return {
|
|
5165
5127
|
type: "linear",
|
|
5166
|
-
angle:
|
|
5128
|
+
angle: po({ x1: l, y1: u, x2: g, y2: f }),
|
|
5167
5129
|
startColor: a,
|
|
5168
5130
|
endColor: r,
|
|
5169
5131
|
startPosition: c,
|
|
@@ -5185,7 +5147,7 @@ const tt = ({
|
|
|
5185
5147
|
};
|
|
5186
5148
|
}
|
|
5187
5149
|
return null;
|
|
5188
|
-
},
|
|
5150
|
+
}, ie = "_templateCenterX", ae = "_templateCenterY", re = "_templateAnchorX", ce = "_templateAnchorY";
|
|
5189
5151
|
class L {
|
|
5190
5152
|
constructor({ editor: t }) {
|
|
5191
5153
|
this.editor = t;
|
|
@@ -5219,14 +5181,14 @@ class L {
|
|
|
5219
5181
|
baseWidth: m,
|
|
5220
5182
|
baseHeight: v,
|
|
5221
5183
|
montageArea: i != null ? i : null
|
|
5222
|
-
})), I =
|
|
5184
|
+
})), I = jt(k({}, s), {
|
|
5223
5185
|
baseWidth: m,
|
|
5224
5186
|
baseHeight: v,
|
|
5225
5187
|
positionsNormalized: !0,
|
|
5226
5188
|
previewId: e != null ? e : s.previewId
|
|
5227
5189
|
});
|
|
5228
5190
|
return {
|
|
5229
|
-
id: t != null ? t : `template-${
|
|
5191
|
+
id: t != null ? t : `template-${Y()}`,
|
|
5230
5192
|
meta: I,
|
|
5231
5193
|
objects: b
|
|
5232
5194
|
};
|
|
@@ -5292,7 +5254,7 @@ class L {
|
|
|
5292
5254
|
montageArea: n,
|
|
5293
5255
|
useRelativePositions: m
|
|
5294
5256
|
}), A.set({
|
|
5295
|
-
id: `${A.type}-${
|
|
5257
|
+
id: `${A.type}-${Y()}`,
|
|
5296
5258
|
evented: !0
|
|
5297
5259
|
}), o.add(A), A));
|
|
5298
5260
|
return !S.length && !b ? null : (v = S.length > 0 || b, S.length && L._activateObjects({ canvas: o, objects: S }), o.requestRenderAll(), o.fire("editor:template-applied", {
|
|
@@ -5320,7 +5282,7 @@ class L {
|
|
|
5320
5282
|
* Подготавливает объекты для сериализации.
|
|
5321
5283
|
*/
|
|
5322
5284
|
static _collectObjects(t) {
|
|
5323
|
-
return t ? t instanceof
|
|
5285
|
+
return t ? t instanceof x ? t.getObjects() : [t] : [];
|
|
5324
5286
|
}
|
|
5325
5287
|
/**
|
|
5326
5288
|
* Возвращает габариты объекта.
|
|
@@ -5396,7 +5358,7 @@ class L {
|
|
|
5396
5358
|
const e = typeof t.svgMarkup == "string" ? t.svgMarkup : null;
|
|
5397
5359
|
if (!e) return null;
|
|
5398
5360
|
try {
|
|
5399
|
-
const s = yield
|
|
5361
|
+
const s = yield bs(e), o = ct.groupSVGElements(s.objects, s.options), n = yield ct.enlivenObjectEnlivables(
|
|
5400
5362
|
L._prepareSerializableProps(t)
|
|
5401
5363
|
);
|
|
5402
5364
|
return o.set(n), o.setCoords(), o;
|
|
@@ -5409,7 +5371,7 @@ class L {
|
|
|
5409
5371
|
* Убирает технические поля сериализации, оставляя только применимые свойства.
|
|
5410
5372
|
*/
|
|
5411
5373
|
static _prepareSerializableProps(t) {
|
|
5412
|
-
const e =
|
|
5374
|
+
const e = k({}, t);
|
|
5413
5375
|
return delete e.svgMarkup, delete e.objects, delete e.path, delete e.paths, delete e.type, delete e.version, e;
|
|
5414
5376
|
}
|
|
5415
5377
|
/**
|
|
@@ -5455,14 +5417,14 @@ class L {
|
|
|
5455
5417
|
montageArea: a,
|
|
5456
5418
|
useRelativePositions: r
|
|
5457
5419
|
}) {
|
|
5458
|
-
const c = t, { x: d, y: l } =
|
|
5420
|
+
const c = t, { x: d, y: l } = uo({
|
|
5459
5421
|
object: t,
|
|
5460
5422
|
baseWidth: n,
|
|
5461
5423
|
baseHeight: i,
|
|
5462
5424
|
useRelativePositions: r,
|
|
5463
5425
|
centerKeys: {
|
|
5464
|
-
x:
|
|
5465
|
-
y:
|
|
5426
|
+
x: ie,
|
|
5427
|
+
y: ae
|
|
5466
5428
|
}
|
|
5467
5429
|
}), { scaleX: u, scaleY: g } = t, f = tt({ value: u, fallback: 1 }), p = tt({ value: g, fallback: 1 }), m = L._getPositioningBounds({
|
|
5468
5430
|
bounds: s,
|
|
@@ -5470,9 +5432,9 @@ class L {
|
|
|
5470
5432
|
baseHeight: i,
|
|
5471
5433
|
scale: e,
|
|
5472
5434
|
useRelativePositions: r,
|
|
5473
|
-
anchorX: L._resolveAnchor(c,
|
|
5474
|
-
anchorY: L._resolveAnchor(c,
|
|
5475
|
-
}), v =
|
|
5435
|
+
anchorX: L._resolveAnchor(c, re),
|
|
5436
|
+
anchorY: L._resolveAnchor(c, ce)
|
|
5437
|
+
}), v = go({
|
|
5476
5438
|
normalizedX: d,
|
|
5477
5439
|
normalizedY: l,
|
|
5478
5440
|
bounds: m,
|
|
@@ -5482,7 +5444,7 @@ class L {
|
|
|
5482
5444
|
t.set({
|
|
5483
5445
|
scaleX: b,
|
|
5484
5446
|
scaleY: I
|
|
5485
|
-
}), t.setPositionByOrigin(v, "center", "center"), t.setCoords(), delete c[
|
|
5447
|
+
}), t.setPositionByOrigin(v, "center", "center"), t.setCoords(), delete c[ie], delete c[ae], delete c[re], delete c[ce];
|
|
5486
5448
|
}
|
|
5487
5449
|
/**
|
|
5488
5450
|
* Возвращает bounds, в которых должны позиционироваться нормализованные объекты.
|
|
@@ -5533,7 +5495,7 @@ class L {
|
|
|
5533
5495
|
fallback: e
|
|
5534
5496
|
}) {
|
|
5535
5497
|
const { width: s, height: o } = e, r = t || {}, { baseWidth: n = s, baseHeight: i = o } = r, a = gt(r, ["baseWidth", "baseHeight"]);
|
|
5536
|
-
return
|
|
5498
|
+
return k({
|
|
5537
5499
|
baseWidth: n,
|
|
5538
5500
|
baseHeight: i
|
|
5539
5501
|
}, a);
|
|
@@ -5560,7 +5522,7 @@ class L {
|
|
|
5560
5522
|
t.setActiveObject(e[0]);
|
|
5561
5523
|
return;
|
|
5562
5524
|
}
|
|
5563
|
-
const s = new
|
|
5525
|
+
const s = new x(e, { canvas: t });
|
|
5564
5526
|
t.setActiveObject(s);
|
|
5565
5527
|
}
|
|
5566
5528
|
/**
|
|
@@ -5584,7 +5546,7 @@ class L {
|
|
|
5584
5546
|
baseHeight: o,
|
|
5585
5547
|
montageArea: n
|
|
5586
5548
|
}) {
|
|
5587
|
-
const i = t.toDatalessObject([...
|
|
5549
|
+
const i = t.toDatalessObject([...as]);
|
|
5588
5550
|
if (L._isSvgObject(t)) {
|
|
5589
5551
|
const y = L._extractSvgMarkup(t);
|
|
5590
5552
|
y && (i.svgMarkup = y, delete i.objects, delete i.path);
|
|
@@ -5595,7 +5557,7 @@ class L {
|
|
|
5595
5557
|
top: r,
|
|
5596
5558
|
width: c,
|
|
5597
5559
|
height: d
|
|
5598
|
-
} = e, l = t.getBoundingRect(!1, !0), u = s || c || 1, g = o || d || 1, f =
|
|
5560
|
+
} = e, l = t.getBoundingRect(!1, !0), u = s || c || 1, g = o || d || 1, f = fo({
|
|
5599
5561
|
object: t,
|
|
5600
5562
|
montageArea: n,
|
|
5601
5563
|
bounds: e
|
|
@@ -5606,11 +5568,11 @@ class L {
|
|
|
5606
5568
|
y: (y.y - r) / g
|
|
5607
5569
|
};
|
|
5608
5570
|
})(), m = (l.left - a) / u, v = (l.top - r) / g, b = m + l.width / u, I = v + l.height / g;
|
|
5609
|
-
return i[
|
|
5571
|
+
return i[ie] = p.x, i[ae] = p.y, i[re] = L._detectAnchor({
|
|
5610
5572
|
center: p.x,
|
|
5611
5573
|
start: m,
|
|
5612
5574
|
end: b
|
|
5613
|
-
}), i[
|
|
5575
|
+
}), i[ce] = L._detectAnchor({
|
|
5614
5576
|
center: p.y,
|
|
5615
5577
|
start: v,
|
|
5616
5578
|
end: I
|
|
@@ -5644,7 +5606,7 @@ class L {
|
|
|
5644
5606
|
withoutSave: !0
|
|
5645
5607
|
}), !0;
|
|
5646
5608
|
if (a === "gradient") {
|
|
5647
|
-
const c =
|
|
5609
|
+
const c = mo(n);
|
|
5648
5610
|
if (c)
|
|
5649
5611
|
return e.setGradientBackground({
|
|
5650
5612
|
gradient: c,
|
|
@@ -5695,7 +5657,7 @@ class L {
|
|
|
5695
5657
|
*/
|
|
5696
5658
|
static _cloneCustomData(t) {
|
|
5697
5659
|
if (!(!t || typeof t != "object"))
|
|
5698
|
-
return
|
|
5660
|
+
return k({}, t);
|
|
5699
5661
|
}
|
|
5700
5662
|
/**
|
|
5701
5663
|
* Извлекает src изображения из FabricImage или его исходного элемента.
|
|
@@ -5724,7 +5686,7 @@ class L {
|
|
|
5724
5686
|
return ct.enlivenObjectEnlivables(t);
|
|
5725
5687
|
}
|
|
5726
5688
|
}
|
|
5727
|
-
const
|
|
5689
|
+
const yo = 5, rs = "#3D8BF4", fe = 1, qt = 1, ts = ({
|
|
5728
5690
|
anchors: h,
|
|
5729
5691
|
positions: t,
|
|
5730
5692
|
threshold: e
|
|
@@ -5739,16 +5701,16 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
5739
5701
|
delta: s,
|
|
5740
5702
|
guidePosition: n
|
|
5741
5703
|
};
|
|
5742
|
-
},
|
|
5704
|
+
}, vo = ({
|
|
5743
5705
|
activeBounds: h,
|
|
5744
5706
|
threshold: t,
|
|
5745
5707
|
anchors: e
|
|
5746
5708
|
}) => {
|
|
5747
|
-
const { left: s, right: o, centerX: n, top: i, bottom: a, centerY: r } = h, c =
|
|
5709
|
+
const { left: s, right: o, centerX: n, top: i, bottom: a, centerY: r } = h, c = ts({
|
|
5748
5710
|
anchors: e.vertical,
|
|
5749
5711
|
positions: [s, n, o],
|
|
5750
5712
|
threshold: t
|
|
5751
|
-
}), d =
|
|
5713
|
+
}), d = ts({
|
|
5752
5714
|
anchors: e.horizontal,
|
|
5753
5715
|
positions: [i, r, a],
|
|
5754
5716
|
threshold: t
|
|
@@ -5764,7 +5726,7 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
5764
5726
|
deltaY: d.delta,
|
|
5765
5727
|
guides: l
|
|
5766
5728
|
};
|
|
5767
|
-
},
|
|
5729
|
+
}, cs = ({
|
|
5768
5730
|
activeBounds: h,
|
|
5769
5731
|
aligned: t,
|
|
5770
5732
|
threshold: e,
|
|
@@ -5836,7 +5798,7 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
5836
5798
|
}
|
|
5837
5799
|
}
|
|
5838
5800
|
return c;
|
|
5839
|
-
},
|
|
5801
|
+
}, bo = ({
|
|
5840
5802
|
activeBounds: h,
|
|
5841
5803
|
candidates: t,
|
|
5842
5804
|
threshold: e,
|
|
@@ -5893,22 +5855,22 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
5893
5855
|
if (u && f) {
|
|
5894
5856
|
const { bounds: y } = u, { bounds: w } = f, A = w.top - y.bottom - v;
|
|
5895
5857
|
if (A >= 0) {
|
|
5896
|
-
const M = A / 2, C = n - y.bottom, j = w.top - i, T = Math.abs(C - M), B = Math.abs(j - M),
|
|
5897
|
-
if (
|
|
5898
|
-
const
|
|
5858
|
+
const M = A / 2, C = n - y.bottom, j = w.top - i, T = Math.abs(C - M), B = Math.abs(j - M), Z = Math.max(T, B);
|
|
5859
|
+
if (Z <= e) {
|
|
5860
|
+
const U = M - C, F = i + U, V = {
|
|
5899
5861
|
type: "vertical",
|
|
5900
5862
|
axis: o,
|
|
5901
5863
|
refStart: y.bottom,
|
|
5902
5864
|
refEnd: y.bottom + M,
|
|
5903
|
-
activeStart:
|
|
5904
|
-
activeEnd:
|
|
5865
|
+
activeStart: F,
|
|
5866
|
+
activeEnd: F + M,
|
|
5905
5867
|
distance: M
|
|
5906
5868
|
};
|
|
5907
|
-
m.push({ delta:
|
|
5869
|
+
m.push({ delta: U, guide: V, diff: Z });
|
|
5908
5870
|
}
|
|
5909
5871
|
}
|
|
5910
5872
|
}
|
|
5911
|
-
const b =
|
|
5873
|
+
const b = cs({
|
|
5912
5874
|
activeBounds: h,
|
|
5913
5875
|
aligned: c,
|
|
5914
5876
|
threshold: e,
|
|
@@ -5922,7 +5884,7 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
5922
5884
|
delta: I.delta,
|
|
5923
5885
|
guide: I.guide
|
|
5924
5886
|
};
|
|
5925
|
-
},
|
|
5887
|
+
}, Mo = ({
|
|
5926
5888
|
activeBounds: h,
|
|
5927
5889
|
candidates: t,
|
|
5928
5890
|
threshold: e,
|
|
@@ -5979,22 +5941,22 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
5979
5941
|
if (u && f) {
|
|
5980
5942
|
const { bounds: y } = u, { bounds: w } = f, A = w.left - y.right - v;
|
|
5981
5943
|
if (A >= 0) {
|
|
5982
|
-
const M = A / 2, C = n - y.right, j = w.left - i, T = Math.abs(C - M), B = Math.abs(j - M),
|
|
5983
|
-
if (
|
|
5984
|
-
const
|
|
5944
|
+
const M = A / 2, C = n - y.right, j = w.left - i, T = Math.abs(C - M), B = Math.abs(j - M), Z = Math.max(T, B);
|
|
5945
|
+
if (Z <= e) {
|
|
5946
|
+
const U = M - C, F = i + U, V = {
|
|
5985
5947
|
type: "horizontal",
|
|
5986
5948
|
axis: o,
|
|
5987
5949
|
refStart: y.right,
|
|
5988
5950
|
refEnd: y.right + M,
|
|
5989
|
-
activeStart:
|
|
5990
|
-
activeEnd:
|
|
5951
|
+
activeStart: F,
|
|
5952
|
+
activeEnd: F + M,
|
|
5991
5953
|
distance: M
|
|
5992
5954
|
};
|
|
5993
|
-
m.push({ delta:
|
|
5955
|
+
m.push({ delta: U, guide: V, diff: Z });
|
|
5994
5956
|
}
|
|
5995
5957
|
}
|
|
5996
5958
|
}
|
|
5997
|
-
const b =
|
|
5959
|
+
const b = cs({
|
|
5998
5960
|
activeBounds: h,
|
|
5999
5961
|
aligned: c,
|
|
6000
5962
|
threshold: e,
|
|
@@ -6008,18 +5970,18 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
6008
5970
|
delta: I.delta,
|
|
6009
5971
|
guide: I.guide
|
|
6010
5972
|
};
|
|
6011
|
-
},
|
|
5973
|
+
}, wo = ({
|
|
6012
5974
|
activeBounds: h,
|
|
6013
5975
|
candidates: t,
|
|
6014
5976
|
threshold: e,
|
|
6015
5977
|
spacingPatterns: s
|
|
6016
5978
|
}) => {
|
|
6017
|
-
const o =
|
|
5979
|
+
const o = bo({
|
|
6018
5980
|
activeBounds: h,
|
|
6019
5981
|
candidates: t,
|
|
6020
5982
|
threshold: e,
|
|
6021
5983
|
patterns: s.vertical
|
|
6022
|
-
}), n =
|
|
5984
|
+
}), n = Mo({
|
|
6023
5985
|
activeBounds: h,
|
|
6024
5986
|
candidates: t,
|
|
6025
5987
|
threshold: e,
|
|
@@ -6030,7 +5992,7 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
6030
5992
|
deltaY: o.delta,
|
|
6031
5993
|
guides: i
|
|
6032
5994
|
};
|
|
6033
|
-
},
|
|
5995
|
+
}, So = ({
|
|
6034
5996
|
context: h,
|
|
6035
5997
|
x: t,
|
|
6036
5998
|
y: e,
|
|
@@ -6040,7 +6002,7 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
6040
6002
|
}) => {
|
|
6041
6003
|
const i = Math.min(n, s / 2, o / 2);
|
|
6042
6004
|
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 + o - i), h.quadraticCurveTo(t + s, e + o, t + s - i, e + o), h.lineTo(t + i, e + o), h.quadraticCurveTo(t, e + o, t, e + o - i), h.lineTo(t, e + i), h.quadraticCurveTo(t, e, t + i, e), h.closePath();
|
|
6043
|
-
},
|
|
6005
|
+
}, pe = ({
|
|
6044
6006
|
context: h,
|
|
6045
6007
|
type: t,
|
|
6046
6008
|
axis: e,
|
|
@@ -6060,7 +6022,7 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
6060
6022
|
const p = i || 1, m = 12 / p, v = l / p, b = u / p, I = (s + o) / 2 + g, y = t === "vertical" ? e + f : I, w = t === "vertical" ? I : e + f;
|
|
6061
6023
|
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";
|
|
6062
6024
|
const A = h.measureText(n).width + v * 2, M = m + v * 2, C = y - A / 2, j = w - M / 2;
|
|
6063
|
-
h.beginPath(),
|
|
6025
|
+
h.beginPath(), So({
|
|
6064
6026
|
context: h,
|
|
6065
6027
|
x: C,
|
|
6066
6028
|
y: j,
|
|
@@ -6068,7 +6030,7 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
6068
6030
|
height: M,
|
|
6069
6031
|
radius: b
|
|
6070
6032
|
}), h.fill(), h.fillStyle = r, h.fillText(n, y, w), h.restore();
|
|
6071
|
-
},
|
|
6033
|
+
}, Ao = ({
|
|
6072
6034
|
context: h,
|
|
6073
6035
|
guide: t,
|
|
6074
6036
|
zoom: e
|
|
@@ -6083,8 +6045,8 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
6083
6045
|
distance: c
|
|
6084
6046
|
} = t, d = Math.round(c).toString();
|
|
6085
6047
|
h.beginPath(), s === "vertical" ? (h.moveTo(o, n), h.lineTo(o, i), h.moveTo(o, a), h.lineTo(o, r)) : (h.moveTo(n, o), h.lineTo(i, o), h.moveTo(a, o), h.lineTo(r, o)), h.stroke();
|
|
6086
|
-
const l =
|
|
6087
|
-
|
|
6048
|
+
const l = rs;
|
|
6049
|
+
pe({
|
|
6088
6050
|
context: h,
|
|
6089
6051
|
type: s,
|
|
6090
6052
|
axis: o,
|
|
@@ -6093,8 +6055,8 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
6093
6055
|
text: d,
|
|
6094
6056
|
zoom: e,
|
|
6095
6057
|
color: l,
|
|
6096
|
-
lineWidth:
|
|
6097
|
-
}),
|
|
6058
|
+
lineWidth: fe
|
|
6059
|
+
}), pe({
|
|
6098
6060
|
context: h,
|
|
6099
6061
|
type: s,
|
|
6100
6062
|
axis: o,
|
|
@@ -6103,9 +6065,9 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
6103
6065
|
text: d,
|
|
6104
6066
|
zoom: e,
|
|
6105
6067
|
color: l,
|
|
6106
|
-
lineWidth:
|
|
6068
|
+
lineWidth: fe
|
|
6107
6069
|
});
|
|
6108
|
-
},
|
|
6070
|
+
}, es = ({
|
|
6109
6071
|
anchors: h,
|
|
6110
6072
|
bounds: t
|
|
6111
6073
|
}) => {
|
|
@@ -6118,7 +6080,7 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
6118
6080
|
centerY: a
|
|
6119
6081
|
} = t;
|
|
6120
6082
|
h.vertical.push(e, o, s), h.horizontal.push(n, a, i);
|
|
6121
|
-
},
|
|
6083
|
+
}, ss = ({
|
|
6122
6084
|
bounds: h,
|
|
6123
6085
|
type: t,
|
|
6124
6086
|
primaryStart: e,
|
|
@@ -6145,30 +6107,30 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
6145
6107
|
});
|
|
6146
6108
|
}
|
|
6147
6109
|
return o;
|
|
6148
|
-
},
|
|
6110
|
+
}, jo = ({
|
|
6149
6111
|
bounds: h
|
|
6150
6112
|
}) => {
|
|
6151
|
-
const t =
|
|
6113
|
+
const t = ss({
|
|
6152
6114
|
bounds: h,
|
|
6153
6115
|
type: "vertical",
|
|
6154
6116
|
primaryStart: "top",
|
|
6155
6117
|
primaryEnd: "bottom"
|
|
6156
|
-
}), e =
|
|
6118
|
+
}), e = ss({
|
|
6157
6119
|
bounds: h,
|
|
6158
6120
|
type: "horizontal",
|
|
6159
6121
|
primaryStart: "left",
|
|
6160
6122
|
primaryEnd: "right"
|
|
6161
6123
|
});
|
|
6162
6124
|
return { vertical: t, horizontal: e };
|
|
6163
|
-
},
|
|
6125
|
+
}, Io = ["montage-area", "background", "interaction-blocker"], ds = ({
|
|
6164
6126
|
activeObject: h
|
|
6165
6127
|
}) => {
|
|
6166
6128
|
const t = /* @__PURE__ */ new Set();
|
|
6167
|
-
return h && (t.add(h), h instanceof
|
|
6168
|
-
},
|
|
6129
|
+
return h && (t.add(h), h instanceof x && h.getObjects().forEach((e) => t.add(e))), t;
|
|
6130
|
+
}, ls = ({
|
|
6169
6131
|
object: h,
|
|
6170
6132
|
excluded: t,
|
|
6171
|
-
ignoredIds: e =
|
|
6133
|
+
ignoredIds: e = Io
|
|
6172
6134
|
}) => {
|
|
6173
6135
|
if (t.has(h)) return !0;
|
|
6174
6136
|
const { visible: s = !0 } = h;
|
|
@@ -6176,7 +6138,7 @@ const po = 5, os = "#3D8BF4", ge = 1, Xt = 1, Qe = ({
|
|
|
6176
6138
|
const { id: o } = h;
|
|
6177
6139
|
return !!(o && e.includes(o));
|
|
6178
6140
|
};
|
|
6179
|
-
class
|
|
6141
|
+
class Co {
|
|
6180
6142
|
/**
|
|
6181
6143
|
* Создаёт менеджер прилипания и инициализирует слушатели событий.
|
|
6182
6144
|
*/
|
|
@@ -6239,7 +6201,7 @@ class jo {
|
|
|
6239
6201
|
this._clearGuides();
|
|
6240
6202
|
return;
|
|
6241
6203
|
}
|
|
6242
|
-
const { canvas: i } = this, a = i.getZoom() || 1, r =
|
|
6204
|
+
const { canvas: i } = this, a = i.getZoom() || 1, r = yo / a, c = vo({
|
|
6243
6205
|
activeBounds: n,
|
|
6244
6206
|
threshold: r,
|
|
6245
6207
|
anchors: this.anchors
|
|
@@ -6251,7 +6213,7 @@ class jo {
|
|
|
6251
6213
|
top: b + l
|
|
6252
6214
|
}), e.setCoords(), n = (p = ht({ object: e })) != null ? p : n;
|
|
6253
6215
|
}
|
|
6254
|
-
const g = this.cachedTargetBounds.length ? this.cachedTargetBounds : this._collectTargets({ activeObject: e }).map((v) => ht({ object: v })).filter((v) => !!v), f =
|
|
6216
|
+
const g = this.cachedTargetBounds.length ? this.cachedTargetBounds : this._collectTargets({ activeObject: e }).map((v) => ht({ object: v })).filter((v) => !!v), f = wo({
|
|
6255
6217
|
activeBounds: n,
|
|
6256
6218
|
candidates: g,
|
|
6257
6219
|
threshold: r,
|
|
@@ -6290,11 +6252,11 @@ class jo {
|
|
|
6290
6252
|
const { canvas: t, guideBounds: e } = this, s = t.getSelectionContext();
|
|
6291
6253
|
if (!s) return;
|
|
6292
6254
|
const o = e != null ? e : this._calculateViewportBounds(), { left: n, right: i, top: a, bottom: r } = o, { viewportTransform: c } = t, d = t.getZoom() || 1;
|
|
6293
|
-
s.save(), Array.isArray(c) && s.transform(...c), s.lineWidth =
|
|
6255
|
+
s.save(), Array.isArray(c) && s.transform(...c), s.lineWidth = fe / d, s.strokeStyle = rs, s.setLineDash([4, 4]);
|
|
6294
6256
|
for (const l of this.activeGuides)
|
|
6295
6257
|
s.beginPath(), l.type === "vertical" ? (s.moveTo(l.position, a), s.lineTo(l.position, r)) : (s.moveTo(n, l.position), s.lineTo(i, l.position)), s.stroke();
|
|
6296
6258
|
for (const l of this.activeSpacingGuides)
|
|
6297
|
-
|
|
6259
|
+
Ao({
|
|
6298
6260
|
context: s,
|
|
6299
6261
|
guide: l,
|
|
6300
6262
|
zoom: d
|
|
@@ -6330,7 +6292,7 @@ class jo {
|
|
|
6330
6292
|
* Применяет шаг перемещения, округляя координаты объекта к сетке MOVE_SNAP_STEP.
|
|
6331
6293
|
*/
|
|
6332
6294
|
_applyMovementStep({ target: t }) {
|
|
6333
|
-
const { left: e = 0, top: s = 0 } = t, o = Math.round(e /
|
|
6295
|
+
const { left: e = 0, top: s = 0 } = t, o = Math.round(e / qt) * qt, n = Math.round(s / qt) * qt;
|
|
6334
6296
|
o === e && n === s || (t.set({
|
|
6335
6297
|
left: o,
|
|
6336
6298
|
top: n
|
|
@@ -6343,11 +6305,11 @@ class jo {
|
|
|
6343
6305
|
const e = this._collectTargets({ activeObject: t }), s = { vertical: [], horizontal: [] }, o = [];
|
|
6344
6306
|
for (const a of e) {
|
|
6345
6307
|
const r = ht({ object: a });
|
|
6346
|
-
r && (
|
|
6308
|
+
r && (es({ anchors: s, bounds: r }), o.push(r));
|
|
6347
6309
|
}
|
|
6348
6310
|
const { montageArea: n } = this.editor, i = ht({ object: n });
|
|
6349
6311
|
if (i) {
|
|
6350
|
-
|
|
6312
|
+
es({ anchors: s, bounds: i });
|
|
6351
6313
|
const { left: a, right: r, top: c, bottom: d } = i;
|
|
6352
6314
|
this.guideBounds = {
|
|
6353
6315
|
left: a,
|
|
@@ -6357,15 +6319,15 @@ class jo {
|
|
|
6357
6319
|
};
|
|
6358
6320
|
} else
|
|
6359
6321
|
this.guideBounds = this._calculateViewportBounds();
|
|
6360
|
-
this.anchors = s, this.spacingPatterns =
|
|
6322
|
+
this.anchors = s, this.spacingPatterns = jo({ bounds: o }), this.cachedTargetBounds = o;
|
|
6361
6323
|
}
|
|
6362
6324
|
/**
|
|
6363
6325
|
* Собирает объекты, подходящие для прилипания, исключая активный объект и запрещённые id.
|
|
6364
6326
|
*/
|
|
6365
6327
|
_collectTargets({ activeObject: t }) {
|
|
6366
|
-
const e =
|
|
6328
|
+
const e = ds({ activeObject: t }), s = [];
|
|
6367
6329
|
return this.canvas.forEachObject((o) => {
|
|
6368
|
-
|
|
6330
|
+
ls({ object: o, excluded: e }) || s.push(o);
|
|
6369
6331
|
}), s;
|
|
6370
6332
|
}
|
|
6371
6333
|
/**
|
|
@@ -6388,8 +6350,8 @@ class jo {
|
|
|
6388
6350
|
};
|
|
6389
6351
|
}
|
|
6390
6352
|
}
|
|
6391
|
-
const
|
|
6392
|
-
class
|
|
6353
|
+
const os = "#3D8BF4", ns = 1;
|
|
6354
|
+
class Et {
|
|
6393
6355
|
/**
|
|
6394
6356
|
* Создаёт менеджер измерений и инициализирует события.
|
|
6395
6357
|
*/
|
|
@@ -6499,7 +6461,7 @@ class Ct {
|
|
|
6499
6461
|
this._clearGuides();
|
|
6500
6462
|
return;
|
|
6501
6463
|
}
|
|
6502
|
-
const i =
|
|
6464
|
+
const i = Et._resolveTarget({
|
|
6503
6465
|
event: t,
|
|
6504
6466
|
activeObject: o
|
|
6505
6467
|
}), { montageArea: a } = s, r = i != null ? i : a, c = r === a, d = ht({ object: r });
|
|
@@ -6511,7 +6473,7 @@ class Ct {
|
|
|
6511
6473
|
this._clearGuides();
|
|
6512
6474
|
return;
|
|
6513
6475
|
}
|
|
6514
|
-
const u =
|
|
6476
|
+
const u = Et._buildGuides({
|
|
6515
6477
|
activeBounds: n,
|
|
6516
6478
|
targetBounds: d,
|
|
6517
6479
|
targetIsMontageArea: c
|
|
@@ -6529,8 +6491,8 @@ class Ct {
|
|
|
6529
6491
|
event: t,
|
|
6530
6492
|
activeObject: e
|
|
6531
6493
|
}) {
|
|
6532
|
-
const { target: s } = t, o =
|
|
6533
|
-
return s && !
|
|
6494
|
+
const { target: s } = t, o = ds({ activeObject: e });
|
|
6495
|
+
return s && !ls({ object: s, excluded: o }) ? s : null;
|
|
6534
6496
|
}
|
|
6535
6497
|
/**
|
|
6536
6498
|
* Собирает вертикальные и горизонтальные направляющие расстояний.
|
|
@@ -6540,11 +6502,11 @@ class Ct {
|
|
|
6540
6502
|
targetBounds: e,
|
|
6541
6503
|
targetIsMontageArea: s
|
|
6542
6504
|
}) {
|
|
6543
|
-
const o =
|
|
6505
|
+
const o = Et._buildHorizontalGuides({
|
|
6544
6506
|
activeBounds: t,
|
|
6545
6507
|
targetBounds: e,
|
|
6546
6508
|
targetIsMontageArea: s
|
|
6547
|
-
}), n =
|
|
6509
|
+
}), n = Et._buildVerticalGuides({
|
|
6548
6510
|
activeBounds: t,
|
|
6549
6511
|
targetBounds: e,
|
|
6550
6512
|
targetIsMontageArea: s
|
|
@@ -6698,10 +6660,10 @@ class Ct {
|
|
|
6698
6660
|
const { canvas: t } = this, e = t.getSelectionContext();
|
|
6699
6661
|
if (!e) return;
|
|
6700
6662
|
const { viewportTransform: s } = t, o = t.getZoom() || 1, n = this.activeGuides.some((c) => c.type === "vertical"), i = this.activeGuides.some((c) => c.type === "horizontal"), a = n && i && !this.isTargetMontageArea, r = a ? 12 / o : 0;
|
|
6701
|
-
e.save(), Array.isArray(s) && e.transform(...s), e.lineWidth =
|
|
6663
|
+
e.save(), Array.isArray(s) && e.transform(...s), e.lineWidth = ns / o, e.strokeStyle = os, e.setLineDash([]);
|
|
6702
6664
|
for (const c of this.activeGuides) {
|
|
6703
6665
|
const { type: d, axis: l, start: u, end: g, distance: f } = c, p = Math.abs(g - u), m = u <= g ? -1 : 1, v = a ? m * (p / 2 + r) : 0, b = 0;
|
|
6704
|
-
e.beginPath(), d === "vertical" ? (e.moveTo(l, u), e.lineTo(l, g)) : (e.moveTo(u, l), e.lineTo(g, l)), e.stroke(),
|
|
6666
|
+
e.beginPath(), d === "vertical" ? (e.moveTo(l, u), e.lineTo(l, g)) : (e.moveTo(u, l), e.lineTo(g, l)), e.stroke(), pe({
|
|
6705
6667
|
context: e,
|
|
6706
6668
|
type: d,
|
|
6707
6669
|
axis: l,
|
|
@@ -6709,8 +6671,8 @@ class Ct {
|
|
|
6709
6671
|
end: g,
|
|
6710
6672
|
text: Math.round(f).toString(),
|
|
6711
6673
|
zoom: o,
|
|
6712
|
-
color:
|
|
6713
|
-
lineWidth:
|
|
6674
|
+
color: os,
|
|
6675
|
+
lineWidth: ns,
|
|
6714
6676
|
offsetAlongAxis: v,
|
|
6715
6677
|
offsetPerpendicular: b
|
|
6716
6678
|
});
|
|
@@ -6736,14 +6698,14 @@ class Ct {
|
|
|
6736
6698
|
(e = t == null ? void 0 : t.showAfterTemporary) == null || e.call(t), this.isToolbarHidden = !1;
|
|
6737
6699
|
}
|
|
6738
6700
|
}
|
|
6739
|
-
class
|
|
6701
|
+
class we {
|
|
6740
6702
|
/**
|
|
6741
6703
|
* Конструктор класса ImageEditor.
|
|
6742
6704
|
* @param canvasId - идентификатор канваса, в котором будет создан редактор
|
|
6743
6705
|
* @param options - опции и настройки редактора
|
|
6744
6706
|
*/
|
|
6745
6707
|
constructor(t, e) {
|
|
6746
|
-
this.options = e, this.containerId = t, this.editorId = `${t}-${
|
|
6708
|
+
this.options = e, this.containerId = t, this.editorId = `${t}-${Y()}`, this.clipboard = null, this.init();
|
|
6747
6709
|
}
|
|
6748
6710
|
/**
|
|
6749
6711
|
* Инициализация редактора.
|
|
@@ -6766,7 +6728,7 @@ class Me {
|
|
|
6766
6728
|
showRotationAngle: d,
|
|
6767
6729
|
_onReadyCallback: l
|
|
6768
6730
|
} = this.options;
|
|
6769
|
-
if ($.apply(), this.canvas = new
|
|
6731
|
+
if ($.apply(), this.canvas = new Ms(this.containerId, this.options), this.moduleLoader = new Is(), this.workerManager = new Ts(), this.errorManager = new Ut({ editor: this }), this.historyManager = new Jt({ editor: this }), this.toolbar = new Hs({ editor: this }), this.transformManager = new Js({ editor: this }), this.zoomManager = new to({ editor: this }), this.canvasManager = new $s({ editor: this }), this.imageManager = new rt({ editor: this }), this.layerManager = new te({ editor: this }), this.shapeManager = new so({ editor: this }), this.interactionBlocker = new eo({ editor: this }), this.backgroundManager = new Tt({ editor: this }), this.clipboardManager = new oo({ editor: this }), this.objectLockManager = new ee({ editor: this }), this.groupingManager = new no({ editor: this }), this.selectionManager = new io({ editor: this }), this.deletionManager = new Me({ editor: this }), this.panConstraintManager = new ao({ editor: this }), this.snappingManager = new Co({ editor: this }), this.measurementManager = new Et({ editor: this }), this.fontManager = new ge((u = this.options.fonts) != null ? u : []), this.textManager = new G({ editor: this }), this.templateManager = new L({ editor: this }), d && (this.angleIndicator = new be({ editor: this })), this._createMontageArea(), this._createClippingArea(), this.listeners = new Pt({ editor: this, options: this.options }), this.canvasManager.setEditorContainerWidth(t), this.canvasManager.setEditorContainerHeight(e), this.canvasManager.setCanvasWrapperWidth(s), this.canvasManager.setCanvasWrapperHeight(o), this.canvasManager.setCanvasCSSWidth(n), this.canvasManager.setCanvasCSSHeight(i), this.canvasManager.updateCanvas(), this.zoomManager.calculateAndApplyDefaultZoom(), yield this.fontManager.loadFonts(), a != null && a.source) {
|
|
6770
6732
|
const {
|
|
6771
6733
|
source: g,
|
|
6772
6734
|
scale: f = `image-${c}`,
|
|
@@ -6788,7 +6750,7 @@ class Me {
|
|
|
6788
6750
|
this.montageArea = this.shapeManager.addRectangle({
|
|
6789
6751
|
width: t,
|
|
6790
6752
|
height: e,
|
|
6791
|
-
fill:
|
|
6753
|
+
fill: we._createMosaicPattern(),
|
|
6792
6754
|
stroke: null,
|
|
6793
6755
|
strokeWidth: 0,
|
|
6794
6756
|
selectable: !1,
|
|
@@ -6839,7 +6801,7 @@ class Me {
|
|
|
6839
6801
|
const t = document.createElement("canvas");
|
|
6840
6802
|
t.width = 20, t.height = 20;
|
|
6841
6803
|
const e = t.getContext("2d");
|
|
6842
|
-
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
|
|
6804
|
+
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 ws({
|
|
6843
6805
|
source: t,
|
|
6844
6806
|
repeat: "repeat"
|
|
6845
6807
|
});
|
|
@@ -6871,7 +6833,7 @@ const E = [
|
|
|
6871
6833
|
"U+0490-0491",
|
|
6872
6834
|
"U+04B0-04B1",
|
|
6873
6835
|
"U+2116"
|
|
6874
|
-
].join(", "),
|
|
6836
|
+
].join(", "), To = [
|
|
6875
6837
|
{
|
|
6876
6838
|
family: "Arial",
|
|
6877
6839
|
source: 'local("Arial"), local("Liberation Sans"), local("DejaVu Sans")',
|
|
@@ -7661,7 +7623,7 @@ const E = [
|
|
|
7661
7623
|
unicodeRange: E
|
|
7662
7624
|
}
|
|
7663
7625
|
}
|
|
7664
|
-
],
|
|
7626
|
+
], Eo = {
|
|
7665
7627
|
/**
|
|
7666
7628
|
* Опции редактора
|
|
7667
7629
|
*/
|
|
@@ -7753,20 +7715,20 @@ const E = [
|
|
|
7753
7715
|
/**
|
|
7754
7716
|
* Список шрифтов, которые будут доступны в редакторе по умолчанию.
|
|
7755
7717
|
*/
|
|
7756
|
-
fonts:
|
|
7718
|
+
fonts: To
|
|
7757
7719
|
};
|
|
7758
|
-
function
|
|
7759
|
-
const e =
|
|
7720
|
+
function _o(h, t = {}) {
|
|
7721
|
+
const e = k(k({}, Eo), t), s = document.getElementById(h);
|
|
7760
7722
|
if (!s)
|
|
7761
7723
|
return Promise.reject(new Error(`Контейнер с ID "${h}" не найден.`));
|
|
7762
7724
|
const o = document.createElement("canvas");
|
|
7763
7725
|
return o.id = `${h}-canvas`, s.appendChild(o), e.editorContainer = s, new Promise((n) => {
|
|
7764
7726
|
e._onReadyCallback = n;
|
|
7765
|
-
const i = new
|
|
7727
|
+
const i = new we(o.id, e);
|
|
7766
7728
|
window[h] = i;
|
|
7767
7729
|
});
|
|
7768
7730
|
}
|
|
7769
7731
|
export {
|
|
7770
|
-
|
|
7732
|
+
_o as default
|
|
7771
7733
|
};
|
|
7772
7734
|
//# sourceMappingURL=main.js.map
|