noLoop();

  createCanvas(400, 400);

}

​

function draw() {

  background(220);

  /*

  rect(100, 20, 35, 10, 10);

  rect(100, 40, 35, 10, 10);

  rect(100, 60, 35, 10, 10);

  rect(100, 80, 35, 10, 10);

  */

  // START - 0

  // END/LIMIT - 300

  // STEP/INCREMENT - 20

    // START      LIMIT      INCREMENT

  for (let i = 0; i <= 400; i = i + 40) {

    console.log("the value of i is: " + i);

​

    // % - remainder 

    // 4 % 2 = 0 // the remainder of 4 divided by 2 is 0

    // 5 % 2 = 1 // the remainder of 5 divided by 2 is 1

    if (i % 80 == 0) {

      fill(0, 0, 255);

    } else if (i % 120 == 0) { // if i is a multiple of 80

      fill(0, 255, 0);

    } else {

      fill(255, 0, 0);

    }

    rect(i, 100, 35, 10, 10);

    fill(255, 0, 255);

    ellipse(100, i * 2, 20, 20);

  } // end for loop

}