URGENT! > Please, I need help create functioning game menu

Tejaun

I was wondering if someone would be able to help me with this huge issue I'm facing. I created a maze and I created a menu for it. I was wondering if someone would be able to put them together so that they work together.
Here's what I have so far.

This is the Menu I have

    PImage heart; 
    int  x= 20, y = 20, directionX = 1, directionY = 0, speed = 3;
    PImage kanye;
    PImage pablo;
    PImage meds;
    Button[] menuButtons;
    static final int NUMMENUBUTTONS = 2;
    boolean drawBoxes;

    void setup() {
      size(750, 600);
      menuButtons = new Button[3];
      menuButtons[0] = new Button("Play Kanye Maze", new PVector(100, 100), 32, color(0), color(255, 0, 0));
      menuButtons[1] = new Button("Exit", new PVector(100, 300), 32, color(0), color(255, 0, 0));
      menuButtons[2] = new Button("How to Play", new PVector(100, 485), 32, color(0), color(255, 0, 0));
      drawBoxes = false;
      heart =loadImage ("heartbreak.png");
      kanye =loadImage("kanye.png");
      pablo =loadImage("pablo.jpg");
      meds =loadImage("kim.png");
    }

    void draw() {
      background(heart);
      displayMenu();
    }

    void displayMenu() {
      for (int i = 0; i < NUMMENUBUTTONS; i++) {
        menuButtons[i].draw(drawBoxes);
      }
    }

    void mousePressed() {
      if (menuButtons[0].containsMouse()) { 
      }
      if (menuButtons[1].containsMouse()) {
        exit();
      }
    }

    class Button {
      PVector pos;
      color textColor, hoverColor;
      float size, tWidth;
      String text;

      Button(String text, PVector pos, float size, color textColor, color hoverColor) {
        this.pos = pos;
        this.textColor = textColor;
        this.hoverColor = hoverColor;
        this.size = size;
        this.text = text;
        textSize(size);
        tWidth = textWidth(text);
      }

      void draw(boolean on) {
        textSize(size);
        if (containsMouse()) fill(hoverColor);
        else fill(textColor);
        text(text, pos.x, pos.y + size);
        if (on)
          rect(pos.x, pos.y, tWidth, size);
      }

      boolean containsMouse() {
        if (mouseX > pos.x && mouseX < pos.x + tWidth && mouseY > pos.y && mouseY < pos.y + size ) 
          return true;
        else return false;
      }
    }

This is the Game

 int  x= 20, y = 20, directionX = 1, directionY = 0, speed = 3;
 PImage kanye;
 PImage pablo;
 PImage meds;

void setup()
{
  size(750, 600);
  smooth();
  noStroke(); 
  imageMode(CENTER);
  kanye =loadImage("kanye.png");
  pablo =loadImage("pablo.jpg");
  meds =loadImage("kim.png");


}

void draw()
{
  background(pablo);
  image (kanye, x, y); 
 // draws a barrier in red 
  fill(250, 250, 10);
  rect(200, 120, 130, 10);
  rect(400, 90, 10, 400);
  rect(200, 40, 10, 90);
  rect(0, 40, 200, 10);
  rect(275, 40, 500, 10);
  rect(325, 90, 10, 40);
  rect(475, 40, 10, 100);
  rect(60, 180, 200, 10);
  rect(325, 180, 10, 150);
  rect(550, 120, 10, 270);
  rect(100, 400, 230, 10);
  rect(200, 270, 10, 130);
  rect(260, 325, 75, 10);
  rect(475, 210, 10, 100);
  rect(400, 300, 80, 10);
  rect(475, 380, 10, 220);
  rect(60, 260, 150, 10);
  rect(0, 330, 90, 10);
  rect(0, 100, 120, 10);
  rect(70, 480, 340, 10);
  rect(70, 550, 410, 10);
  rect(550, 450, 200, 10);
  rect(475, 520, 200, 10);
  rect(475, 380, 200, 10);
  rect(550, 120, 120, 10);
  rect(620, 200, 140, 10);
  rect(670, 310, 10, 80);
  rect(620, 310, 60, 10);
  rect(620, 270, 10, 50);
  fill(255, 0, 0);
  rect(495, 535, 60, 60);
  image(meds, 520, 565, 60, 60);



  // calculate next position of x and y to know when it will hit a wall
  int nextX = int(x+speed*directionX);
  int nextY = int(y+speed*directionY); 

  // check if next position has a bright color(red) to show that the ellipse hit a wall
  if (brightness(get(nextX, nextY)) > 200) {
    // hit a barrier -> go back to beginning
    x=20; y=20;
    directionX=1; directionY=0;
  } else {
    // no barrier -> change Position
    x=nextX;
    y=nextY;
  }


  // check boundaries
  if ((x>width-20) || (x<20)) 

  {   
    directionX=-directionX;
  }
  if ((y>height-20) || (y<20)) 

  {   
    directionY=-directionY;
  } 

  fill (color(255, 255, 255)); 
  image (kanye, x, y);   
  fill (color(22, 82, 22));
}


void keyPressed()
{
  if (key == CODED)
  {
    if (keyCode == LEFT)
    {
      //if (directionX>0) { 
      directionX=-1;
      directionY=0;
      //}
    }
    else if (keyCode == RIGHT)
    {
      //if (directionX<0) {  
      directionX=1;
      directionY=0;
      //}
    }
    else if (keyCode == UP)
    {
      //if (directionY<0) {
      directionY=-1;
      directionX=0;
      //}
    }
    else if (keyCode == DOWN)
    {
      //if (directionY<0) { 
      directionY=1;
      directionX=0;
      //}

    }
  }
}

Tejaun

bump ^

jeremydouglass

@Tejaun --

put them together so that they work together.

What exactly is the problem?

For example, why can you not simply combine the two setups, the global variables, the functions, etc.? What breaks or what stops you from trying to do that?

Chrisir

You need also a boolean menuOn=true;

when menu is done set it to false

In draw and keypressed use it with if which part you want to execute

Tejaun

@jeremydouglass I'm not sure how to put them together

Chrisir

Follow my advice and show your attempt

Tejaun

@Chrisir I'm confused where and what do I do that for? Where do I put it?

Chrisir

Follow jeremy's advice

jeremydouglass

Start with just the global variables and the setup() functions. How do you combine them?

PImage heart; 
int  x= 20, y = 20, directionX = 1, directionY = 0, speed = 3;
PImage kanye;
PImage pablo;
PImage meds;
Button[] menuButtons;
static final int NUMMENUBUTTONS = 2;
boolean drawBoxes;

void setup() {
  size(750, 600);
  menuButtons = new Button[3];
  menuButtons[0] = new Button("Play Kanye Maze", new PVector(100, 100), 32, color(0), color(255, 0, 0));
  menuButtons[1] = new Button("Exit", new PVector(100, 300), 32, color(0), color(255, 0, 0));
  menuButtons[2] = new Button("How to Play", new PVector(100, 485), 32, color(0), color(255, 0, 0));
  drawBoxes = false;
  heart =loadImage ("heartbreak.png");
  kanye =loadImage("kanye.png");
  pablo =loadImage("pablo.jpg");
  meds =loadImage("kim.png");
}

---

int  x= 20, y = 20, directionX = 1, directionY = 0, speed = 3;
 PImage kanye;
 PImage pablo;
 PImage meds;

void setup()
{
  size(750, 600);
  smooth();
  noStroke(); 
  imageMode(CENTER);
  kanye =loadImage("kanye.png");
  pablo =loadImage("pablo.jpg");
  meds =loadImage("kim.png");
}

Tejaun

@jeremydouglass I already combined the setup, the first one. I just need to know how would I go about putting the actual game into the menu. Like when I click the "play kanye maze" button.

Chrisir

Set the boolean I mentioned to true etc.

Chrisir

in draw()

if(menuOn){
   showMenu();
}
   else
     {//game}

Tejaun

@Chrisir

I tried putting them together can you put the stuff where it belongs for me

PImage heart; 
int  x= 20, y = 20, directionX = 1, directionY = 0, speed = 3;
PImage kanye;
PImage pablo;
PImage meds;
Button[] menuButtons;
static final int NUMMENUBUTTONS = 2;
boolean drawBoxes;

void setup() {
  size(750, 600);
  menuButtons = new Button[3];
  menuButtons[0] = new Button("Play Kanye Maze", new PVector(100, 100), 32, color(0), color(255, 0, 0));
  menuButtons[1] = new Button("Exit", new PVector(100, 300), 32, color(0), color(255, 0, 0));
  menuButtons[2] = new Button("How to Play", new PVector(100, 485), 32, color(0), color(255, 0, 0));
  drawBoxes = false;
  heart =loadImage ("heartbreak.png");
  kanye =loadImage("kanye.png");
  pablo =loadImage("pablo.jpg");
  meds =loadImage("kim.png");
}

void draw() {
  background(heart);
  displayMenu();
}

void displayMenu() {
  for (int i = 0; i < NUMMENUBUTTONS; i++) {
    menuButtons[i].draw(drawBoxes);
  }
}

void mousePressed()
{
  if (menuButtons[0].containsMouse()) { 
  background(pablo);
  image (kanye, x, y); 
 // draws a barrier in red 
  fill(250, 250, 10);
  rect(200, 120, 130, 10);
  rect(400, 90, 10, 400);
  rect(200, 40, 10, 90);
  rect(0, 40, 200, 10);
  rect(275, 40, 500, 10);
  rect(325, 90, 10, 40);
  rect(475, 40, 10, 100);
  rect(60, 180, 200, 10);
  rect(325, 180, 10, 150);
  rect(550, 120, 10, 270);
  rect(100, 400, 230, 10);
  rect(200, 270, 10, 130);
  rect(260, 325, 75, 10);
  rect(475, 210, 10, 100);
  rect(400, 300, 80, 10);
  rect(475, 380, 10, 220);
  rect(60, 260, 150, 10);
  rect(0, 330, 90, 10);
  rect(0, 100, 120, 10);
  rect(70, 480, 340, 10);
  rect(70, 550, 410, 10);
  rect(550, 450, 200, 10);
  rect(475, 520, 200, 10);
  rect(475, 380, 200, 10);
  rect(550, 120, 120, 10);
  rect(620, 200, 140, 10);
  rect(670, 310, 10, 80);
  rect(620, 310, 60, 10);
  rect(620, 270, 10, 50);
  fill(255, 0, 0);
  rect(495, 535, 60, 60);
  image(meds, 520, 565, 60, 60);
  }
  if (menuButtons[1].containsMouse()) {
    exit();
  }
}

class Button {
  PVector pos;
  color textColor, hoverColor;
  float size, tWidth;
  String text;

  Button(String text, PVector pos, float size, color textColor, color hoverColor) {
    this.pos = pos;
    this.textColor = textColor;
    this.hoverColor = hoverColor;
    this.size = size;
    this.text = text;
    textSize(size);
    tWidth = textWidth(text);
  }

  void draw(boolean on) {
    textSize(size);
    if (containsMouse()) fill(hoverColor);
    else fill(textColor);
    text(text, pos.x, pos.y + size);
    if (on)
      rect(pos.x, pos.y, tWidth, size);
  }

  boolean containsMouse() {
    if (mouseX > pos.x && mouseX < pos.x + tWidth && mouseY > pos.y && mouseY < pos.y + size ) 
      return true;
    else return false;
  }
}

jeremydouglass

What happened when you put it together? Are you getting an error message? Is something happening incorrectly, or is there an event you need to add?

Chrisir

I repeat

You need also a boolean menuOn=true; before setup()

when menu is done set menuOn to false (or when the entry is clicked in the menu)

In draw and keypressed and mousePressed() use menuOn with if and decide which part you want to execute

AND

in draw()

if(menuOn){
   background(heart);
   displayMenu();
}
   else  {
        //game code
}