let B;

​

let i=0;

let j=0;

​

W ="#FFFFFF";

B = "#000000";

​

let aArray =       [W,B,B,B,B,B,B,B,B,B,B,B,W,B,B,B,B,B,W,B,B,B,B,B,B,B,B,B,B,B,W,B];

​

let bArray = [B,B,B,B,B,B,W,B,B,B,B,B,B,W,B,B,B,W,B,B,B,B,B,B,W,B,B,B,B,B,B,B];

​

let cArray = 

[B,B,B,B,B,B,W,B,B,B,B,B,B,B,W,W,W,B,B,B,B,B,B,B,W,B,B,B,B,B,B,B];

​

let dArray = [B,B,B,B,B,W,B,W,B,B,B,B,B,B,B,B,B,B,B,B,B,B,B,W,B,W,B,B,B,B,B,B];

​

let eArray = [B,B,B,B,W,B,B,B,W,B,B,B,B,B,B,B,B,B,B,B,B,B,W,B,B,B,W,B,B,B,B,B];

​

let fArray = [B,B,B,W,B,B,B,B,B,W,B,B,B,B,B,W,B,B,B,B,B,W,B,B,B,B,B,W,B,B,B,B];

​

let hArray = [B,B,B,B,W,B,B,B,W,B,B,B,B,B,W,B,W,B,B,B,B,B,W,B,B,B,W,B,B,B,B,W];

​

  let iArray = [B,B,B,B,B,W,W,W,B,B,B,B,B,W,B,B,B,W,B,B,B,B,B,W,W,W,B,B,B,B,B,W];

​

​

  let jArray = [B,B,B,B,B,B,B,B,B,B,B,B,B,W,B,B,B,W,B,B,B,B,B,B,B,B,B,B,B,B,B,W];

  let gArray = [B,B,B,W,B,B,B,B,B,W,B,B,B,B,W,B,W,B,B,B,B,W,B,B,B,B,B,W,B,B,B,B];

​

function setup() {

noStroke()

  createCanvas(660, 640);

  x=20;

}

​

​

function draw() {

​

  background(220);

​

    for (let a = 0; a < aArray.length; a++) {

​

      //Row 1, 2, 3, 16, 17, 18, 31,32

      rect(a*x, 0, x, x);

      rect(a*x, 20, x, x);

      rect(a*x, 40, x, x);

      rect(a*x, 300, x, x);

      rect(a*x, 320, x, x);

      rect(a*x, 340, x, x);

      rect(a*x, 600, x, x);

      rect(a*x, 620, x, x);

      fill(aArray[a]);

     }

​

​

​

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

      //Row 4,19

      rect(i*x, 60, x, x);

      rect(i*x, 360, x, x); 

      fill(bArray[i]);

    }

​

​

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

      //Row 4,20

      rect(i*x, 80, x, x);

      rect(i*x, 380, x, x); 

      fill(cArray[i]);

    }

  // pop();

​

  // push();

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

      //Row 6,7,21,22

      rect(i*x, 100, x, x);

      rect(i*x, 120, x, x);

      rect(i*x, 400, x, x);

      rect(i*x, 420, x, x);

      fill(dArray[i]);

    }

  // pop();

​

  // push();

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

      //Row 8,9,23,24

      rect(i*x, 140, x, x);

      rect(i*x, 160, x, x);

      rect(i*x, 440, x, x);

      rect(i*x, 460, x, x);

      fill(eArray[i]);

    }

  // pop();

  // push();

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

      //Row 10,11,25,26

      rect(i*x, 180, x, x);

      rect(i*x, 200, x, x);

      rect(i*x, 480, x, x);

      rect(i*x, 500, x, x);

      fill(fArray[i]);

    }

  // pop();

​

  // push();

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

      //Row 12,27

      rect(i*x, 220, x, x);

      rect(i*x, 520, x, x); 

      fill(gArray[i]);

    }

  // pop();

  // push();

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

      //Row 13,28

      rect(i*x, 240, x, x);

      rect(i*x, 540, x, x); 

      fill(hArray[i]);

    }

  // pop();

  // push();

​

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

      //Row 14,29

      rect(i*x, 260, x, x);

      rect(i*x, 560, x, x); 

      fill(iArray[i]);

    }

  // pop();

​

  // push();

​

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

      //Row 14,29

      rect(i*x, 280, x, x);

      rect(i*x, 580, x, x); 

      fill(jArray[i]);

    }

  // pop();

}