Assignment 4

var clPurple; // color purple

var clWhite; // color white

​

var deltaY;

​

function setup() {

  // create canvas 600 x 600

  createCanvas(600, 600);

​

  // assign values to variables declared above

  clPurple = "#7209b7";

  clWhite = "#ffffff";

​

  rad = 600;

​

  stW = 1;

​

  x = width / 85; // equals 600 / 85 = 7.05;

  y = height / 60; // equals 600 / 60 = 10;

  // Starting value of deltaY

  deltaY = -600;

​

  //print(x, y)

​

  //noLoop();

}

​

​

function draw() {

  background(clWhite);

  background(220);

  rad = 800;

  stW = 0.2;

  noFill();

  stroke("purple");

  /*

  // Draw the first square

  square(x, y, rad);

​

  // Second decrease square rad

  rad = rad - 20;

  square(x, y, rad);

​

  // Third decrease square rad

  rad = rad - 20;

  square(x, y, rad);

​

  // Fourth decrease square rad

  rad = rad - 20;

  square(x, y, rad);

​

  // Fifth decrease square rad

  rad = rad - 20;

  square(x, y, rad);

​

  // Sixth decrease square rad

  rad = rad - 20;

  square(x, y, rad);

​

  // Seventh decrease square rad

  rad = rad - 20;

  square(x, y, rad);

  */

  // Disable Color Fill

  noFill();

  // repeat the following code 7 times

  for(var i = 0; i < 40; i = i + 1) {

    strokeWeight(stW);

    square(x, y, rad);

    rad = rad - 20;

    stW = stW + 0.2;

  }

  rad = 800;

  stW = 0.2;

  // Draw the second circle group

  // repeat the following code 7 times

  deltaY = deltaY + 1;

  if(deltaY > height) {

    deltaY = -600;

  }

  push();     // Lock style settings

  translate(0, deltaY);

  for(var i = 0; i < 40; i = i + 1) {

    strokeWeight(stW);

    square(x, y, rad);

    rad = rad - 20;

    stW = stW + 0.3; 

  }

​

  pop();    // unlock style settings 

}