Workshop › Simon Says Colors › Step 12 of 27

Go dark again

What we are doing

Every frame, update counts litFor down by one. When it reaches zero, the light goes out: lit becomes -1. The loop now updates, then draws.

```js
function update() {
  if (litFor > 0) {
    litFor -= 1
    if (litFor === 0) lit = -1
  }
}

function loop() {
  update()
  draw()
```

What it means

• While litFor is above 0, subtract 1 each frame. -= means "take away".
• When it hits exactly 0, turn the light off.
• loop calls update() before draw(), so each frame first changes the state, then shows it.

Your turn

1. Above function draw, write update and an empty line.
2. In loop, write update() above draw().

Skills: The game loop, Game states

← Light a pad for a while The computer shows a pad →

All steps

1. Get the canvas and the pen
2. A dark board
3. The first pad
4. Two colors for every pad
5. All four pads
6. A function that draws
7. Light a pad
8. Draw again and again
9. The sequence to remember
10. Show the round
11. Light a pad for a while
12. Go dark again
13. The computer shows a pad
14. Show the whole sequence
15. Watch, then your turn
16. Check each press
17. Play with the keyboard
18. Which pad is at a point?
19. Play with the mouse
20. Progress and mistakes
21. A function for a new game
22. Click to retry
23. Light up when pressed
24. Faster and faster
25. Save the best score
26. Show the best score
27. Build it yourself: no dawdling