Workshop › Flappy-style Bird › Step 21 of 30

Score each pipe once

What we are doing

A pipe scores when it has fully passed the bird. But that stays true for every frame until the pipe leaves the screen. A passed flag on each pipe makes sure it counts only once.

```js
let score = 0

  pipes.push({ x: canvas.width, gapY, passed: false })

  for (const pipe of pipes) {
    pipe.x -= PIPE_SPEED
    if (!pipe.passed && pipe.x + PIPE_WIDTH < bird.x - bird.r) {
      pipe.passed = true
      score += 1
    }
  }
```

What it means

• New pipes start with passed: false.
• The if scores only a pipe that is not passed yet and is fully behind the bird; then it marks it as passed.
• On the next frames !pipe.passed is false, so the same pipe never scores again.

Your turn

1. Under let frame = 0, write let score = 0.
2. In addPipe, add passed: false to the new pipe.
3. In update, inside the pipe loop, under pipe.x -= PIPE_SPEED, write the if block.

Skills: Game states

← Through the opening Show the score →

All steps

1. Get the canvas and the pen
2. Paint the sky
3. Draw the bird
4. A function that draws
5. A function that moves
6. The game loop
7. Gravity
8. A flap
9. Space, Up arrow or a tap
10. Wait for the first flap
11. The ground and the sky
12. Tell the player
13. A pipe as data
14. Draw the pipes
15. The world moves, not the bird
16. A new pipe at a random height
17. A pipe every 90 frames
18. Remove the pipes you passed
19. Is the bird level with a pipe?
20. Through the opening
21. Score each pipe once
22. Show the score
23. A function for a fresh start
24. Try again
25. One place where the game ends
26. Remember the best score
27. Show the best score
28. The same speed on every screen
29. No catching up after a pause
30. Build it yourself: a medal