​

let types = ["left","right","empty","forward","function"];

​

const brickWidth = 40;

const brickMargin = 20;

​

function setup() {

  createCanvas(800, 400);

  for( i = 0; i < 10; i++ ){

    let brick = new Brick( random(types) );

    bricks.push(brick);

  }

}

​

function draw() {

  background(220);

  for( i = 0; i < bricks.length; i++ ){

    let brick = bricks[i];

    brick.draw();

    translate( brickWidth+brickMargin, 0);

  }

}

​

​

​

class Brick{

  constructor(type){

    this.type = type;

  }

  draw(){

    noStroke();

    switch( this.type ){

      default:

      case "empty":

        fill("white")

        rect(0,0,brickWidth,brickWidth);

        break;

      case "left":

        fill("#FFBD33");

        rect(0,0,brickWidth,brickWidth);

        break;

      case "right":

        fill("#E15F59");

        rect(0,0,brickWidth,brickWidth);

        break;

      case "forward":

        fill("#00CEB5");

        rect(0,0,brickWidth,brickWidth);

        break;

      case "function":

        fill("#61B2EB");

        rect(0, 0, brickWidth, brickWidth, 2, 10, 10, 2);

        break;

    }

  }

}