Workshop › Angry Birds-style Slingshot › Step 42 of 47

Three levels of data

What we are doing

Because a level is only data, more levels need no new code: LEVELS is an array of level arrays. The second level has stone legs and two floors, the third is a wide fortress with three pigs. For now we still start the first one.

```js
// Each level: [kind, x, y, width, height], x and y the top left corner.
const LEVELS = [
  [
    ['wood', 380, 230, 12, 60], ['wood', 440, 230, 12, 60], ['wood', 370, 218, 94, 12], ['pig', 406, 196, 22, 22],
    ['pig', 480, 268, 22, 22],
  ],
  [
    ['stone', 360, 250, 14, 40], ['stone', 450, 250, 14, 40], ['wood', 350, 238, 124, 12], ['pig', 400, 268, 22, 22],
    ['wood', 380, 188, 12, 50], ['wood', 432, 188, 12, 50], ['wood', 372, 176, 80, 12], ['pig', 400, 216, 22, 22],
  ],
  [
    ['wood', 340, 230, 12, 60], ['wood', 400, 230, 12, 60], ['wood', 460, 230, 12, 60], ['stone', 330, 218, 152, 12],
    ['pig', 362, 268, 22, 22], ['pig', 424, 268, 22, 22], ['wood', 360, 168, 12, 50], ['wood', 440, 168, 12, 50],
    ['wood', 352, 156, 108, 12], ['pig', 396, 196, 22, 22], ['stone', 500, 250, 40, 40],
  ],
]

  bodies = LEVELS[0].map(([kind, x, y, w, h]) => body(kind, x, y, w, h))
```

What it means

LEVELS holds three arrays, each one a list of blocks like LEVEL was. The first is the old level.
Every block rests exactly on the one below: a block's y + h equals the next one's y.
LEVELS[0] is the first level.

Your turn

Replace the // The level comment and the whole LEVEL block with the comment and LEVELS.
In reset, change LEVEL.map to LEVELS[0].map.

Skills: Arrays and objects

← Play again Start any level →

All steps