// 1 fail screen (try again)

// 1 success screen

var choice = 0; // 0 if nothing is chosen yet, 1 if Right button is clicked 2 if Left button is clicked

var state = 1; // 1 if alive, 0 if dead

var qnum = 1; // what question you're on

​

function setup() {

  createCanvas(500, 500);

  background(220);

}

​

function mousePressed() {

  // 0 if nothing is chosen or a random area is cliked, 1 if Right button is clicked 2 if Left button is clicked

  if(mouseY>=300&&mouseX >= 250) {

    choice = 1

  } else if(mouseY>=300&&mouseX <250) {

    choice = 2

  } else choice = 0;

}

​

function draw() {

  console.log(qnum);

    if(state == 1 && qnum == 1) {

      //ask q1 and two buttons 

      ///q1 prompt

      noStroke()

      fill('black'); 

      rect(0, 0, 500, 300);

      ///two buttons

      stroke('palegreen');         //border of button

      rect(0, 300, 250, 200);      

      rect(250, 300, 250, 200);

      rect(width/2-50,height/2-50,100,60);   //envelope

      fill('palegreen')

      triangle(width/2-50,height/2-50,width/2+50,height/2-50,width/2,230)

      textAlign(CENTER);            //text alignment

      fill('palegreen')            //color of text

      textFont('Courier New', 20);   //font

      text('Welcome to the initialisation',width/2,110);

      text('You are chosen to be a spy',width/2, 130);

      text('Do you accept?',width/2, 150);

      text ('I Accept', width/4*3, 400);

      text ('I Reject', width/4, 400);

      if (mouseX>250 && mouseY>300) {

        fill('yellow'); 

        text ('I Accept', width/4*3, 400);

      } else if (mouseX<250 && mouseY>300) {

        fill('yellow'); 

        text ('I Reject', width/4, 400);

      }

      ///the answer for q1 is Right(1). If choice is correct, send to next question; if choice is wrong, change state to dead

      if(choice == 1) {qnum++; choice = 0;} 

      else if(choice == 2){state = 0; choice = 0;}

    } 

    if(state == 1 && qnum == 2) {

      //ask q2 and two buttons 

      ///q2 prompt

      background(220);

      fill('green');

      rect(0, 0, 500, 300);

      ///two buttons

      fill(255);

      rect(0, 300, 250, 200);

      rect(250, 300, 250, 200);

      ///the answer for q2 is Right(1). If choice is correct, send to next question; if choice is wrong, change state to dead

      if(choice == 1) {qnum++; choice = 0;} 

      else if(choice == 2){state = 0; choice = 0;}

    }  

    if(state == 1 && qnum == 3) {

      //ask q3 and two buttons 

      ///q3 prompt

      background(220);

      fill('blue');

      rect(0, 0, 500, 300);

      ///two buttons

      fill(255);

      rect(0, 300, 250, 200);

      rect(250, 300, 250, 200);

      ///the answer for q3 is Right(1). If choice is correct, send to next question; if choice is wrong, change state to dead

      if(choice == 1) {qnum++; choice = 0;} 

      else if(choice == 2){state = 0; choice = 0;}

    }

    if(state == 1 && qnum == 4) {

      //ask q4 and two buttons 

      ///q4 prompt

      background(220);

      fill('purple');

      rect(0, 0, 500, 300);

      ///two buttons

      fill(255);

      rect(0, 300, 250, 200);

      rect(250, 300, 250, 200);

      ///the answer for q4 is Right(1). If choice is correct, send to next question; if choice is wrong, change state to dead

      if(choice == 1) {qnum++; choice = 0;} 

      else if(choice == 2){state = 0; choice = 0;}

    }

    // if all 4 questions are cleared, you pass 

    if(state == 1 && qnum > 4) {

      // success screen 

      background(220);

      fill(255);

      circle(mouseX, mouseY, 25);

    }

    // whenever you reach state == 0, you see a fail screen

    if(state == 0) {

      // fail screen 

      background(220);

      line(200, 100, 300, 200); 

      line(200, 200, 300, 100);

      //draw restart button

      rect(0, 300, 500, 200);

      //if restart button is pressed (choice > 0), we start again (state = 1) & qnum = 1

      if(choice > 0) {state = 1; choice=0; qnum = 1;}

    }

}