fix: remove adjacent lines in selection
This commit is contained in:
parent
19663353c8
commit
4ca631d4d2
1 changed files with 24 additions and 5 deletions
|
|
@ -1,3 +1,4 @@
|
||||||
|
/* eslint-disable react-hooks/exhaustive-deps */
|
||||||
import { useEffect, useRef } from "react";
|
import { useEffect, useRef } from "react";
|
||||||
import { useApp } from "@pixi/react";
|
import { useApp } from "@pixi/react";
|
||||||
import { DashLineShader, SmoothGraphics } from "@pixi/graphics-smooth";
|
import { DashLineShader, SmoothGraphics } from "@pixi/graphics-smooth";
|
||||||
|
|
@ -21,12 +22,30 @@ function SelectionBox({ selection, coords, scale, isDark }: Props) {
|
||||||
graphics.clear();
|
graphics.clear();
|
||||||
graphics.lineStyle({ width: 1, color: isDark ? 0xffffff : 0x000000, shader });
|
graphics.lineStyle({ width: 1, color: isDark ? 0xffffff : 0x000000, shader });
|
||||||
|
|
||||||
selection.forEach(([x, y]) => {
|
const edges = new Set<string>();
|
||||||
const rectX = x * 16 * scale;
|
|
||||||
const rectY = y * 16 * scale;
|
|
||||||
|
|
||||||
graphics.drawRect(rectX, rectY, 16 * scale, 16 * scale);
|
selection.forEach(([x, y]) => {
|
||||||
// todo: remove lines on adjacent rectangles
|
const top = [x, y, x + 1, y];
|
||||||
|
const bottom = [x, y + 1, x + 1, y + 1];
|
||||||
|
const left = [x, y, x, y + 1];
|
||||||
|
const right = [x + 1, y, x + 1, y + 1];
|
||||||
|
|
||||||
|
// Add edges, or remove them if they already exist (shared edges)
|
||||||
|
[top, bottom, left, right].forEach((edge) => {
|
||||||
|
const stringified = JSON.stringify(edge);
|
||||||
|
if (edges.has(stringified)) {
|
||||||
|
edges.delete(stringified); // Shared edge, remove it
|
||||||
|
} else {
|
||||||
|
edges.add(stringified); // Unique edge, add it
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Draw the remaining edges
|
||||||
|
edges.forEach((edge) => {
|
||||||
|
const [x1, y1, x2, y2] = JSON.parse(edge);
|
||||||
|
graphics.moveTo(x1 * 16 * scale, y1 * 16 * scale);
|
||||||
|
graphics.lineTo(x2 * 16 * scale, y2 * 16 * scale);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue