Brick Breaker II

Review — Brick Breaker I 5 min

• The ball was two numbers, vx and vy, added every frame.
• A wall flipped one of them. The paddle flipped vy, but only while it came down.
• A miss cost a life, and serve :: custom let the ball ride the paddle first.

Quick-fire

In Castle Climb, the knight never asked <touching color [#b5562f]?>. What did it ask instead?

Today’s Topic 3 min

• A wall as a list: six rows of twelve letters in wall
• Bricks as clones that redraw their own letter
• brick at (x) (y) :: custom — grid maths, Castle Climb’s way
• Breaking a brick by rewriting one letter

Learning outcome

By the end of this lesson you will be able to:

1. Build a wall of clones from a list of rows.
2. Turn a point into a column, a row and a letter.
3. Bounce off the side or the bottom of a brick by moving one way at a time.

Learnt — the wall is a list 28 min

1 · Six rows of letters

The wall is a list called wall. Each item is one row of 12 letters. The letter is the brick:

A hit takes 1 off the letter: a 3 becomes a 2, a 2 becomes a 1, a 1 becomes a dot. So a purple brick turns blue, then green, then vanishes.

............
.3333333333.
.2222222222.
.2222222222.
.1111111111.
.1111111111.

define load wall
delete all of [wall v]
add [............] to [wall v]
add [.3333333333.] to [wall v]
add [.2222222222.] to [wall v]
add [.2222222222.] to [wall v]
add [.1111111111.] to [wall v]
add [.1111111111.] to [wall v]
              

A hidden Brick sprite reads the list and leaves a clone wherever there is a letter. Its costumes are named 1, 2 and 3, so a letter can name its own costume.

define build wall
set [bricks left v] to (0)
set [r v] to (1)
repeat (length of [wall v])
  set [c v] to (1)
  repeat (12)
    set [my tile v] to (letter (c) of (item (r) of [wall v]))
    if <not <(my tile) = [.]>> then
      set [my col v] to (c)
      set [my row v] to (r)
      go to x: ((-220) + ((40) * ((c) - (1)))) y: ((130) - ((20) * ((r) - (1))))
      switch costume to (my tile)
      create clone of [myself v]
      change [bricks left v] by (1)
    end
    change [c v] by (1)
  end
  change [r v] by (1)
end
            

2 · Brick at (x) (y)

Each clone remembers its column and row. That is the only thing a clone needs: it keeps reading its letter, and draws whatever it finds.

when I start as a clone
show
forever
  set [my tile v] to (letter (my col) of (item (my row) of [wall v]))
  if <(my tile) = [.]> then
    delete this clone
  end
  switch costume to (my tile)
end
            

The ball goes the other way: from a point to a column and a row. It is Castle Climb’s tile at, with 40-wide columns and 20-tall rows.

define brick at (x) (y)
set [col v] to (([floor v] of (((x) + (240)) / (40))) + (1))
set [row v] to (([floor v] of (((140) - (y)) / (20))) + (1))
set [tile v] to (letter (col) of (item (row) of [wall v]))
if <(tile) = []> then
  set [tile v] to [.]
end
            

3 · Breaking a brick is writing a letter

To change one letter, rebuild its row letter by letter — Castle Climb’s clear tile, with the new letter as an input.

define write (new)
set [new row v] to []
set [i v] to (1)
repeat (12)
  if <(i) = (col)> then
    set [new row v] to (join (new row) (new))
  else
    set [new row v] to (join (new row) (letter (i) of (item (row) of [wall v])))
  end
  change [i v] by (1)
end
replace item (row) of [wall v] with (new row)
              

define hit brick
change [score v] by (10)
if <(tile) = [1]> then
  write [.] :: custom
  change [bricks left v] by (-1)
else
  write ((tile) - (1)) :: custom
end
              

4 · Across, ask. Up, ask.

Which way should the ball bounce? It depends which face it hit. So the ball moves one way at a time, and asks after each:

1. Move across by vx. Ask about the edge in front: x + 7 going right, x − 7 going left.
2. A brick there? It hit a side. Step back, flip vx, hit the brick.
3. Now move up by vy. Ask about y + 7 or y − 7.
4. A brick there? It hit a top or a bottom. Step back, flip vy, hit the brick.

define move ball
change x by (vx)
if <(vx) > (0)> then
  brick at ((x position) + (7)) (y position) :: custom
else
  brick at ((x position) - (7)) (y position) :: custom
end
if <not <(tile) = [.]>> then
  change x by ((0) - (vx))
  set [vx v] to ((0) - (vx))
  hit brick :: custom
end
change y by (vy)
if <(vy) > (0)> then
  brick at (x position) ((y position) + (7)) :: custom
else
  brick at (x position) ((y position) - (7)) :: custom
end
if <not <(tile) = [.]>> then
  change y by ((0) - (vy))
  set [vy v] to ((0) - (vy))
  hit brick :: custom
end
            

Basic — the ball breaks the wall 25 min

Open your Brick Breaker I project. The paddle, walls and serve stay as they are.

Step 1 — the Brick sprite

1. Paint a Brick: a 38 × 18 rectangle. Make three costumes, coloured green, blue and purple, and name them 1, 2 and 3.
2. Make a list for all sprites called wall, and variables score, bricks left, col, row, tile, new row and i.
3. On the Brick, for this sprite only: my col, my row, my tile, r and c.
4. Build load wall, build wall and the clone script from Learnt sections 1 and 2.

when flag clicked
hide
load wall :: custom
build wall :: custom
            

Step 2 — the Ball’s four new blocks

Build brick at, write, hit brick and move ball from the Learnt. Tick “Run without screen refresh” on all four.

Step 3 — the main loop

when flag clicked
set [lives v] to (3)
set [score v] to (0)
serve :: custom
forever
  move ball :: custom
  walls :: custom
  if <<touching [Paddle v]?> and <(vy) < (0)>> then
    set [vy v] to ((0) - (vy))
  end
  if <(y position) < (-170)> then
    change [lives v] by (-1)
    if <(lives) = (0)> then
      say [Game over!]
      stop [this script v]
    end
    serve :: custom
  end
end
            

A wall of your own

The wall is just text. Type a new one.

• Change the six rows in load wall to make a pyramid.
• Every row must still be exactly 12 letters long.
• Use all three brick strengths.

.....33.....
....2222....
...222222...
..11111111..
.1111111111.
111111111111

Wall cleared!

Right now the game never ends if you win. Fix that.

• When the last brick breaks, the ball says Wall cleared!.
• The ball stops moving.
• Use bricks left — do not count clones.

if <(bricks left) = (0)> then
  say [Wall cleared!]
  stop [this script v]
end
            

Steel bricks

Add a new letter, #, for a steel brick .

• The ball bounces off steel, like any brick.
• Steel never breaks, and scores nothing.
• Steel does not count in bricks left, so you can still clear the wall.

define hit brick
if <not <(tile) = [#]>> then
  change [score v] by (10)
  if <(tile) = [1]> then
    write [.] :: custom
    change [bricks left v] by (-1)
  else
    write ((tile) - (1)) :: custom
  end
end
            

if <not <(my tile) = [#]>> then
  change [bricks left v] by (1)
end
            

A wall in one save code

Tile Maker packed a level into one long code. Do the same for a wall.

• A variable code holds the whole wall as 72 letters: the six rows joined together.
• A My Block unpack cuts it back into six rows of 12 in wall.
• load wall is not needed any more.

define unpack
delete all of [wall v]
set [r v] to (0)
repeat (6)
  set [new row v] to []
  set [c v] to (1)
  repeat (12)
    set [new row v] to (join (new row) (letter (((r) * (12)) + (c)) of (code)))
    change [c v] by (1)
  end
  add (new row) to [wall v]
  change [r v] by (1)
end
            

Summary 5 min

• The wall is a list. Each letter is a brick, and the letter is its hit points.
• Brick clones only remember their column and row, and draw what the list says.
• brick at turns a point into a column, a row and a letter.
• The ball moves across, asks, then up, asks — so it knows which face it hit.

Hit points

How many hits something can take before it breaks.

Grid maths

Turning a point into a column and a row with floor.

Face

One side of a brick: top, bottom, left or right.

Hand in

Save your wall game. Next lesson the paddle starts to aim: where the ball lands on it decides where it goes.