Project 03 – Variable Face

function setup() {
    createCanvas(650, 450);
    background(240);
}

function draw() {

var rec1x = constrain(mouseX,60,340)
var rec1y = constrain(mouseY,120,390)

var rec2x = 400 - constrain(mouseX,60,340)
var rec2y = 450 - constrain(mouseY,120,390)

var rec3x = dist(400,0,constrain(mouseX,450,600),0)
var rec3y = dist(400,constrain(mouseY*(2/3),120,300),400,constrain(mouseY,180,390))

var rec4x = 650-constrain(mouseX,450,600)
var rec4y = constrain(mouseY/2,60,225)

//making sure movement doesn't leave a trail
  background(240);

//was having issues getting strokes to show up later so I decided to push this part in
  push();
  noStroke();
//top left rectangle
  if (rec1x*rec1y >= rec2x*rec2y) {
    fill(255,0,0);
  } else {
    fill(0,0,255);
  }
  rect(0,0,rec1x,rec1y);
//bottom middle rectangle
  if (rec1x*rec1y >= rec2x*rec2y) {
    fill(0,0,255);
  } else {
    fill(255,0,0);
  }
  rect(constrain(mouseX,60,340),constrain(mouseY,120,390),rec2x,rec2y);
//top middle yellow rectangle
  fill(255,255,0);
  rect(constrain(mouseX,60,340),0,400-constrain(mouseX,60,340),constrain(mouseY/2,60,330));
//colred retangle above yellow
  if (rec3x*rec3y >= rec4x*rec4y) {
    fill(0,0,255);
  } else {
    fill(255,0,0);
  }
  rect(constrain(mouseX,450,600),0,rec4x,rec4y);
//top tight rectangle
  if (rec3x*rec3y >= rec4x*rec4y) {
    fill(255,0,0);
  } else {
    fill(0,0,255);
  }
  rect(400,constrain(mouseY*(2/3),120,300),rec3x,rec3y);
//bottom yellow rectangle
  fill(255,255,0);
  rect(400,constrain(mouseY,180,390),250,450-constrain(mouseY,180,390));


  pop();
  strokeWeight(14);
//dividing line between two sections
  line(400,0,400,450)
//left side vertical line
  line(constrain(mouseX,60,340),0,constrain(mouseX,60,340),450);
//left side long horizontal
  line(0,constrain(mouseY,120,390),400,constrain(mouseY,120,390));
//left side short horizontal
  line(constrain(mouseX,60,340),constrain(mouseY/2,60,330),400,constrain(mouseY/2,60,330));
//right side bottom horizontal
  line(400,constrain(mouseY,180,390),650,constrain(mouseY,180,390));
//right side vertical
  line(constrain(mouseX,450,600),0,constrain(mouseX,450,600),constrain(mouseY,180,390));
//right side top horizontal
  line(constrain(mouseX,450,600),constrain(mouseY/2,60,225),650,constrain(mouseY/2,60,225));
//right side middle horizontal
  line(constrain(mouseX,450,600),constrain(mouseY*(2/3),120,300),400,constrain(mouseY*(2/3),120,300));


}