Workshop › Puzzle Bobble-style Bubble Shooter › Step 25 of 31

Win or lose

What we are doing

You win when the board is empty (plus 1000 points). You lose when any bubble hangs below the danger line near the shooter.

```js
const DANGER = 440 // a bubble below this line ends the game
let state // 'playing', 'won' or 'lost'
  state = 'playing'

  const cells = grid.flatMap((row, r2) => row.map((color2, c2) => ({ r: r2, c: c2, color: color2 })))
  if (cells.every((cell) => cell.color < 0)) {
    state = 'won'
    score += 1000
  } else if (cells.some((cell) => cell.color >= 0 && cellPos(cell.r, cell.c).y + R > DANGER)) state = 'lost'
```

What it means

• cells is every cell as { r, c, color }, in one list.
• every empty: won. Otherwise, some bubble whose bottom edge is below DANGER: lost.

Your turn

1. Under SPEED, write DANGER; under let drop, write let state; in reset, under drop = 0, write state = 'playing'.
2. At the end of attach, under the drop line, write the check.

Skills: Game states

← The ceiling comes down The danger line →

All steps

1. The night sky
2. One bubble
3. A grid of cells
4. Draw the grid
5. Bubbles that nest
6. The shooter
7. Aim upwards
8. Turn with the arrows
9. Aim with the pointer
10. Fire!
11. Fly
12. Bounce off the walls
13. Touching something?
14. Stick into the grid
15. Smaller steps
16. Six neighbours
17. Flood fill
18. Three in a row pop
19. Bubbles that fall
20. Cut them loose
21. Show the score
22. Only useful colors
23. Count the shots
24. The ceiling comes down
25. Win or lose
26. The danger line
27. The end message
28. Play again
29. Best score
30. A dotted guide
31. Build it yourself: swap bubbles