@syncfusion/ej2-image-editor 27.1.50 → 27.1.52

package/dist/es6/ej2-image-editor.es5.js

@@ -2021,7 +2021,7 @@ var Draw = /** @__PURE__ @class */ (function () {
                 }
                 this.drawArrowHead(canvasDraw, true);
                 this.drawArrowHead(canvasDraw, false);
-                if (actObj.end === 'none') {
+                if (actObj.end === 'none' && actObj.start !== 'circle' && actObj.start !== 'square') {
                     this.shapeLine(canvasDraw, actPoint.startX, actPoint.startY, actPoint.endX, actPoint.endY);
                 }
                 canvasDraw.fillStyle = tempFillStyle;
@@ -2425,9 +2425,10 @@ var Draw = /** @__PURE__ @class */ (function () {
         var isStartArrow = actObj.start === 'arrow';
         var isEndArrow = actObj.end === 'arrow';
         var isEndCircleOrSquare = actObj.end === 'circle' || actObj.end === 'square';
+        var isStartCircleOrSquare = actObj.start === 'circle' || actObj.start === 'square';
         if ((start && actObj.triangleDirection === 'left' || actObj.triangleDirection === 'right') &&
-            ((isStartArrow && actObj.end === 'none') || (isStartArrow && !isEndCircleOrSquare)) ||
-            (!start && (isEndArrow && actObj.start === 'none' || !isStartArrow && !isEndCircleOrSquare))) {
+            ((isStartArrow && actObj.end === 'none') || (isStartArrow && !isEndCircleOrSquare && !isStartCircleOrSquare)) ||
+            (!start && (isEndArrow && actObj.start === 'none' || !isStartArrow && !isEndCircleOrSquare && !isStartCircleOrSquare))) {
             this.shapeLine(canvasDraw, startX, startY, endX, endY);
         }
         if ((start && actObj.triangleDirection === 'left') || (!start && actObj.triangleDirection === 'right')) {
@@ -2462,9 +2463,10 @@ var Draw = /** @__PURE__ @class */ (function () {
         var angle = Math.atan2(this.dy, this.dx);
         var isStartArrowSolid = actObj.start === 'arrowSolid';
         var isEndArrowSolid = actObj.end === 'arrowSolid';
+        var isStartCircleOrSquare = actObj.start === 'circle' || actObj.start === 'square';
         var isEndCircleOrSquare = actObj.end === 'circle' || actObj.end === 'square';
-        if ((start && (isStartArrowSolid && actObj.end === 'none') || (isStartArrowSolid && !isEndCircleOrSquare)) ||
-            (!start && (isEndArrowSolid && actObj.start === 'none' || !isStartArrowSolid && !isEndCircleOrSquare))) {
+        if ((start && (isStartArrowSolid && actObj.end === 'none') || (isStartArrowSolid && !isEndCircleOrSquare && !isStartCircleOrSquare)) ||
+            (!start && (isEndArrowSolid && actObj.start === 'none' || !isStartArrowSolid && !isEndCircleOrSquare && !isStartCircleOrSquare))) {
             this.shapeLine(canvasDraw, startX, startY, endX, endY);
         }
         if ((start && actObj.triangleDirection === 'left') || (!start && actObj.triangleDirection === 'right')) {
@@ -3031,12 +3033,7 @@ var Draw = /** @__PURE__ @class */ (function () {
             /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
             var coll = actObj.rotateFlipColl[i];
             if (typeof (coll) === 'number') {
-                if (actObj.shapeDegree === 0) {
-                    tempDegree = coll;
-                }
-                else {
-                    tempDegree = coll - actObj.shapeDegree;
-                }
+                tempDegree = coll;
                 if (tempDegree === -450) {
                     tempDegree = -90;
                 }
@@ -3134,12 +3131,7 @@ var Draw = /** @__PURE__ @class */ (function () {
             /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
             var coll = actObj.rotateFlipColl[i];
             if (typeof (coll) === 'number') {
-                if (actObj.shapeDegree === 0) {
-                    tempDegree = coll;
-                }
-                else {
-                    tempDegree = coll - actObj.shapeDegree;
-                }
+                tempDegree = coll;
                 if (tempDegree === -450) {
                     tempDegree = -90;
                 }
@@ -7347,7 +7339,7 @@ var Filter = /** @__PURE__ @class */ (function () {
     Filter.prototype.parseFilterString = function (filterString) {
         /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
         var filterArray = [];
-        if (filterString !== 'none') {
+        if (filterString && filterString !== 'none') {
             filterArray = filterString.split(' ').map(function (filter) {
                 var _a = filter.match(/([a-z-]+)\(([^)]+)\)/).slice(1, 3), name = _a[0], value = _a[1];
                 return { filter: name, value: value };
@@ -12066,6 +12058,7 @@ var Selection = /** @__PURE__ @class */ (function () {
             this.triggerShapeChange(shapeResizingArgs, shapeMovingArgs, 'mouse-down');
             parent.activeObj.activePoint = activePoint;
             parent.isShapeDrawing = true;
+            this.tempActiveObj = extend({}, parent.activeObj, {}, true);
             return;
         }
         parent.notify('draw', { prop: 'resetFrameZoom', onPropertyChange: false, value: { isOk: true } });
@@ -21562,12 +21555,22 @@ var UndoRedo = /** @__PURE__ @class */ (function () {
         var parent = this.parent;
         for (var i = 0; i < parent.objColl.length; i++) {
             var obj = parent.objColl[i];
+            var isUpdated = false;
             if (obj.shape === 'line' || obj.shape === 'arrow') {
                 if (obj.activePoint.width < 0) {
                     obj.activePoint.width = Math.abs(obj.activePoint.width);
+                    isUpdated = true;
                 }
                 if (obj.activePoint.height < 0) {
                     obj.activePoint.height = Math.abs(obj.activePoint.height);
+                    isUpdated = true;
+                }
+                if (isUpdated) {
+                    var activeObj = extend({}, parent.activeObj, {}, true);
+                    parent.activeObj = obj;
+                    parent.notify('shape', { prop: 'updImgRatioForActObj', onPropertyChange: false });
+                    obj = parent.activeObj;
+                    parent.activeObj = activeObj;
                 }
             }
         }
@@ -27782,6 +27785,9 @@ var ToolbarModule = /** @__PURE__ @class */ (function () {
                 zOrderElement.classList.remove('e-overlay');
             }
         }
+        if (zOrderElement && (parent.shapeColl.length === 0 || (obj['freehandDrawSelectedId'] && parent.shapeColl.length === 1))) {
+            zOrderElement.classList.add('e-overlay');
+        }
     };
     ToolbarModule.prototype.renderStraightenSlider = function () {
         var parent = this.parent;
@@ -28014,7 +28020,7 @@ var ToolbarModule = /** @__PURE__ @class */ (function () {
         qualityOptionDiv.appendChild(parent.createElement('button', { id: id + '_qualitybuttonIcon', className: 'e-ie-img-icon-button', attrs: { type: 'button' } }));
         qualityNameDiv.appendChild(qualityOptionDiv);
         if (Browser.isDevice) {
-            qualityNameDiv.appendChild(parent.createElement('span', {
+            dialogRightContent.appendChild(parent.createElement('span', {
                 id: id + '_qualitySize', className: 'e-ie-img-quality-size'
             }));
         }
@@ -28251,11 +28257,11 @@ var ToolbarModule = /** @__PURE__ @class */ (function () {
                 fileSize = Math.floor(blob.size / 1024);
                 if (fileSize > 1000) {
                     var megabytes = fileSize / 1024;
-                    imageNameLabel.innerHTML = 'Image size: ' + megabytes.toFixed(2) + ' MB';
+                    imageNameLabel.innerHTML = this.l10n.getConstant('ImageSize') + ': ' + megabytes.toFixed(2) + ' MB';
                     fileSize = +megabytes.toFixed(2);
                 }
                 else {
-                    imageNameLabel.innerHTML = 'Image size: ' + fileSize.toFixed(2) + ' KB';
+                    imageNameLabel.innerHTML = this.l10n.getConstant('ImageSize') + ': ' + fileSize.toFixed(2) + ' KB';
                     fileSize = +fileSize.toFixed(2);
                 }
                 if (Browser.isDevice) {
@@ -28273,6 +28279,46 @@ var ToolbarModule = /** @__PURE__ @class */ (function () {
                 this.fileSize = fileSize;
             }).bind(this), 'image/jpeg', quality);
         }
+        else if (!isNullOrUndefined(fileType) && fileType.toLowerCase() === 'png') {
+            ctx.drawImage(tempCanvas, 0, 0);
+            tempCanvas.toBlob((function (blob) {
+                fileSize = Math.floor(blob.size / 1024);
+                if (fileSize > 1000) {
+                    var megabytes = fileSize / 1024;
+                    imageNameLabel.innerHTML = this.l10n.getConstant('ImageSize') + ': ' + megabytes.toFixed(2) + ' MB';
+                    fileSize = +megabytes.toFixed(2);
+                }
+                else {
+                    imageNameLabel.innerHTML = this.l10n.getConstant('ImageSize') + ': ' + fileSize.toFixed(2) + ' KB';
+                    fileSize = +fileSize.toFixed(2);
+                }
+                if (Browser.isDevice) {
+                    canvas.style.display = 'none';
+                }
+                this.fileSize = fileSize;
+            }).bind(this), 'image/png', 1);
+        }
+        else if (!isNullOrUndefined(fileType) && fileType.toLowerCase() === 'svg') {
+            ctx.drawImage(tempCanvas, 0, 0);
+            var svgDataUrl = tempCanvas.toDataURL('image/svg+xml');
+            var base64Data = svgDataUrl.split(',')[1];
+            var binaryStringLength = base64Data.length;
+            var rawByteSize = binaryStringLength;
+            var fileSize_1 = Math.floor(rawByteSize / 1024); // KB
+            if (fileSize_1 > 1000) {
+                var megabytes = fileSize_1 / 1024; // Convert to MB
+                imageNameLabel.innerHTML = this.l10n.getConstant('ImageSize') + ': ' + megabytes.toFixed(2) + ' MB';
+                fileSize_1 = +megabytes.toFixed(2);
+            }
+            else {
+                imageNameLabel.innerHTML = this.l10n.getConstant('ImageSize') + ': ' + fileSize_1.toFixed(2) + ' KB';
+                fileSize_1 = +fileSize_1.toFixed(2);
+            }
+            if (Browser.isDevice) {
+                canvas.style.display = 'none';
+            }
+            this.fileSize = fileSize_1;
+        }
         else {
             if (Browser.isDevice) {
                 canvas.style.display = 'none';