//Create variables for the light colors

//Use conditionals to change the colors based on the mouse position

let redLight = 'red'

let yellowLight = 'yellow'

let greenLight = 'green'

​

function setup() {

  createCanvas(200,200)

}

​

function draw() {

  background(220);

  rectMode(CENTER)

  fill(100);

  rect(width / 2, height / 2, 80, 160);

​

  fill(redLight)

  ellipse(width / 2, height / 2 - 50, 40, 40)

​

  fill(yellowLight)

  ellipse(width / 2, height / 2, 40)

​

  fill(greenLight)

  ellipse(width / 2, height / 2 + 50, 40, 40)

​

​

​

​

  if (mouseY < height/3) {

  redLight ='red'

  yellowLight = 'white'

  greenLight = 'white'

  }

  else if (mouseY < height * 2/3) {

  redLight ='white'

  yellowLight = 'yellow'

  greenLight = 'white'

  }

    else if (mouseY < height) {

  redLight ='white'

  yellowLight = 'white'

  greenLight = 'green'

  }

​

//   else if(mouseY<10) {

//     yellowLight=0

//   }

//   if (mouseY < 133) {

//     greenLight = 'green'

//   } else if (mouseY>200) {

​

  // }

​

  //when the y location of my mouse is less than 1/3 of my canvas height- the red light should be on

  // when the y location of my mouse is less than 2/3 of my canvas height- the yellow light should be on

  // when the y location of my mouse is more than 2/3 of my canvas height- the green light should be on

}

​

​

// if(boolean){

// output

// }else if(boolean){

​

// output

// }else if(boolean){

​

// output

// }else{

// output

// }