Snake wraps around the screen edges
The snake no longer dies when it hits a wall. Instead, it comes back in on the opposite side and keeps moving the same way. Running into its own tail still ends the game, and the start screen and README instructions were updated to match.
What it does
- Remove wall collision as a game-over condition in the Snake game.
- When the snake's head would move past any edge of the grid, it reappears on the opposite edge (horizontal wrap for left/right, vertical wrap for top/bottom), keeping the same direction of travel. Use modulo arithmetic over the grid size (e.g. (pos + delta + GRID) % GRID).
- Self-collision still ends the game. The tail cell is still treated as safe to move into when the snake is not eating on that move.
- Eating food, growth, speed-up, scoring, pause, restart, and saved best score are unchanged.
- Start screen text changes from "Eat the red food to grow. Don't hit the walls or yourself!" to "Eat the red food to grow. Go off one edge to come back on the other side, but don't hit yourself!"
- README controls section: replace "The game ends if you hit a wall or your own tail." with two bullets: "There are no deadly walls: go off one edge and the snake comes back in on the opposite side." and "The game ends if you run into your own tail."
Safety check ✓ Safe
The change is small and limited to game movement logic and instruction text. It adds no new dependencies, network access, or file access, and nothing in it is unrelated to the request.
Conversation that created this patch
@lena
Let the snake wrap around the edges instead of dying at the walls.
AI
The walls no longer kill the snake. If it goes off one edge, it comes straight back in on the opposite side, still moving the same way. Running into its own tail still ends the game.
I also changed the instructions on the start screen and in the README so they no longer say to avoid the walls. I haven't played it in a browser, so try it to confirm it feels right. Your saved best score is still there.
Code changes (for the curious, 2 files) · raw
README.md +2 −1
@@ -10,7 +10,8 @@ The classic Snake game. It runs in your web browser from a single file and works | |
| |
- **Arrow keys** move the snake. | |
- Eat the **red food** to grow and score a point. The snake speeds up a little each time it eats. | |
| − | - The game ends if you hit a wall or your own tail. |
| + | - There are no deadly walls: go off one edge and the snake comes back in on the opposite side. |
| + | - The game ends if you run into your own tail. |
- On the Game Over screen, click **Play Again** or press **Space** or **Enter** to restart. | |
- Press **P** to pause and resume. | |
|
index.html +7 −4
@@ -83,7 +83,7 @@ | |
<div id="startScreen" class="overlay"> | |
<h2>Snake</h2> | |
<p>Use the arrow keys to move.</p> | |
| − | <p>Eat the red food to grow. Don't hit the walls or yourself!</p> |
| + | <p>Eat the red food to grow. Go off one edge to come back on the other side, but don't hit yourself!</p> |
<button id="startBtn">Start</button> | |
<p class="help">or press any arrow key</p> | |
</div> | |
@@ -184,14 +184,17 @@ | |
// Use the next queued turn, if any (lets quick key presses register one per move). | |
if (inputQueue.length) direction = inputQueue.shift(); | |
| |
| − | const head = { x: snake[0].x + direction.x, y: snake[0].y + direction.y }; |
| + | // Going off one edge brings the snake back in on the opposite side. |
| + | const head = { |
| + | x: (snake[0].x + direction.x + GRID) % GRID, |
| + | y: (snake[0].y + direction.y + GRID) % GRID, |
| + | }; |
const eating = food && head.x === food.x && head.y === food.y; | |
| |
// The tail moves away this turn unless we're eating, so it's safe to move into. | |
const body = eating ? snake : snake.slice(0, -1); | |
| − | const hitWall = head.x < 0 || head.y < 0 || head.x >= GRID || head.y >= GRID; |
const hitSelf = body.some(s => s.x === head.x && s.y === head.y); | |
| − | if (hitWall || hitSelf) { |
| + | if (hitSelf) { |
gameOver(); | |
return; | |
} |