Workshop › Zelda-style Dungeon › Step 18 of 22

A timer

What we are doing

The goal is to escape as fast as you can, so frames are counted and shown as seconds in the top right.

```js
let frames

  frames = 0

  frames += 1

  ctx.textAlign = 'right'
  const seconds = (f) => (f / 60).toFixed(1)
  ctx.fillText('Time ' + seconds(frames), canvas.width - 12, 30)
```

What it means

• About 60 frames make a second; toFixed(1) keeps one digit after the dot.
• seconds is a small arrow function made right where it is needed.

Your turn

1. Above held, write frames; in reset, set it to 0 after swing; at the top of update, add one.
2. After the keys text, write the time.

Skills: Game states, The game loop

← The locked door Game over →

All steps

1. A room
2. The hero
3. The game loop
4. Walk
5. Walls
6. A touch pad
7. Next room
8. The sword
9. Enemies
10. Strike!
11. They chase you
12. They wander
13. Ouch
14. Blinking and hearts
15. Keys and hearts
16. A world that remembers
17. The locked door
18. A timer
19. Game over
20. The stairs out
21. Best time
22. Build it yourself: cleared rooms