trafficlunar/blockmatic
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: better implementation of ae9f8500

Browse source
This commit is contained in:
trafficlunar 2025-01-17 11:34:32 +00:00
parent 47e7a1d737
commit 3c40a51d42
1 changed files with 17 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
src/components/canvas/Canvas.tsx
View file

@ -87,39 +87,28 @@ function Canvas() {
}, [dragging, holdingAlt, tool, setCssCursor]); }, [dragging, holdingAlt, tool, setCssCursor]);
const onToolUse = useCallback(() => { const onToolUse = useCallback(() => {
// If selection box is there // Calculate the top-left position of the radius
if (!(selectionBoxBounds.maxX == selectionBoxBounds.minX && selectionBoxBounds.maxY == selectionBoxBounds.maxY)) {
// If the mouse is not in the selection, return
if (
!(
mouseCoords.x >= selectionBoxBounds.minX &&
mouseCoords.x <= selectionBoxBounds.maxX - 1 &&
mouseCoords.y >= selectionBoxBounds.minY &&
mouseCoords.y <= selectionBoxBounds.maxY - 1
)
) {
return;
}
}
// Radius calculation - if odd number cursor is in center, if even cursor is in top-left corner
const getRadiusPosition = (): Position => { const getRadiusPosition = (): Position => {
const halfSize = Math.floor(radius / 2); const halfSize = Math.floor(radius / 2);
const x = mouseCoords.x - (radius % 2 === 0 ? 0 : halfSize); const x = mouseCoords.x - (radius % 2 === 0 ? 0 : halfSize);
const y = mouseCoords.y - (radius % 2 === 0 ? 0 : halfSize); const y = mouseCoords.y - (radius % 2 === 0 ? 0 : halfSize);
return { x, y }; return { x, y };
}; };
// Check if a block is within the selection bounds
const isInSelection = (x: number, y: number) => {
return x >= selectionBoxBounds.minX && x < selectionBoxBounds.maxX && y >= selectionBoxBounds.minY && y < selectionBoxBounds.maxY;
};
const eraseTool = () => { const eraseTool = () => {
// Fixes Infinity and NaN errors // Fixes Infinity and NaN errors when no blocks are present
if (blocks.length == 1) return; if (blocks.length == 1) return;
const radiusPosition = getRadiusPosition(); const radiusPosition = getRadiusPosition();
const updated = blocks.filter((block) => { const updated = blocks.filter((block) => {
const withinSquare = const withinRadius =
block.x >= radiusPosition.x && block.x < radiusPosition.x + radius && block.y >= radiusPosition.y && block.y < radiusPosition.y + radius; block.x >= radiusPosition.x && block.x < radiusPosition.x + radius && block.y >= radiusPosition.y && block.y < radiusPosition.y + radius;
return !withinSquare; return !withinRadius || !isInSelection(block.x, block.y);
}); });
setBlocks(updated); setBlocks(updated);
@ -140,11 +129,14 @@ function Canvas() {
const tileX = radiusPosition.x + x; const tileX = radiusPosition.x + x;
const tileY = radiusPosition.y + y; const tileY = radiusPosition.y + y;
radiusBlocks.push({ // Only add blocks within the selection
name: selectedBlock, if (isInSelection(tileX, tileY)) {
x: tileX, radiusBlocks.push({
y: tileY, name: selectedBlock,
}); x: tileX,
y: tileY,
});
}
} }
} }