14 - Pipes

There's not much challenge to the game now, so let's add some green pipes that move across the screen for the bird to dodge.

As you might have guessed by now, we'll add a Pipe Sprite for that. Each pipe is 2 rectangles with a gap in the middle. We need to do some math to calculate the y coordinate of each rectangle - remembering the y coordinate is the center of the rectangle.

Next we need to add our pipes in the Level Sprite's state, defining it in the init method. Then in the loop method we update the state to move the pipe. Lastly in render we map the pipe state to the Pipe Sprite.

The newPipe function sets a random y coordinate for the pipe gap, which our bird has to jump through. The device parameter has a random field, which works like Math.random. It's important to use Replay's random function to ensure the game works cross-platform.