How to change "pages" with button of an image

arikar1

Otis and Max are the name of my images, I want it to change the page to have a different player in my game based on which image/button you click on. Please help!

int maxX, maxY;      // Position of square button
int otisX, otisY;  // Position of circle button
int maxW, maxH =300;
int otisW, otisH =300;
//int rectSize = 90;     // Diameter of rect
//int circleSize = 93;   // Diameter of circle
//color rectColor, circleColor, baseColor;
//color rectHighlight, circleHighlight;
//color currentColor;
boolean maxOver = false;
boolean otisOver = false;

int page = 1;


PImage otis;
PImage max;

void setup() {
  size(1200, 750); 
  otisX = width/2+otisSize/2+10;
  otisY = height/2;
  //otisX=0;
  //otisY=150;
  //maxX=800;
      //maxY=150;
  maxX = width/2-maxSize-10;
  maxY = height/2-maxSize/2;

  otis = loadImage("otis.png");
  max = loadImage("max.png");

}

  boolean MaxOver(int x, int y, int width, int height)  {
  if (mouseX >= x && mouseX <= x+width && 
      mouseY >= y && mouseY <= y+height) {
    return true;
  } else {
    return false;
  }
}

  boolean OtisOver(int x, int y, int width, int height)  {
  if (mouseX >= x && mouseX <= x+width && 
      mouseY >= y && mouseY <= y+height) {
    return true;
 } else {
    return false;
  }
}




void draw() {
  update(mouseX, mouseY);

  if(MaxOver){
    page++;
 // }else{
 }
    //(page==1);
  image(max, maxX, maxY); 
  if (OtisOver){
    page--;
  }
}



//if (page == 1) {
//  pageOne();
//}
//if (page==2) {
//  pageTwo();
//}
// if (page==3) {
//  pageThree();
//}
  //if (otisOver){
  //  (page--);
  //}else{
  //  (page==1);
  //}
  //if (maxOver){
  //  (page++);
  //}else{
  //  (page==1);
  //}


    //void mouseClicked() {
  //if// (page < 6) {
    //page++;
 // }
//}

if (page==1){
  //image(otis, otisX,otisY);
  //image(max, maxX, maxY);

  //if (OtisOver (otisX,otisY,otisW,otisH)==true) {
  //  page++;
 //// }else{
// }
 //if (MaxOver (maxX,maxY,maxW,maxH)==true) {
  // page--;
// }


}else if (page==2){
  image(max, maxX, maxY);
}else if (page==0){
  background(#FFFFFF);
  image(otis, otisX, otisY);
}
}
void mousePressed() {
  if(page==1) {
    if (MaxOver(maxX, maxY, maxW, maxH) == true){
      page++;}
  }
  if(page==1) {
    if (OtisOver (otisX, otisY, otisW, otisH) == true){
      page--;}
  }
}

 OR I HAVE ALSO BEEN TRYING THIS



int maxX, maxY;      // Position of square button
int otisX, otisY;  // Position of circle button
//int maxW, maxH =300;
//int otisW, otisH =300;
int otisSize = 300;     // Diameter of rect
int maxSize = 300;   // Diameter of circle
//color rectColor, circleColor, baseColor;
//color rectHighlight, circleHighlight;
//color currentColor;
boolean maxOver = false;
boolean otisOver = false;

int page = 1;


PImage otis;
PImage max;

void setup() {
  size(1200, 750); 
  otisX = width/2+otisSize/2+10;
  otisY = height/2;
  //otisX=0;
  //otisY=150;
  //maxX=800;
  //maxY=150;
  maxX = width/2-maxSize-10;
  maxY = height/2-maxSize/2;

  otis = loadImage("otis.png");
  max = loadImage("max.png");

}

  boolean MaxOver(int x, int y, int width, int height)  {
  if (mouseX >= x && mouseX <= x+width && 
      mouseY >= y && mouseY <= y+height) {
    return true;
  } else {
    return false;
  }
}

  boolean OtisOver(int x, int y, int width, int height)  {
  if (mouseX >= x && mouseX <= x+width && 
      mouseY >= y && mouseY <= y+height) {
    return true;
 } else {
    return false;
  }
}




void draw() {
  update(mouseX, mouseY);

if (page==1){
  if(maxOver){
    page++;
 // }else{
 }
    //(page==1);
  image(max, maxX, maxY); 
  if (otisOver){
    page--;
  }
  image(otis, otisX, otisY); 


  }else if (page==2){
  image(max, maxX, maxY);
}else if (page==0){
  background(#FFFFFF);
  image(otis, otisX, otisY);
}
}




void update(int x, int y) {
  if ( otisOver(otisX, otisY, otisSize, otisSize) ) {
    otisOver = true;
    maxOver = false;
  } else if ( maxOver(maxX, maxY, maxSize, maxSize) ) {
    maxOver = true;
    otisOver = false;
  } else {
    otisOver = maxOver = false;
  }
}

void mousePressed() {
  if (otisOver) {
    page--;
  }
  if (maxOver) {
    page++;
  }
}

boolean maxOver(int x, int y, int width, int height)  {
  if (mouseX >= x && mouseX <= x+width && 
      mouseY >= y && mouseY <= y+height) {
    return true;
  } else {
    return false;
  }
}

boolean otisOver(int x, int y, int width, int height)  {
  if (mouseX >= x && mouseX <= x+width && 
      mouseY >= y && mouseY <= y+height) {
    return true;
  } else {
    return false;
  }
}

TfGuy44

Edit post. Select code. Press Ctrl + o.

GoToLoop

http://studio.ProcessingTogether.com/sp/pad/export/ro.9eDRvB4LRmLrr