​

let currentpanel = 1;

​

function setup() {

  createCanvas(400, 400);

}

​

​

function mousePressed(){

    if (dist(mouseX, mouseY, 350, 350) <= 45){ //green button 

      currentpanel = currentpanel + 1

    } else if (dist(mouseX, mouseY, 50, 350) <= 45){ //red button

      currentpanel = currentpanel -1

    }

  //save("comic.png");

  }

​

​

function draw() {

  background(255);

​

  strokeWeight(6); // Black line

  line(0, 300, 400, 300);

​

  if (currentpanel == 1) {

    //Green Button

    textStyle(NORMAL);

    strokeWeight(0);

    fill("Green");

    circle(350, 350, 90);

    fill("Black");

    textAlign(CENTER,CENTER);

    textSize(26);

    text("NEXT", 350, 350);

    //Comic

    textSize(66);

    text("123456789",200,150);

  } else if (currentpanel == 2){

    //Green Button

    strokeWeight(0);

    fill("green");

    circle(350, 350, 90);

    //Red Button

    fill("red");

    circle(50,350,90);

    //Text

    fill("black");

    textAlign(CENTER,CENTER);

    textSize(26);

    text("NEXT", 350, 350);

    text("BACK",50,350);

    //Comic

    textSize(66);

    text("12345678",200,150);

  } else if (currentpanel == 3){

    //Green Button

    strokeWeight(0);

    fill("green");

    circle(350, 350, 90);

    //Red Button

    fill("red");

    circle(50,350,90);

    //Text

    fill("black");

    textAlign(CENTER,CENTER);

    textSize(26);

    text("NEXT", 350, 350);

    text("BACK",50,350);

    //Comic

    textSize(66);

    text("12345678",200,150);

    //Text Bubble

    triangle(330,125,250,100,275,80);

    ellipse(226,76,140,80);

    fill(255);

    textSize(16);

    text("Where did 9 go?",226,76);

  } else if (currentpanel == 4){

    //Green Button

    strokeWeight(0);

    fill("green");

    circle(350, 350, 90);

    //Red Button

    fill("red");

    circle(50,350,90);

    //Text

    textStyle(NORMAL);

    fill("black");

    textAlign(CENTER,CENTER);

    textSize(26);

    text("Home", 350, 350);

    text("BACK",50,350);

    //Comic

    textSize(316);

    textStyle(BOLD);

    text("7",200,150);

    fill(255);

    circle(170,57,30);

    circle(230,57,30);

    fill(0);

    circle(170,57,16);

    circle(230,57,16);

  } else{

    currentpanel = 1

  }

}

​