Workshop › Endless Runner › Step 16 of 19

Birds

What we are doing

After a while, some obstacles are birds flying low: 30% of the time once the distance passes 1500. They are drawn in orange.

```js
function spawn() {
  // Birds only show up once the player has got used to jumping.
  if (distance > 1500 && Math.random() < 0.3) {
    obstacles.push({ x: canvas.width, y: GROUND - 50, w: 34, h: 20, bird: true })
  } else {
    obstacles.push({ x: canvas.width, y: GROUND - 40, w: 20, h: 40, bird: false })
  }

    ctx.fillStyle = o.bird ? '#b45309' : '#15803d'
```

What it means

Math.random() < 0.3 is true about 30% of the time.
A bird is 34×20, flying with its bottom 30 pixels above the ground; every obstacle now says whether it is a bird.
The color is chosen with condition ? a : b.

Your turn

In spawn, replace the push line with the comment and the if ... else block.
In draw, choose the color with o.bird ? '#b45309' : '#15803d'.

Skills: Game states

← The score counter Which keys are down? →

All steps