@syncfusion/ej2-image-editor 20.4.38 → 20.4.42

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

@@ -145,6 +145,7 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
         _this.tempBWFilter = false;
         _this.isBrightnessAdjusted = false;
         _this.isInitialLoading = false;
+        _this.imageFileName = '';
         return _this;
     }
     ImageEditor_1 = ImageEditor;
@@ -3344,6 +3345,7 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
         ctx.drawImage(this.inMemoryCanvas, 0, 0, 300, 150);
     };
     ImageEditor.prototype.updateCanvas = function () {
+        var fileOpened = { fileName: this.imageFileName, fileType: this.imageFileType };
         this.lastX = this.baseImg.width / 2;
         this.lastY = this.baseImg.height / 2;
         var wrapperWidth;
@@ -3408,7 +3410,7 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
         if (this.disabled) {
             this.element.setAttribute('class', 'e-disabled');
         }
-        this.trigger('fileOpened');
+        this.trigger('fileOpened', fileOpened);
     };
     ImageEditor.prototype.imageOnLoad = function (src) {
         var _this = this;
@@ -3612,6 +3614,18 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
         }
     };
     ImageEditor.prototype.fileSelect = function (inputElement, args) {
+        this.imageFileName = inputElement.value.split('\\')[inputElement.value.split('\\').length - 1];
+        this.imageFileName = this.imageFileName.split('.')[0];
+        var fileType = inputElement.value.split('.');
+        if (fileType[fileType.length - 1].toLowerCase() === 'jpg' || fileType[fileType.length - 1].toLowerCase() === 'jpeg') {
+            this.imageFileType = 'Jpeg';
+        }
+        else if (fileType[fileType.length - 1].toLowerCase() === 'png') {
+            this.imageFileType = 'Png';
+        }
+        else if (fileType[fileType.length - 1].toLowerCase() === 'svg') {
+            this.imageFileType = 'Svg';
+        }
         showSpinner(this.element);
         this.element.style.opacity = '0.5';
         /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
@@ -8376,7 +8390,6 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
             var heightRatio = void 0;
             var imgData = void 0;
             var zoomedRotate = false;
-            var factor = this.factor;
             if (this.factor === 1) {
                 imgData = this.lowerContext.getImageData(0, 0, this.lowerCanvas.width, this.lowerCanvas.height);
                 widthRatio = this.lowerCanvas.width / parseInt(this.lowerCanvas.style.maxWidth, 10);
@@ -8678,9 +8691,23 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
             this.imgDataColl = [];
             var type = typeof (data);
             if (type === 'string') {
+                var fileName = data.split('.');
+                if (fileName[fileName.length - 1].toLowerCase() === 'jpg' || fileName[fileName.length - 1].toLowerCase() === 'jpeg') {
+                    this.imageFileType = 'Jpeg';
+                }
+                else if (fileName[fileName.length - 1].toLowerCase() === 'png') {
+                    this.imageFileType = 'Png';
+                }
+                else if (fileName[fileName.length - 1].toLowerCase() === 'svg') {
+                    this.imageFileType = 'Svg';
+                }
+                fileName = fileName[fileName.length - 2].split('/');
+                this.imageFileName = fileName[fileName.length - 1];
                 this.imageOnLoad(data);
             }
             else {
+                this.imageFileName = 'ImageEditor';
+                this.imageFileType = 'Jpeg';
                 var tempFilter = this.lowerContext.filter;
                 this.lowerCanvas = document.querySelector('#' + this.element.id + '_lowerCanvas');
                 this.upperCanvas = document.querySelector('#' + this.element.id + '_upperCanvas');
@@ -8784,6 +8811,8 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
             this.tempObjColl = undefined;
             this.adjustmentLevel = { brightness: 0, contrast: 0, hue: 0, opacity: 100, saturation: 0, blur: 0, exposure: 0, sharpen: false, bw: false };
             this.tempAdjustmentLevel = { brightness: 0, contrast: 0, hue: 0, opacity: 100, saturation: 0, blur: 0, exposure: 0, sharpen: false, bw: false };
+            this.imageFileName = '';
+            this.imageFileType = undefined;
             this.canvasFilter = this.currentFilter = this.tempAdjustmentValue = '';
             this.lowerContext.filter = this.initialAdjustmentValue = this.adjustmentValue = 'brightness(' + 1 + ') ' + 'contrast(' + 100
                 + '%) ' + 'hue-rotate(' + 0 + 'deg) ' +
@@ -8905,22 +8934,23 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
             }
             type = type ? type : 'Png';
             this.redrawActObj();
-            var beforeSave = { cancel: false, fileName: fileName ? fileName : 'ImageEditor', fileType: type };
-            var saved_1 = { fileName: fileName ? fileName : 'ImageEditor', fileType: type };
+            fileName = fileName ? fileName : this.imageFileName;
+            var beforeSave = { cancel: false, fileName: fileName, fileType: type };
+            var saved_1 = { fileName: fileName ? fileName : this.imageFileName, fileType: type };
             this.trigger('beforeSave', beforeSave, function (observableSaveArgs) {
                 if (!observableSaveArgs.cancel) {
                     _this.currObjType.isSave = true;
                     fileName = observableSaveArgs.fileName ? observableSaveArgs.fileName : fileName;
                     if (type.toLowerCase() === 'svg') {
-                        fileName = fileName || 'ImageEditor';
+                        fileName = fileName || _this.imageFileName;
                         _this.toSVGImg(fileName);
                     }
                     else if (type.toLowerCase() === 'jpeg') {
-                        fileName = fileName || 'ImageEditor';
+                        fileName = fileName || _this.imageFileName;
                         _this.toBlobFn(fileName, type.toLowerCase());
                     }
                     else {
-                        fileName = fileName || 'ImageEditor';
+                        fileName = fileName || _this.imageFileName;
                         _this.toBlobFn(fileName, type.toLowerCase());
                     }
                     _this.trigger('saved', saved_1);
@@ -9456,7 +9486,8 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
             this.initialAdjustmentValue = 'brightness(1) contrast(100%) hue-rotate(0deg) saturate(100%) opacity(1) blur(0px) sepia(0%) grayscale(0%) invert(0%)';
         }
         this.lowerContext.filter = this.initialAdjustmentValue;
-        this.setFilter(filterOption.toString());
+        var filterValue = filterOption.split(' ');
+        this.setFilter(filterValue.join('').toLowerCase());
     };
     /**
      * To apply the filters to an image