Final Touches

Before we wrap this chapter up, let's make a few final touches.

It's annoying that the pipes start right away once we load the game. This doesn't make much sense in our Title game state either.

Let's make a few changes to the pipe manager to address this:


1
// ...
2

3
export class PipeManager {
4
  export class PipeManager {
5
  currentSpawnPosition: Vector2d;
6
  game: Game;
7
  pipes: Pipe[] = [];
8
  pipeScrollSpeed: number;
9
  spawnTimerThreshold: number;
10
  spawnTimerAccumulator = 0;
11
  spawnPositionYMinimum: number;
12
  spawnPositionYMaximum: number;
13
  spriteMap: SpriteMap;
14
  spriteSheet: HTMLImageElement;
+
  stopped = true;
16

17
  // ...
18

19
  public reset() {
20
    this.pipes = [];
21
    this.spawnTimerAccumulator = 0;
+
    this.stopped = true;
23
  }
24

25
  public stop() {
26
    this.stopped = true;
27
  }
28

+
  public start() {
+
    this.stopped = false;
+
  }
32

33
  // ...
34
}

We've:

Defauled to a stopped state to start
Set stopped to true in reset() as well
Added a start() method to start the pipe manager

Now update the click handler to make use of start():


1
// ...
2

3
canvas.addEventListener("click", () => {
4
  switch (game.state) {
5
    case GameState.Title: {
6
      game.state = GameState.Playing;
7
      bird.flap();
+
      pipeManager.start();
9

10
      break;
11
    }
12

13
    case GameState.Playing: {
14
      bird.flap();
15

16
      break;
17
    }
18

19
    case GameState.GameOver: {
20
      game.reset();
21
      bird.reset();
22
      ground.start();
23
      pipeManager.reset();
24

25
      break;
26
    }
27
  }
28
});
29

30
// ...

That feels a little better. You can start the action when you choose to play.