let width = 500;

let height = 500;

let rows = 5;

let columns = 5;

let _x = 0;

let _y = 0;

let x_pos = 0;

let y_pos = 0;

​

class Square {

  constructor(x, y) {

    this.x = x;

    this.y = y;

    this.width = width/columns;

    this.height = height/rows;

    this.fill = false;

  }

​

  display() {

    if (this.fill == true){

      fill(color("black"));

    } else {

        fill(color("white"));

      }

    rect(this.x, this.y, this.width, this.height);

  }

  stand(){

    fill(color("orange"))

    ellipse(this.x+this.width/2, this.y+this.height/2,

             this.width/2, this.height/2);

  }

}

​

function drawBlankSquares(){

  background(220);

  for (let y = 0; y < squares.length; y++) {

    for (let x = 0; x < squares[y].length; x++) {

      squares[y][x].display();

    }

  }

}

​

function fill_in(){

  if (x_pos < squares.length &&

      y_pos < squares[0].length &&

      x_pos >= 0 &&

      y_pos >= 0){

    squares[x_pos][y_pos].fill = true;

  }

}

function f(){ fill_in(); }

​

function left(){ if (x_pos > 0){ x_pos -= 1;} }

function l(){ left(); }

​

function right(){ if (x_pos < squares.length-2){ x_pos += 1;} }

function r(){ right(); }

​

function up(){ if (y_pos > 0){ y_pos -= 1;} }

function u(){ up(); }

​

function down(){ if (y_pos < squares[0].length-2){ y_pos += 1;} }

function d(){ down(); }

​

function setup() {

  createCanvas(width, height);

  for (let x=0; x<=width; x+=width/columns){

    _y = 0;

    squares[_x] = [];

    for (let y=0; y<=height; y+=height/rows){

      squares[_x][_y] = (new Square(x, y));

      _y++;

    }

    _x++;

  }

  follow_directions();

  drawBlankSquares();

​

  squares[x_pos][y_pos].stand();

}

​

function draw() {  }

​

function outline(){

  right();

  fill_in();

  right();

  fill_in();

  right();

  fill_in();

  down();

  fill_in();

  down();

  fill_in();

  down();

  fill_in();

  left();

  fill_in();

  left();

  fill_in();

  left();

  fill_in();

  up();

  fill_in();

  up();

  fill_in();

  up();

  fill_in();  

}

​

​

// ---------------------------------------------------

//           Write your code here ↓

// ---------------------------------------------------

​

function follow_directions(){

​

  down()

  fill_in()

  right()

  right()

  down()

  fill_in()

  right()

  fill_in()

  down()

  down()

  fill_in()

  // d(); f(); r(); r(); d(); f(); r(); f(); d(); d(); f();

}

​