@syncfusion/ej2-image-editor 24.1.46 → 24.2.3
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 +4 -2
- 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 +52 -14
- package/dist/es6/ej2-image-editor.es2015.js.map +1 -1
- package/dist/es6/ej2-image-editor.es5.js +52 -14
- 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 +11 -11
- package/src/image-editor/action/draw.js +3 -0
- package/src/image-editor/action/selection.js +2 -2
- package/src/image-editor/action/shape.js +6 -6
- package/src/image-editor/action/undo-redo.d.ts +1 -0
- package/src/image-editor/action/undo-redo.js +41 -6
- package/styles/bootstrap-dark.css +12 -0
- package/styles/bootstrap.css +12 -0
- package/styles/bootstrap4.css +12 -0
- package/styles/bootstrap5-dark.css +12 -0
- package/styles/bootstrap5.css +12 -0
- package/styles/fabric-dark.css +12 -0
- package/styles/fabric.css +12 -0
- package/styles/fluent-dark.css +12 -0
- package/styles/fluent.css +12 -0
- package/styles/highcontrast-light.css +12 -0
- package/styles/highcontrast.css +12 -0
- package/styles/image-editor/_bootstrap-dark-definition.scss +1 -0
- package/styles/image-editor/_bootstrap-definition.scss +1 -0
- package/styles/image-editor/_bootstrap4-definition.scss +1 -0
- package/styles/image-editor/_bootstrap5-definition.scss +1 -0
- package/styles/image-editor/_fabric-dark-definition.scss +1 -0
- package/styles/image-editor/_fabric-definition.scss +1 -0
- package/styles/image-editor/_fluent-definition.scss +1 -0
- package/styles/image-editor/_fusionnew-definition.scss +1 -0
- package/styles/image-editor/_highcontrast-definition.scss +1 -0
- package/styles/image-editor/_highcontrast-light-definition.scss +1 -0
- package/styles/image-editor/_layout.scss +32 -2
- package/styles/image-editor/_material-dark-definition.scss +1 -0
- package/styles/image-editor/_material-definition.scss +1 -0
- package/styles/image-editor/_material3-definition.scss +3 -2
- package/styles/image-editor/_tailwind-definition.scss +1 -0
- package/styles/image-editor/bootstrap-dark.css +12 -0
- package/styles/image-editor/bootstrap.css +12 -0
- package/styles/image-editor/bootstrap4.css +12 -0
- package/styles/image-editor/bootstrap5-dark.css +12 -0
- package/styles/image-editor/bootstrap5.css +12 -0
- package/styles/image-editor/fabric-dark.css +12 -0
- package/styles/image-editor/fabric.css +12 -0
- package/styles/image-editor/fluent-dark.css +12 -0
- package/styles/image-editor/fluent.css +12 -0
- package/styles/image-editor/highcontrast-light.css +12 -0
- package/styles/image-editor/highcontrast.css +12 -0
- package/styles/image-editor/material-dark.css +12 -0
- package/styles/image-editor/material.css +12 -0
- package/styles/image-editor/material3-dark.css +25 -4
- package/styles/image-editor/material3.css +25 -4
- package/styles/image-editor/tailwind-dark.css +15 -2
- package/styles/image-editor/tailwind.css +15 -2
- package/styles/material-dark.css +12 -0
- package/styles/material.css +12 -0
- package/styles/material3-dark.css +25 -4
- package/styles/material3.css +25 -4
- package/styles/tailwind-dark.css +15 -2
- package/styles/tailwind.css +15 -2
|
@@ -4894,6 +4894,9 @@ var Draw = /** @__PURE__ @class */ (function () {
|
|
|
4894
4894
|
if (lastDotIndex !== -1) {
|
|
4895
4895
|
return url.slice(lastDotIndex + 1).toLowerCase();
|
|
4896
4896
|
}
|
|
4897
|
+
else if (url.indexOf('base64') !== -1) {
|
|
4898
|
+
return url.slice(url.indexOf('/') + 1, url.indexOf(';')).toLowerCase();
|
|
4899
|
+
}
|
|
4897
4900
|
return null;
|
|
4898
4901
|
};
|
|
4899
4902
|
Draw.prototype.fileSelect = function (inputElement, args) {
|
|
@@ -11582,13 +11585,13 @@ var Selection = /** @__PURE__ @class */ (function () {
|
|
|
11582
11585
|
if (this.currentDrawingShape === 'text') {
|
|
11583
11586
|
var prevCropObj_1 = extend({}, parent.cropObj, {}, true);
|
|
11584
11587
|
parent.notify('undo-redo', { prop: 'updateUndoRedoColl', onPropertyChange: false,
|
|
11585
|
-
value: { operation: '
|
|
11588
|
+
value: { operation: 'shapeInsert', previousObj: this.initialPrevObj, previousObjColl: this.initialPrevObj.objColl,
|
|
11586
11589
|
previousPointColl: this.initialPrevObj.pointColl, previousSelPointColl: this.initialPrevObj.selPointColl,
|
|
11587
11590
|
previousCropObj: prevCropObj_1, previousText: null,
|
|
11588
11591
|
currentText: null, previousFilter: null, isCircleCrop: null } });
|
|
11589
11592
|
}
|
|
11590
11593
|
else {
|
|
11591
|
-
parent.notify('undo-redo', { prop: 'updateUrObj', onPropertyChange: false, value: { objColl: this.initialPrevObj.objColl } });
|
|
11594
|
+
parent.notify('undo-redo', { prop: 'updateUrObj', onPropertyChange: false, value: { objColl: this.initialPrevObj.objColl, operation: 'shapeInsert' } });
|
|
11592
11595
|
}
|
|
11593
11596
|
this.isShapeInserted = true;
|
|
11594
11597
|
this.currentDrawingShape = '';
|
|
@@ -13751,7 +13754,7 @@ var Shape = /** @__PURE__ @class */ (function () {
|
|
|
13751
13754
|
parent.notify('selection', { prop: 'isShapeInserted', onPropertyChange: false, value: { bool: true } });
|
|
13752
13755
|
parent.notify('undo-redo', { prop: 'updateUrObj', onPropertyChange: false, value: { objColl: objColl_1 } });
|
|
13753
13756
|
if (parent.isPublicMethod) {
|
|
13754
|
-
parent.notify('undo-redo', { prop: 'updateUndoRedo', onPropertyChange: false });
|
|
13757
|
+
parent.notify('undo-redo', { prop: 'updateUndoRedo', value: { operation: 'shapeInsert' }, onPropertyChange: false });
|
|
13755
13758
|
}
|
|
13756
13759
|
parent.isPublicMethod = false;
|
|
13757
13760
|
});
|
|
@@ -13777,7 +13780,7 @@ var Shape = /** @__PURE__ @class */ (function () {
|
|
|
13777
13780
|
isApplyBtn: null, isCropping: null, isZooming: null, cType: null } });
|
|
13778
13781
|
parent.notify('toolbar', { prop: 'update-toolbar-items', onPropertyChange: false });
|
|
13779
13782
|
if (parent.isPublicMethod) {
|
|
13780
|
-
parent.notify('undo-redo', { prop: 'updateUndoRedo', onPropertyChange: false });
|
|
13783
|
+
parent.notify('undo-redo', { prop: 'updateUndoRedo', value: { operation: 'shapeInsert' }, onPropertyChange: false });
|
|
13781
13784
|
}
|
|
13782
13785
|
parent.isPublicMethod = false;
|
|
13783
13786
|
}
|
|
@@ -13875,7 +13878,7 @@ var Shape = /** @__PURE__ @class */ (function () {
|
|
|
13875
13878
|
parent.dotNetRef.invokeMethodAsync('ShapeEventAsync', 'OnShape', shapeChangingArgs, null).then(function (shapeChangingArgs) {
|
|
13876
13879
|
_this.drawShapeTextEvent(shapeChangingArgs);
|
|
13877
13880
|
if (parent.isPublicMethod) {
|
|
13878
|
-
parent.notify('undo-redo', { prop: 'updateUndoRedo', onPropertyChange: false });
|
|
13881
|
+
parent.notify('undo-redo', { prop: 'updateUndoRedo', value: { operation: 'shapeInsert' }, onPropertyChange: false });
|
|
13879
13882
|
}
|
|
13880
13883
|
parent.isPublicMethod = false;
|
|
13881
13884
|
});
|
|
@@ -13884,7 +13887,7 @@ var Shape = /** @__PURE__ @class */ (function () {
|
|
|
13884
13887
|
parent.trigger('shapeChanging', shapeChangingArgs);
|
|
13885
13888
|
this.drawShapeTextEvent(shapeChangingArgs);
|
|
13886
13889
|
if (parent.isPublicMethod) {
|
|
13887
|
-
parent.notify('undo-redo', { prop: 'updateUndoRedo', onPropertyChange: false });
|
|
13890
|
+
parent.notify('undo-redo', { prop: 'updateUndoRedo', value: { operation: 'shapeInsert' }, onPropertyChange: false });
|
|
13888
13891
|
}
|
|
13889
13892
|
parent.isPublicMethod = false;
|
|
13890
13893
|
}
|
|
@@ -13897,7 +13900,7 @@ var Shape = /** @__PURE__ @class */ (function () {
|
|
|
13897
13900
|
parent.objColl.push(parent.activeObj);
|
|
13898
13901
|
var prevCropObj = extend({}, parent.cropObj, {}, true);
|
|
13899
13902
|
parent.notify('undo-redo', { prop: 'updateUndoRedoColl', onPropertyChange: false,
|
|
13900
|
-
value: { operation: '
|
|
13903
|
+
value: { operation: 'shapeInsert', previousObj: this.prevObj, previousObjColl: this.prevObj.objColl,
|
|
13901
13904
|
previousPointColl: this.prevObj.pointColl, previousSelPointColl: this.prevObj.selPointColl, previousCropObj: prevCropObj,
|
|
13902
13905
|
previousText: null, currentText: null, previousFilter: null, isCircleCrop: null } });
|
|
13903
13906
|
parent.notify('selection', { prop: 'redrawShape', onPropertyChange: false,
|
|
@@ -13928,7 +13931,7 @@ var Shape = /** @__PURE__ @class */ (function () {
|
|
|
13928
13931
|
parent.objColl.push(parent.activeObj);
|
|
13929
13932
|
var prevCropObj = extend({}, parent.cropObj, {}, true);
|
|
13930
13933
|
parent.notify('undo-redo', { prop: 'updateUndoRedoColl', onPropertyChange: false,
|
|
13931
|
-
value: { operation: '
|
|
13934
|
+
value: { operation: 'shapeInsert', previousObj: this.prevObj, previousObjColl: this.prevObj.objColl,
|
|
13932
13935
|
previousPointColl: this.prevObj.pointColl, previousSelPointColl: this.prevObj.selPointColl,
|
|
13933
13936
|
previousCropObj: prevCropObj, previousText: null, currentText: null, previousFilter: null, isCircleCrop: null } });
|
|
13934
13937
|
parent.notify('selection', { prop: 'redrawShape', onPropertyChange: false,
|
|
@@ -19179,10 +19182,10 @@ var UndoRedo = /** @__PURE__ @class */ (function () {
|
|
|
19179
19182
|
this.redo();
|
|
19180
19183
|
break;
|
|
19181
19184
|
case 'updateUrObj':
|
|
19182
|
-
this.updateUrObj(args.value['objColl']);
|
|
19185
|
+
this.updateUrObj(args.value['objColl'], args.value['operation']);
|
|
19183
19186
|
break;
|
|
19184
19187
|
case 'updateUndoRedo':
|
|
19185
|
-
this.updateUndoRedo();
|
|
19188
|
+
this.updateUndoRedo(args.value ? args.value['operation'] : null);
|
|
19186
19189
|
break;
|
|
19187
19190
|
case 'getAppliedUndoRedoColl':
|
|
19188
19191
|
args.value['obj']['appliedUndoRedoColl'] = this.appliedUndoRedoColl;
|
|
@@ -19449,6 +19452,7 @@ var UndoRedo = /** @__PURE__ @class */ (function () {
|
|
|
19449
19452
|
case 'invert':
|
|
19450
19453
|
case 'sharpen':
|
|
19451
19454
|
case 'imageRotate':
|
|
19455
|
+
case 'shapeInsert':
|
|
19452
19456
|
this.shapeTransform(obj.previousObjColl);
|
|
19453
19457
|
break;
|
|
19454
19458
|
case 'freehanddraw':
|
|
@@ -19582,6 +19586,7 @@ var UndoRedo = /** @__PURE__ @class */ (function () {
|
|
|
19582
19586
|
case 'invert':
|
|
19583
19587
|
case 'sharpen':
|
|
19584
19588
|
case 'imageRotate':
|
|
19589
|
+
case 'shapeInsert':
|
|
19585
19590
|
this.shapeTransform(obj.currentObjColl);
|
|
19586
19591
|
break;
|
|
19587
19592
|
case 'freehanddraw':
|
|
@@ -19919,6 +19924,37 @@ var UndoRedo = /** @__PURE__ @class */ (function () {
|
|
|
19919
19924
|
}
|
|
19920
19925
|
parent.notify('filter', { prop: 'setAdjustmentValue', onPropertyChange: false, value: { adjustmentValue: this.lowerContext.filter } });
|
|
19921
19926
|
parent.currObjType.isCustomCrop = false;
|
|
19927
|
+
if (isBlazor() && parent.events && parent.events.historyChanged.hasDelegate === true) {
|
|
19928
|
+
var imageAction = this.getImageAction(operation);
|
|
19929
|
+
var args = { length: this.undoRedoColl.length, index: this.undoRedoStep, actionTrigger: isUndo ? 'Undo' : 'Redo', imageAction: imageAction };
|
|
19930
|
+
parent.dotNetRef.invokeMethodAsync('OnHistoryChangedAsync', args);
|
|
19931
|
+
}
|
|
19932
|
+
};
|
|
19933
|
+
UndoRedo.prototype.getImageAction = function (operation) {
|
|
19934
|
+
if (['brightness', 'contrast', 'saturation', 'opacity', 'blur', 'hue'].indexOf(operation) !== -1) {
|
|
19935
|
+
return 'FinetuneApplied';
|
|
19936
|
+
}
|
|
19937
|
+
else if (['chrome', 'cold', 'warm', 'grayscale', 'blackandwhite', 'sepia', 'invert'].indexOf(operation) !== -1) {
|
|
19938
|
+
return 'FilterApplied';
|
|
19939
|
+
}
|
|
19940
|
+
else if (operation === 'frame') {
|
|
19941
|
+
return 'FrameApplied';
|
|
19942
|
+
}
|
|
19943
|
+
else if (operation === 'resize') {
|
|
19944
|
+
return 'ImageResized';
|
|
19945
|
+
}
|
|
19946
|
+
else if (['deleteFreehandDrawing', 'deleteObj'].indexOf(operation) !== -1) {
|
|
19947
|
+
return 'ShapeDeleted';
|
|
19948
|
+
}
|
|
19949
|
+
else if (operation === 'crop') {
|
|
19950
|
+
return 'Cropped';
|
|
19951
|
+
}
|
|
19952
|
+
else if (['shapeInsert', 'freehanddraw', 'freehand-draw'].indexOf(operation) !== -1) {
|
|
19953
|
+
return 'ShapeInserted';
|
|
19954
|
+
}
|
|
19955
|
+
else {
|
|
19956
|
+
return 'ShapeCustomized';
|
|
19957
|
+
}
|
|
19922
19958
|
};
|
|
19923
19959
|
UndoRedo.prototype.updateUrc = function (operation, previousObj, previousObjColl, previousPointColl, previousSelPointColl, previousCropObj, previousText, currentText, previousFilter, isCircleCrop) {
|
|
19924
19960
|
var parent = this.parent;
|
|
@@ -19986,7 +20022,7 @@ var UndoRedo = /** @__PURE__ @class */ (function () {
|
|
|
19986
20022
|
}
|
|
19987
20023
|
}
|
|
19988
20024
|
};
|
|
19989
|
-
UndoRedo.prototype.updateUrObj = function (objColl) {
|
|
20025
|
+
UndoRedo.prototype.updateUrObj = function (objColl, operation) {
|
|
19990
20026
|
var parent = this.parent;
|
|
19991
20027
|
if (parent.allowUndoRedo) {
|
|
19992
20028
|
if (parent.currObjType.isUndoAction) {
|
|
@@ -20007,7 +20043,8 @@ var UndoRedo = /** @__PURE__ @class */ (function () {
|
|
|
20007
20043
|
parent.notify('freehand-draw', { prop: 'getSelPointColl', onPropertyChange: false,
|
|
20008
20044
|
value: { obj: selPointCollObj } });
|
|
20009
20045
|
obj.selPointColl = extend([], selPointCollObj['selPointColl'], [], true);
|
|
20010
|
-
|
|
20046
|
+
var oper = operation ? operation : 'shapeTransform';
|
|
20047
|
+
this.undoRedoColl.push({ operation: oper, previousObj: obj, currentObj: obj,
|
|
20011
20048
|
previousObjColl: objColl, currentObjColl: obj.objColl,
|
|
20012
20049
|
previousPointColl: obj.pointColl, currentPointColl: obj.pointColl,
|
|
20013
20050
|
previousSelPointColl: obj.selPointColl, currentSelPointColl: obj.selPointColl,
|
|
@@ -20016,7 +20053,7 @@ var UndoRedo = /** @__PURE__ @class */ (function () {
|
|
|
20016
20053
|
value: { obj: parent.objColl[parent.objColl.length - 1] } });
|
|
20017
20054
|
}
|
|
20018
20055
|
};
|
|
20019
|
-
UndoRedo.prototype.updateUndoRedo = function () {
|
|
20056
|
+
UndoRedo.prototype.updateUndoRedo = function (operation) {
|
|
20020
20057
|
var parent = this.parent;
|
|
20021
20058
|
var prevCropObj = extend({}, parent.cropObj, {}, true);
|
|
20022
20059
|
var object = { currObj: {} };
|
|
@@ -20033,7 +20070,8 @@ var UndoRedo = /** @__PURE__ @class */ (function () {
|
|
|
20033
20070
|
parent.notify('shape', { prop: 'updImgRatioForActObj', onPropertyChange: false });
|
|
20034
20071
|
}
|
|
20035
20072
|
parent.objColl.push(parent.activeObj);
|
|
20036
|
-
|
|
20073
|
+
var oper = operation ? operation : 'shapeTransform';
|
|
20074
|
+
this.updateUrc(oper, prevObj, prevObj.objColl, prevObj.pointColl, prevObj.selPointColl, prevCropObj);
|
|
20037
20075
|
parent.objColl.pop();
|
|
20038
20076
|
parent.notify('shape', { prop: 'applyActObj', onPropertyChange: false, value: { isMouseDown: null } });
|
|
20039
20077
|
parent.notify('shape', { prop: 'refreshActiveObj', onPropertyChange: false });
|