Spirograph #2

function setup(){

  createCanvas(windowWidth, windowHeight);

  background(0);

  print('Move the mouse up and down on the canvas to change the color, right and left to change the scale. Click to clear the canvas.');

}

​

function draw() {

  fill(0,0,0,0); //transparent square fills

​

  colorMode(RGB);

​

  //starts the squares in the center of the canvas

  translate(width/2, height/2); 

  //rotates the squares

  rotate(radians(frameCount*3));

  //changes the size of the squares depending on the X coordinate of the mouse

  scale(mouseX/500, mouseX/500); 

  //changes the color of the stroke depending on the Y coordinate of the mouse

  stroke(lerpColor(color(102,152,152),color(243,121,32), mouseY/750)); 

  rect(75,75,100,100);

}

​

//clears the canvas upon clicking the mouse

function mousePressed(){

  clear();

}