@threedddplus/logoeditor 0.0.186 → 0.0.187

package/dist/logoeditor.cjs.development.js

@@ -1859,6 +1859,9 @@ var toastMessages =
   },
   noChangesMade: function noChangesMade() {
     return CustomToast('warning', 'No Changes Made To Save!!!', 12);
+  },
+  fontsNotAvailable: function fontsNotAvailable() {
+    return CustomToast('warning', 'Fonts not availble in-order to view the proper text', 13);
   }
 };
 
@@ -3845,6 +3848,7 @@ var converterSlice = function converterSlice(set, get) {
       var _canvasToLoad, _use3dddPlus$getState;
       var svgData = getDesignConceptSVGData(svgstr);
       var loadedObject = fabric.fabric.util.groupSVGElements(objects, options);
+      console.log("SVG DATA--->", svgData);
       svgData.forEach(function (resItem) {
         var path;
         var node;
@@ -3872,8 +3876,6 @@ var converterSlice = function converterSlice(set, get) {
           node.setCoords();
         }
       });
-      // loadedObject.scaleToHeight(300);
-      // loadedObject.scaleToWidth(300);
       var canvas = (_canvasToLoad = canvasToLoad) != null ? _canvasToLoad : use3dddPlus.getState().popupCanv;
       var canvasWidth = canvas.width;
       var canvasHeight = canvas.height;
@@ -4096,21 +4098,55 @@ var converterSlice = function converterSlice(set, get) {
       }
     });
   };
+  // IF REQURIED RE-USE IN FUTURE
+  /* const checkFontAvailability = (fontFamily) => {
+     const testElement = document.createElement('div');
+     testElement.style.fontFamily = fontFamily;
+     testElement.style.position = 'absolute';
+     testElement.style.left = '-9999px';
+     testElement.textContent = 'Sample text';
+     document.body.appendChild(testElement);
+   
+     const computedFont = window.getComputedStyle(testElement).fontFamily;
+     document.body.removeChild(testElement);
+   
+     return computedFont.includes(fontFamily);
+   };*/
   var getDesignConceptSVGData = function getDesignConceptSVGData(svgData) {
     var parser = new DOMParser();
     var xmlDoc = parser.parseFromString(svgData, 'image/svg+xml');
     var textElements = xmlDoc.querySelectorAll('textPath');
     var href = [];
+    // const availableFonts =  [];
+    // const paths = xmlDoc.querySelectorAll('text');
+    /*paths.forEach((path) => {
+      const fontFamily = path.style.fontFamily;
+      console.log('fontFamily:', fontFamily);
+      if (fontFamily) {
+        const isFontAvailable = checkFontAvailability(fontFamily);
+        availableFonts.push({
+          font:"${fontFamily}"
+        })
+        console.log(`Is the font "${fontFamily}" loaded?`, isFontAvailable);
+        if(!isFontAvailable)use3dddPlus.getState().toastMessages.fontsNotAvailable();
+      }else{
+        use3dddPlus.getState().toastMessages.fontsNotAvailable();
+      }
+    });*/
     textElements.forEach(function (textElement) {
-      var _textElement$getAttri, _textElement$parentNo;
+      var _textElement$getAttri;
       var hrefValue = (_textElement$getAttri = textElement == null ? void 0 : textElement.getAttribute('xlink:href')) != null ? _textElement$getAttri : textElement == null ? void 0 : textElement.getAttribute('href');
-      if (hrefValue) href.push({
-        path: hrefValue.replace('#', ''),
-        //@ts-ignore
-        element: textElement == null ? void 0 : (_textElement$parentNo = textElement.parentNode) == null ? void 0 : _textElement$parentNo.id,
-        node: textElement
-      });
+      if (hrefValue) {
+        var _textElement$parentNo;
+        href.push({
+          path: hrefValue.replace('#', ''),
+          //@ts-ignore
+          element: textElement == null ? void 0 : (_textElement$parentNo = textElement.parentNode) == null ? void 0 : _textElement$parentNo.id,
+          node: textElement
+        });
+      }
     });
+    // return { href, availableFonts }; 
     return href;
   };
   return {
@@ -14510,20 +14546,20 @@ var SaveDesign = function SaveDesign(_ref) {
     } else return true;
   };
   var onSaveHandler = /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
-      var canvasGetobject, pathTextsData, selectAllCanvasObjects, canvasData, pathTextsKeys, i, pathData, o, obj, dataCh, S3UrlPath, canvasSvg, raw, horizontalLine, verticalLine;
-      return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-        while (1) switch (_context2.prev = _context2.next) {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+      var canvasGetobject, pathTextsData, canvasData, pathTextsKeys, i, pathData, o, obj, dataCh, S3UrlPath, canvasSvg, raw, horizontalLine, verticalLine;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
           case 0:
             if (isSaving) {
-              _context2.next = 31;
+              _context.next = 31;
               break;
             }
             if (checkValidations()) {
-              _context2.next = 3;
+              _context.next = 3;
               break;
             }
-            return _context2.abrupt("return");
+            return _context.abrupt("return");
           case 3:
             setIsSaving(true);
             canvas.backgroundColor = null;
@@ -14565,66 +14601,54 @@ var SaveDesign = function SaveDesign(_ref) {
                 };
               }
             });
-            selectAllCanvasObjects = function selectAllCanvasObjects(padding) {
-              if (padding === void 0) {
-                padding = 20;
-              }
-              //@ts-ignore
-              return new Promise(function (resolve, reject) {
-                var objs = canvas.getObjects().map(function (obj) {
-                  return obj.set('active', true);
-                });
-                var group = new fabric.fabric.ActiveSelection(objs, {
-                  canvas: canvas,
-                  originX: 'center',
-                  originY: 'center'
-                });
-                canvas.setActiveObject(group);
-                canvas.requestRenderAll();
-                group.clone(function (clonedGroup) {
-                  var boundingRect = clonedGroup.getBoundingRect();
-                  var paddedWidth = boundingRect.width + 2 * padding;
-                  var paddedHeight = boundingRect.height + 2 * padding;
-                  tempCanvas.setWidth(paddedWidth);
-                  tempCanvas.setHeight(paddedHeight);
-                  clonedGroup.left = padding + boundingRect.left;
-                  clonedGroup.top = padding + boundingRect.top;
-                  clonedGroup.setCoords();
-                  tempCanvas.add(clonedGroup);
-                  clonedGroup.center();
-                  clonedGroup.setCoords();
-                  tempCanvas.requestRenderAll();
-                  var dataURL = tempCanvas.toDataURL();
-                  tempCanvas.clear();
-                  tempCanvas.dispose();
-                  clonedGroup = null;
-                  canvas.discardActiveObject();
-                  resolve(dataURL);
-                });
-              });
-            };
-            _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-              return _regeneratorRuntime().wrap(function _callee$(_context) {
-                while (1) switch (_context.prev = _context.next) {
-                  case 0:
-                    _context.prev = 0;
-                    _context.next = 3;
-                    return selectAllCanvasObjects();
-                  case 3:
-                    dataURL = _context.sent;
-                    _context.next = 9;
-                    break;
-                  case 6:
-                    _context.prev = 6;
-                    _context.t0 = _context["catch"](0);
-                    console.error('Error capturing canvas objects:', _context.t0);
-                  case 9:
-                  case "end":
-                    return _context.stop();
-                }
-              }, _callee, null, [[0, 6]]);
-            }))();
-            canvasData = use3dddPlus.getState().applyColorFill(); // looping through the text shape objects & taking out text data to inject in the canvas json data & save
+            /*  const selectAllCanvasObjects = (padding: number = 20): Promise<string> => {
+                //@ts-ignore
+                return new Promise((resolve, reject) => {
+                    const objs = canvas.getObjects().map(obj => obj.set('active', true));
+                    const group = new fabric.ActiveSelection(objs, {
+                        canvas: canvas,
+                        originX: 'center',
+                        originY: 'center'
+                    });
+                    canvas.setActiveObject(group);
+                    canvas.requestRenderAll();
+            
+                    group.clone((clonedGroup) => {
+                      const boundingRect = clonedGroup.getBoundingRect();
+                      const paddedWidth = boundingRect.width + 2 * padding;
+                      const paddedHeight = boundingRect.height + 2 * padding;
+                                  tempCanvas.setWidth(paddedWidth);
+                      tempCanvas.setHeight(paddedHeight);
+                      clonedGroup.left = padding + boundingRect.left;
+                      clonedGroup.top = padding + boundingRect.top;
+                      clonedGroup.setCoords();
+                      
+                      tempCanvas.add(clonedGroup);
+                      clonedGroup.center();
+                      clonedGroup.setCoords();
+                      tempCanvas.requestRenderAll();
+                      const dataURL = tempCanvas.toDataURL();
+            
+                      tempCanvas.clear();
+                      tempCanvas.dispose();
+                      clonedGroup = null;
+                      canvas.discardActiveObject();
+                      resolve(dataURL);
+                    });
+                });
+            };
+            
+            (async () => {
+                try {
+                     dataURL = await selectAllCanvasObjects();
+                } catch (error) {
+                    console.error('Error capturing canvas objects:', error);
+                }
+            })();*/
+            canvasData = use3dddPlus.getState().applyColorFill();
+            dataURL = canvas.toDataURL();
+            console.log('CANVASIMAGE--->', dataURL);
+            // looping through the text shape objects & taking out text data to inject in the canvas json data & save
             pathTextsKeys = Object.keys(pathTextsData);
             for (i = 0; i < pathTextsKeys.length; i++) {
               pathData = pathTextsData[pathTextsKeys[i]];
@@ -14636,10 +14660,10 @@ var SaveDesign = function SaveDesign(_ref) {
               }
             }
             dataCh = JSON.stringify(canvasData);
-            _context2.next = 17;
+            _context.next = 17;
             return uploadLogoConfig(dataCh, use3dddPlus.getState().customerId);
           case 17:
-            S3UrlPath = _context2.sent;
+            S3UrlPath = _context.sent;
             canvasSvg = canvas.toSVG();
             closeModal('', false, '', {});
             raw = JSON.stringify({
@@ -14692,9 +14716,9 @@ var SaveDesign = function SaveDesign(_ref) {
             });
           case 33:
           case "end":
-            return _context2.stop();
+            return _context.stop();
         }
-      }, _callee2);
+      }, _callee);
     }));
     return function onSaveHandler() {
       return _ref2.apply(this, arguments);