let y = 0;

let button;

let backgroundIsMoving = false;

let screen =1;

let fade2 = 0;

let fade3 = 0;

​

​

function preload() {

  img = loadImage("assets/Artboard 1.png");

}

​

function setup() {

  createCanvas(650, 850);

  img.resize(0, 850);

}

​

function draw() {

  background(220);

  image(img, x, 0);

  fill(255);

  rect(width - 100, height - 50, 70, 30);

  print(x);

  changeBG();

  textAppear();

}

​

function mouseClicked() {

  if (

    mouseX > width - 100 &&

    mouseX < width - 30 &&

    mouseY > height - 50 &&

    mouseY < height - 20 &&

    backgroundIsMoving == false

  ) {

    backgroundIsMoving = true;

    print("true")

  }

}

​

function changeBG() {

  if (backgroundIsMoving == true) {

    x-=3

  }

  if (x<=-500 && screen==1) {

    backgroundIsMoving = false

    screen = 2;

  }

  if (x<=-1000 && screen==2) {

    backgroundIsMoving = false

    screen = 3;

  }

}

​

function textAppear() {

  if (backgroundIsMoving == false && screen == 2) {

     textSize(15);

    textAlign(CENTER);

    textLeading(25);

    fill(255, fade2)

  text('Our era  of  human  destruction  has  trained  our  eyes  only  on  the immediate \npromises  of  power  and  profits.  This  refusal  of  the  past, and  even  \nthe  present, will  condemn  us  to  continue  fouling  our  own nests.  \nHow  can  we  get  back  to  the  pasts  we  need  to  see  the  present more  clearly?  \nWe  call  this  return  to  multiple  pasts,  human  and  not human, “ghosts.” \nEvery landscape is haunted by past ways of life.', width/2, 160);

    fade2 += 10;

  } else if (backgroundIsMoving == false && screen == 3){

    fill(255, fade3)

      text('How much longer will we agree to step aside in silence \nas masters of the universe turn us into property, \nwrite our contracts, rape our bodies, sell our histories? \nHow much longer will you and I choose extinction?', width/2, 160);

    fade3 += 10;

  }

}