How do I get p5.js to remove certain objects within my program (e.g. button)?

var img; var buttonhover; var buttonhover2; var header = ["Pop the bubble game"] var buttontext = ["START","HELP"]

function preload() { img = loadImage("bubbleimg.png")

} function setup() { createCanvas(600,620)

}

function draw() { image(img,0,0)

img.resize(600,620)

stroke(0) strokeWeight(4); textFont("stencil") fill(255); textSize(46); text(header[0],46,59);

ellipseMode(CENTER); stroke(5,0,0) fill(55,120,260) strokeWeight(5);

var space = dist(mouseX, mouseY,296,194) if (space<100 ) { buttonhover = true;} else { buttonhover = false; }

if (buttonhover === true) {
  fill(0,255,0);}

ellipse(300,200,200,200);
stroke(0)
  textFont("stencil")

strokeWeight(4); fill(255); textSize(45); text(buttontext[0],230,211);

draw2()

}

function draw2() {

ellipseMode(CENTER); stroke(5,0,0) fill(55,120,260) strokeWeight(5);

var space = dist(mouseX, mouseY,296,450) if (space<100 ) { buttonhover2 = true;} else { buttonhover2 = false; }

if (buttonhover2 === true) {
  fill(255,0,0);
}

ellipse(300,450,200,200);

stroke(0)
  textFont("stencil")

strokeWeight(4); fill(255); textSize(45); text(buttontext[1],244,464);

}

function mousePressed() { if (buttonhover == true) { draw3() }

}

function draw3 () { remove() }

Answers

  • Format your code properly. Edit your post, select your code and hit ctrl+o. Ensure there is an empty line above and below your code.

    Kf

Sign In or Register to comment.