Workshop › Snake › Step 22 of 28

The game over message

What we are doing

When the game ends, write "Game Over" in the middle of the board.

```js
if (gameOver) {
  ctx.fillStyle = 'white'
  ctx.font = '32px sans-serif'
  ctx.textAlign = 'center'
  ctx.fillText('Game Over', canvas.width / 2, canvas.height / 2)
}
```

What it means

• Only when gameOver is true: pick white, a 32-pixel font, center alignment.
• fillText(text, x, y) writes the text; half the width and height is the middle of the board.

Your turn

In draw, after the snake's for loop, leave an empty line and write the if (gameOver) block.

Skills: Drawing on a canvas

← Crash into yourself Show the score →

All steps

1. Find the canvas
2. Get the pen
3. Paint the board
4. Think in cells
5. Keep the position in a variable
6. A function that draws
7. A function that moves
8. The game loop
9. Slow it down
10. A direction to move in
11. Steer with the arrow keys
12. A body made of a list
13. Move the whole body
14. Pick a spot for the food
15. Draw the food
16. Eat and grow
17. Never put food on the snake
18. A table of turns
19. No U-turns
20. Crash into the walls
21. Crash into yourself
22. The game over message
23. Show the score
24. One function that starts a game
25. Play again with Space
26. Remember the best score
27. Speed up as you grow
28. Build it yourself: through the walls