@threedddplus/logoeditor 0.0.125 → 0.0.127
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/logoeditor.cjs.development.js +17 -63
- package/dist/logoeditor.cjs.development.js.map +1 -1
- package/dist/logoeditor.cjs.production.min.js +1 -1
- package/dist/logoeditor.cjs.production.min.js.map +1 -1
- package/dist/logoeditor.esm.js +17 -63
- package/dist/logoeditor.esm.js.map +1 -1
- package/package.json +1 -1
@@ -2866,9 +2866,8 @@ var fabricSlice = function fabricSlice(set, get) {
|
|
2866
2866
|
testSVG: function testSVG(data) {
|
2867
2867
|
fabric.fabric.loadSVGFromURL(data, function (objects, options) {
|
2868
2868
|
var loadedObject = fabric.fabric.util.groupSVGElements(objects, options);
|
2869
|
-
|
2870
|
-
loadedObject.
|
2871
|
-
loadedObject.scaleToHeight(200);
|
2869
|
+
loadedObject.scaleToWidth(450);
|
2870
|
+
loadedObject.scaleToHeight(450);
|
2872
2871
|
var objImage = [];
|
2873
2872
|
var _Fills = [];
|
2874
2873
|
//@ts-ignore
|
@@ -4019,20 +4018,16 @@ var converterSlice = function converterSlice(set, get) {
|
|
4019
4018
|
if (canvasToLoad === void 0) {
|
4020
4019
|
canvasToLoad = use3dddPlus.getState().popupCanv;
|
4021
4020
|
}
|
4022
|
-
// console.log("svgstr\n",svgstr , 'color-VAL\n',colorValue ,'canvas\n' ,canvasToLoad);
|
4023
4021
|
fabric.fabric.loadSVGFromString(
|
4024
4022
|
//@ts-ignore
|
4025
4023
|
new String(svgstr), function (objects, options) {
|
4026
4024
|
var _canvasToLoad, _use3dddPlus$getState;
|
4027
4025
|
var svgData = getDesignConceptSVGData(svgstr);
|
4028
|
-
console.log(svgData);
|
4029
4026
|
var loadedObject = fabric.fabric.util.groupSVGElements(objects, options);
|
4030
4027
|
svgData.forEach(function (resItem) {
|
4031
4028
|
var path;
|
4032
4029
|
var node;
|
4033
4030
|
objects == null ? void 0 : objects.forEach(function (item) {
|
4034
|
-
//@ts-ignore
|
4035
|
-
// console.log(item.id, res[0].path.replace("#", ""));
|
4036
4031
|
//@ts-ignore
|
4037
4032
|
if (item.id === resItem.path) {
|
4038
4033
|
path = item;
|
@@ -4041,7 +4036,6 @@ var converterSlice = function converterSlice(set, get) {
|
|
4041
4036
|
node = item;
|
4042
4037
|
}
|
4043
4038
|
});
|
4044
|
-
console.log(node, path);
|
4045
4039
|
if (node && path) {
|
4046
4040
|
var _resItem$node$childre, _resItem$node$childre2;
|
4047
4041
|
var fontSize = (_resItem$node$childre = resItem.node.children[0]) == null ? void 0 : (_resItem$node$childre2 = _resItem$node$childre.getAttribute('font-size')) == null ? void 0 : _resItem$node$childre2.replace('px', '');
|
@@ -4089,7 +4083,7 @@ var converterSlice = function converterSlice(set, get) {
|
|
4089
4083
|
objImage.forEach(function (ele) {
|
4090
4084
|
var _ele$id;
|
4091
4085
|
ele.set({
|
4092
|
-
strokeWidth:
|
4086
|
+
strokeWidth: 3
|
4093
4087
|
});
|
4094
4088
|
ele.set({
|
4095
4089
|
id: (_ele$id = ele.id) != null ? _ele$id : use3dddPlus.getState().guid()
|
@@ -4192,28 +4186,7 @@ var converterSlice = function converterSlice(set, get) {
|
|
4192
4186
|
// loadedObject.id = use3dddPlus.getState().guid();
|
4193
4187
|
// loadedObject = new fabric.Group(objImage, options);
|
4194
4188
|
(_use3dddPlus$getState = use3dddPlus.getState().popupCanv) == null ? void 0 : _use3dddPlus$getState.clear();
|
4195
|
-
// use3dddPlus
|
4196
|
-
// .getState()
|
4197
|
-
// .popupCanv.setBackgroundColor(
|
4198
|
-
// {
|
4199
|
-
// source:
|
4200
|
-
// 'https://storage.googleapis.com/3ddplusgcp/logoEditor/assets/icons/checkerBoxBG.png',
|
4201
|
-
// repeat: 'repeat',
|
4202
|
-
// },
|
4203
|
-
// use3dddPlus
|
4204
|
-
// .getState()
|
4205
|
-
// .popupCanv.renderAll.bind(use3dddPlus.getState().popupCanv),
|
4206
|
-
// {
|
4207
|
-
// backgroundImageOpacity: 1,
|
4208
|
-
// scaleX: 1.1,
|
4209
|
-
// scaleY: 1.1,
|
4210
|
-
// backgroundRepeat: 'repeat',
|
4211
|
-
// }
|
4212
|
-
// );
|
4213
|
-
// const canvas = use3dddPlus.getState().popupCanv;
|
4214
4189
|
var gridSize = 83; // Size of each grid cell
|
4215
|
-
// var canvasWidth = canvas.width;
|
4216
|
-
// var canvasHeight = canvas.height;
|
4217
4190
|
var numCols = Math.ceil(canvasWidth / gridSize);
|
4218
4191
|
var numRows = Math.ceil(canvasHeight / gridSize);
|
4219
4192
|
// Function to create a rectangle with checkerboard pattern
|
@@ -4281,28 +4254,6 @@ var converterSlice = function converterSlice(set, get) {
|
|
4281
4254
|
use3dddPlus.getState().popUpCanvasUpdateModification(true);
|
4282
4255
|
});
|
4283
4256
|
};
|
4284
|
-
// function convertToFabricUnits(valueWithUnit, canvasHeight = 500) {
|
4285
|
-
// // Parse the value and unit from the string
|
4286
|
-
// const matches = valueWithUnit.match(/^([\d.]+)(\D+)$/);
|
4287
|
-
// if (!matches) {
|
4288
|
-
// throw new Error("Invalid value format. Value must be in the format 'numberunit', e.g., '10px'.");
|
4289
|
-
// }
|
4290
|
-
// const value = parseFloat(matches[1]);
|
4291
|
-
// const unit = matches[2];
|
4292
|
-
// // Define conversion ratios for different units
|
4293
|
-
// const conversionTable = {
|
4294
|
-
// 'px': 1,
|
4295
|
-
// 'em': 16, // Assuming 1em = 16px (default browser font size)
|
4296
|
-
// 'rem': 16, // Same as em
|
4297
|
-
// 'vh': canvasHeight / 100 // 1vh is 1% of canvas height
|
4298
|
-
// };
|
4299
|
-
// // Convert the value to pixels
|
4300
|
-
// if (unit in conversionTable) {
|
4301
|
-
// return value * conversionTable[unit];
|
4302
|
-
// } else {
|
4303
|
-
// throw new Error("Unsupported unit. Supported units are 'px', 'em', 'rem', 'vh'.");
|
4304
|
-
// }
|
4305
|
-
// }
|
4306
4257
|
var getDesignConceptSVGData = function getDesignConceptSVGData(svgData) {
|
4307
4258
|
var parser = new DOMParser();
|
4308
4259
|
var xmlDoc = parser.parseFromString(svgData, 'image/svg+xml');
|
@@ -4425,22 +4376,26 @@ var converterSlice = function converterSlice(set, get) {
|
|
4425
4376
|
if (convert === void 0) {
|
4426
4377
|
convert = true;
|
4427
4378
|
}
|
4428
|
-
console.log("ext\n", ext);
|
4429
|
-
// use3dddPlus.setState({ uploadImageModalDisplay: true });
|
4430
4379
|
use3dddPlus.setState({
|
4431
4380
|
loading: true
|
4432
4381
|
});
|
4433
4382
|
if (convert) {
|
4434
4383
|
if (isSVG) {
|
4435
|
-
|
4436
|
-
var reader = new FileReader();
|
4437
|
-
reader.onload = function (e) {
|
4384
|
+
if (ext === "vectorSVG") {
|
4438
4385
|
use3dddPlus.setState({
|
4439
|
-
imageData:
|
4386
|
+
imageData: data
|
4440
4387
|
});
|
4441
|
-
processImage(
|
4442
|
-
}
|
4443
|
-
|
4388
|
+
processImage(data, 8);
|
4389
|
+
} else {
|
4390
|
+
var reader = new FileReader();
|
4391
|
+
reader.onload = function (e) {
|
4392
|
+
use3dddPlus.setState({
|
4393
|
+
imageData: e.target.result
|
4394
|
+
});
|
4395
|
+
processImage(e.target.result, 8);
|
4396
|
+
};
|
4397
|
+
reader.readAsText(data);
|
4398
|
+
}
|
4444
4399
|
} else {
|
4445
4400
|
console.log("entering INTO ImageTracer-->");
|
4446
4401
|
ImageTracer.imageToSVG(data, function (svgstr) {
|
@@ -7367,7 +7322,6 @@ var PopUpCanvas = function PopUpCanvas() {
|
|
7367
7322
|
}));
|
7368
7323
|
};
|
7369
7324
|
|
7370
|
-
// import axios, { AxiosRequestConfig } from 'axios';
|
7371
7325
|
var UploadLogo = function UploadLogo() {
|
7372
7326
|
var _useState = React.useState(null),
|
7373
7327
|
setSelectedFile = _useState[1];
|
@@ -7466,7 +7420,7 @@ var UploadLogo = function UploadLogo() {
|
|
7466
7420
|
fetch(vectorizeImage.svg_url).then(function (response) {
|
7467
7421
|
return response.text();
|
7468
7422
|
}).then(function (svgText) {
|
7469
|
-
imageToSVG(svgText, '
|
7423
|
+
imageToSVG(svgText, 'vectorSVG', true);
|
7470
7424
|
use3dddPlus.setState({
|
7471
7425
|
loading: false
|
7472
7426
|
});
|