let s21, s22, s23, s31, s32, s33 , s41, s42, s43 ,s51 ,s52, s53;

let screen = 1;

​

let fs1, fs2, fs3;

let button1 = 1;

let button2 = 1;

​

function preload() {

  img1 = loadImage('homescreen.png');

  img2 = loadImage('Music.png');

  img3 = loadImage('kitchen.png');

  img4 = loadImage('arabic.png');

  img5 = loadImage('sci-fi.png');

​

  s21 = loadSound('Sounds/drum1.wav');

  s22 = loadSound('Sounds/drum2.wav');

  s23 = loadSound('Sounds/drum3.wav');

  s31 = loadSound('Sounds/kitchen1.wav');

  s32 = loadSound('Sounds/kitchen2.wav');

  s33= loadSound('Sounds/kitchen3.wav');

  s41= loadSound('Sounds/sharqy1.wav');

  s42 = loadSound('Sounds/sharqy2.WAV');

  s43 = loadSound('Sounds/sharqy3.wav'); 

  s51= loadSound('Sounds/scifi1.mp3');

  s52 = loadSound('Sounds/scifi2.mp3');

  s53 = loadSound('Sounds/scifi3.mp3'); 

}

​

function setup() {

  createCanvas(1440, 900);

}

​

function draw() {

  if (!serialActive) {

    background(255);

    fill(0);

    text("Please press up arrow to select Serial Port", 50, 50); //make sure connection is working

  } 

  else if(screen === 1){

    //display home screen

    image(img1,0, 0, width, height); 

  }

  else if(screen ===2){

          //display the 2nd screen

          image(img2,0, 0, width, height);

          //read data from force sensors. play the sounds 

          if(fs1 > 20){

            s21.play();

          }

          if(fs2 > 20){

            s22.play();

          }

          if(fs3 > 20){

            s23.play();

          }

  }else if(screen === 3){

          //display 3rd screen

          image(img3,0, 0, width, height);

    fill(0);

          //read data from force sensors. play the sounds 

          if(fs1 > 20){

            s31.play();

          }

          if(fs2 > 20){

            s32.play();

          }

          if(fs3 > 20){

            s33.play();

          }

    }else if(screen === 4){

          //display 4th screen

          image(img4,0, 0, width, height);

      fill(0);

          //read data from force sensors. play the sounds 

          if(fs1 > 20){

            s41.play();

          }

          if(fs2 > 20){

            s42.play();

          }

          if(fs3 > 20){

            s43.play();

          }

    }else if(screen === 5){

          //display 4th screen

          image(img5,0, 0, width, height);

          //read data from force sensors. play the sounds 

          if(fs1 > 20){

            s51.play();

          }

          if(fs2 > 20){

            s52.play();

          }

          if(fs3 > 20){

            s53.play();

          }

    }

​

​

  if(screen != 1 && button2 != 1){//if white button is pressed on other screens, go to homescreen

    screen = 1;

  }

}  

​

​

function keyPressed(){

  if (keyCode == UP_ARROW) {

    //start the serial connection!!

    setUpSerial();

  }

​

}

​

function readSerial(Data) {

​

  if(Data != null) {

    let fromArduino = split(trim(Data), ",");

    if (fromArduino.length == 5) {

      // store values here and use them in the main draw loop

      fs1 = int(fromArduino[0]); //Data from force sensor 1

      fs2 = int(fromArduino[1]); //Data from force sensor 2

      fs3 = int(fromArduino[2]);  //Data from force sensor 3

      button1 = int(fromArduino[3]); //Data from button 1, red button

      button2 = int(fromArduino[4]);//Data from button 2, white button

      if(button1 != 1){ //if the button red value is zero, then it is pressed so change screen

        screen++;

        if(screen>5){//if last screen is reached loop through

          screen = 2;

        }

      }

    }

  }

​

}

​

function toggleFullScreen() {

  let fs = fullscreen();

  fullscreen(!fs);

}

function mousePressed() {

  toggleFullScreen();

}

​