@threedddplus/logoeditor 0.0.123 → 0.0.124

package/dist/logoeditor.cjs.development.js

@@ -1824,6 +1824,9 @@ var toastMessages =
   },
   noIteminCanvas: function noIteminCanvas() {
     return CustomToast('warning', 'No item in canvas to save', 10);
+  },
+  fileSize: function fileSize() {
+    return CustomToast('warning', 'We cannot process this file because it is larger than 25MB. Please decrease the size and try again.', 11);
   }
 };
 
@@ -2178,6 +2181,59 @@ var lambdaSlice = function lambdaSlice(_set, _get) {
         return _saveLogo.apply(this, arguments);
       }
       return saveLogo;
+    }(),
+    vectorize: function () {
+      var _vectorize = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4(data) {
+        var formData, config, response;
+        return _regeneratorRuntime().wrap(function _callee4$(_context4) {
+          while (1) switch (_context4.prev = _context4.next) {
+            case 0:
+              formData = new FormData();
+              formData.append('image', data);
+              console.log(data, formData);
+              config = {
+                headers: {
+                  'Content-Type': 'multipart/form-data'
+                }
+              };
+              _context4.prev = 4;
+              use3dddPlus.setState({
+                loading: true
+              });
+              if (requests) {
+                _context4.next = 8;
+                break;
+              }
+              throw new Error('lambdaClient Not Found');
+            case 8:
+              _context4.next = 10;
+              return requests.post('/image-vectorizer', {
+                'image': data
+              }, config);
+            case 10:
+              response = _context4.sent;
+              use3dddPlus.setState({
+                loading: false
+              });
+              return _context4.abrupt("return", response);
+            case 15:
+              _context4.prev = 15;
+              _context4.t0 = _context4["catch"](4);
+              console.error(_context4.t0);
+              use3dddPlus.setState({
+                loading: false
+              });
+              throw new Error(_context4.t0);
+            case 20:
+            case "end":
+              return _context4.stop();
+          }
+        }, _callee4, null, [[4, 15]]);
+      }));
+      function vectorize(_x3) {
+        return _vectorize.apply(this, arguments);
+      }
+      return vectorize;
     }()
   };
 };
@@ -6685,7 +6741,6 @@ var PopUpCanvas = function PopUpCanvas() {
     if (document.getElementById('imageCanvas')) {
       var _canvas = use3dddPlus.getState().popupCanv;
       var outerCanvasContainer = document.getElementById('imageCanvas');
-      console.log(outerCanvasContainer);
       var containerWidth = outerCanvasContainer.clientWidth;
       var scale = containerWidth / _canvas.getWidth();
       var zoom = _canvas.getZoom() * scale;
@@ -6876,20 +6931,6 @@ var PopUpCanvas = function PopUpCanvas() {
       return '';
     }
   };
-  /*
-  const resetHandler = () => {
-    console.log(use3dddPlus.getState().forPopupCanvasReset);
-    popupCanvas.clear();
-    popupCanvas.loadFromJSON(
-      use3dddPlus.getState().forPopupCanvasReset,
-      function () {
-        use3dddPlus.setState({
-          colorFill: { ...use3dddPlus.getState().forPopupCanvasColor },
-        });
-        popupCanvas.renderAll();
-      }
-    );
-  };*/
   var resetHandler = function resetHandler() {
     use3dddPlus.getState().popUpCanvasUpdateModification(true);
     var colors = use3dddPlus.getState().popupCanvasStoreHistory[0].colorFill;
@@ -7326,22 +7367,32 @@ var PopUpCanvas = function PopUpCanvas() {
   }));
 };
 
-// import axios from 'axios';
+// import axios, { AxiosRequestConfig } from 'axios';
 var UploadLogo = function UploadLogo() {
   var _useState = React.useState(null),
     setSelectedFile = _useState[1];
   var _use3dddPlus = use3dddPlus(function (state) {
       return [state.tiffConvert, state.imageToSVG, state.setFile, state.uploadImageModalDisplay,
       // state.pdfConverter,
-      state.aiConvert];
+      state.aiConvert,
+      // state.loadImageFromURL,
+      state.vectorize];
     }, shallow.shallow),
     tiffConvert = _use3dddPlus[0],
     imageToSVG = _use3dddPlus[1],
     setFile = _use3dddPlus[2],
     uploadImageModalDisplay = _use3dddPlus[3],
     // pdfConverter,
-    aiConvert = _use3dddPlus[4];
+    aiConvert = _use3dddPlus[4],
+    vectorize = _use3dddPlus[5];
   var handleFileSelect = function handleFileSelect(file) {
+    var fileSize = file.size;
+    var fileSizeInKB = fileSize / 1024;
+    var fileSizeInMB = fileSizeInKB / 1024;
+    if (fileSizeInMB > 24) {
+      use3dddPlus.getState().toastMessages.fileSize();
+      return;
+    }
     setSelectedFile(file);
     setFile(file);
     svgConverter(file);
@@ -7350,7 +7401,7 @@ var UploadLogo = function UploadLogo() {
 
   var svgConverter = /*#__PURE__*/function () {
     var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(data) {
-      var ext, tiffData, aiToSvg, formData, response, blob, imageUrl;
+      var ext, tiffData, aiToSvg, vectorizeImage;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
@@ -7364,7 +7415,7 @@ var UploadLogo = function UploadLogo() {
               break;
             }
             imageToSVG(data, ext, true);
-            _context.next = 36;
+            _context.next = 28;
             break;
           case 6:
             if (!(ext === 'tif' || ext === 'tiff')) {
@@ -7376,11 +7427,11 @@ var UploadLogo = function UploadLogo() {
           case 9:
             tiffData = _context.sent;
             imageToSVG(tiffData, ext);
-            _context.next = 36;
+            _context.next = 28;
             break;
           case 13:
             if (!(ext === 'ai' || ext === 'pdf')) {
-              _context.next = 21;
+              _context.next = 22;
               break;
             }
             use3dddPlus.setState({
@@ -7390,6 +7441,7 @@ var UploadLogo = function UploadLogo() {
             return aiConvert(data);
           case 17:
             aiToSvg = _context.sent;
+            console.log(aiToSvg);
             fetch(aiToSvg.s3_file_url + '?timestamp=' + Date.now()).then(function (response) {
               return response.text();
             }).then(function (svgText) {
@@ -7400,51 +7452,33 @@ var UploadLogo = function UploadLogo() {
                 loading: false
               });
             });
-            _context.next = 36;
+            _context.next = 28;
             break;
-          case 21:
-            formData = new FormData();
-            formData.append('image', data);
-            /*  axios({
-                url: "https://vectorizer.ai/api/v1/vectorize",
-                method: "POST",
-                headers :{
-                  user: 'vks34swmmj4s8wg',
-                  pass: 'f9ivolvk1mc5khc7ja53bp2rst5d4cuk5q02oqfoj3mn1ag3sig2',
-                },
-                data: formData,
-            })
-            .then((res) => {console.log(res);})
-            .catch((err) => {console.log(err)});*/
-            _context.next = 25;
-            return fetch('https://imagesharpher-f4b4o225iq-ue.a.run.app/upload', {
-              method: 'POST',
-              /*headers :{
-                user: 'vks34swmmj4s8wg',
-                pass: 'f9ivolvk1mc5khc7ja53bp2rst5d4cuk5q02oqfoj3mn1ag3sig2',
-              },*/
-              body: formData
+          case 22:
+            use3dddPlus.setState({
+              loading: true
             });
+            _context.next = 25;
+            return vectorize(data);
           case 25:
-            response = _context.sent;
-            if (!response.ok) {
-              _context.next = 35;
-              break;
-            }
-            console.log(response);
-            _context.next = 30;
-            return response.blob();
-          case 30:
-            blob = _context.sent;
-            imageUrl = URL.createObjectURL(blob);
-            imageToSVG(imageUrl, ext);
-            _context.next = 36;
-            break;
-          case 35:
-            alert('Failed to process the image');
-          case 36:
+            vectorizeImage = _context.sent;
+            console.log(vectorizeImage.svg_url);
+            fetch(vectorizeImage.svg_url).then(function (response) {
+              return response.text();
+            }).then(function (svgText) {
+              imageToSVG(svgText, 'svg', false, false);
+              use3dddPlus.setState({
+                loading: false
+              });
+            })["catch"](function (ex) {
+              console.log(ex);
+              use3dddPlus.setState({
+                loading: false
+              });
+            });
+          case 28:
             setSelectedFile(null);
-          case 37:
+          case 29:
           case "end":
             return _context.stop();
         }
@@ -14332,6 +14366,7 @@ var SaveDesign = function SaveDesign(_ref) {
             return _context.abrupt("return");
           case 3:
             setIsSaving(true);
+            canvas.backgroundColor = null;
             canvasGetobject = canvas.getObjects();
             canvasGetobject.forEach(function (obj) {
               if (obj.type === 'line') {
@@ -14377,11 +14412,10 @@ var SaveDesign = function SaveDesign(_ref) {
               }
             }
             dataCh = JSON.stringify(canvasData);
-            _context.next = 15;
+            _context.next = 16;
             return uploadLogoConfig(dataCh, use3dddPlus.getState().customerId);
-          case 15:
+          case 16:
             S3UrlPath = _context.sent;
-            canvas.backgroundColor = null;
             canvasSvg = canvas.toSVG();
             closeModal('', false, '', {});
             raw = JSON.stringify({