var hover = false;

​

​

function setup() {

  createCanvas(400, 400);

}

​

function draw() {

  background(0);

  // is mouse hovering over the button

  hover = isMouseInButtonArea();

​

  // is button pressed

  if (hover && mouseIsPressed) {

    button = true;

  } else if (!mouseIsPressed) {

    button = false;

  }

​

  if (button) {

    // when the button is pressed

    background(0);

    fill(random(255), random(100), random(150));

    circle(width/2, height/2, 200);

​

  } else {

    // if the button is not pressed

    background(255);  

    if (hover) {

      fill(200, 100, 100);

    } else {

      fill(100);

    }

    rect(width/4, height*3/9, width/2, height/3);

  }

  // cursor

  fill(143, 150, 255);

  ellipse(mouseX, mouseY, 20, 20);

​

}

​

// check if the mouse is within button area

function isMouseInButtonArea() {

  return mouseX > width/4 && mouseX < width*3/4 &&

         mouseY > height*3/9 && mouseY < height*2/3;

}

​