@threedddplus/logoeditor 0.0.103 → 0.0.105
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 +295 -150
- 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 +295 -150
- package/dist/logoeditor.esm.js.map +1 -1
- package/package.json +1 -1
package/dist/logoeditor.esm.js
CHANGED
@@ -3974,18 +3974,75 @@ var converterSlice = function converterSlice(set, get) {
|
|
3974
3974
|
fabric.loadSVGFromString(
|
3975
3975
|
//@ts-ignore
|
3976
3976
|
new String(svgstr), function (objects, options) {
|
3977
|
+
var svgData = getDesignConceptSVGData(svgstr);
|
3978
|
+
console.log(svgData);
|
3977
3979
|
var loadedObject = fabric.util.groupSVGElements(objects, options);
|
3978
|
-
|
3979
|
-
|
3980
|
+
svgData.forEach(function (resItem) {
|
3981
|
+
var path;
|
3982
|
+
var node;
|
3983
|
+
objects == null ? void 0 : objects.forEach(function (item) {
|
3984
|
+
//@ts-ignore
|
3985
|
+
// console.log(item.id, res[0].path.replace("#", ""));
|
3986
|
+
//@ts-ignore
|
3987
|
+
if (item.id === resItem.path) {
|
3988
|
+
path = item;
|
3989
|
+
//@ts-ignore
|
3990
|
+
} else if (item.id === resItem.element) {
|
3991
|
+
node = item;
|
3992
|
+
}
|
3993
|
+
});
|
3994
|
+
if (node && path) {
|
3995
|
+
var _resItem$node$childre, _resItem$node$childre2;
|
3996
|
+
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', '');
|
3997
|
+
console.log('fontSize', resItem.node.children[0], fontSize, path.top, path.left, path.textWidth, path.width);
|
3998
|
+
node.set({
|
3999
|
+
path: path,
|
4000
|
+
top: path.top,
|
4001
|
+
left: path.left,
|
4002
|
+
pathStartOffset: path.width * parseFloat(resItem.node.startOffset.baseVal.valueAsString) / 100,
|
4003
|
+
// fontFamily: resItem.node.children[0].getAttribute("font-family"),
|
4004
|
+
fontSize: fontSize || 25 //convertToFabricUnits("25px"),
|
4005
|
+
// charSpacing: resItem.node.getAttribute("letter-spacing") //convertToFabricUnits(resItem.node.getAttribute("letter-spacing")),
|
4006
|
+
// stroke: resItem.node.children[0].getAttribute("stroke"),
|
4007
|
+
// fill: '#040404'
|
4008
|
+
});
|
4009
|
+
|
4010
|
+
node.setCoords();
|
4011
|
+
}
|
4012
|
+
});
|
4013
|
+
// loadedObject.scaleToHeight(300);
|
4014
|
+
// loadedObject.scaleToWidth(300);
|
4015
|
+
var canvas = use3dddPlus.getState().popupCanv;
|
4016
|
+
var canvasWidth = canvas.width;
|
4017
|
+
var canvasHeight = canvas.height;
|
4018
|
+
var val = 300;
|
4019
|
+
if ((loadedObject.width <= 200 || loadedObject.height <= 200) && (loadedObject.minX === -0 || loadedObject.minX)) {
|
4020
|
+
val = 600;
|
4021
|
+
}
|
4022
|
+
if (Math.ceil(loadedObject.width + loadedObject.left + 45) >= Math.floor(canvasWidth)) {
|
4023
|
+
loadedObject.scaleToWidth(val);
|
4024
|
+
} else if (Math.ceil(loadedObject.height + loadedObject.top + 10) >= Math.floor(canvasHeight)) {
|
4025
|
+
loadedObject.scaleToHeight(val);
|
4026
|
+
} else if (Math.ceil(loadedObject.left) < 0) {
|
4027
|
+
loadedObject.scaleToWidth(val);
|
4028
|
+
} else if (Math.ceil(loadedObject.top) < 0) {
|
4029
|
+
loadedObject.scaleToHeight(val);
|
4030
|
+
} else if (loadedObject.width < 200 || loadedObject.height < 200) {
|
4031
|
+
loadedObject.scaleToWidth(val);
|
4032
|
+
}
|
3980
4033
|
//@ts-ignore
|
3981
4034
|
var objImage = loadedObject == null ? void 0 : loadedObject._objects;
|
3982
4035
|
var _Fills = [];
|
3983
4036
|
var fillCounts = {};
|
4037
|
+
var colorObjects = {};
|
3984
4038
|
if (objImage) {
|
3985
4039
|
objImage.forEach(function (ele) {
|
3986
4040
|
ele.set({
|
3987
4041
|
strokeWidth: 0
|
3988
4042
|
});
|
4043
|
+
ele.set({
|
4044
|
+
id: use3dddPlus.getState().guid()
|
4045
|
+
});
|
3989
4046
|
if (typeof ele.fill === "string" && ele.fill !== "") {
|
3990
4047
|
set({
|
3991
4048
|
fillColor: [].concat(ele.fill)
|
@@ -3993,6 +4050,13 @@ var converterSlice = function converterSlice(set, get) {
|
|
3993
4050
|
var fillColor = ele.fill.toString();
|
3994
4051
|
var pixelCount = ele.width * ele.height;
|
3995
4052
|
fillCounts[fillColor] = (fillCounts[fillColor] || 0) + pixelCount;
|
4053
|
+
if (colorObjects[fillColor]) {
|
4054
|
+
colorObjects[fillColor].objects.push(ele.get("id"));
|
4055
|
+
} else {
|
4056
|
+
colorObjects[fillColor] = {
|
4057
|
+
objects: [ele.get("id")]
|
4058
|
+
};
|
4059
|
+
}
|
3996
4060
|
}
|
3997
4061
|
});
|
3998
4062
|
}
|
@@ -4003,12 +4067,17 @@ var converterSlice = function converterSlice(set, get) {
|
|
4003
4067
|
return fillCounts[b] - fillCounts[a];
|
4004
4068
|
});
|
4005
4069
|
var topColors = sortedFillColors.slice(0, colorValue);
|
4070
|
+
var colorObjectsHex = {};
|
4006
4071
|
topColors.map(function (e) {
|
4007
4072
|
if (e.search("#") === -1) {
|
4008
4073
|
var _C = get().RGBToHex(e);
|
4009
4074
|
_Fills.push(_C);
|
4075
|
+
colorObjects[e].hex = _C;
|
4076
|
+
colorObjectsHex[_C] = colorObjects[e];
|
4010
4077
|
} else {
|
4011
4078
|
_Fills.push(e);
|
4079
|
+
colorObjects[e].hex = e;
|
4080
|
+
colorObjectsHex[e] = colorObjects[e];
|
4012
4081
|
}
|
4013
4082
|
});
|
4014
4083
|
//@ts-ignore
|
@@ -4030,7 +4099,8 @@ var converterSlice = function converterSlice(set, get) {
|
|
4030
4099
|
defaultCF.push({
|
4031
4100
|
property: cf,
|
4032
4101
|
"default": fillColors[cf],
|
4033
|
-
updated: fillColors[cf]
|
4102
|
+
updated: fillColors[cf],
|
4103
|
+
objects: colorObjectsHex[fillColors[cf]].objects
|
4034
4104
|
});
|
4035
4105
|
});
|
4036
4106
|
use3dddPlus.setState({
|
@@ -4089,10 +4159,10 @@ var converterSlice = function converterSlice(set, get) {
|
|
4089
4159
|
// backgroundRepeat: 'repeat',
|
4090
4160
|
// }
|
4091
4161
|
// );
|
4092
|
-
|
4162
|
+
// const canvas = use3dddPlus.getState().popupCanv;
|
4093
4163
|
var gridSize = 15; // Size of each grid cell
|
4094
|
-
var canvasWidth = canvas.width;
|
4095
|
-
var canvasHeight = canvas.height;
|
4164
|
+
// var canvasWidth = canvas.width;
|
4165
|
+
// var canvasHeight = canvas.height;
|
4096
4166
|
var numCols = Math.ceil(canvasWidth / gridSize);
|
4097
4167
|
var numRows = Math.ceil(canvasHeight / gridSize);
|
4098
4168
|
// Function to create a rectangle with checkerboard pattern
|
@@ -4159,6 +4229,45 @@ var converterSlice = function converterSlice(set, get) {
|
|
4159
4229
|
use3dddPlus.getState().popUpCanvasUpdateModification(true);
|
4160
4230
|
});
|
4161
4231
|
};
|
4232
|
+
// function convertToFabricUnits(valueWithUnit, canvasHeight = 500) {
|
4233
|
+
// // Parse the value and unit from the string
|
4234
|
+
// const matches = valueWithUnit.match(/^([\d.]+)(\D+)$/);
|
4235
|
+
// if (!matches) {
|
4236
|
+
// throw new Error("Invalid value format. Value must be in the format 'numberunit', e.g., '10px'.");
|
4237
|
+
// }
|
4238
|
+
// const value = parseFloat(matches[1]);
|
4239
|
+
// const unit = matches[2];
|
4240
|
+
// // Define conversion ratios for different units
|
4241
|
+
// const conversionTable = {
|
4242
|
+
// 'px': 1,
|
4243
|
+
// 'em': 16, // Assuming 1em = 16px (default browser font size)
|
4244
|
+
// 'rem': 16, // Same as em
|
4245
|
+
// 'vh': canvasHeight / 100 // 1vh is 1% of canvas height
|
4246
|
+
// };
|
4247
|
+
// // Convert the value to pixels
|
4248
|
+
// if (unit in conversionTable) {
|
4249
|
+
// return value * conversionTable[unit];
|
4250
|
+
// } else {
|
4251
|
+
// throw new Error("Unsupported unit. Supported units are 'px', 'em', 'rem', 'vh'.");
|
4252
|
+
// }
|
4253
|
+
// }
|
4254
|
+
var getDesignConceptSVGData = function getDesignConceptSVGData(svgData) {
|
4255
|
+
var parser = new DOMParser();
|
4256
|
+
var xmlDoc = parser.parseFromString(svgData, 'image/svg+xml');
|
4257
|
+
var textElements = xmlDoc.querySelectorAll('textPath');
|
4258
|
+
var href = [];
|
4259
|
+
textElements.forEach(function (textElement) {
|
4260
|
+
var _textElement$getAttri, _textElement$parentNo;
|
4261
|
+
var hrefValue = (_textElement$getAttri = textElement == null ? void 0 : textElement.getAttribute('xlink:href')) != null ? _textElement$getAttri : textElement == null ? void 0 : textElement.getAttribute('href');
|
4262
|
+
if (hrefValue) href.push({
|
4263
|
+
path: hrefValue.replace('#', ''),
|
4264
|
+
//@ts-ignore
|
4265
|
+
element: textElement == null ? void 0 : (_textElement$parentNo = textElement.parentNode) == null ? void 0 : _textElement$parentNo.id,
|
4266
|
+
node: textElement
|
4267
|
+
});
|
4268
|
+
});
|
4269
|
+
return href;
|
4270
|
+
};
|
4162
4271
|
return {
|
4163
4272
|
fillColor: [],
|
4164
4273
|
file: {},
|
@@ -4353,7 +4462,7 @@ var converterSlice = function converterSlice(set, get) {
|
|
4353
4462
|
changeSVGColor: function changeSVGColor(property, color) {
|
4354
4463
|
use3dddPlus.getState().popUpCanvasUpdateModification(true);
|
4355
4464
|
var fillColor = _extends({}, use3dddPlus.getState().colorFill);
|
4356
|
-
|
4465
|
+
// const previousColor = fillColor[property];
|
4357
4466
|
//const SelectedObjet = use3dddPlus.getState().activeSelection;
|
4358
4467
|
// console.log("Color_CHANGING--->",SelectedObjet.colorFill);
|
4359
4468
|
// let _newObj = SelectedObjet.colorFill;
|
@@ -4375,27 +4484,45 @@ var converterSlice = function converterSlice(set, get) {
|
|
4375
4484
|
// .getState()
|
4376
4485
|
// .popupCanv.getActiveObject()._objects;
|
4377
4486
|
if (use3dddPlus.getState().loadedObject) {
|
4378
|
-
|
4379
|
-
objImage.
|
4380
|
-
|
4381
|
-
|
4382
|
-
|
4487
|
+
// let objImage1 = use3dddPlus.getState().popupCanv.getObjects();
|
4488
|
+
var objImage = use3dddPlus.getState().popupCanv.getActiveObject();
|
4489
|
+
if (objImage && objImage._objects) {
|
4490
|
+
objImage._objects.forEach(function (ele) {
|
4491
|
+
var defaultColorObject = null;
|
4492
|
+
if (use3dddPlus.getState().defaultColorFill) {
|
4493
|
+
defaultColorObject = use3dddPlus.getState().defaultColorFill.find(function (dcf) {
|
4494
|
+
return dcf.property === property;
|
4495
|
+
});
|
4496
|
+
}
|
4497
|
+
if (ele.id && defaultColorObject && defaultColorObject.objects && defaultColorObject.objects.includes(ele.id) && typeof ele.fill === "string" && ele.fill !== "") {
|
4498
|
+
// const _C = (ele.fill === 'transparent' || (typeof ele.fill === 'string' && ele.fill.includes('#')) ? ele.fill : get().RGBToHex(ele.fill));
|
4499
|
+
// if (_C === previousColor) {
|
4383
4500
|
ele.set({
|
4384
4501
|
fill: color
|
4385
4502
|
});
|
4503
|
+
// }
|
4386
4504
|
}
|
4387
|
-
|
4388
|
-
|
4389
|
-
|
4390
|
-
|
4391
|
-
|
4392
|
-
|
4393
|
-
|
4394
|
-
|
4395
|
-
|
4396
|
-
|
4397
|
-
|
4398
|
-
|
4505
|
+
// if(typeof ele.fill === "string" && ele.fill !== ""){
|
4506
|
+
// const _C = (ele.fill === 'transparent' || (typeof ele.fill === 'string' && ele.fill.includes('#')) ? ele.fill : get().RGBToHex(ele.fill));
|
4507
|
+
// if (_C === previousColor) {
|
4508
|
+
// ele.set({
|
4509
|
+
// fill: color,
|
4510
|
+
// });
|
4511
|
+
// }
|
4512
|
+
// }
|
4513
|
+
});
|
4514
|
+
|
4515
|
+
use3dddPlus.getState().popupCanv.renderAll();
|
4516
|
+
fillColor[property] = color;
|
4517
|
+
// Object.keys(fillColor).forEach((fc: any) => {
|
4518
|
+
// if(fillColor[fc] === previousColor){
|
4519
|
+
// fillColor[fc] = color;
|
4520
|
+
// }
|
4521
|
+
// });
|
4522
|
+
use3dddPlus.setState({
|
4523
|
+
colorFill: fillColor
|
4524
|
+
});
|
4525
|
+
}
|
4399
4526
|
return true;
|
4400
4527
|
} else {
|
4401
4528
|
return false;
|
@@ -5372,7 +5499,6 @@ var initCanvas = function initCanvas() {
|
|
5372
5499
|
});
|
5373
5500
|
canv.on('object:scaling', function (e) {
|
5374
5501
|
var obj = e.target;
|
5375
|
-
console.log("++++", e);
|
5376
5502
|
if (isNaN(e.pointer.x) || isNaN(e.pointer.y)) {
|
5377
5503
|
obj.set({
|
5378
5504
|
top: use3dddPlus.getState().lastPosition.top,
|
@@ -5397,6 +5523,7 @@ var initCanvas = function initCanvas() {
|
|
5397
5523
|
width1 = obj.width;
|
5398
5524
|
height1 = obj.height;
|
5399
5525
|
}
|
5526
|
+
obj.setCoords();
|
5400
5527
|
use3dddPlus.getState().setLastPosition({
|
5401
5528
|
top: obj.top,
|
5402
5529
|
left: obj.left
|
@@ -6494,10 +6621,14 @@ var PopUpCanvas = function PopUpCanvas() {
|
|
6494
6621
|
setColorFillCount(Object.keys(colorFill).length);
|
6495
6622
|
var defaultCF = [];
|
6496
6623
|
Object.keys(colorFill).map(function (cf) {
|
6624
|
+
var _defaultColorFill$fin;
|
6497
6625
|
defaultCF.push({
|
6498
6626
|
property: cf,
|
6499
6627
|
"default": colorFill[cf],
|
6500
|
-
updated: colorFill[cf]
|
6628
|
+
updated: colorFill[cf],
|
6629
|
+
objects: (_defaultColorFill$fin = defaultColorFill.find(function (dcf) {
|
6630
|
+
return dcf.property === cf;
|
6631
|
+
})) == null ? void 0 : _defaultColorFill$fin.objects
|
6501
6632
|
});
|
6502
6633
|
});
|
6503
6634
|
setDefaultColorFill(defaultCF);
|
@@ -6534,21 +6665,20 @@ var PopUpCanvas = function PopUpCanvas() {
|
|
6534
6665
|
// }
|
6535
6666
|
if (changeSVGColor(property, color)) {
|
6536
6667
|
setDefaultColorFill(defaultColorFill.map(function (c) {
|
6537
|
-
return (
|
6538
|
-
|
6539
|
-
|
6540
|
-
|
6541
|
-
|
6542
|
-
|
6543
|
-
|
6668
|
+
return c.property === property ? _extends({}, c, {
|
6669
|
+
updated: color
|
6670
|
+
}) : c;
|
6671
|
+
}
|
6672
|
+
// colorFill[property] === c.updated ? { ...c, updated: color } : c
|
6673
|
+
));
|
6674
|
+
|
6544
6675
|
setDefaultColorFillCopy(defaultColorFillCopy.map(function (c) {
|
6545
|
-
return (
|
6546
|
-
|
6547
|
-
|
6548
|
-
|
6549
|
-
|
6550
|
-
|
6551
|
-
}));
|
6676
|
+
return c.property === property ? _extends({}, c, {
|
6677
|
+
updated: color
|
6678
|
+
}) : c;
|
6679
|
+
}
|
6680
|
+
// colorFill[property] === c.updated ? { ...c, updated: color } : c
|
6681
|
+
));
|
6552
6682
|
}
|
6553
6683
|
};
|
6554
6684
|
// const colors = [
|
@@ -8752,7 +8882,7 @@ var Rightmenu = function Rightmenu() {
|
|
8752
8882
|
};
|
8753
8883
|
var textShapeChange = /*#__PURE__*/function () {
|
8754
8884
|
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(e, textChange, fontSize, charSpacing, strokeWidth, fontWeight, textAlign, fontStyle) {
|
8755
|
-
var pathData, p, shapeType, text, _text, fabricPath, dims, newTextPath, activeObj, _dims
|
8885
|
+
var pathData, p, shapeType, text, _text, fabricPath, dims, newTextPath, activeObj, _dims;
|
8756
8886
|
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
8757
8887
|
while (1) switch (_context2.prev = _context2.next) {
|
8758
8888
|
case 0:
|
@@ -9075,27 +9205,30 @@ var Rightmenu = function Rightmenu() {
|
|
9075
9205
|
updateStoreAllObject(newTextPath);
|
9076
9206
|
}
|
9077
9207
|
canvas.renderAll();
|
9078
|
-
|
9208
|
+
// setTimeout(() => {
|
9209
|
+
// reduceFontSize();
|
9210
|
+
// }, 500);
|
9211
|
+
reduceFontSize();
|
9212
|
+
// canvas.renderAll();
|
9213
|
+
// let brNew = use3dddPlus.getState().activeSelection.getBoundingRect();
|
9214
|
+
// while (
|
9215
|
+
// Math.ceil(brNew.width + brNew.left + 45) >= Math.floor(canvas.width) ||
|
9216
|
+
// Math.ceil(brNew.height + brNew.top + 10) >= Math.floor(canvas.height) ||
|
9217
|
+
// Math.ceil(brNew.left) < 0 ||
|
9218
|
+
// Math.ceil(brNew.top) < 0
|
9219
|
+
// ) {
|
9220
|
+
// textSelected.set('fontSize', textSelected.fontSize - 0.1);
|
9221
|
+
// canvas.remove(canvas.getActiveObject());
|
9222
|
+
// await textShapeChange(textSelected.shapeType, true);
|
9223
|
+
// const activeObj = canvas.getActiveObject();
|
9224
|
+
// brNew.left = activeObj.left;
|
9225
|
+
// brNew.width = activeObj.width;
|
9226
|
+
// brNew.top = activeObj.top;
|
9227
|
+
// brNew.height = activeObj.height;
|
9228
|
+
// textSelected.setCoords();
|
9229
|
+
// canvas.renderAll();
|
9230
|
+
// }
|
9079
9231
|
case 103:
|
9080
|
-
if (!(Math.ceil(brNew.width + brNew.left + 45) >= Math.floor(canvas.width) || Math.ceil(brNew.height + brNew.top + 10) >= Math.floor(canvas.height) || Math.ceil(brNew.left) < 0 || Math.ceil(brNew.top) < 0)) {
|
9081
|
-
_context2.next = 117;
|
9082
|
-
break;
|
9083
|
-
}
|
9084
|
-
textSelected.set('fontSize', textSelected.fontSize - 0.1);
|
9085
|
-
canvas.remove(canvas.getActiveObject());
|
9086
|
-
_context2.next = 108;
|
9087
|
-
return textShapeChange(textSelected.shapeType, true);
|
9088
|
-
case 108:
|
9089
|
-
_activeObj = canvas.getActiveObject();
|
9090
|
-
brNew.left = _activeObj.left;
|
9091
|
-
brNew.width = _activeObj.width;
|
9092
|
-
brNew.top = _activeObj.top;
|
9093
|
-
brNew.height = _activeObj.height;
|
9094
|
-
textSelected.setCoords();
|
9095
|
-
canvas.renderAll();
|
9096
|
-
_context2.next = 103;
|
9097
|
-
break;
|
9098
|
-
case 117:
|
9099
9232
|
case "end":
|
9100
9233
|
return _context2.stop();
|
9101
9234
|
}
|
@@ -9140,9 +9273,44 @@ var Rightmenu = function Rightmenu() {
|
|
9140
9273
|
return;
|
9141
9274
|
}
|
9142
9275
|
};
|
9276
|
+
/*
|
9277
|
+
const reduceFontSize = async () => {
|
9278
|
+
let brNew = textSelected.getBoundingRect();
|
9279
|
+
let canvasWidth = 0;
|
9280
|
+
let canvasHeight = 0;
|
9281
|
+
if (textSelected && textSelected.canvas && textSelected.canvas.width) {
|
9282
|
+
canvasWidth = textSelected.canvas.width;
|
9283
|
+
canvasHeight = textSelected.canvas.height;
|
9284
|
+
} else {
|
9285
|
+
canvasWidth = canvas.width;
|
9286
|
+
canvasHeight = canvas.height;
|
9287
|
+
}
|
9288
|
+
while (
|
9289
|
+
Math.ceil(brNew.width + brNew.left + 45) > Math.floor(canvasWidth) ||
|
9290
|
+
Math.ceil(brNew.height + brNew.top + 10) > Math.floor(canvasHeight) ||
|
9291
|
+
Math.ceil(brNew.left) < 0 ||
|
9292
|
+
Math.ceil(brNew.top) < 0
|
9293
|
+
) {
|
9294
|
+
textSelected.set('fontSize', textSelected.fontSize - 0.1);
|
9295
|
+
if (currentSelection === 'path') {
|
9296
|
+
await textShapeChange(textSelected.shapeType, true);
|
9297
|
+
canvas.renderAll();
|
9298
|
+
const activeObj = canvas.getActiveObject();
|
9299
|
+
brNew.left = activeObj.left;
|
9300
|
+
brNew.width = activeObj.width;
|
9301
|
+
brNew.top = activeObj.top;
|
9302
|
+
brNew.height = activeObj.height;
|
9303
|
+
} else {
|
9304
|
+
brNew = textSelected.getBoundingRect();
|
9305
|
+
}
|
9306
|
+
textSelected.setCoords();
|
9307
|
+
// canvas.renderAll();
|
9308
|
+
}
|
9309
|
+
};
|
9310
|
+
*/
|
9143
9311
|
var reduceFontSize = /*#__PURE__*/function () {
|
9144
9312
|
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
|
9145
|
-
var brNew, canvasWidth, canvasHeight,
|
9313
|
+
var brNew, canvasWidth, canvasHeight, _activeObj;
|
9146
9314
|
return _regeneratorRuntime().wrap(function _callee3$(_context3) {
|
9147
9315
|
while (1) switch (_context3.prev = _context3.next) {
|
9148
9316
|
case 0:
|
@@ -9156,35 +9324,16 @@ var Rightmenu = function Rightmenu() {
|
|
9156
9324
|
canvasWidth = canvas.width;
|
9157
9325
|
canvasHeight = canvas.height;
|
9158
9326
|
}
|
9159
|
-
|
9160
|
-
|
9161
|
-
|
9162
|
-
|
9163
|
-
|
9164
|
-
|
9165
|
-
|
9166
|
-
_context3.next = 17;
|
9167
|
-
break;
|
9327
|
+
while (Math.ceil(brNew.width + brNew.left + 45) >= Math.floor(canvasWidth) || Math.ceil(brNew.height + brNew.top + 10) >= Math.floor(canvasHeight) || Math.ceil(brNew.left) < 0 || Math.ceil(brNew.top) < 0) {
|
9328
|
+
_activeObj = canvas.getActiveObject();
|
9329
|
+
_activeObj.scale(_activeObj.scaleX * 0.99);
|
9330
|
+
_activeObj.setCoords();
|
9331
|
+
_activeObj = canvas.getActiveObject();
|
9332
|
+
brNew = _activeObj.getBoundingRect();
|
9333
|
+
canvas.renderAll();
|
9168
9334
|
}
|
9169
|
-
_context3.next = 9;
|
9170
|
-
return textShapeChange(textSelected.shapeType, true);
|
9171
|
-
case 9:
|
9172
9335
|
canvas.renderAll();
|
9173
|
-
|
9174
|
-
brNew.left = _activeObj2.left;
|
9175
|
-
brNew.width = _activeObj2.width;
|
9176
|
-
brNew.top = _activeObj2.top;
|
9177
|
-
brNew.height = _activeObj2.height;
|
9178
|
-
_context3.next = 18;
|
9179
|
-
break;
|
9180
|
-
case 17:
|
9181
|
-
brNew = textSelected.getBoundingRect();
|
9182
|
-
case 18:
|
9183
|
-
textSelected.setCoords();
|
9184
|
-
// canvas.renderAll();
|
9185
|
-
_context3.next = 4;
|
9186
|
-
break;
|
9187
|
-
case 21:
|
9336
|
+
case 6:
|
9188
9337
|
case "end":
|
9189
9338
|
return _context3.stop();
|
9190
9339
|
}
|
@@ -9301,71 +9450,67 @@ var Rightmenu = function Rightmenu() {
|
|
9301
9450
|
// // setSliderValue(event.target.value);
|
9302
9451
|
// }
|
9303
9452
|
// };
|
9304
|
-
|
9305
|
-
|
9306
|
-
|
9307
|
-
|
9308
|
-
|
9309
|
-
|
9310
|
-
|
9311
|
-
|
9312
|
-
|
9313
|
-
|
9314
|
-
|
9315
|
-
|
9316
|
-
|
9317
|
-
|
9318
|
-
|
9319
|
-
|
9320
|
-
|
9321
|
-
|
9322
|
-
|
9323
|
-
|
9324
|
-
|
9325
|
-
|
9326
|
-
|
9327
|
-
|
9328
|
-
|
9329
|
-
|
9330
|
-
brNew.top = _activeObj3.top;
|
9331
|
-
brNew.height = _activeObj3.height;
|
9332
|
-
_context5.next = 17;
|
9333
|
-
break;
|
9334
|
-
case 16:
|
9335
|
-
brNew = textSelected.getBoundingRect();
|
9336
|
-
case 17:
|
9337
|
-
textSelected.setCoords();
|
9338
|
-
canvas.renderAll();
|
9339
|
-
_context5.next = 3;
|
9340
|
-
break;
|
9341
|
-
case 21:
|
9342
|
-
case "end":
|
9343
|
-
return _context5.stop();
|
9344
|
-
}
|
9345
|
-
}, _callee5);
|
9346
|
-
}));
|
9347
|
-
return function reduceLeft() {
|
9348
|
-
return _ref5.apply(this, arguments);
|
9349
|
-
};
|
9350
|
-
}();
|
9453
|
+
// const reduceLeft = async () => {
|
9454
|
+
// const canvasWidth = textSelected.canvas.width;
|
9455
|
+
// const canvasHeight = textSelected.canvas.height;
|
9456
|
+
// let brNew = textSelected.getBoundingRect();
|
9457
|
+
// while (
|
9458
|
+
// Math.ceil(brNew.width + brNew.left + 45) >= Math.floor(canvasWidth) ||
|
9459
|
+
// Math.ceil(brNew.height + brNew.top + 10) >= Math.floor(canvasHeight) ||
|
9460
|
+
// Math.ceil(brNew.left) < 0 ||
|
9461
|
+
// Math.ceil(brNew.top) < 0
|
9462
|
+
// ) {
|
9463
|
+
// textSelected.set('fontSize', textSelected.fontSize - 0.1);
|
9464
|
+
// if (currentSelection === 'path') {
|
9465
|
+
// await textShapeChange(textSelected.shapeType, true);
|
9466
|
+
// canvas.renderAll();
|
9467
|
+
// const activeObj = canvas.getActiveObject();
|
9468
|
+
// brNew.left = activeObj.left;
|
9469
|
+
// brNew.width = activeObj.width;
|
9470
|
+
// brNew.top = activeObj.top;
|
9471
|
+
// brNew.height = activeObj.height;
|
9472
|
+
// } else {
|
9473
|
+
// brNew = textSelected.getBoundingRect();
|
9474
|
+
// }
|
9475
|
+
// textSelected.setCoords();
|
9476
|
+
// canvas.renderAll();
|
9477
|
+
// }
|
9478
|
+
// };
|
9351
9479
|
var fontChange = function fontChange(e) {
|
9352
9480
|
fontFamilies.map(function (item) {
|
9353
9481
|
if (item.name == e.target.value) {
|
9354
9482
|
var font = new FontFace(item.name, "url('" + item.src + "')");
|
9355
|
-
font.load().then(function (
|
9356
|
-
var
|
9357
|
-
|
9358
|
-
|
9359
|
-
|
9360
|
-
|
9361
|
-
|
9362
|
-
|
9363
|
-
|
9364
|
-
|
9365
|
-
|
9366
|
-
|
9367
|
-
|
9368
|
-
|
9483
|
+
font.load().then( /*#__PURE__*/function () {
|
9484
|
+
var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5(value) {
|
9485
|
+
var _document$fonts;
|
9486
|
+
return _regeneratorRuntime().wrap(function _callee5$(_context5) {
|
9487
|
+
while (1) switch (_context5.prev = _context5.next) {
|
9488
|
+
case 0:
|
9489
|
+
//@ts-ignore
|
9490
|
+
(_document$fonts = document.fonts) == null ? void 0 : _document$fonts.add(value);
|
9491
|
+
document.body.classList.add('fonts-loaded');
|
9492
|
+
textSelected.set('fontFamily', item.name);
|
9493
|
+
if (!(currentSelection === 'path')) {
|
9494
|
+
_context5.next = 6;
|
9495
|
+
break;
|
9496
|
+
}
|
9497
|
+
_context5.next = 6;
|
9498
|
+
return textShapeChange(textSelected.shapeType, true);
|
9499
|
+
case 6:
|
9500
|
+
canvas.renderAll();
|
9501
|
+
use3dddPlus.getState().forIconCapture();
|
9502
|
+
textSelected.icon = use3dddPlus.getState().iconImage;
|
9503
|
+
reduceFontSize();
|
9504
|
+
case 10:
|
9505
|
+
case "end":
|
9506
|
+
return _context5.stop();
|
9507
|
+
}
|
9508
|
+
}, _callee5);
|
9509
|
+
}));
|
9510
|
+
return function (_x11) {
|
9511
|
+
return _ref5.apply(this, arguments);
|
9512
|
+
};
|
9513
|
+
}());
|
9369
9514
|
}
|
9370
9515
|
});
|
9371
9516
|
};
|