更新
This commit is contained in:
24kycj
@@ -409,6 +409,7 @@ function addBackground() {
|
||||
|
||||
function finishBack(backImg) {
|
||||
if (backImg) {
|
||||
backImg.objectCaching = true;
|
||||
soonPlaceBgOnCanvas(backImg, '#canvas2');
|
||||
background_image2 = backImg;
|
||||
window.background_image2 = backImg;
|
||||
@@ -426,6 +427,7 @@ function addBackground() {
|
||||
if (!loadBg) return;
|
||||
loadBg('bg_front_1.png', function (frontImg) {
|
||||
if (!frontImg) return;
|
||||
frontImg.objectCaching = true;
|
||||
frontImg.scale(1, 1);
|
||||
soonPlaceBgOnCanvas(frontImg, '#canvas1');
|
||||
background_image1 = frontImg;
|
||||
@@ -436,10 +438,10 @@ function addBackground() {
|
||||
canvas.renderAll();
|
||||
recordObjs1.push(JSON.stringify(objs1));
|
||||
recordJson1.push(canvas1.toJSON(TO_JSON_PROPERTIES));
|
||||
loadBg('bg_back.png', finishBack, function () { loadBg('bg_back.png', finishBack); });
|
||||
loadBg('bg_back.png', finishBack, function () { loadBg('bg_back.png', finishBack, null, 2, true); }, 2, true);
|
||||
}, function () {
|
||||
setTimeout(startLoad, 200);
|
||||
});
|
||||
}, 2, true);
|
||||
}
|
||||
|
||||
whenReady('#canvas1', startLoad);
|
||||
@@ -1515,7 +1517,20 @@ function handleObjectMoving(e) {
|
||||
obj.set("angle", angleDeg);
|
||||
obj.set("flipped", flipped);
|
||||
}
|
||||
updateControls();
|
||||
soonScheduleUpdateControls();
|
||||
}
|
||||
|
||||
var _soonUpdateControlsRaf = 0;
|
||||
function soonScheduleUpdateControls() {
|
||||
if (_soonUpdateControlsRaf) return;
|
||||
_soonUpdateControlsRaf = requestAnimationFrame(function () {
|
||||
_soonUpdateControlsRaf = 0;
|
||||
window.updateControls();
|
||||
});
|
||||
}
|
||||
|
||||
function soonDesign1SetInteracting(on) {
|
||||
window._soonDesign1Interacting = !!on;
|
||||
}
|
||||
|
||||
// 辅助函数：检查对象是否被锁定
|
||||
@@ -1623,17 +1638,28 @@ function initCanvasEvents() {
|
||||
_canvasEventsInitialized = true;
|
||||
|
||||
[canvas1, canvas2].forEach(currentCanvas => {
|
||||
var _mouseMoveRaf = 0;
|
||||
var _mouseMovePending = null;
|
||||
// 1. 鼠标移动
|
||||
currentCanvas.on("mouse:move", (e) => {
|
||||
let offsetX = 0, offsetY = 0;
|
||||
if (currentCanvas === canvas2 && typeof background_image !== 'undefined') {
|
||||
offsetX = background_image.left;
|
||||
offsetY = background_image.top;
|
||||
}
|
||||
if (e.pointer) {
|
||||
$("#posText").text("X: " + (e.pointer.x - offsetX).toFixed(0) + " Y: " + (e.pointer.y - offsetY).toFixed(0));
|
||||
}
|
||||
updateRulerGuides(e.e);
|
||||
_mouseMovePending = { e: e, canvas: currentCanvas };
|
||||
if (_mouseMoveRaf) return;
|
||||
_mouseMoveRaf = requestAnimationFrame(function () {
|
||||
_mouseMoveRaf = 0;
|
||||
var payload = _mouseMovePending;
|
||||
if (!payload) return;
|
||||
var moveEvent = payload.e;
|
||||
var moveCanvas = payload.canvas;
|
||||
let offsetX = 0, offsetY = 0;
|
||||
if (moveCanvas === canvas2 && typeof background_image !== 'undefined') {
|
||||
offsetX = background_image.left;
|
||||
offsetY = background_image.top;
|
||||
}
|
||||
if (moveEvent.pointer) {
|
||||
$("#posText").text("X: " + (moveEvent.pointer.x - offsetX).toFixed(0) + " Y: " + (moveEvent.pointer.y - offsetY).toFixed(0));
|
||||
}
|
||||
updateRulerGuides(moveEvent.e);
|
||||
});
|
||||
});
|
||||
|
||||
// 2. 鼠标移出
|
||||
@@ -1726,12 +1752,19 @@ function initCanvasEvents() {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
soonDesign1SetInteracting(true);
|
||||
handleObjectMoving(e);
|
||||
});
|
||||
|
||||
// 6. 变换事件
|
||||
currentCanvas.on("object:rotating", updateControls);
|
||||
currentCanvas.on("object:scaling", updateControls);
|
||||
currentCanvas.on("object:rotating", function () {
|
||||
soonDesign1SetInteracting(true);
|
||||
soonScheduleUpdateControls();
|
||||
});
|
||||
currentCanvas.on("object:scaling", function () {
|
||||
soonDesign1SetInteracting(true);
|
||||
soonScheduleUpdateControls();
|
||||
});
|
||||
currentCanvas.on("object:rotated", () => { window.recordState(); });
|
||||
currentCanvas.on('text:editing:entered', () => { _textEdit = true; });
|
||||
currentCanvas.on('text:editing:exited', () => { _textEdit = false; });
|
||||
@@ -1739,38 +1772,41 @@ function initCanvasEvents() {
|
||||
|
||||
// 7. 对象修改后
|
||||
currentCanvas.on('object:modified', function (event) {
|
||||
if (currentCanvas.getActiveObjects().length > 1) return;
|
||||
let idx = getIndex(event.target);
|
||||
if (idx <= 0) return;
|
||||
let objData = objs[idx - 1];
|
||||
// 安全检查：确保 objData 存在且有 type 属性
|
||||
if (!objData || typeof objData.type === 'undefined') {
|
||||
try {
|
||||
if (currentCanvas.getActiveObjects().length > 1) return;
|
||||
let idx = getIndex(event.target);
|
||||
if (idx <= 0) return;
|
||||
let objData = objs[idx - 1];
|
||||
// 安全检查：确保 objData 存在且有 type 属性
|
||||
if (!objData || typeof objData.type === 'undefined') {
|
||||
// 更新对象列表以同步锁状态
|
||||
if (typeof window.updateList === 'function') {
|
||||
window.updateList();
|
||||
}
|
||||
return;
|
||||
}
|
||||
let target = event.target;
|
||||
|
||||
if ([3, 4, 10].includes(objData.type)) {
|
||||
target.fontSize = (target.fontSize * target.scaleX).toFixed(0);
|
||||
target.scaleX = 1; target.scaleY = 1;
|
||||
target._clearCache();
|
||||
if (objData.type == 3) $("#text_size").val(target.fontSize);
|
||||
if (objData.type == 4) $("#out_text_size").val(target.fontSize);
|
||||
if (objData.type == 10) $("#count_size").val(target.fontSize);
|
||||
currentCanvas.renderAll();
|
||||
} else if (objData.type == 5) {
|
||||
target.width *= target.scaleX; target.height *= target.scaleY;
|
||||
target.scaleX = 1; target.scaleY = 1;
|
||||
}
|
||||
window.recordState();
|
||||
// 更新对象列表以同步锁状态
|
||||
if (typeof window.updateList === 'function') {
|
||||
window.updateList();
|
||||
}
|
||||
return;
|
||||
}
|
||||
let target = event.target;
|
||||
|
||||
if ([3, 4, 10].includes(objData.type)) {
|
||||
target.fontSize = (target.fontSize * target.scaleX).toFixed(0);
|
||||
target.scaleX = 1; target.scaleY = 1;
|
||||
target._clearCache();
|
||||
if (objData.type == 3) $("#text_size").val(target.fontSize);
|
||||
if (objData.type == 4) $("#out_text_size").val(target.fontSize);
|
||||
if (objData.type == 10) $("#count_size").val(target.fontSize);
|
||||
currentCanvas.renderAll();
|
||||
} finally {
|
||||
soonDesign1SetInteracting(false);
|
||||
updateControls();
|
||||
} else if (objData.type == 5) {
|
||||
target.width *= target.scaleX; target.height *= target.scaleY;
|
||||
target.scaleX = 1; target.scaleY = 1;
|
||||
updateControls();
|
||||
}
|
||||
window.recordState();
|
||||
// 更新对象列表以同步锁状态
|
||||
if (typeof window.updateList === 'function') {
|
||||
window.updateList();
|
||||
}
|
||||
});
|
||||
// ==================================================
|
||||
@@ -1828,6 +1864,8 @@ function initCanvasEvents() {
|
||||
ctx.fill();
|
||||
ctx.restore();
|
||||
}
|
||||
|
||||
if (window._soonDesign1Interacting) return;
|
||||
|
||||
// 在遮罩之后重新绘制辅助线，确保辅助线在最上层
|
||||
const objects = currentCanvas.getObjects();
|
||||
@@ -2042,6 +2080,7 @@ function initRulers() {
|
||||
|
||||
// --- 3. 绘制标尺 (核心绘制循环) ---
|
||||
function updateAndDraw() {
|
||||
if (window._soonDesign1Interacting) return;
|
||||
// 每次重新获取尺寸，确保使用最新值
|
||||
// 使用多种方法尝试获取实际尺寸，确保准确
|
||||
let currentCanvasWidth = canvasWrapper.width() || canvasWrapper.outerWidth() || canvasWrapper[0].getBoundingClientRect().width || 800;
|
||||
|
||||
Reference in New Issue
Block a user