@anu3ev/fabric-image-editor 0.1.65 → 0.1.67
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 +151 -140
- package/package.json +1 -1
package/dist/main.js
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
1
|
+
var ye = Object.defineProperty, pe = Object.defineProperties;
|
|
2
|
+
var Ie = Object.getOwnPropertyDescriptors;
|
|
3
3
|
var Y = Object.getOwnPropertySymbols;
|
|
4
|
-
var
|
|
5
|
-
var
|
|
4
|
+
var le = Object.prototype.hasOwnProperty, he = Object.prototype.propertyIsEnumerable;
|
|
5
|
+
var de = (r, e, t) => e in r ? ye(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, y = (r, e) => {
|
|
6
6
|
for (var t in e || (e = {}))
|
|
7
|
-
|
|
7
|
+
le.call(e, t) && de(r, t, e[t]);
|
|
8
8
|
if (Y)
|
|
9
9
|
for (var t of Y(e))
|
|
10
|
-
|
|
10
|
+
he.call(e, t) && de(r, t, e[t]);
|
|
11
11
|
return r;
|
|
12
|
-
},
|
|
12
|
+
}, ge = (r, e) => pe(r, Ie(e));
|
|
13
13
|
var _ = (r, e) => {
|
|
14
14
|
var t = {};
|
|
15
15
|
for (var s in r)
|
|
16
|
-
|
|
16
|
+
le.call(r, s) && e.indexOf(s) < 0 && (t[s] = r[s]);
|
|
17
17
|
if (r != null && Y)
|
|
18
18
|
for (var s of Y(r))
|
|
19
|
-
e.indexOf(s) < 0 &&
|
|
19
|
+
e.indexOf(s) < 0 && he.call(r, s) && (t[s] = r[s]);
|
|
20
20
|
return t;
|
|
21
21
|
};
|
|
22
22
|
var v = (r, e, t) => new Promise((s, n) => {
|
|
@@ -35,15 +35,15 @@ var v = (r, e, t) => new Promise((s, n) => {
|
|
|
35
35
|
}, o = (d) => d.done ? s(d.value) : Promise.resolve(d.value).then(i, a);
|
|
36
36
|
o((t = t.apply(r, e)).next());
|
|
37
37
|
});
|
|
38
|
-
import { ActiveSelection as p, util as H, controlsUtils as
|
|
39
|
-
import { create as
|
|
40
|
-
import
|
|
41
|
-
var
|
|
38
|
+
import { ActiveSelection as p, util as H, controlsUtils as ve, InteractiveFabricObject as Ae, loadSVGFromURL as Se, FabricImage as R, Point as P, Rect as Ce, Circle as Ne, Triangle as De, Group as J, Canvas as Le, Pattern as we } from "fabric";
|
|
39
|
+
import { create as Ee } from "jsondiffpatch";
|
|
40
|
+
import Oe from "diff-match-patch";
|
|
41
|
+
var Te = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict", L = function() {
|
|
42
42
|
for (var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 21, t = "", s = crypto.getRandomValues(new Uint8Array(e |= 0)); e--; )
|
|
43
|
-
t +=
|
|
43
|
+
t += Te[s[e] & 63];
|
|
44
44
|
return t;
|
|
45
45
|
};
|
|
46
|
-
class
|
|
46
|
+
class z {
|
|
47
47
|
/**
|
|
48
48
|
* Конструктор принимает редактор и опции.
|
|
49
49
|
* @param params
|
|
@@ -61,7 +61,7 @@ class R {
|
|
|
61
61
|
* @param params.options.adaptCanvasToContainerOnResize — адаптировать канвас к размерам контейнера при изменении размеров окна
|
|
62
62
|
*/
|
|
63
63
|
constructor({ editor: e, options: t = {} }) {
|
|
64
|
-
this.isDragging = !1, this.lastMouseX = 0, this.lastMouseY = 0, this.isUndoRedoKeyPressed = !1, this.isSpacePressed = !1, this.savedSelection = [], this.canvasDragging = !1, this.mouseWheelZooming = !1, this.bringToFrontOnSelection = !1, this.resetObjectFitByDoubleClick = !1, this.copyObjectsByHotkey = !1, this.pasteImageFromClipboard = !1, this.undoRedoByHotKeys = !1, this.selectAllByHotkey = !1, this.deleteObjectsByHotkey = !1, this.adaptCanvasToContainerOnResize = !1, this.editor = e, this.canvas = e.canvas, this.options = t, this.handleContainerResizeBound =
|
|
64
|
+
this.isDragging = !1, this.lastMouseX = 0, this.lastMouseY = 0, this.isUndoRedoKeyPressed = !1, this.isSpacePressed = !1, this.savedSelection = [], this.canvasDragging = !1, this.mouseWheelZooming = !1, this.bringToFrontOnSelection = !1, this.resetObjectFitByDoubleClick = !1, this.copyObjectsByHotkey = !1, this.pasteImageFromClipboard = !1, this.undoRedoByHotKeys = !1, this.selectAllByHotkey = !1, this.deleteObjectsByHotkey = !1, this.adaptCanvasToContainerOnResize = !1, this.editor = e, this.canvas = e.canvas, this.options = t, this.handleContainerResizeBound = z.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 = z.debounce(this.handleObjectModifiedHistory.bind(this), 300), this.handleObjectRotatingHistoryBound = z.debounce(this.handleObjectRotatingHistory.bind(this), 300), this.handleObjectAddedHistoryBound = this.handleObjectAddedHistory.bind(this), this.handleObjectRemovedHistoryBound = this.handleObjectRemovedHistory.bind(this), this.handleOverlayUpdateBound = this.handleOverlayUpdate.bind(this), this.handleCanvasDragStartBound = this.handleCanvasDragStart.bind(this), this.handleCanvasDraggingBound = this.handleCanvasDragging.bind(this), this.handleCanvasDragEndBound = this.handleCanvasDragEnd.bind(this), this.handleMouseWheelZoomBound = this.handleMouseWheelZoom.bind(this), this.handleBringToFrontBound = this.handleBringToFront.bind(this), this.handleResetObjectFitBound = this.handleResetObjectFit.bind(this), this.handleLockedSelectionBound = this._filterLockedSelection.bind(this), this.init();
|
|
65
65
|
}
|
|
66
66
|
/**
|
|
67
67
|
* Инициализация всех обработчиков согласно опциям.
|
|
@@ -364,7 +364,7 @@ class R {
|
|
|
364
364
|
};
|
|
365
365
|
}
|
|
366
366
|
}
|
|
367
|
-
class
|
|
367
|
+
class ke {
|
|
368
368
|
/**
|
|
369
369
|
* Класс для динамической загрузки внешних модулей.
|
|
370
370
|
*/
|
|
@@ -382,7 +382,7 @@ class Te {
|
|
|
382
382
|
return this.loaders[e] ? (this.cache.has(e) || this.cache.set(e, this.loaders[e]()), this.cache.get(e)) : Promise.reject(new Error(`Unknown module "${e}"`));
|
|
383
383
|
}
|
|
384
384
|
}
|
|
385
|
-
function
|
|
385
|
+
function xe(r) {
|
|
386
386
|
return new Worker(
|
|
387
387
|
"" + new URL("assets/worker-CN39s7P7.js", import.meta.url).href,
|
|
388
388
|
{
|
|
@@ -390,13 +390,13 @@ function ke(r) {
|
|
|
390
390
|
}
|
|
391
391
|
);
|
|
392
392
|
}
|
|
393
|
-
class
|
|
393
|
+
class Be {
|
|
394
394
|
/**
|
|
395
395
|
* @param scriptUrl — URL скрипта воркера.
|
|
396
396
|
* По-умолчанию использует DefaultWorker из соседнего файла
|
|
397
397
|
*/
|
|
398
398
|
constructor(e) {
|
|
399
|
-
e ? this.worker = new Worker(e, { type: "module" }) : this.worker = new
|
|
399
|
+
e ? this.worker = new Worker(e, { type: "module" }) : this.worker = new xe(), this._callbacks = /* @__PURE__ */ new Map(), this.worker.onmessage = this._handleMessage.bind(this);
|
|
400
400
|
}
|
|
401
401
|
/**
|
|
402
402
|
* Обработчик сообщений от воркера
|
|
@@ -436,26 +436,26 @@ class xe {
|
|
|
436
436
|
this.worker.terminate();
|
|
437
437
|
}
|
|
438
438
|
}
|
|
439
|
-
const N = 12,
|
|
439
|
+
const N = 12, Ue = 2, K = 8, q = 20, Re = 100, ee = 20, te = 8, Ze = 100, F = 32, se = 1, ze = "#2B2D33", ne = "#3D8BF4", ie = "#FFFFFF";
|
|
440
440
|
function W(r, e, t, s, n) {
|
|
441
|
-
const i = N, a =
|
|
442
|
-
r.save(), r.translate(e, t), r.rotate(H.degreesToRadians(n.angle)), r.fillStyle =
|
|
443
|
-
}
|
|
444
|
-
function ge(r, e, t, s, n) {
|
|
445
|
-
const i = J, a = K, o = Ue;
|
|
446
|
-
r.save(), r.translate(e, t), r.rotate(H.degreesToRadians(n.angle)), r.fillStyle = ne, r.strokeStyle = se, r.lineWidth = te, r.beginPath(), r.roundRect(-i / 2, -a / 2, i, a, o), r.fill(), r.stroke(), r.restore();
|
|
441
|
+
const i = N, a = Ue;
|
|
442
|
+
r.save(), r.translate(e, t), r.rotate(H.degreesToRadians(n.angle)), r.fillStyle = ie, r.strokeStyle = ne, r.lineWidth = se, r.beginPath(), r.roundRect(-i / 2, -i / 2, i, i, a), r.fill(), r.stroke(), r.restore();
|
|
447
443
|
}
|
|
448
444
|
function ue(r, e, t, s, n) {
|
|
449
|
-
const i =
|
|
450
|
-
r.save(), r.translate(e, t), r.rotate(H.degreesToRadians(n.angle)), r.fillStyle =
|
|
445
|
+
const i = K, a = q, o = Re;
|
|
446
|
+
r.save(), r.translate(e, t), r.rotate(H.degreesToRadians(n.angle)), r.fillStyle = ie, r.strokeStyle = ne, r.lineWidth = se, r.beginPath(), r.roundRect(-i / 2, -a / 2, i, a, o), r.fill(), r.stroke(), r.restore();
|
|
447
|
+
}
|
|
448
|
+
function Me(r, e, t, s, n) {
|
|
449
|
+
const i = ee, a = te, o = Ze;
|
|
450
|
+
r.save(), r.translate(e, t), r.rotate(H.degreesToRadians(n.angle)), r.fillStyle = ie, r.strokeStyle = ne, r.lineWidth = se, r.beginPath(), r.roundRect(-i / 2, -a / 2, i, a, o), r.fill(), r.stroke(), r.restore();
|
|
451
451
|
}
|
|
452
|
-
const
|
|
453
|
-
|
|
454
|
-
function
|
|
452
|
+
const He = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE4Ljc1IDQuMzc1djMuNzVhLjYyNS42MjUgMCAwIDEtLjYyNS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDEgMC0xLjI1aDIuMTRsLTIuMDc3LTEuOTAzLS4wMi0uMDE5YTYuMjUgNi4yNSAwIDEgMC0uMTMgOC45NjcuNjI2LjYyNiAwIDAgMSAuODYuOTA5QTcuNDU2IDcuNDU2IDAgMCAxIDEwIDE3LjVoLS4xMDNhNy41IDcuNSAwIDEgMSA1LjM5Ni0xMi44MTJMMTcuNSA2LjcwM1Y0LjM3NWEuNjI1LjYyNSAwIDAgMSAxLjI1IDBaIi8+PC9zdmc+", fe = new Image();
|
|
453
|
+
fe.src = He;
|
|
454
|
+
function Ye(r, e, t, s, n) {
|
|
455
455
|
const a = F / 2;
|
|
456
|
-
r.save(), r.translate(e, t), r.rotate(H.degreesToRadians(n.angle)), r.fillStyle = ze, r.beginPath(), r.arc(0, 0, a, 0, 2 * Math.PI), r.fill(), r.drawImage(
|
|
456
|
+
r.save(), r.translate(e, t), r.rotate(H.degreesToRadians(n.angle)), r.fillStyle = ze, r.beginPath(), r.arc(0, 0, a, 0, 2 * Math.PI), r.fill(), r.drawImage(fe, -a / 2, -a / 2, a, a), r.restore();
|
|
457
457
|
}
|
|
458
|
-
const
|
|
458
|
+
const _e = {
|
|
459
459
|
// Угловые точки
|
|
460
460
|
tl: {
|
|
461
461
|
render: W,
|
|
@@ -487,47 +487,47 @@ const Ye = {
|
|
|
487
487
|
},
|
|
488
488
|
// Середина вертикалей
|
|
489
489
|
ml: {
|
|
490
|
-
render:
|
|
491
|
-
sizeX:
|
|
492
|
-
sizeY:
|
|
490
|
+
render: ue,
|
|
491
|
+
sizeX: K,
|
|
492
|
+
sizeY: q,
|
|
493
493
|
offsetX: 0,
|
|
494
494
|
offsetY: 0
|
|
495
495
|
},
|
|
496
496
|
mr: {
|
|
497
|
-
render:
|
|
498
|
-
sizeX:
|
|
499
|
-
sizeY:
|
|
497
|
+
render: ue,
|
|
498
|
+
sizeX: K,
|
|
499
|
+
sizeY: q,
|
|
500
500
|
offsetX: 0,
|
|
501
501
|
offsetY: 0
|
|
502
502
|
},
|
|
503
503
|
// Середина горизонталей
|
|
504
504
|
mt: {
|
|
505
|
-
render:
|
|
506
|
-
sizeX:
|
|
507
|
-
sizeY:
|
|
505
|
+
render: Me,
|
|
506
|
+
sizeX: ee,
|
|
507
|
+
sizeY: te,
|
|
508
508
|
offsetX: 0,
|
|
509
509
|
offsetY: 0
|
|
510
510
|
},
|
|
511
511
|
mb: {
|
|
512
|
-
render:
|
|
513
|
-
sizeX:
|
|
514
|
-
sizeY:
|
|
512
|
+
render: Me,
|
|
513
|
+
sizeX: ee,
|
|
514
|
+
sizeY: te,
|
|
515
515
|
offsetX: 0,
|
|
516
516
|
offsetY: 0
|
|
517
517
|
},
|
|
518
518
|
// Специальный «rotate» контрол
|
|
519
519
|
mtr: {
|
|
520
|
-
render:
|
|
520
|
+
render: Ye,
|
|
521
521
|
sizeX: F,
|
|
522
522
|
sizeY: F,
|
|
523
523
|
offsetX: 0,
|
|
524
524
|
offsetY: -F
|
|
525
525
|
}
|
|
526
526
|
};
|
|
527
|
-
class
|
|
527
|
+
class We {
|
|
528
528
|
static apply() {
|
|
529
|
-
const e =
|
|
530
|
-
Object.entries(
|
|
529
|
+
const e = ve.createObjectDefaultControls();
|
|
530
|
+
Object.entries(_e).forEach(([t, s]) => {
|
|
531
531
|
Object.assign(e[t], {
|
|
532
532
|
render: s.render,
|
|
533
533
|
sizeX: s.sizeX,
|
|
@@ -538,10 +538,10 @@ class _e {
|
|
|
538
538
|
var l;
|
|
539
539
|
(l = a.target.canvas) == null || l.setCursor("grabbing");
|
|
540
540
|
});
|
|
541
|
-
}),
|
|
541
|
+
}), Ae.ownDefaults.controls = e;
|
|
542
542
|
}
|
|
543
543
|
}
|
|
544
|
-
const
|
|
544
|
+
const Pe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNi44NzUgMi41YS42MjUuNjI1IDAgMCAwLS42MjUuNjI0VjYuMjVIMy4xMjVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2MTBjMCAuMzQ1LjI4LjYyNS42MjUuNjI1aDEwYy4zNDUgMCAuNjI1LS4yOC42MjUtLjYyNXYtMy4xMjZoMy4xMjVjLjM0NSAwIC42MjUtLjI4LjYyNS0uNjI1di0xMGEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTEwWm02Ljg3NSAxMGgyLjVWMy43NUg3LjV2Mi41aDUuNjI1Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NS42MjRabS0xMCAzLjc1VjcuNWg4Ljc1djguNzVIMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", Fe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMi41IDcuNWMwLS42OS41Ni0xLjI1IDEuMjUtMS4yNWgxMi41Yy42OSAwIDEuMjUuNTYgMS4yNSAxLjI1djguNzVjMCAuNjktLjU2IDEuMjUtMS4yNSAxLjI1SDMuNzVjLS42OSAwLTEuMjUtLjU2LTEuMjUtMS4yNVY3LjVabTEzLjc1IDBIMy43NXY4Ljc1aDEyLjVWNy41WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTAgMS44NzVhMi4xODggMi4xODggMCAwIDAtMi4xODggMi4xODh2Mi44MTJhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyYTMuNDM3IDMuNDM3IDAgMSAxIDYuODc1IDB2Mi44MTNhLjYyNS42MjUgMCAxIDEtMS4yNSAwVjQuMDYyQTIuMTg4IDIuMTg4IDAgMCAwIDEwIDEuODc2WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTEwIDEyLjgxM2EuOTM3LjkzNyAwIDEgMCAwLTEuODc1LjkzNy45MzcgMCAwIDAgMCAxLjg3NFoiLz48L3N2Zz4=", Ve = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE2LjI1IDYuMjVINy41VjQuMzc1YTIuNSAyLjUgMCAwIDEgMi41LTIuNWMxLjIgMCAyLjI4MS44NiAyLjUxMiAyYS42MjUuNjI1IDAgMCAwIDEuMjI2LS4yNWMtLjM1NC0xLjczOC0xLjkyNS0zLTMuNzM4LTNhMy43NTQgMy43NTQgMCAwIDAtMy43NSAzLjc1VjYuMjVoLTIuNUExLjI1IDEuMjUgMCAwIDAgMi41IDcuNXY4Ljc1YTEuMjUgMS4yNSAwIDAgMCAxLjI1IDEuMjVoMTIuNWExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjcuNWExLjI1IDEuMjUgMCAwIDAtMS4yNS0xLjI1Wm0wIDEwSDMuNzVWNy41aDEyLjV2OC43NVptLTUuMzEzLTQuMzc1YS45MzcuOTM3IDAgMSAxLTEuODc0IDAgLjkzNy45MzcgMCAwIDEgMS44NzQgMFoiLz48L3N2Zz4K", Ge = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTIuNSA4LjEyNSAxMCAxMi41bDcuNS00LjM3NUwxMCAzLjc1IDIuNSA4LjEyNVoiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjY4NSAzLjIxYS42MjUuNjI1IDAgMCAxIC42MyAwbDcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOGw3LjUtNC4zNzVaTTMuNzQgOC4xMjUgMTAgMTEuNzc2bDYuMjYtMy42NTFMMTAgNC40NzQgMy43NCA4LjEyNVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA5LjQ2YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDExLjc3NmwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA5LjQ2Wm0tMS42NiAyLjQxNUwxMCAxNS41MjZsNi4yNi0zLjY1MS0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNi0xLjk3NSAxLjE1MVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", Xe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMy4yMWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDguMTI1IDEwIDExLjc3Nmw2LjI2LTMuNjUxTDEwIDQuNDc0IDMuNzQgOC4xMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjcxNCAxMCAxMCAxMi41bDQuMjg2LTIuNSAzLjIxNCAxLjg3NUwxMCAxNi4yNWwtNy41LTQuMzc1TDUuNzE0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDkuNDZhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgMTEuNzc2bDMuOTctMi4zMTZhLjYyNS42MjUgMCAwIDEgLjYzIDBsMy4yMTUgMS44NzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhMNS40IDkuNDZabS0xLjY2IDIuNDE1TDEwIDE1LjUyNmw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2LTEuOTc1IDEuMTUxWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", Qe = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0ibTIuNSA2LjI1IDcuNSA0LjM3NSA3LjUtNC4zNzVMMTAgMS44NzUgMi41IDYuMjVaIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS42ODUgMS4zMzVhLjYyNS42MjUgMCAwIDEgLjYzIDBsNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4bDcuNS00LjM3NVpNMy43NCA2LjI1IDEwIDkuOTAxbDYuMjYtMy42NTFMMTAgMi41OTkgMy43NCA2LjI1WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS40IDExLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCAxMy42NTFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgMTEuMzM1Wk0zLjc0IDEzLjc1IDEwIDE3LjQwMWw2LjI2LTMuNjUxLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTMuNzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgNy41ODVhLjYyNS42MjUgMCAwIDEgLjYzIDBMMTAgOS45MDFsMy45Ny0yLjMxNmEuNjI1LjYyNSAwIDAgMSAuNjMgMGwzLjIxNSAxLjg3NWEuNjI1LjYyNSAwIDAgMSAwIDEuMDhsLTcuNSA0LjM3NWEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtNy41LTQuMzc1YS42MjUuNjI1IDAgMCAxIDAtMS4wOEw1LjQgNy41ODVaTTMuNzQgMTAgMTAgMTMuNjUxIDE2LjI2IDEwbC0xLjk3NC0xLjE1MS0zLjk3MSAyLjMxNmEuNjI1LjYyNSAwIDAgMS0uNjMgMGwtMy45Ny0yLjMxNkwzLjc0IDEwWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+", $e = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMS45NiAxMy40MzVhLjYyNS42MjUgMCAwIDEgLjg1NS0uMjI1TDEwIDE3LjQwMWw3LjE4NS00LjE5YS42MjUuNjI1IDAgMCAxIC42MyAxLjA3OWwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEtLjIyNS0uODU1Wk05LjY4NSAxLjMzNWEuNjI1LjYyNSAwIDAgMSAuNjMgMGw3LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEgMCAxLjA4bC03LjUgNC4zNzVhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTcuNS00LjM3NWEuNjI1LjYyNSAwIDAgMSAwLTEuMDhsNy41LTQuMzc1Wk0zLjc0IDYuMjUgMTAgOS45MDFsNi4yNi0zLjY1MUwxMCAyLjU5OSAzLjc0IDYuMjVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Im01LjcxNCAxMS44NzUgNC4yODYgMi41IDQuMjg2LTIuNUwxNy41IDEzLjc1IDEwIDE4LjEyNSAyLjUgMTMuNzVsMy4yMTQtMS44NzVaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQgMTEuMzM1YS42MjUuNjI1IDAgMCAxIC42MyAwTDEwIDEzLjY1MWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCAxMS4zMzVaTTMuNzQgMTMuNzUgMTAgMTcuNDAxbDYuMjYtMy42NTEtMS45NzQtMS4xNTEtMy45NzEgMi4zMTZhLjYyNS42MjUgMCAwIDEtLjYzIDBsLTMuOTctMi4zMTZMMy43NCAxMy43NVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNCA3LjU4NWEuNjI1LjYyNSAwIDAgMSAuNjMgMEwxMCA5LjkwMWwzLjk3LTIuMzE2YS42MjUuNjI1IDAgMCAxIC42MyAwbDMuMjE1IDEuODc1YS42MjUuNjI1IDAgMCAxIDAgMS4wOGwtNy41IDQuMzc1YS42MjUuNjI1IDAgMCAxLS42MyAwbC03LjUtNC4zNzVhLjYyNS42MjUgMCAwIDEgMC0xLjA4TDUuNCA3LjU4NVpNMy43NCAxMCAxMCAxMy42NTEgMTYuMjYgMTBsLTEuOTc0LTEuMTUxLTMuOTcxIDIuMzE2YS42MjUuNjI1IDAgMCAxLS42MyAwbC0zLjk3LTIuMzE2TDMuNzQgMTBaIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=", Je = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iI0VDNEU0MCIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOC4xMjUgMS4yNUExLjg3NSAxLjg3NSAwIDAgMCA2LjI1IDMuMTI1di42MjVIMy4xMjVhLjYyNS42MjUgMCAwIDAgMCAxLjI1aC42MjV2MTEuMjVBMS4yNSAxLjI1IDAgMCAwIDUgMTcuNWgxMGExLjI1IDEuMjUgMCAwIDAgMS4yNS0xLjI1VjVoLjYyNWEuNjI1LjYyNSAwIDAgMCAwLTEuMjVIMTMuNzV2LS42MjVhMS44NzUgMS44NzUgMCAwIDAtMS44NzUtMS44NzVoLTMuNzVabTQuMzc1IDIuNXYtLjYyNWEuNjI1LjYyNSAwIDAgMC0uNjI1LS42MjVoLTMuNzVhLjYyNS42MjUgMCAwIDAtLjYyNS42MjV2LjYyNWg1Wk01IDE2LjI1VjVoMTB2MTEuMjVINVpNOC4xMjUgNy41Yy4zNDUgMCAuNjI1LjI4LjYyNS42MjV2NWEuNjI1LjYyNSAwIDEgMS0xLjI1IDB2LTVjMC0uMzQ1LjI4LS42MjUuNjI1LS42MjVabTQuMzc1IDUuNjI1di01YS42MjUuNjI1IDAgMCAwLTEuMjUgMHY1YS42MjUuNjI1IDAgMSAwIDEuMjUgMFoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==", Z = {
|
|
545
545
|
style: {
|
|
546
546
|
position: "absolute",
|
|
547
547
|
display: "none",
|
|
@@ -608,14 +608,14 @@ const We = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMj
|
|
|
608
608
|
],
|
|
609
609
|
offsetTop: 50,
|
|
610
610
|
icons: {
|
|
611
|
-
copyPaste:
|
|
612
|
-
delete:
|
|
613
|
-
lock:
|
|
614
|
-
unlock:
|
|
615
|
-
bringToFront:
|
|
616
|
-
sendToBack:
|
|
617
|
-
bringForward:
|
|
618
|
-
sendBackwards:
|
|
611
|
+
copyPaste: Pe,
|
|
612
|
+
delete: Je,
|
|
613
|
+
lock: Fe,
|
|
614
|
+
unlock: Ve,
|
|
615
|
+
bringToFront: Qe,
|
|
616
|
+
sendToBack: $e,
|
|
617
|
+
bringForward: Ge,
|
|
618
|
+
sendBackwards: Xe
|
|
619
619
|
},
|
|
620
620
|
handlers: {
|
|
621
621
|
copyPaste: (r) => v(null, null, function* () {
|
|
@@ -646,18 +646,18 @@ const We = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMj
|
|
|
646
646
|
}
|
|
647
647
|
}
|
|
648
648
|
};
|
|
649
|
-
class
|
|
649
|
+
class Ke {
|
|
650
650
|
constructor({ editor: e }) {
|
|
651
651
|
this.currentTarget = null, this.currentLocked = !1, this.isTransforming = !1, this.editor = e, this.canvas = e.canvas, this.options = e.options, this._initToolbar();
|
|
652
652
|
}
|
|
653
653
|
_initToolbar() {
|
|
654
654
|
if (!this.options.showToolbar) return;
|
|
655
655
|
const e = this.options.toolbar || {};
|
|
656
|
-
this.config =
|
|
657
|
-
style: y(y({},
|
|
658
|
-
btnStyle: y(y({},
|
|
659
|
-
icons: y(y({},
|
|
660
|
-
handlers: y(y({},
|
|
656
|
+
this.config = ge(y(y({}, Z), e), {
|
|
657
|
+
style: y(y({}, Z.style), e.style || {}),
|
|
658
|
+
btnStyle: y(y({}, Z.btnStyle), e.btnStyle || {}),
|
|
659
|
+
icons: y(y({}, Z.icons), e.icons || {}),
|
|
660
|
+
handlers: y(y({}, Z.handlers), e.handlers || {})
|
|
661
661
|
}), this.currentTarget = null, this.currentLocked = !1, this.isTransforming = !1, this._onMouseDown = this._handleMouseDown.bind(this), this._onObjectMoving = this._startTransform.bind(this), this._onObjectScaling = this._startTransform.bind(this), this._onObjectRotating = this._startTransform.bind(this), this._onMouseUp = this._endTransform.bind(this), this._onObjectModified = this._endTransform.bind(this), this._onSelectionChange = this._updateToolbar.bind(this), this._onSelectionClear = () => {
|
|
662
662
|
this.el.style.display = "none";
|
|
663
663
|
}, this._createDOM(), this._bindEvents();
|
|
@@ -762,7 +762,7 @@ class Je {
|
|
|
762
762
|
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();
|
|
763
763
|
}
|
|
764
764
|
}
|
|
765
|
-
class
|
|
765
|
+
class qe {
|
|
766
766
|
constructor({ editor: e }) {
|
|
767
767
|
this.editor = e, this.canvas = e.canvas, this._historySuspendCount = 0, this.baseState = null, this.patches = [], this.currentIndex = 0, this.maxHistoryLength = e.options.maxHistoryLength, this.totalChangesCount = 0, this.baseStateChangesCount = 0, this._createDiffPatcher();
|
|
768
768
|
}
|
|
@@ -774,7 +774,7 @@ class Ke {
|
|
|
774
774
|
return this.patches[this.currentIndex - 1] || null;
|
|
775
775
|
}
|
|
776
776
|
_createDiffPatcher() {
|
|
777
|
-
this.diffPatcher =
|
|
777
|
+
this.diffPatcher = Ee({
|
|
778
778
|
objectHash(e) {
|
|
779
779
|
const t = e;
|
|
780
780
|
return [
|
|
@@ -798,7 +798,7 @@ class Ke {
|
|
|
798
798
|
includeValueOnMove: !1
|
|
799
799
|
},
|
|
800
800
|
textDiff: {
|
|
801
|
-
diffMatchPatch:
|
|
801
|
+
diffMatchPatch: Oe,
|
|
802
802
|
minLength: 60
|
|
803
803
|
}
|
|
804
804
|
});
|
|
@@ -965,7 +965,7 @@ class Ke {
|
|
|
965
965
|
});
|
|
966
966
|
}
|
|
967
967
|
}
|
|
968
|
-
const
|
|
968
|
+
const et = 0.1, tt = 2, st = 0.1, nt = 90, B = 16, U = 16, O = 4096, T = 4096, $ = "application/image-editor:";
|
|
969
969
|
class D {
|
|
970
970
|
constructor({ editor: e }) {
|
|
971
971
|
this.editor = e, this.options = e.options, this._createdBlobUrls = [], this.acceptContentTypes = this.editor.options.acceptContentTypes, this.acceptFormats = this.getAllowedFormatsFromContentTypes();
|
|
@@ -1018,20 +1018,20 @@ class D {
|
|
|
1018
1018
|
data: { source: t, format: h, contentType: l, acceptContentTypes: g, acceptFormats: u }
|
|
1019
1019
|
}), null;
|
|
1020
1020
|
if (this._createdBlobUrls.push(m), h === "svg") {
|
|
1021
|
-
const b = yield
|
|
1021
|
+
const b = yield Se(m);
|
|
1022
1022
|
M = H.groupSVGElements(b.objects, b.options);
|
|
1023
1023
|
} else
|
|
1024
|
-
M = yield
|
|
1024
|
+
M = yield R.fromURL(m, { crossOrigin: "anonymous" });
|
|
1025
1025
|
const { width: f, height: j } = M;
|
|
1026
|
-
if (M instanceof
|
|
1026
|
+
if (M instanceof R) {
|
|
1027
1027
|
const b = M.getElement();
|
|
1028
1028
|
let S = "";
|
|
1029
1029
|
if (b instanceof HTMLImageElement ? S = b.src : b instanceof HTMLCanvasElement && (S = b.toDataURL()), j > T || f > O) {
|
|
1030
1030
|
const w = yield this.resizeImageToBoundaries(S, "max"), E = URL.createObjectURL(w);
|
|
1031
|
-
this._createdBlobUrls.push(E), M = yield
|
|
1031
|
+
this._createdBlobUrls.push(E), M = yield R.fromURL(E, { crossOrigin: "anonymous" });
|
|
1032
1032
|
} else if (j < U || f < B) {
|
|
1033
1033
|
const w = yield this.resizeImageToBoundaries(S, "min"), E = URL.createObjectURL(w);
|
|
1034
|
-
this._createdBlobUrls.push(E), M = yield
|
|
1034
|
+
this._createdBlobUrls.push(E), M = yield R.fromURL(E, { crossOrigin: "anonymous" });
|
|
1035
1035
|
}
|
|
1036
1036
|
}
|
|
1037
1037
|
if (M.set("id", `${M.type}-${L()}`), M.set("format", h), s === "scale-montage")
|
|
@@ -1113,7 +1113,7 @@ class D {
|
|
|
1113
1113
|
const c = s === "application/pdf", l = c ? "image/jpg" : s, h = D.getFormatFromContentType(l);
|
|
1114
1114
|
o.setCoords();
|
|
1115
1115
|
const { left: g, top: u, width: m, height: M } = o.getBoundingRect(), f = yield a.clone(["id", "format", "locked"]);
|
|
1116
|
-
["image/jpg", "image/jpeg"].includes(l) && (f.backgroundColor = "#ffffff");
|
|
1116
|
+
f.enableRetinaScaling = !1, ["image/jpg", "image/jpeg"].includes(l) && (f.backgroundColor = "#ffffff");
|
|
1117
1117
|
const j = f.getObjects().find((I) => I.id === o.id);
|
|
1118
1118
|
j && (j.visible = !1), f.viewportTransform = [1, 0, 0, 1, -g, -u], f.setDimensions({ width: m, height: M }, { backstoreOnly: !0 }), f.renderAll();
|
|
1119
1119
|
const A = f.getObjects().filter((I) => I.format).every((I) => I.format === "svg");
|
|
@@ -1152,27 +1152,27 @@ class D {
|
|
|
1152
1152
|
[S]
|
|
1153
1153
|
);
|
|
1154
1154
|
if (c) {
|
|
1155
|
-
const k = m * 0.264583, C = M * 0.264583,
|
|
1155
|
+
const k = m * 0.264583, C = M * 0.264583, je = (yield this.editor.moduleLoader.loadModule("jspdf")).jsPDF, Q = new je({
|
|
1156
1156
|
orientation: k > C ? "landscape" : "portrait",
|
|
1157
1157
|
unit: "mm",
|
|
1158
1158
|
format: [k, C]
|
|
1159
1159
|
});
|
|
1160
1160
|
if (Q.addImage(String(w), "JPG", 0, 0, k, C), n) {
|
|
1161
|
-
const
|
|
1161
|
+
const ce = {
|
|
1162
1162
|
image: Q.output("datauristring"),
|
|
1163
1163
|
format: "pdf",
|
|
1164
1164
|
contentType: "application/pdf",
|
|
1165
1165
|
fileName: t
|
|
1166
1166
|
};
|
|
1167
|
-
return a.fire("editor:canvas-exported",
|
|
1167
|
+
return a.fire("editor:canvas-exported", ce), ce;
|
|
1168
1168
|
}
|
|
1169
|
-
const
|
|
1170
|
-
image: new File([
|
|
1169
|
+
const be = Q.output("blob"), re = {
|
|
1170
|
+
image: new File([be], t, { type: "application/pdf" }),
|
|
1171
1171
|
format: "pdf",
|
|
1172
1172
|
contentType: "application/pdf",
|
|
1173
1173
|
fileName: t
|
|
1174
1174
|
};
|
|
1175
|
-
return a.fire("editor:canvas-exported",
|
|
1175
|
+
return a.fire("editor:canvas-exported", re), re;
|
|
1176
1176
|
}
|
|
1177
1177
|
if (n) {
|
|
1178
1178
|
const I = {
|
|
@@ -1183,13 +1183,13 @@ class D {
|
|
|
1183
1183
|
};
|
|
1184
1184
|
return a.fire("editor:canvas-exported", I), I;
|
|
1185
1185
|
}
|
|
1186
|
-
const E = h === "svg" && !A ? t.replace(/\.[^/.]+$/, ".png") : t,
|
|
1186
|
+
const E = h === "svg" && !A ? t.replace(/\.[^/.]+$/, ".png") : t, oe = {
|
|
1187
1187
|
image: new File([b], E, { type: l }),
|
|
1188
1188
|
format: h,
|
|
1189
1189
|
contentType: l,
|
|
1190
1190
|
fileName: E
|
|
1191
1191
|
};
|
|
1192
|
-
return a.fire("editor:canvas-exported",
|
|
1192
|
+
return a.fire("editor:canvas-exported", oe), oe;
|
|
1193
1193
|
} catch (c) {
|
|
1194
1194
|
return this.editor.errorManager.emitError({
|
|
1195
1195
|
origin: "ImageManager",
|
|
@@ -1245,7 +1245,7 @@ class D {
|
|
|
1245
1245
|
};
|
|
1246
1246
|
return o.fire("editor:object-exported", j), j;
|
|
1247
1247
|
}
|
|
1248
|
-
if (i && c instanceof
|
|
1248
|
+
if (i && c instanceof R) {
|
|
1249
1249
|
const M = yield createImageBitmap(c.getElement()), f = yield d.post(
|
|
1250
1250
|
"toDataURL",
|
|
1251
1251
|
{
|
|
@@ -1263,7 +1263,9 @@ class D {
|
|
|
1263
1263
|
};
|
|
1264
1264
|
return o.fire("editor:object-exported", j), j;
|
|
1265
1265
|
}
|
|
1266
|
-
const h = c.toCanvasElement(
|
|
1266
|
+
const h = c.toCanvasElement({
|
|
1267
|
+
enableRetinaScaling: !1
|
|
1268
|
+
}), g = yield new Promise((M, f) => {
|
|
1267
1269
|
h.toBlob((j) => {
|
|
1268
1270
|
j ? M(j) : f(new Error("Failed to create Blob from canvas"));
|
|
1269
1271
|
});
|
|
@@ -1414,11 +1416,11 @@ class D {
|
|
|
1414
1416
|
return t ? t[1] : "";
|
|
1415
1417
|
}
|
|
1416
1418
|
}
|
|
1417
|
-
const x = (r, e, t) => Math.max(Math.min(r, t), e),
|
|
1418
|
-
function
|
|
1419
|
+
const x = (r, e, t) => Math.max(Math.min(r, t), e), me = (r, e) => r * e, it = (r, e) => new P(r / 2, e / 2);
|
|
1420
|
+
function at(r) {
|
|
1419
1421
|
return ((r == null ? void 0 : r.type) === "image" || (r == null ? void 0 : r.format) === "svg") && typeof (r == null ? void 0 : r.width) == "number" && typeof (r == null ? void 0 : r.height) == "number";
|
|
1420
1422
|
}
|
|
1421
|
-
class
|
|
1423
|
+
class ot {
|
|
1422
1424
|
/**
|
|
1423
1425
|
* @param options
|
|
1424
1426
|
* @param options.editor – экземпляр редактора
|
|
@@ -1451,7 +1453,7 @@ class at {
|
|
|
1451
1453
|
options: { canvasBackstoreWidth: o }
|
|
1452
1454
|
} = this.editor, { width: d, height: c } = a, l = x(Number(e), B, O);
|
|
1453
1455
|
if (!o || o === "auto" || n ? this.adaptCanvasToContainer() : o ? this.setCanvasBackstoreWidth(Number(o)) : this.setCanvasBackstoreWidth(l), a.set({ width: l }), (m = i.clipPath) == null || m.set({ width: l }), t) {
|
|
1454
|
-
const M = l / d, f =
|
|
1456
|
+
const M = l / d, f = me(c, M);
|
|
1455
1457
|
this.setResolutionHeight(f);
|
|
1456
1458
|
return;
|
|
1457
1459
|
}
|
|
@@ -1481,7 +1483,7 @@ class at {
|
|
|
1481
1483
|
options: { canvasBackstoreHeight: o }
|
|
1482
1484
|
} = this.editor, { width: d, height: c } = a, l = x(Number(e), U, T);
|
|
1483
1485
|
if (!o || o === "auto" || n ? this.adaptCanvasToContainer() : o ? this.setCanvasBackstoreHeight(Number(o)) : this.setCanvasBackstoreHeight(l), a.set({ height: l }), (m = i.clipPath) == null || m.set({ height: l }), t) {
|
|
1484
|
-
const M = l / c, f =
|
|
1486
|
+
const M = l / c, f = me(d, M);
|
|
1485
1487
|
this.setResolutionWidth(f);
|
|
1486
1488
|
return;
|
|
1487
1489
|
}
|
|
@@ -1499,7 +1501,7 @@ class at {
|
|
|
1499
1501
|
*/
|
|
1500
1502
|
centerMontageArea() {
|
|
1501
1503
|
var d;
|
|
1502
|
-
const { canvas: e, montageArea: t } = this.editor, s = e.getWidth(), n = e.getHeight(), i = e.getZoom(), a =
|
|
1504
|
+
const { canvas: e, montageArea: t } = this.editor, s = e.getWidth(), n = e.getHeight(), i = e.getZoom(), a = it(s, n);
|
|
1503
1505
|
t.set({
|
|
1504
1506
|
left: s / 2,
|
|
1505
1507
|
top: n / 2
|
|
@@ -1750,7 +1752,7 @@ class at {
|
|
|
1750
1752
|
montageAreaHeight: d
|
|
1751
1753
|
}
|
|
1752
1754
|
} = this.editor, c = e || n.getActiveObject();
|
|
1753
|
-
if (!
|
|
1755
|
+
if (!at(c)) return;
|
|
1754
1756
|
const { width: l, height: h } = c;
|
|
1755
1757
|
let g = Math.min(l, O), u = Math.min(h, T);
|
|
1756
1758
|
if (t) {
|
|
@@ -1803,9 +1805,9 @@ class at {
|
|
|
1803
1805
|
return e.getObjects().filter((i) => i.id !== t.id && i.id !== (s == null ? void 0 : s.id));
|
|
1804
1806
|
}
|
|
1805
1807
|
}
|
|
1806
|
-
class
|
|
1808
|
+
class rt {
|
|
1807
1809
|
constructor({ editor: e }) {
|
|
1808
|
-
this.editor = e, this.options = e.options, this.minZoom = this.options.minZoom ||
|
|
1810
|
+
this.editor = e, this.options = e.options, this.minZoom = this.options.minZoom || et, this.maxZoom = this.options.maxZoom || tt, this.defaultZoom = this.options.defaultScale, this.maxZoomFactor = this.options.maxZoomFactor;
|
|
1809
1811
|
}
|
|
1810
1812
|
/**
|
|
1811
1813
|
* Метод рассчитывает и применяет зум по умолчанию для монтажной области редактора.
|
|
@@ -1827,7 +1829,7 @@ class ot {
|
|
|
1827
1829
|
* @fires editor:zoom-changed
|
|
1828
1830
|
* Если передавать координаты курсора, то нужно быть аккуратнее, так как юзер может выйти за пределы рабочей области
|
|
1829
1831
|
*/
|
|
1830
|
-
zoom(e =
|
|
1832
|
+
zoom(e = st, t = {}) {
|
|
1831
1833
|
var g, u;
|
|
1832
1834
|
if (!e) return;
|
|
1833
1835
|
const { minZoom: s, maxZoom: n } = this, { canvas: i } = this.editor, a = i.getZoom(), o = i.getCenterPoint(), d = (g = t.pointX) != null ? g : o.x, c = (u = t.pointY) != null ? u : o.y, l = new P(d, c);
|
|
@@ -1870,7 +1872,7 @@ class ot {
|
|
|
1870
1872
|
* @param options.withoutSave - Не сохранять состояние
|
|
1871
1873
|
* @fires editor:object-rotated
|
|
1872
1874
|
*/
|
|
1873
|
-
rotate(e =
|
|
1875
|
+
rotate(e = nt, { withoutSave: t } = {}) {
|
|
1874
1876
|
const { canvas: s, historyManager: n } = this.editor, i = s.getActiveObject();
|
|
1875
1877
|
if (!i) return;
|
|
1876
1878
|
const a = i.angle + e;
|
|
@@ -2025,7 +2027,7 @@ class ot {
|
|
|
2025
2027
|
});
|
|
2026
2028
|
}
|
|
2027
2029
|
}
|
|
2028
|
-
class
|
|
2030
|
+
class ct {
|
|
2029
2031
|
constructor({ editor: e }) {
|
|
2030
2032
|
this.editor = e, this.isBlocked = !1, this.overlayMask = null, this._createOverlay();
|
|
2031
2033
|
}
|
|
@@ -2208,7 +2210,7 @@ class V {
|
|
|
2208
2210
|
});
|
|
2209
2211
|
}
|
|
2210
2212
|
}
|
|
2211
|
-
class
|
|
2213
|
+
class dt {
|
|
2212
2214
|
/**
|
|
2213
2215
|
* Менеджер фигур для редактора.
|
|
2214
2216
|
* @param options - Опции и настройки менеджера фигур.
|
|
@@ -2248,7 +2250,7 @@ class ct {
|
|
|
2248
2250
|
"height",
|
|
2249
2251
|
"fill"
|
|
2250
2252
|
]);
|
|
2251
|
-
const { canvas: g } = this.editor, u = new
|
|
2253
|
+
const { canvas: g } = this.editor, u = new Ce(y({
|
|
2252
2254
|
id: e,
|
|
2253
2255
|
left: t,
|
|
2254
2256
|
top: s,
|
|
@@ -2288,7 +2290,7 @@ class ct {
|
|
|
2288
2290
|
"radius",
|
|
2289
2291
|
"fill"
|
|
2290
2292
|
]);
|
|
2291
|
-
const { canvas: h } = this.editor, g = new
|
|
2293
|
+
const { canvas: h } = this.editor, g = new Ne(y({
|
|
2292
2294
|
id: e,
|
|
2293
2295
|
left: t,
|
|
2294
2296
|
top: s,
|
|
@@ -2330,7 +2332,7 @@ class ct {
|
|
|
2330
2332
|
"height",
|
|
2331
2333
|
"fill"
|
|
2332
2334
|
]);
|
|
2333
|
-
const { canvas: g } = this.editor, u = new
|
|
2335
|
+
const { canvas: g } = this.editor, u = new De(y({
|
|
2334
2336
|
id: e,
|
|
2335
2337
|
left: t,
|
|
2336
2338
|
top: s,
|
|
@@ -2341,7 +2343,7 @@ class ct {
|
|
|
2341
2343
|
return !t && !s && g.centerObject(u), c || (g.add(u), d || g.setActiveObject(u), g.renderAll()), u;
|
|
2342
2344
|
}
|
|
2343
2345
|
}
|
|
2344
|
-
class
|
|
2346
|
+
class lt {
|
|
2345
2347
|
/**
|
|
2346
2348
|
* @param options
|
|
2347
2349
|
* @param options.editor - экземпляр редактора с доступом к canvas
|
|
@@ -2381,7 +2383,7 @@ class dt {
|
|
|
2381
2383
|
return;
|
|
2382
2384
|
}
|
|
2383
2385
|
if (s.type !== "image") {
|
|
2384
|
-
const g =
|
|
2386
|
+
const g = `${$}${JSON.stringify(s.toObject(["format"]))}`;
|
|
2385
2387
|
navigator.clipboard.writeText(g).catch((u) => {
|
|
2386
2388
|
t.emitWarning({
|
|
2387
2389
|
origin: "ClipboardManager",
|
|
@@ -2393,16 +2395,23 @@ class dt {
|
|
|
2393
2395
|
});
|
|
2394
2396
|
return;
|
|
2395
2397
|
}
|
|
2396
|
-
const i = s.toCanvasElement(
|
|
2398
|
+
const i = s.toCanvasElement({
|
|
2399
|
+
enableRetinaScaling: !1
|
|
2400
|
+
}).toDataURL(), a = i.slice(5).split(";")[0], o = i.split(",")[1], d = atob(o), c = new Uint8Array(d.length);
|
|
2397
2401
|
for (let g = 0; g < d.length; g += 1)
|
|
2398
2402
|
c[g] = d.charCodeAt(g);
|
|
2399
2403
|
const l = new Blob([c.buffer], { type: a }), h = new ClipboardItem({ [a]: l });
|
|
2400
2404
|
navigator.clipboard.write([h]).catch((g) => {
|
|
2401
|
-
|
|
2402
|
-
|
|
2403
|
-
|
|
2404
|
-
|
|
2405
|
-
|
|
2405
|
+
const u = `${$}${JSON.stringify(s.toObject(["format"]))}`;
|
|
2406
|
+
navigator.clipboard.writeText(u).catch((m) => {
|
|
2407
|
+
t.emitError({
|
|
2408
|
+
origin: "ClipboardManager",
|
|
2409
|
+
method: "copy",
|
|
2410
|
+
code: "CLIPBOARD_WRITE_IMAGE_FAILED",
|
|
2411
|
+
// eslint-disable-next-line max-len
|
|
2412
|
+
message: `Ошибка записи изображения в буфер обмена: ${g.message}. Fallback также не удался: ${m.message}`,
|
|
2413
|
+
data: { originalError: g, fallbackError: m }
|
|
2414
|
+
});
|
|
2406
2415
|
});
|
|
2407
2416
|
});
|
|
2408
2417
|
});
|
|
@@ -2415,28 +2424,29 @@ class dt {
|
|
|
2415
2424
|
*/
|
|
2416
2425
|
handlePasteEvent(t) {
|
|
2417
2426
|
return v(this, arguments, function* ({ clipboardData: e }) {
|
|
2418
|
-
var
|
|
2419
|
-
if (!((
|
|
2427
|
+
var c;
|
|
2428
|
+
if (!((c = e == null ? void 0 : e.items) != null && c.length)) {
|
|
2429
|
+
this.paste();
|
|
2430
|
+
return;
|
|
2431
|
+
}
|
|
2420
2432
|
const s = e.getData("text/plain");
|
|
2421
|
-
if (s && s.startsWith(
|
|
2433
|
+
if (s && s.startsWith($)) {
|
|
2422
2434
|
this.paste();
|
|
2423
2435
|
return;
|
|
2424
2436
|
}
|
|
2425
|
-
const { imageManager: n } = this.editor, { items: i } = e, a = i[i.length - 1];
|
|
2426
|
-
if (a.type !== "text/html") {
|
|
2427
|
-
const c = a.getAsFile();
|
|
2428
|
-
if (!c) return;
|
|
2437
|
+
const { imageManager: n } = this.editor, { items: i } = e, a = i[i.length - 1], o = a.getAsFile();
|
|
2438
|
+
if (a.type !== "text/html" && o) {
|
|
2429
2439
|
const l = new FileReader();
|
|
2430
2440
|
l.onload = (h) => {
|
|
2431
2441
|
h.target && this.editor.imageManager.importImage({ source: h.target.result });
|
|
2432
|
-
}, l.readAsDataURL(
|
|
2442
|
+
}, l.readAsDataURL(o);
|
|
2433
2443
|
return;
|
|
2434
2444
|
}
|
|
2435
|
-
const
|
|
2436
|
-
if (
|
|
2437
|
-
const
|
|
2438
|
-
if (
|
|
2439
|
-
n.importImage({ source:
|
|
2445
|
+
const d = e.getData("text/html");
|
|
2446
|
+
if (d) {
|
|
2447
|
+
const g = new DOMParser().parseFromString(d, "text/html").querySelector("img");
|
|
2448
|
+
if (g != null && g.src) {
|
|
2449
|
+
n.importImage({ source: g.src });
|
|
2440
2450
|
return;
|
|
2441
2451
|
}
|
|
2442
2452
|
}
|
|
@@ -2524,10 +2534,10 @@ class G {
|
|
|
2524
2534
|
});
|
|
2525
2535
|
}
|
|
2526
2536
|
static _isGroupOrSelection(e) {
|
|
2527
|
-
return e instanceof p || e instanceof
|
|
2537
|
+
return e instanceof p || e instanceof J;
|
|
2528
2538
|
}
|
|
2529
2539
|
}
|
|
2530
|
-
class
|
|
2540
|
+
class ht {
|
|
2531
2541
|
constructor({ editor: e }) {
|
|
2532
2542
|
this.editor = e;
|
|
2533
2543
|
}
|
|
@@ -2546,7 +2556,7 @@ class lt {
|
|
|
2546
2556
|
n.suspendHistory();
|
|
2547
2557
|
const i = e || s.getActiveObject();
|
|
2548
2558
|
if (!i || !(i instanceof p)) return;
|
|
2549
|
-
const a = i.getObjects(), o = new
|
|
2559
|
+
const a = i.getObjects(), o = new J(a);
|
|
2550
2560
|
a.forEach((d) => s.remove(d)), o.set("id", `${o.type}-${L()}`), s.add(o), s.setActiveObject(o), s.renderAll(), n.resumeHistory(), t || n.saveState(), s.fire("editor:objects-grouped", {
|
|
2551
2561
|
object: i,
|
|
2552
2562
|
group: o,
|
|
@@ -2567,7 +2577,7 @@ class lt {
|
|
|
2567
2577
|
const { canvas: s, historyManager: n } = this.editor;
|
|
2568
2578
|
n.suspendHistory();
|
|
2569
2579
|
const i = e || s.getActiveObject();
|
|
2570
|
-
if (!(i instanceof
|
|
2580
|
+
if (!(i instanceof J)) return;
|
|
2571
2581
|
const a = i.removeAll();
|
|
2572
2582
|
s.remove(i), a.forEach((d) => s.add(d));
|
|
2573
2583
|
const o = new p(a, {
|
|
@@ -2580,7 +2590,7 @@ class lt {
|
|
|
2580
2590
|
});
|
|
2581
2591
|
}
|
|
2582
2592
|
}
|
|
2583
|
-
class
|
|
2593
|
+
class gt {
|
|
2584
2594
|
constructor({ editor: e }) {
|
|
2585
2595
|
this.editor = e;
|
|
2586
2596
|
}
|
|
@@ -2595,7 +2605,7 @@ class ht {
|
|
|
2595
2605
|
i && s.lockObject({ object: a, skipInnerObjects: !0, withoutSave: !0 }), e.setActiveObject(a), e.requestRenderAll(), e.fire("editor:all-objects-selected", { selected: a });
|
|
2596
2606
|
}
|
|
2597
2607
|
}
|
|
2598
|
-
class
|
|
2608
|
+
class ut {
|
|
2599
2609
|
constructor({ editor: e }) {
|
|
2600
2610
|
this.editor = e;
|
|
2601
2611
|
}
|
|
@@ -2623,7 +2633,7 @@ class gt {
|
|
|
2623
2633
|
}));
|
|
2624
2634
|
}
|
|
2625
2635
|
}
|
|
2626
|
-
const
|
|
2636
|
+
const Mt = {
|
|
2627
2637
|
IMAGE_MANAGER: {
|
|
2628
2638
|
/**
|
|
2629
2639
|
* Некорректный Content-Type изображения
|
|
@@ -2764,10 +2774,10 @@ class X {
|
|
|
2764
2774
|
* @returns true, если код допустим, иначе false
|
|
2765
2775
|
*/
|
|
2766
2776
|
static isValidErrorCode(e) {
|
|
2767
|
-
return e ? Object.values(
|
|
2777
|
+
return e ? Object.values(Mt).some((t) => Object.values(t).includes(e)) : !1;
|
|
2768
2778
|
}
|
|
2769
2779
|
}
|
|
2770
|
-
class
|
|
2780
|
+
class ae {
|
|
2771
2781
|
/**
|
|
2772
2782
|
* Конструктор класса ImageEditor.
|
|
2773
2783
|
* @param canvasId - идентификатор канваса, в котором будет создан редактор
|
|
@@ -2795,7 +2805,7 @@ class ie {
|
|
|
2795
2805
|
scaleType: c,
|
|
2796
2806
|
_onReadyCallback: l
|
|
2797
2807
|
} = this.options;
|
|
2798
|
-
if (
|
|
2808
|
+
if (We.apply(), this.canvas = new Le(this.containerId, this.options), this.moduleLoader = new ke(), this.workerManager = new Be(), this.errorManager = new X({ editor: this }), this.historyManager = new qe({ editor: this }), this.toolbar = new Ke({ editor: this }), this.transformManager = new rt({ editor: this }), this.canvasManager = new ot({ editor: this }), this.imageManager = new D({ editor: this }), this.layerManager = new V({ editor: this }), this.shapeManager = new dt({ editor: this }), this.interactionBlocker = new ct({ editor: this }), this.clipboardManager = new lt({ editor: this }), this.objectLockManager = new G({ editor: this }), this.groupingManager = new ht({ editor: this }), this.selectionManager = new gt({ editor: this }), this.deletionManager = new ut({ editor: this }), this._createMontageArea(), this._createClippingArea(), this.listeners = new z({ editor: this, options: this.options }), this.canvasManager.setEditorContainerWidth(e), this.canvasManager.setEditorContainerHeight(t), this.canvasManager.setCanvasWrapperWidth(s), this.canvasManager.setCanvasWrapperHeight(n), this.canvasManager.setCanvasCSSWidth(i), this.canvasManager.setCanvasCSSHeight(a), o != null && o.source) {
|
|
2799
2809
|
const {
|
|
2800
2810
|
source: h,
|
|
2801
2811
|
scale: g = `image-${c}`,
|
|
@@ -2818,7 +2828,7 @@ class ie {
|
|
|
2818
2828
|
this.montageArea = this.shapeManager.addRectangle({
|
|
2819
2829
|
width: e,
|
|
2820
2830
|
height: t,
|
|
2821
|
-
fill:
|
|
2831
|
+
fill: ae._createMosaicPattern(),
|
|
2822
2832
|
stroke: null,
|
|
2823
2833
|
strokeWidth: 0,
|
|
2824
2834
|
selectable: !1,
|
|
@@ -2868,19 +2878,20 @@ class ie {
|
|
|
2868
2878
|
const e = document.createElement("canvas");
|
|
2869
2879
|
e.width = 20, e.height = 20;
|
|
2870
2880
|
const t = e.getContext("2d");
|
|
2871
|
-
return t.fillStyle = "#ddd", t.fillRect(0, 0, 40, 40), t.fillStyle = "#ccc", t.fillRect(0, 0, 10, 10), t.fillRect(10, 10, 10, 10), new
|
|
2881
|
+
return t.fillStyle = "#ddd", t.fillRect(0, 0, 40, 40), t.fillStyle = "#ccc", t.fillRect(0, 0, 10, 10), t.fillRect(10, 10, 10, 10), new we({
|
|
2872
2882
|
source: e,
|
|
2873
2883
|
repeat: "repeat"
|
|
2874
2884
|
});
|
|
2875
2885
|
}
|
|
2876
2886
|
}
|
|
2877
|
-
const
|
|
2887
|
+
const mt = {
|
|
2878
2888
|
/**
|
|
2879
2889
|
* Опции редактора
|
|
2880
2890
|
*/
|
|
2881
2891
|
preserveObjectStacking: !0,
|
|
2882
2892
|
controlsAboveOverlay: !0,
|
|
2883
2893
|
centeredRotation: !0,
|
|
2894
|
+
enableRetinaScaling: !1,
|
|
2884
2895
|
/*
|
|
2885
2896
|
* Кастомные опции
|
|
2886
2897
|
*/
|
|
@@ -2963,18 +2974,18 @@ const Mt = {
|
|
|
2963
2974
|
resetObjectFitByDoubleClick: !0,
|
|
2964
2975
|
keyboardIgnoreSelectors: []
|
|
2965
2976
|
};
|
|
2966
|
-
function
|
|
2967
|
-
const t = y(y({},
|
|
2977
|
+
function At(r, e = {}) {
|
|
2978
|
+
const t = y(y({}, mt), e), s = document.getElementById(r);
|
|
2968
2979
|
if (!s)
|
|
2969
2980
|
return Promise.reject(new Error(`Контейнер с ID "${r}" не найден.`));
|
|
2970
2981
|
const n = document.createElement("canvas");
|
|
2971
2982
|
return n.id = `${r}-canvas`, s.appendChild(n), t.editorContainer = s, new Promise((i) => {
|
|
2972
2983
|
t._onReadyCallback = i;
|
|
2973
|
-
const a = new
|
|
2984
|
+
const a = new ae(n.id, t);
|
|
2974
2985
|
window[r] = a;
|
|
2975
2986
|
});
|
|
2976
2987
|
}
|
|
2977
2988
|
export {
|
|
2978
|
-
|
|
2989
|
+
At as default
|
|
2979
2990
|
};
|
|
2980
2991
|
//# sourceMappingURL=main.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@anu3ev/fabric-image-editor",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.67",
|
|
4
4
|
"description": "JavaScript image editor built on FabricJS, allowing you to create instances with an integrated montage area and providing an API to modify and manage state.",
|
|
5
5
|
"module": "dist/main.js",
|
|
6
6
|
"files": [
|