From 1bdf86f1705a848f3b9445783e01b27b0882877a Mon Sep 17 00:00:00 2001 From: ale Date: Wed, 12 Nov 2025 18:22:30 +0100 Subject: [PATCH] tiles position Signed-off-by: ale --- lib/gameLogic.ts | 151 +++++++++++++++++++++++------------------------ 1 file changed, 73 insertions(+), 78 deletions(-) diff --git a/lib/gameLogic.ts b/lib/gameLogic.ts index 60e4104..8c5f944 100644 --- a/lib/gameLogic.ts +++ b/lib/gameLogic.ts @@ -130,7 +130,7 @@ export function isValidMove(tile: DominoTile, side: 'left' | 'right', boardEnds: return canPlaceTile(tile, targetEnd.value); } -// Calculate tile position on board with multi-directional placement +// Calculate tile position on board with smart wrapping to keep tiles visible export function calculateTilePosition( board: PlacedTile[], side: 'left' | 'right', @@ -153,89 +153,84 @@ export function calculateTilePosition( let orientation: 'horizontal' | 'vertical' = 'horizontal'; let rotation = 0; - // Calculate how many tiles on this side to determine direction changes + // Count tiles on current side to determine wrapping const tilesOnSide = side === 'right' ? board.length - 1 : 0; - const directionIndex = Math.floor(tilesOnSide / 3); // Change direction every 3 tiles for tighter spiral - const positionInDirection = tilesOnSide % 3; - + const segmentLength = 5; // Change direction every 5 tiles + const segmentIndex = Math.floor(tilesOnSide / segmentLength); + if (side === 'right') { - const direction = directionIndex % 4; // 0: right, 1: down, 2: left, 3: up + // Alternate between horizontal right and vertical down + const isVerticalSegment = segmentIndex % 2 === 1; - switch (direction) { - case 0: // Going right (horizontal) - orientation = isDouble ? 'vertical' : 'horizontal'; - position = { - x: lastTile.position.x + (lastTile.orientation === 'horizontal' ? tileWidth : tileHeight) + spacing, - y: lastTile.position.y, - }; - break; - case 1: // Going down (vertical) - orientation = isDouble ? 'horizontal' : 'vertical'; - position = { - x: lastTile.position.x, - y: lastTile.position.y + (lastTile.orientation === 'vertical' ? tileHeight : tileWidth) + spacing, - }; - break; - case 2: // Going left (horizontal) - orientation = isDouble ? 'vertical' : 'horizontal'; - position = { - x: lastTile.position.x - (lastTile.orientation === 'horizontal' ? tileWidth : tileHeight) - spacing, - y: lastTile.position.y, - }; - break; - case 3: // Going up (vertical) - orientation = isDouble ? 'horizontal' : 'vertical'; - position = { - x: lastTile.position.x, - y: lastTile.position.y - (lastTile.orientation === 'vertical' ? tileHeight : tileWidth) - spacing, - }; - break; - default: - orientation = 'horizontal'; - position = { - x: lastTile.position.x + tileWidth + spacing, - y: lastTile.position.y, - }; + if (isVerticalSegment && lastTile.orientation === 'horizontal') { + // Transition from horizontal to vertical (going down) + orientation = isDouble ? 'horizontal' : 'vertical'; + const offset = lastTile.orientation === 'horizontal' ? tileWidth : tileHeight; + position = { + x: lastTile.position.x + offset + spacing, + y: lastTile.position.y, + }; + } else if (!isVerticalSegment && lastTile.orientation === 'vertical') { + // Transition from vertical to horizontal (going right) + orientation = isDouble ? 'vertical' : 'horizontal'; + const offset = lastTile.orientation === 'vertical' ? tileHeight : tileWidth; + position = { + x: lastTile.position.x, + y: lastTile.position.y + offset + spacing, + }; + } else if (isVerticalSegment) { + // Continue vertical (going down) + orientation = isDouble ? 'horizontal' : 'vertical'; + const offset = lastTile.orientation === 'vertical' ? tileHeight : tileWidth; + position = { + x: lastTile.position.x, + y: lastTile.position.y + offset + spacing, + }; + } else { + // Continue horizontal (going right) + orientation = isDouble ? 'vertical' : 'horizontal'; + const offset = lastTile.orientation === 'horizontal' ? tileWidth : tileHeight; + position = { + x: lastTile.position.x + offset + spacing, + y: lastTile.position.y, + }; } } else { - // Left side uses same logic but in reverse - const direction = directionIndex % 4; // 0: left, 1: up, 2: right, 3: down + // Left side: alternate between horizontal left and vertical up + const isVerticalSegment = segmentIndex % 2 === 1; - switch (direction) { - case 0: // Going left (horizontal) - orientation = isDouble ? 'vertical' : 'horizontal'; - position = { - x: lastTile.position.x - (lastTile.orientation === 'horizontal' ? tileWidth : tileHeight) - spacing, - y: lastTile.position.y, - }; - break; - case 1: // Going up (vertical) - orientation = isDouble ? 'horizontal' : 'vertical'; - position = { - x: lastTile.position.x, - y: lastTile.position.y - (lastTile.orientation === 'vertical' ? tileHeight : tileWidth) - spacing, - }; - break; - case 2: // Going right (horizontal) - orientation = isDouble ? 'vertical' : 'horizontal'; - position = { - x: lastTile.position.x + (lastTile.orientation === 'horizontal' ? tileWidth : tileHeight) + spacing, - y: lastTile.position.y, - }; - break; - case 3: // Going down (vertical) - orientation = isDouble ? 'horizontal' : 'vertical'; - position = { - x: lastTile.position.x, - y: lastTile.position.y + (lastTile.orientation === 'vertical' ? tileHeight : tileWidth) + spacing, - }; - break; - default: - orientation = 'horizontal'; - position = { - x: lastTile.position.x - tileWidth - spacing, - y: lastTile.position.y, - }; + if (isVerticalSegment && lastTile.orientation === 'horizontal') { + // Transition from horizontal to vertical (going up) + orientation = isDouble ? 'horizontal' : 'vertical'; + const offset = lastTile.orientation === 'horizontal' ? tileWidth : tileHeight; + position = { + x: lastTile.position.x - offset - spacing, + y: lastTile.position.y, + }; + } else if (!isVerticalSegment && lastTile.orientation === 'vertical') { + // Transition from vertical to horizontal (going left) + orientation = isDouble ? 'vertical' : 'horizontal'; + const offset = lastTile.orientation === 'vertical' ? tileHeight : tileWidth; + position = { + x: lastTile.position.x, + y: lastTile.position.y - offset - spacing, + }; + } else if (isVerticalSegment) { + // Continue vertical (going up) + orientation = isDouble ? 'horizontal' : 'vertical'; + const offset = lastTile.orientation === 'vertical' ? tileHeight : tileWidth; + position = { + x: lastTile.position.x, + y: lastTile.position.y - offset - spacing, + }; + } else { + // Continue horizontal (going left) + orientation = isDouble ? 'vertical' : 'horizontal'; + const offset = lastTile.orientation === 'horizontal' ? tileWidth : tileHeight; + position = { + x: lastTile.position.x - offset - spacing, + y: lastTile.position.y, + }; } }