@@ -30,9 +30,9 @@ import Widget2 from "#components/Widget.svelte";
const lineLog = document.getElementById('line-log');
const pixelToMeter = 0.01; // Conversion factor: 1 pixel = 0.01 meter
const gridSize = 10; // Size of each grid cell in pixels
- let lastEndPoint = null;
- let lastStartPoint = null;
let capturedLines = [];
+ let lastEndPoint = null; // Tracks the end point of the last line
+ let firstStartPoint = null; // Tracks the start point of the first line
// Snap a coordinate to the nearest grid point
function snapToGrid(value) {
@@ -65,7 +65,7 @@ import Widget2 from "#components/Widget.svelte";
ctx.clearRect(0, 0, canvas.width, canvas.height);
capturedLines = [];
lastEndPoint = null;
- lastStartPoint = null;
+ firstStartPoint = null;
drawGrid(); // Redraw the grid after clearing
updateLineLog();
}
@@ -96,20 +96,17 @@ import Widget2 from "#components/Widget.svelte";
// Determine the starting point for the new line
let startX, startY;
- if (lastEndPoint && clickX === lastEndPoint.x && clickY === lastEndPoint.y) {
- // Snap to the last endpoint
- startX = lastEndPoint.x;
- startY = lastEndPoint.y;
- } else if (lastStartPoint && clickX === lastStartPoint.x && clickY === lastStartPoint.y) {
- // Snap to the last starting point
- startX = lastStartPoint.x;
- startY = lastStartPoint.y;
- } else if (!capturedLines.length) {
- // First line can start anywhere
+ if (!lastEndPoint) {
+ // For the first line, set the start point anywhere
startX = clickX;
startY = clickY;
+ firstStartPoint = { x: startX, y: startY }; // Save the first start point
+ } else if (clickX === lastEndPoint.x && clickY === lastEndPoint.y) {
+ // For subsequent lines, start at the last endpoint
+ startX = lastEndPoint.x;
+ startY = lastEndPoint.y;
} else {
- // If click doesn't match a valid connection, do nothing
+ // If not a valid start point, do nothing
return;
}
@@ -117,16 +114,21 @@ import Widget2 from "#components/Widget.svelte";
const endX = snapToGrid(e.offsetX);
const endY = snapToGrid(e.offsetY);
- // Avoid drawing a "point" as a line
- if (startX === endX && startY === endY) {
+ // The endpoint must be either:
+ // - A valid grid point
+ // - The start point of the first line
+ const isValidEndPoint =
+ (endX !== startX || endY !== startY) &&
+ (endX === firstStartPoint?.x && endY === firstStartPoint?.y);
+
+ if (!isValidEndPoint) {
return;
}
// Draw the line
drawLine(startX, startY, endX, endY);
- // Update the last start and end points
- lastStartPoint = { x: startX, y: startY };
+ // Update the last endpoint
lastEndPoint = { x: endX, y: endY };
// Capture the line details