03 Generative Art

//Julia Steinweh-Adler
//Section D


var value = 0;
var bg = 0;

function setup(){
    createCanvas(600, 450);
    rectMode(CENTER);

}

function draw() {
    background(value/2, value/4, value*2);
    noStroke();
    fill(value * 1.3, value * 0.7, value * 0.5); // fill color uses mouse position
    let size = dist(mouseX, mouseY, width/2, height);
    let sizeI = dist(mouseY, mouseX, width/2, height);
    strokeWeight(10);
    stroke(value-80, 0, 0);    //stroke color uses mouse position in red value
  
  //CAMERA BODY
  rect(width/2, height/2, sizeI, sizeI, 20);    //rounded cornered square
  rect(width/2, height/2, sizeI, value);    //widest rectangle
  fill(200, 100, 100);    //color red
  rect(width/2, height/2, size, value);   //inner rectangle
  fill(value * 1.3, value * 0.7, value * 0.5);    //mouse position influenced orange
  ellipse(width/2, height/2, size, size);  //outer circle
  fill(200, 100, 100);   //red
  ellipse(width/2, height/2, size*0.7, size*0.7);  //inner circle
  fill(value/2, value/4, value*2) 
  ellipse(width/2, height/2, size/2.5, size/2.5); //cut center hole

  //FLASH - mouse pressed "flash" green square that rotates with mouse coordinates
  if (mouseIsPressed) {
    fill(100, 200, 150);  //green
    push();
    translate(width/2, height/2);    //change origin to center
    rotate(radians(mouseY));    //mouse Y coordinates value for degrees of rotation
    rect(0, 0, size/6, size/6);     //rectangle that is size responsive
    pop();  
    
  } else {    //when mouse not clicked, use constant ellipse
    ellipse(width/2, height/2, 50, 50);
  }
  
}
  // Fade in and Out Background
    function mouseMoved() {
      if (bg == 0) {    
       value += 0.5;   //value increase
      } if (value == 255) {    //value can only increase to 255 before decreasing 
        bg = 1
      } if (bg == 1) { 
        value -= 0.5;    // value decrease
      } if (value == 140) {    //value can only decrease to 140 before increasing
        bg =0
     }
}