diff --git a/data.json b/data.json index 1fac665..e4c7a7e 100644 --- a/data.json +++ b/data.json @@ -1 +1 @@ -{"history":[{"time":"2025-4-9","path":"E:\\project\\sideline\\shanghaikashu\\文件\\soon文件\\ceshi6.soon"},{"time":"2025-4-9","path":"E:\\project\\sideline\\shanghaikashu\\文件\\soon文件\\ceshi7.soon"},{"time":"2025-4-9","path":"E:\\project\\sideline\\shanghaikashu\\文件\\soon文件\\ceshi5.soon"},{"time":"2025-4-9","path":"E:\\project\\sideline\\shanghaikashu\\文件\\soon文件\\ceshi.soon"}]} \ No newline at end of file +{"history":[{"time":"2025-4-10","path":"E:\\project\\sideline\\shanghaikashu\\文件\\soon文件\\ceshi6.soon"},{"time":"2025-4-10","path":"E:\\project\\sideline\\shanghaikashu\\文件\\soon文件\\ceshi7.soon"},{"time":"2025-4-9","path":"E:\\project\\sideline\\shanghaikashu\\文件\\soon文件\\ceshi5.soon"},{"time":"2025-4-9","path":"E:\\project\\sideline\\shanghaikashu\\文件\\soon文件\\ceshi.soon"}]} \ No newline at end of file diff --git a/design1.html b/design1.html index 89daee1..eae0d43 100644 --- a/design1.html +++ b/design1.html @@ -246,6 +246,23 @@ +
+ +
+
+ +
+
+ +
+
+ +
+
+
@@ -494,11 +511,11 @@
- +
@@ -2221,7 +2238,8 @@ "y": parseInt((xy[1] - background_image1.top).toFixed(0)), "h": parseInt((item.get("scaleY") * item.get("height")).toFixed(0)), "w": parseInt((item.get("scaleX") * item.get("width")).toFixed(0)), - "rotate": parseInt(item.get("angle").toFixed(0)) + "rotate": parseInt(item.get("angle").toFixed(0)), + align: objs1[idx - 1].align }); } else if (type == 8) { //二维码 @@ -2360,7 +2378,8 @@ "y": parseInt((xy[1] - background_image2.top).toFixed(0)), "h": parseInt((item.get("scaleY") * item.get("height")).toFixed(0)), "w": parseInt((item.get("scaleX") * item.get("width")).toFixed(0)), - "rotate": parseInt(item.get("angle").toFixed(0)) + "rotate": parseInt(item.get("angle").toFixed(0)), + align: objs2[idx - 1].align }); } else if (type == 8) { //二维码 @@ -2819,7 +2838,8 @@ "y": parseInt((xy[1] - background_image1.top).toFixed(0)), "h": parseInt((item.get("scaleY") * item.get("height")).toFixed(0)), "w": parseInt((item.get("scaleX") * item.get("width")).toFixed(0)), - "rotate": parseInt(item.get("angle").toFixed(0)) + "rotate": parseInt(item.get("angle").toFixed(0)), + align: objs1[idx - 1].align }); } else if (type == 8) { //二维码 @@ -2958,7 +2978,8 @@ "y": parseInt((xy[1] - background_image2.top).toFixed(0)), "h": parseInt((item.get("scaleY") * item.get("height")).toFixed(0)), "w": parseInt((item.get("scaleX") * item.get("width")).toFixed(0)), - "rotate": parseInt(item.get("angle").toFixed(0)) + "rotate": parseInt(item.get("angle").toFixed(0)), + align: objs2[idx - 1].align }); } else if (type == 8) { //二维码 @@ -3899,6 +3920,46 @@ canvas.renderAll(); }); + $('#out_left_alignment').click(function () { + $('#out_left_alignment').parent().removeClass('tool1') + $('#out_right_alignment').parent().removeClass('tool1') + $('#out_center_alignment').parent().removeClass('tool1') + setTimeout(() => { + $('#out_left_alignment').parent().addClass('tool1') + }); + canvas.getActiveObject().set('textAlign', 'left') + let idx = getIndex(canvas.getActiveObject()) + objs[idx - 1].align = 'left' + recordState() + canvas.renderAll() + }) + $('#out_right_alignment').click(function () { + $('#out_left_alignment').parent().removeClass('tool1') + $('#out_right_alignment').parent().removeClass('tool1') + $('#out_center_alignment').parent().removeClass('tool1') + setTimeout(() => { + $('#out_right_alignment').parent().addClass('tool1') + }); + canvas.getActiveObject().set('textAlign', 'right') + let idx = getIndex(canvas.getActiveObject()) + objs[idx - 1].align = 'right' + recordState() + canvas.renderAll() + }) + $('#out_center_alignment').click(function () { + $('#out_left_alignment').parent().removeClass('tool1') + $('#out_right_alignment').parent().removeClass('tool1') + $('#out_center_alignment').parent().removeClass('tool1') + setTimeout(() => { + $('#out_center_alignment').parent().addClass('tool1') + }); + canvas.getActiveObject().set('textAlign', 'center') + let idx = getIndex(canvas.getActiveObject()) + objs[idx - 1].align = 'center' + recordState() + canvas.renderAll() + }) + $("#out_text_italics").click(function () { if ($(this).hasClass("ui-radio-acitve")) { //已选 @@ -4995,7 +5056,8 @@ textBackgroundColor: "", underline: false, linethrough: false, - fontFamily: 'Arial' + fontFamily: 'Arial', + textAlign: 'center' }); //text.on({ @@ -5018,7 +5080,7 @@ text.setControlVisible("mb", false); canvas.add(text); - objs.push({ type: 4, name: resName("OUT_TEXT_"), exceed: false, autoWrap: false, fixSize: false, black: false }); + objs.push({ type: 4, name: resName("OUT_TEXT_"), exceed: false, autoWrap: false, fixSize: false, black: false, align: 'center' }); canvas.renderAll(); updateList(); recordState(); @@ -5026,6 +5088,14 @@ function selectOutText() { //color //size + const align = canvas.getActiveObject().get('textAlign') + if (align === 'left') { + $('#out_left_alignment').parent().addClass('tool1') + } else if (align === 'right') { + $('#out_right_alignment').parent().addClass('tool1') + } else { + $('#out_center_alignment').parent().addClass('tool1') + } $("#out_text_control").show(); $("#out_text_color").val(canvas.getActiveObject().get("fill")); $("#out_text_text").val(canvas.getActiveObject().get("text")); @@ -5987,7 +6057,7 @@ , area: '450px;' , id: 'LAY_layuipro' //设定一个id，防止重复弹出 , moveType: 1 //拖拽模式，0或者1 - , content: '
Soon Design
' + language_str("vers") + ' 2.1.2
' + language_str("copyright") + '
' + , content: '
Soon Design
' + language_str("vers") + ' 3.0.1
' + language_str("copyright") + '
' }); }) $("#help").click(function () { diff --git a/design2.html b/design2.html index 89aec12..859c392 100644 --- a/design2.html +++ b/design2.html @@ -187,12 +187,12 @@ style="display: inline-block;width: 150px;position: relative;top:-3px;left:5px;">
- +
@@ -233,6 +233,23 @@
+
+ +
+
+ +
+
+ +
+
+ +
+
+
@@ -1248,7 +1265,7 @@ left: left / zoom }) - g3.push(img1) + // g3.push(img1) let url3 = new fabric.Group(g3).toDataURL({ height: 648, width: 1012, @@ -1350,7 +1367,7 @@ height: 648, width: 1012 }) - g4.push(img2) + // g4.push(img2) let url4 = new fabric.Group(g4).toDataURL({ height: 648, width: 1012, @@ -1383,7 +1400,7 @@ const buffer3 = Buffer.from(url3.replace(/^data:image\/\w+;base64,/, ""), 'base64'); const printPath3 = path.join(exePath, 'print3.png'); fs.writeFileSync(printPath3, buffer3); - const buffer4 = Buffer.from(url3.replace(/^data:image\/\w+;base64,/, ""), 'base64'); + const buffer4 = Buffer.from(url4.replace(/^data:image\/\w+;base64,/, ""), 'base64'); const printPath4 = path.join(exePath, 'print4.png'); fs.writeFileSync(printPath4, buffer4); if ((objs1.length != 0) & (objs2.length == 0)) { @@ -1763,7 +1780,8 @@ y: parseInt((xy[1] - background_image1.top).toFixed(0)), h: parseInt((item.get('scaleY') * item.get('height')).toFixed(0)), w: parseInt((item.get('scaleX') * item.get('width')).toFixed(0)), - rotate: parseInt(item.get('angle').toFixed(0)) + rotate: parseInt(item.get('angle').toFixed(0)), + align: objs1[idx - 1].align }) } else if (type == 8) { //二维码 @@ -1878,7 +1896,8 @@ y: parseInt((xy[1] - background_image2.top).toFixed(0)), h: parseInt((item.get('scaleY') * item.get('height')).toFixed(0)), w: parseInt((item.get('scaleX') * item.get('width')).toFixed(0)), - rotate: parseInt(item.get('angle').toFixed(0)) + rotate: parseInt(item.get('angle').toFixed(0)), + align: objs2[idx - 1].align }) } else if (type == 8) { //二维码 @@ -2254,7 +2273,8 @@ y: parseInt((xy[1] - background_image1.top).toFixed(0)), h: parseInt((item.get('scaleY') * item.get('height')).toFixed(0)), w: parseInt((item.get('scaleX') * item.get('width')).toFixed(0)), - rotate: parseInt(item.get('angle').toFixed(0)) + rotate: parseInt(item.get('angle').toFixed(0)), + align: objs1[idx - 1].align }) } else if (type == 8) { //二维码 @@ -2369,7 +2389,8 @@ y: parseInt((xy[1] - background_image2.top).toFixed(0)), h: parseInt((item.get('scaleY') * item.get('height')).toFixed(0)), w: parseInt((item.get('scaleX') * item.get('width')).toFixed(0)), - rotate: parseInt(item.get('angle').toFixed(0)) + rotate: parseInt(item.get('angle').toFixed(0)), + align: objs2[idx - 1].align }) } else if (type == 8) { //二维码 @@ -3296,6 +3317,45 @@ recordState(); canvas.renderAll(); }); + $('#out_left_alignment').click(function () { + $('#out_left_alignment').parent().removeClass('tool1') + $('#out_right_alignment').parent().removeClass('tool1') + $('#out_center_alignment').parent().removeClass('tool1') + setTimeout(() => { + $('#out_left_alignment').parent().addClass('tool1') + }); + canvas.getActiveObject().set('textAlign', 'left') + let idx = getIndex(canvas.getActiveObject()) + objs[idx - 1].align = 'left' + recordState() + canvas.renderAll() + }) + $('#out_right_alignment').click(function () { + $('#out_left_alignment').parent().removeClass('tool1') + $('#out_right_alignment').parent().removeClass('tool1') + $('#out_center_alignment').parent().removeClass('tool1') + setTimeout(() => { + $('#out_right_alignment').parent().addClass('tool1') + }); + canvas.getActiveObject().set('textAlign', 'right') + let idx = getIndex(canvas.getActiveObject()) + objs[idx - 1].align = 'right' + recordState() + canvas.renderAll() + }) + $('#out_center_alignment').click(function () { + $('#out_left_alignment').parent().removeClass('tool1') + $('#out_right_alignment').parent().removeClass('tool1') + $('#out_center_alignment').parent().removeClass('tool1') + setTimeout(() => { + $('#out_center_alignment').parent().addClass('tool1') + }); + canvas.getActiveObject().set('textAlign', 'center') + let idx = getIndex(canvas.getActiveObject()) + objs[idx - 1].align = 'center' + recordState() + canvas.renderAll() + }) $('#out_text_italics').click(function () { if ($(this).hasClass('ui-radio-acitve')) { //已选 @@ -4356,7 +4416,7 @@ $("#circle_text_color").val(canvas.getActiveObject().get("fill")); $("#circle_text_back_color").val(canvas.getActiveObject().get("textBackgroundColor") == "" ? '#ffffff' : canvas.getActiveObject().get("textBackgroundColor")); circle_text_size.setValue(canvas.getActiveObject().get("fontSize") - 10); - circle_text_diameter.setValue(canvas.getActiveObject().get("diameter")-500); + circle_text_diameter.setValue(canvas.getActiveObject().get("diameter")-50); $("#circle_text_text").val(canvas.getActiveObject().get("text")); $("#circle_text_font_family").val(canvas.getActiveObject().get("fontFamily")); @@ -4406,7 +4466,8 @@ textBackgroundColor: '', underline: false, linethrough: false, - fontFamily: 'Arial' + fontFamily: 'Arial', + textAlign: 'center' }) //text.on({ @@ -4429,7 +4490,7 @@ text.setControlVisible('mb', false) canvas.add(text) - objs.push({ type: 4, name: resName('OUT_TEXT_'), exceed: false, autoWrap: false, fixSize: false, black: false }) + objs.push({ type: 4, name: resName('OUT_TEXT_'), exceed: false, autoWrap: false, fixSize: false, black: false, align: 'center' }) canvas.renderAll() updateList() recordState() @@ -4437,6 +4498,14 @@ function selectOutText() { //color //size + const align = canvas.getActiveObject().get('textAlign') + if (align === 'left') { + $('#out_left_alignment').parent().addClass('tool1') + } else if (align === 'right') { + $('#out_right_alignment').parent().addClass('tool1') + } else { + $('#out_center_alignment').parent().addClass('tool1') + } $('#out_text_control').show() $('#out_text_color').val(canvas.getActiveObject().get('fill')) $('#out_text_text').val(canvas.getActiveObject().get('text')) @@ -5379,7 +5448,7 @@ content: '
Soon Design
' + language_str('vers') + - ' 2.1.2
' + + ' 3.0.1
' + language_str('copyright') + '
' }) @@ -5512,20 +5581,20 @@ }) canvas1.on("object:moving", function (e) { let obj = canvas.getActiveObject() - if (objs[getIndex(e.target) - 1].type ===11) { - let pointer = { - x: obj.left, - y: obj.top > canvas.height/2 ? obj.top + obj.height/2 : obj.top - obj.height/2 - } - console.log(obj) - let distance = getDisdance(pointer.x, pointer.y, canvas.width/2,canvas.height/2) - let angleDeg = getDeg(pointer) - let flipped = pointer.y > canvas.height/2 ? true : false - obj.set("diameter", distance*2); - obj.set("angle", angleDeg); - obj.set("flipped", flipped); - // canvas.renderAll(); - } + // if (objs[getIndex(e.target) - 1].type ===11) { + // let pointer = { + // x: obj.left, + // y: obj.top > canvas.height/2 ? obj.top + obj.height/2 : obj.top - obj.height/2 + // } + // console.log(obj) + // let distance = getDisdance(pointer.x, pointer.y, canvas.width/2,canvas.height/2) + // let angleDeg = getDeg(pointer) + // let flipped = pointer.y > canvas.height/2 ? true : false + // obj.set("diameter", distance*2); + // obj.set("angle", angleDeg); + // obj.set("flipped", flipped); + // // canvas.renderAll(); + // } updateControls(); }); canvas1.on('object:scaling', function (event) { @@ -6078,8 +6147,8 @@ }); var circle_text_diameter = slider.render({ elem: '#circle_text_diameter', - min: 500, - max: 4000 + min: 50, + max: 1100 , change: function (value) { canvas.getActiveObject().set("diameter", value); canvas.renderAll(); diff --git a/output.pdf b/output.pdf index f0f56b0..76cec24 100644 Binary files a/output.pdf and b/output.pdf differ diff --git a/print3.png b/print3.png index 37ab2ed..abdd9c8 100644 Binary files a/print3.png and b/print3.png differ diff --git a/print4.png b/print4.png index 37ab2ed..3bcbd7b 100644 Binary files a/print4.png and b/print4.png differ diff --git a/public/css/design.css b/public/css/design.css index 77df7cb..d605543 100644 --- a/public/css/design.css +++ b/public/css/design.css @@ -180,6 +180,17 @@ img { .component-line span{ color: #969FA7; } +.component-line .tool { + cursor: pointer; + padding: 4px; +} +.component-line .tool:hover{ + background-color: #646E76; +} +.component-line .tool1 { + background-color: #646E76; + padding: 4px; +} .ui-input{ background-color: #31373D; border: #646E76 solid 1px;