// meaning that it won't be executed, it's just a programmer comment.

​

// # 1 - SETUP : The setup function is executed once at the start

​

function setup() {

  createCanvas(400, 400); // create the canvas space

  rectMode(CENTER); // define mode for rectangle drawing

  noStroke(); // do not draw outlines of shapes

  //stroke(0); // draw the outline of a shape, 0 = black and 255 = white.

}

​

// # 2 - DRAW : The draw function is executed every frame of the animation

​

function draw() {

  // # 2.1 - Draw Background

  background(255); // draw background in white, 0 = black and 255 = white.

  // # 2.2 - Draw Grid of Cubes

  for(let i = 40; i < width ; i = i + 40){

    for(let j = 40; j < height ; j = j + 40){

      push(); // start linear transformation

      translate(i,j); // linear transformation 1 : translate

      rotate(millis()/1000 + i/300 + j/300); // linear transformation 2 : rotate

      fill(map(sin(millis()/1000 + i/100 - j/100),-1,1,120,180)); // color the inside of a shape

      rect(0,0,20,20); // draw one square at the transformed origin

      pop(); // end linear transformation

    }

  }

}