@syncfusion/ej2-image-editor 24.1.43 → 24.1.44
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/CHANGELOG.md +8 -0
- package/README.md +1 -1
- package/dist/ej2-image-editor.umd.min.js +2 -2
- package/dist/ej2-image-editor.umd.min.js.map +1 -1
- package/dist/es6/ej2-image-editor.es2015.js +45 -21
- package/dist/es6/ej2-image-editor.es2015.js.map +1 -1
- package/dist/es6/ej2-image-editor.es5.js +45 -21
- package/dist/es6/ej2-image-editor.es5.js.map +1 -1
- package/dist/global/ej2-image-editor.min.js +2 -2
- package/dist/global/ej2-image-editor.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +7 -7
- package/src/image-editor/action/draw.js +19 -16
- package/src/image-editor/action/selection.js +8 -0
- package/src/image-editor/action/transform.js +4 -4
- package/src/image-editor/action/undo-redo.js +11 -1
- package/src/image-editor/renderer/toolbar.js +3 -0
- package/styles/bootstrap-dark.css +9 -2
- package/styles/bootstrap.css +9 -2
- package/styles/bootstrap4.css +9 -2
- package/styles/bootstrap5-dark.css +9 -2
- package/styles/bootstrap5.css +9 -2
- package/styles/fabric-dark.css +9 -2
- package/styles/fabric.css +9 -2
- package/styles/fluent-dark.css +9 -2
- package/styles/fluent.css +9 -2
- package/styles/highcontrast-light.css +9 -2
- package/styles/highcontrast.css +9 -2
- package/styles/image-editor/_layout.scss +9 -6
- package/styles/image-editor/bootstrap-dark.css +9 -2
- package/styles/image-editor/bootstrap.css +9 -2
- package/styles/image-editor/bootstrap4.css +9 -2
- package/styles/image-editor/bootstrap5-dark.css +9 -2
- package/styles/image-editor/bootstrap5.css +9 -2
- package/styles/image-editor/fabric-dark.css +9 -2
- package/styles/image-editor/fabric.css +9 -2
- package/styles/image-editor/fluent-dark.css +9 -2
- package/styles/image-editor/fluent.css +9 -2
- package/styles/image-editor/highcontrast-light.css +9 -2
- package/styles/image-editor/highcontrast.css +9 -2
- package/styles/image-editor/material-dark.css +9 -2
- package/styles/image-editor/material.css +9 -2
- package/styles/image-editor/material3-dark.css +7 -2
- package/styles/image-editor/material3.css +7 -2
- package/styles/image-editor/tailwind-dark.css +9 -2
- package/styles/image-editor/tailwind.css +9 -2
- package/styles/material-dark.css +9 -2
- package/styles/material.css +9 -2
- package/styles/material3-dark.css +7 -2
- package/styles/material3.css +7 -2
- package/styles/tailwind-dark.css +9 -2
- package/styles/tailwind.css +9 -2
|
@@ -1099,7 +1099,7 @@ var Draw = /** @__PURE__ @class */ (function () {
|
|
|
1099
1099
|
this.updateCanvas();
|
|
1100
1100
|
break;
|
|
1101
1101
|
case 'performCancel':
|
|
1102
|
-
this.performCancel(args.value['isContextualToolbar']);
|
|
1102
|
+
this.performCancel(args.value['isContextualToolbar'], args.value['isUndoRedo']);
|
|
1103
1103
|
break;
|
|
1104
1104
|
case 'updateFlipPan':
|
|
1105
1105
|
this.updateFlipPan(args.value['tempSelectionObj']);
|
|
@@ -1591,13 +1591,11 @@ var Draw = /** @__PURE__ @class */ (function () {
|
|
|
1591
1591
|
if (destTop < 0) {
|
|
1592
1592
|
height += destTop;
|
|
1593
1593
|
}
|
|
1594
|
-
if (
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
height -= (destTop + destHeight - parent.lowerCanvas.height);
|
|
1600
|
-
}
|
|
1594
|
+
if (destLeft + destWidth > parent.lowerCanvas.width) {
|
|
1595
|
+
width -= (destLeft + destWidth - parent.lowerCanvas.width);
|
|
1596
|
+
}
|
|
1597
|
+
if (destTop + destHeight > parent.lowerCanvas.height) {
|
|
1598
|
+
height -= (destTop + destHeight - parent.lowerCanvas.height);
|
|
1601
1599
|
}
|
|
1602
1600
|
}
|
|
1603
1601
|
switch (parent.currObjType.shape.toLowerCase()) {
|
|
@@ -3219,7 +3217,7 @@ var Draw = /** @__PURE__ @class */ (function () {
|
|
|
3219
3217
|
parent.img.destHeight = maxDimension.width;
|
|
3220
3218
|
}
|
|
3221
3219
|
parent.img.destLeft = (parent.lowerCanvas.clientWidth - maxDimension.height) / 2;
|
|
3222
|
-
parent.img.destTop = (parent.lowerCanvas.clientHeight - maxDimension.width
|
|
3220
|
+
parent.img.destTop = (parent.lowerCanvas.clientHeight - maxDimension.width) / 2;
|
|
3223
3221
|
parent.img.destWidth = maxDimension.height;
|
|
3224
3222
|
parent.img.destHeight = maxDimension.width;
|
|
3225
3223
|
}
|
|
@@ -3235,7 +3233,12 @@ var Draw = /** @__PURE__ @class */ (function () {
|
|
|
3235
3233
|
parent.img.destHeight = maxDimension.height;
|
|
3236
3234
|
}
|
|
3237
3235
|
parent.img.destLeft = (parent.lowerCanvas.clientWidth - maxDimension.width) / 2;
|
|
3238
|
-
|
|
3236
|
+
if (degree === 0) {
|
|
3237
|
+
parent.img.destTop = (parent.lowerCanvas.clientHeight - maxDimension.height + 1) / 2;
|
|
3238
|
+
}
|
|
3239
|
+
else {
|
|
3240
|
+
parent.img.destTop = (parent.lowerCanvas.clientHeight - maxDimension.height) / 2;
|
|
3241
|
+
}
|
|
3239
3242
|
parent.img.destWidth = maxDimension.width;
|
|
3240
3243
|
parent.img.destHeight = maxDimension.height;
|
|
3241
3244
|
}
|
|
@@ -3550,14 +3553,14 @@ var Draw = /** @__PURE__ @class */ (function () {
|
|
|
3550
3553
|
parent.cancelCropSelection = null;
|
|
3551
3554
|
}
|
|
3552
3555
|
};
|
|
3553
|
-
Draw.prototype.performCancel = function (isContextualToolbar) {
|
|
3556
|
+
Draw.prototype.performCancel = function (isContextualToolbar, isUndoRedo) {
|
|
3554
3557
|
var parent = this.parent;
|
|
3555
3558
|
var straightenObj = { bool: parent.isStraightening };
|
|
3556
3559
|
isContextualToolbar = isContextualToolbar ? isContextualToolbar : false;
|
|
3557
3560
|
var obj = { bool: false };
|
|
3558
3561
|
parent.allowDownScale = true;
|
|
3559
3562
|
parent.notify('selection', { prop: 'getFreehandDrawEditing', onPropertyChange: false, value: { obj: obj } });
|
|
3560
|
-
if (JSON.stringify(parent.frameObj) !== JSON.stringify(parent.tempFrameObj)) {
|
|
3563
|
+
if (isNullOrUndefined(isUndoRedo) && JSON.stringify(parent.frameObj) !== JSON.stringify(parent.tempFrameObj)) {
|
|
3561
3564
|
extend(parent.frameObj, parent.tempFrameObj);
|
|
3562
3565
|
this.renderImage(null, null, true);
|
|
3563
3566
|
}
|
|
@@ -4321,16 +4324,16 @@ var Draw = /** @__PURE__ @class */ (function () {
|
|
|
4321
4324
|
Draw.prototype.setClientTransDim = function (isPreventDimension) {
|
|
4322
4325
|
var parent = this.parent;
|
|
4323
4326
|
if (parent.transform.degree % 90 === 0 && parent.transform.degree % 180 !== 0) {
|
|
4324
|
-
parent.img.destLeft = (parent.lowerCanvas.
|
|
4325
|
-
parent.img.destTop = (parent.lowerCanvas.
|
|
4327
|
+
parent.img.destLeft = (parent.lowerCanvas.clientWidth - parent.img.destHeight) / 2;
|
|
4328
|
+
parent.img.destTop = (parent.lowerCanvas.clientHeight - parent.img.destWidth + 1) / 2;
|
|
4326
4329
|
var temp = parent.img.destWidth;
|
|
4327
4330
|
parent.img.destWidth = parent.img.destHeight;
|
|
4328
4331
|
parent.img.destHeight = temp;
|
|
4329
4332
|
}
|
|
4330
4333
|
else {
|
|
4331
4334
|
if (isNullOrUndefined(isPreventDimension)) {
|
|
4332
|
-
parent.img.destLeft = (parent.lowerCanvas.
|
|
4333
|
-
parent.img.destTop = (parent.lowerCanvas.
|
|
4335
|
+
parent.img.destLeft = (parent.lowerCanvas.clientWidth - parent.img.destWidth) / 2;
|
|
4336
|
+
parent.img.destTop = (parent.lowerCanvas.clientHeight - parent.img.destHeight + 1) / 2;
|
|
4334
4337
|
}
|
|
4335
4338
|
}
|
|
4336
4339
|
};
|
|
@@ -12637,7 +12640,15 @@ var Selection = /** @__PURE__ @class */ (function () {
|
|
|
12637
12640
|
this.getCurrentFlipState();
|
|
12638
12641
|
}
|
|
12639
12642
|
else {
|
|
12643
|
+
var totalPannedInternalPoint = extend({}, parent.panPoint.totalPannedInternalPoint, {}, true);
|
|
12644
|
+
var destPoints = { startX: parent.img.destLeft, startY: parent.img.destTop, width: parent.img.destWidth,
|
|
12645
|
+
height: parent.img.destHeight };
|
|
12640
12646
|
parent.notify('draw', { prop: 'callUpdateCurrTransState', onPropertyChange: false });
|
|
12647
|
+
parent.panPoint.totalPannedInternalPoint = totalPannedInternalPoint;
|
|
12648
|
+
parent.img.destLeft = destPoints.startX;
|
|
12649
|
+
parent.img.destTop = destPoints.startY;
|
|
12650
|
+
parent.img.destWidth = destPoints.width;
|
|
12651
|
+
parent.img.destHeight = destPoints.height;
|
|
12641
12652
|
parent.notify('freehand-draw', { prop: 'freehandRedraw', onPropertyChange: false,
|
|
12642
12653
|
value: { context: this.lowerContext, points: null } });
|
|
12643
12654
|
}
|
|
@@ -17848,11 +17859,11 @@ var Transform = /** @__PURE__ @class */ (function () {
|
|
|
17848
17859
|
if (parent.img.destTop > 0) {
|
|
17849
17860
|
parent.img.destTop = 0;
|
|
17850
17861
|
}
|
|
17851
|
-
if (parent.img.destLeft + maxDimension.width < parent.lowerCanvas.
|
|
17852
|
-
parent.img.destLeft = parent.lowerCanvas.
|
|
17862
|
+
if (parent.img.destLeft + maxDimension.width < parent.lowerCanvas.clientWidth) {
|
|
17863
|
+
parent.img.destLeft = parent.lowerCanvas.clientWidth - parent.img.destWidth;
|
|
17853
17864
|
}
|
|
17854
|
-
if (parent.img.destTop + maxDimension.height < parent.lowerCanvas.
|
|
17855
|
-
parent.img.destTop = parent.lowerCanvas.
|
|
17865
|
+
if (parent.img.destTop + maxDimension.height < parent.lowerCanvas.clientHeight) {
|
|
17866
|
+
parent.img.destTop = parent.lowerCanvas.clientHeight - parent.img.destHeight;
|
|
17856
17867
|
}
|
|
17857
17868
|
}
|
|
17858
17869
|
return maxDimension;
|
|
@@ -19469,7 +19480,7 @@ var UndoRedo = /** @__PURE__ @class */ (function () {
|
|
|
19469
19480
|
this.tempCurrSelPoint = extend({}, parent.currSelectionPoint, {}, true);
|
|
19470
19481
|
parent.currSelectionPoint = null;
|
|
19471
19482
|
}
|
|
19472
|
-
parent.notify('draw', { prop: 'performCancel', value: { isContextualToolbar: null } });
|
|
19483
|
+
parent.notify('draw', { prop: 'performCancel', value: { isContextualToolbar: null, isUndoRedo: true } });
|
|
19473
19484
|
parent.currObjType.isActiveObj = false;
|
|
19474
19485
|
if (parent.transform.straighten !== 0) {
|
|
19475
19486
|
parent.notify('draw', { prop: 'setStraightenActObj', value: { activeObj: null } });
|
|
@@ -20032,6 +20043,16 @@ var UndoRedo = /** @__PURE__ @class */ (function () {
|
|
|
20032
20043
|
this.parent.notify('draw', { prop: 'getArrowDimension', onPropertyChange: false, value: { obj: arrowObj } });
|
|
20033
20044
|
var tempArrowObj = extend({}, arrowObj['arrowDimension'], {}, true);
|
|
20034
20045
|
if (parent.transform.zoomFactor > 0 && (obj.length > 0 || point.length > 0)) {
|
|
20046
|
+
if (obj.length > 0) {
|
|
20047
|
+
for (var i = 0; i < obj.length; i++) {
|
|
20048
|
+
if (obj[i].currIndex) {
|
|
20049
|
+
continue;
|
|
20050
|
+
}
|
|
20051
|
+
else {
|
|
20052
|
+
obj[i].currIndex = 'shape_' + (i + 1);
|
|
20053
|
+
}
|
|
20054
|
+
}
|
|
20055
|
+
}
|
|
20035
20056
|
parent.objColl = obj;
|
|
20036
20057
|
parent.pointColl = point;
|
|
20037
20058
|
var isUndoRedo = parent.isUndoRedo;
|
|
@@ -27557,6 +27578,9 @@ var ToolbarModule = /** @__PURE__ @class */ (function () {
|
|
|
27557
27578
|
qtArea.style.top = point.startY - (height + (height / 1.5)) + 'px';
|
|
27558
27579
|
}
|
|
27559
27580
|
}
|
|
27581
|
+
if (parseFloat(qtArea.style.top) < 0) {
|
|
27582
|
+
qtArea.style.top = '0px';
|
|
27583
|
+
}
|
|
27560
27584
|
}
|
|
27561
27585
|
};
|
|
27562
27586
|
ToolbarModule.prototype.refreshDropDownBtn = function (isDisabled) {
|