datasync-blob 1.1.25 → 1.1.26

package/dist/components/DsBlob.js

@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.DsBlob = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _reactToastify = require("react-toastify");
-require("react-toastify/dist/ReactToastify.css");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 class DsBlob extends _react.Component {
@@ -111,9 +109,6 @@ class DsBlob extends _react.Component {
       throw error;
     }
   };
-  setPicture = data => {
-    console.log("setPicture => Fake procedure canbe deleted !");
-  };
 
   //-----------------------------------------
   convert_blob_picture_into_cloud_file = async pictureBlob => {
@@ -131,10 +126,7 @@ class DsBlob extends _react.Component {
           if (pictureBlob.data && pictureBlob.data.startsWith('blob:')) {
             URL.revokeObjectURL(pictureBlob.data);
           }
-          this.setPicture(pictureBlob.cloud_url_prefix); //Display the image using the cloud URL only if upload succeeded
-          _reactToastify.toast.success("Image uploadée");
-          console.log("pictureBlob->", pictureBlob);
-
+          this.setData(pictureBlob.cloud_url_prefix);
           //inform parent component of the new cloud URL for the uploaded image
           this.props.uploadPicture({
             data: pictureBlob.cloud_url_prefix
@@ -145,7 +137,6 @@ class DsBlob extends _react.Component {
         }
       }
     } catch (error) {
-      _reactToastify.toast.error("Erreur lors du téléchargement de l'image");
       console.error("Upload error:", error);
     }
   };
@@ -200,162 +191,67 @@ class DsBlob extends _react.Component {
       }
     }
 
+    //Compute jpeg compression ratio
+    let jpegCompressionRatio = this.props.jpegQuality && this.props.jpegQuality > 0 && this.props.jpegQuality < 1 ? this.props.jpegQuality : 1;
+
     //Build 2d picture
     canvas.width = width;
     canvas.height = height;
     context = canvas.getContext('2d');
     context.drawImage(imageSource, 0, 0, width, height);
+    if (this.props.cloud_storage) {
+      canvas.toBlob(async blob => {
+        if (blob) {
+          console.log("Binary blob created, size:", blob.size);
+          if (this.debugging) console.log("jpegCompressionRatio->", jpegCompressionRatio, " blob.size = ", blob.size);
+
+          // Fallback: use blob URL for display but keep binary data
+          const blobUrl = URL.createObjectURL(blob);
+
+          // Convert blob to ArrayBuffer to maintain genuine binary data
+          const reader = new FileReader();
+          reader.onload = () => {
+            const binaryData = reader.result; // ArrayBuffer - genuine binary data
+            console.log("Fallback: Using binary data, size:", binaryData.byteLength);
+
+            //Call the upload callback with both blob URL for display and binary data for upload
+            this.convert_blob_picture_into_cloud_file({
+              data: blobUrl,
+              // For display in img tag
+              binaryData: binaryData,
+              // Genuine JPEG binary stream
+              cloud_url_prefix: this.props.cloud_url_prefix,
+              // Pass cloud URL prefix if needed for parent component
+              isBlobUrl: true // Flag to track blob URLs for cleanup
+            });
+          };
+          reader.readAsArrayBuffer(blob);
+        } else {
+          console.error("Failed to create blob from canvas");
+        }
+      }, 'image/jpeg', jpegCompressionRatio);
+    } else {
+      //Jpeg conversion
 
-    //Jpeg conversion
-    let jpegCompressionRatio = this.props.jpegQuality && this.props.jpegQuality > 0 && this.props.jpegQuality < 1 ? this.props.jpegQuality : 1;
-    let canvasData = canvas.toDataURL('image/jpg', jpegCompressionRatio); //Jpeg conversion
+      let canvasData = canvas.toDataURL('image/jpg', jpegCompressionRatio); //Jpeg conversion
+
+      if (this.debugging) console.log("jpegCompressionRatio->", jpegCompressionRatio, " canvasData.length = ", canvasData.length);
+      const processedData = canvasData ? canvasData : "";
+      this.setData(processedData);
 
-    if (this.debugging) console.log("jpegCompressionRatio->", jpegCompressionRatio, " canvasData.length = ", canvasData.length);
-    const processedData = this.props.removebase64 ? canvasData ? canvasData.substring("data:image/png;base64".length) : "" : canvasData ? canvasData : "";
-    this.setData(processedData);
-    if (this.props.removebase64) {
-      //remove base64 prefix if property is set
-      this.props.uploadPicture({
-        data: processedData
-      });
-    } else {
       //Keep base 64 prefix as it is
       this.props.uploadPicture({
         data: processedData
       });
     }
   };
-  //-----------------------------------------------------------------------------------------------------------------------------------------
-  reduceBinaryImage = e => {
-    let imageSource = e.path && e.path[0] || e.srcElement; //Safari compliancy
-
-    if (this.debugging) console.log("imageSource = ", imageSource);
-    var canvas = document.createElement('canvas'),
-      context,
-      width = imageSource.width,
-      height = imageSource.height;
-
-    //Exact size props are set
-    if (this.props.width && this.props.height) {
-      //Check image size
-      if (width > this.props.width || height > this.props.height) {
-        alert("L'image est trop grande, le format requis est " + this.props.width + "x" + this.props.height);
-        return;
-      }
-
-      //Check image size
-      if (width < this.props.width || height < this.props.height) {
-        alert("L'image est trop petite, le format requis est " + this.props.width + "x" + this.props.height);
-        return;
-      }
-    }
-
-    //Max size props are set
-    if (this.props.maxWidth && this.props.maxHeight) {
-      if (width > height) {
-        //Check resize is enabled
-        if (!this.props.reduceImage) {
-          alert("L'image est trop large ! la largeur maximale est de " + this.props.maxWidth);
-          return;
-        }
-        if (width > this.props.maxWidth) {
-          height *= this.props.maxWidth / width;
-          width = this.props.maxWidth;
-        }
-      } else {
-        if (height > this.props.maxHeight) {
-          //Check resize is enabled
-          if (!this.props.reduceImage) {
-            alert("L'image est trop haute, la hauteur maximale est de " + this.props.maxHeight);
-            return;
-          }
-          width *= this.props.maxHeight / height;
-          height = this.props.maxHeight;
-        }
-      }
-    }
-
-    //Build 2d picture
-    canvas.width = width;
-    canvas.height = height;
-    context = canvas.getContext('2d');
-    context.drawImage(imageSource, 0, 0, width, height);
-
-    //Binary conversion using toBlob to maintain binary output
-    let jpegCompressionRatio = this.props.jpegQuality && this.props.jpegQuality > 0 && this.props.jpegQuality < 1 ? this.props.jpegQuality : 1;
-    canvas.toBlob(async blob => {
-      if (blob) {
-        console.log("Binary blob created, size:", blob.size);
-        if (this.debugging) console.log("jpegCompressionRatio->", jpegCompressionRatio, " blob.size = ", blob.size);
-
-        // Fallback: use blob URL for display but keep binary data
-        const blobUrl = URL.createObjectURL(blob);
-
-        // Convert blob to ArrayBuffer to maintain genuine binary data
-        const reader = new FileReader();
-        reader.onload = () => {
-          const binaryData = reader.result; // ArrayBuffer - genuine binary data
-          console.log("Fallback: Using binary data, size:", binaryData.byteLength);
-
-          // Store both display URL and binary data
-          this.setData(blobUrl, binaryData);
-          this.props.uploadPicture({
-            data: this.props.cloud_url_prefix,
-            // Pass the cloud URL for display
-            binaryData: null,
-            // Clear binary data since we now have a cloud URL
-            cloud_url_prefix: this.props.cloud_url_prefix,
-            // Pass cloud URL prefix if needed for parent component
-            isBlobUrl: false // The final URL is not a blob URL, it's a cloud URL
-          });
-
-          //Call the upload callback with both blob URL for display and binary data for upload
-          this.convert_blob_picture_into_cloud_file({
-            data: blobUrl,
-            // For display in img tag
-            binaryData: binaryData,
-            // Genuine JPEG binary stream
-            cloud_url_prefix: this.props.cloud_url_prefix,
-            // Pass cloud URL prefix if needed for parent component
-            isBlobUrl: true // Flag to track blob URLs for cleanup
-          });
-        };
-        reader.readAsArrayBuffer(blob);
-      } else {
-        console.error("Failed to create blob from canvas");
-      }
-    }, 'image/jpeg', jpegCompressionRatio);
-  };
 
   //-----------------------------------------------------------------------------------------------------------------------------------------
   storeBase64ImageToImg = e => {
-    var image = document.createElement('img');
-    image.onload = this.reduceBase64Image;
+    var DOM_image = document.createElement('img');
+    DOM_image.onload = this.reduceBase64Image;
     console.log("storeBase64ImageToImg:e.currentTarget.result = ", e.currentTarget.result);
-    image.src = e.currentTarget.result;
-  };
-
-  //-----------------------------------------------------------------------------------------------------------------------------------------
-  storeBinaryImageToImg = e => {
-    var image = document.createElement('img');
-    //2Do DEBUG image.onload = this.reduceImage;
-    console.log("storeBinaryImageToImg:e.currentTarget.result = ", e.currentTarget.result);
-    // Convert ArrayBuffer to Blob URL since image.src cannot accept ArrayBuffer directly
-    // Use the detected image type from the original file
-    const imageType = this.currentImageType || 'image/jpeg'; // fallback to jpeg
-    const blob = new Blob([e.currentTarget.result], {
-      type: imageType
-    });
-    const blobUrl = URL.createObjectURL(blob);
-    image.src = blobUrl;
-
-    // Clean up blob URL after image loads to prevent memory leaks
-    image.onload = loadEvent => {
-      this.reduceBinaryImage(loadEvent);
-      URL.revokeObjectURL(blobUrl);
-      // Clear the stored image type
-      this.currentImageType = null;
-    };
+    DOM_image.src = e.currentTarget.result;
   };
 
   //-----------------------------------------------------------------------------------------------------------------------------------------
@@ -366,18 +262,6 @@ class DsBlob extends _react.Component {
     _reader.readAsDataURL(aPictureFile); //The readAsDataURL() method of the FileReader interface is used to read the contents of the specified file's data as a base64 encoded string.
   };
 
-  //-----------------------------------------------------------------------------------------------------------------------------------------
-  readImageAsBinary = async aPictureFile => {
-    let _reader = new FileReader();
-    console.log("readImageAsBinary:aPictureFile = ", aPictureFile);
-
-    // Store the image type for use in storeBinaryImageToImg
-    this.currentImageType = aPictureFile.type;
-    console.log("Detected image type:", this.currentImageType);
-    _reader.onload = this.storeBinaryImageToImg;
-    _reader.readAsArrayBuffer(aPictureFile); //The readAsArrayBuffer() method reads the file as genuine binary content without base64 conversion.
-  };
-
   //-----------------------------------------------------------------------------------------------------------------------------------------
   resetUpload = () => {
     // Clean up any blob URLs before resetting
@@ -453,11 +337,7 @@ class DsBlob extends _react.Component {
       if (errCount == errs.length) {
         //None new error occurs
         if (this.debugging) console.log("readImageAsBase64::", file.name);
-        if (this.props.cloud_storage) {
-          this.readImageAsBinary(file);
-        } else {
-          this.readImageAsBase64(file);
-        }
+        this.readImageAsBase64(file);
       }
     });
     if (errs.length) {
@@ -480,8 +360,7 @@ class DsBlob extends _react.Component {
     }
 
     // Otherwise, treat as base64 and add appropriate prefix
-    const prefix = this.props.removebase64 ? "data:image/png;base64," : "";
-    return prefix + this.state.data;
+    return this.state.data;
   };
 
   //-----------------------------------------------------------------------------------------------------------------------------------------
@@ -580,17 +459,7 @@ class DsBlob extends _react.Component {
       type: "button",
       value: "Effacer",
       onClick: this.resetUpload
-    })), /*#__PURE__*/_react.default.createElement(_reactToastify.ToastContainer, {
-      position: "top-right",
-      autoClose: 3000,
-      hideProgressBar: false,
-      newestOnTop: false,
-      closeOnClick: true,
-      rtl: false,
-      pauseOnFocusLoss: true,
-      draggable: true,
-      pauseOnHover: true
-    }));
+    })));
   }
 }
 exports.DsBlob = DsBlob;
@@ -608,7 +477,6 @@ DsBlob.propTypes = {
   // Image processing options
   reduceImage: _propTypes.default.bool,
   jpegQuality: _propTypes.default.number,
-  removebase64: _propTypes.default.bool,
   // Cloud storage options
   cloud_storage: _propTypes.default.bool,
   cloud_url_prefix: _propTypes.default.string,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "datasync-blob",
-  "version": "1.1.25",
+  "version": "1.1.26",
   "description": "Datasync Blob component",
   "main": "./dist/components/DsBlob.js",
   "files": [
@@ -42,8 +42,5 @@
   },
   "keywords": [],
   "author": "",
-  "license": "ISC",
-  "dependencies": {
-    "react-toastify": "^11.1.0"
-  }
+  "license": "ISC"
 }