diff --git a/frontend/src/lib/components/screensavers/FractalCrystalline.svelte b/frontend/src/lib/components/screensavers/FractalCrystalline.svelte index 9b84cbb..b8dfb8f 100644 --- a/frontend/src/lib/components/screensavers/FractalCrystalline.svelte +++ b/frontend/src/lib/components/screensavers/FractalCrystalline.svelte @@ -15,7 +15,7 @@ // Collision detection grid let occupiedGrid = []; - const GRID_CELL_SIZE = 4; + const GRID_CELL_SIZE = 2; // Smaller cells for finer collision detection let gridWidth, gridHeight; const CONFIG = { @@ -61,6 +61,31 @@ } } + function markLinePath(x1, y1, x2, y2) { + // Mark all cells along the line path + const dx = x2 - x1; + const dy = y2 - y1; + const steps = Math.max(Math.abs(dx), Math.abs(dy)) / GRID_CELL_SIZE; + for (let i = 0; i <= steps; i++) { + const t = steps > 0 ? i / steps : 0; + markOccupied(x1 + dx * t, y1 + dy * t); + } + } + + function isPathOccupied(x1, y1, x2, y2) { + // Check if any cell along the path is occupied (skip the starting point) + const dx = x2 - x1; + const dy = y2 - y1; + const steps = Math.max(Math.abs(dx), Math.abs(dy)) / GRID_CELL_SIZE; + for (let i = 1; i <= steps; i++) { // Start from 1 to skip current position + const t = steps > 0 ? i / steps : 0; + if (isOccupied(x1 + dx * t, y1 + dy * t)) { + return true; + } + } + return false; + } + function getCoverage() { let filled = 0; for (let row of occupiedGrid) { @@ -137,14 +162,14 @@ continue; } - // Check collision - kill branch if cell is already occupied - if (isOccupied(newX, newY)) { + // Check collision - kill branch if path crosses occupied cells + if (isPathOccupied(branch.x, branch.y, newX, newY)) { branches.splice(i, 1); continue; } - // Mark cell as occupied - markOccupied(newX, newY); + // Mark the line path as occupied + markLinePath(branch.x, branch.y, newX, newY); // Store point for shatter effect crystalPoints.push({ diff --git a/frontend/src/routes/+layout.svelte b/frontend/src/routes/+layout.svelte index 91d1b7c..2941080 100644 --- a/frontend/src/routes/+layout.svelte +++ b/frontend/src/routes/+layout.svelte @@ -129,6 +129,7 @@ -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; + line-height: 32px; } .nav-links {