let catImg1 = [];

let catImg2 = [];

let catImg3 = [];

let catImg4 = [];

let catImg5 = [];

let catImg6 = [];

​

let catTxt1 = [

  "the sun rose from the ocean; my feelings became calmer",

  "as the sun declined towards the horizon,\nthe wind died away into a gentle breeze",

  "the evening was warm and serene,\nand we prolonged our walk farther than usual",

  "the sun became warmer, the nights clear and balmy",

  "the sun sank lower in the heavens",

  "when I awoke I found that the sun \nhad already mounted considerably",

];

​

let catTxt2 = [

  "the wind was high, and the waves continually threatened the safety of my little skiff",

  "the winds whispered in soothing accents",

  "the wind gave you an idea of what the \nwaterspout must be on the great ocean",

  "I looked at the heavens, which were covered by clouds that flew before the wind, only to be replaced by others"

];

​

let catTxt3 = [

  "rain poured from the dark sky, and added to the melancholy impression I received from the objects around me",

  "the wind was unfavourable, and the rain fell in torrents",

  "the rain still continued, and the scene was enveloped in an impenetrable darkness",

  "a heavy storm of rain descended",

];

​

let catTxt4 = [

  "our situation was somewhat dangerous, especially as we were compassed round by a very thick fog",

  "vast mists were rising from the rivers which ran through it",

];

​

let catTxt5 = [

  "the cold stars shone in mockery, \nand the bare trees waved their branches above me",

  "the snow vanished, and I beheld \nthe bare trees and the black earth",

  "a great fall of snow had taken place the night before, and the fields were one uniform white; the appearance was disconsolate"

];

​

let catTxt6 = [

  "the thunder burst with a terrific crash over my head",

  "thunder was heard at a distance as the island split",

  "thunder burst at once with frightful loudness \nfrom various quarters of the heavens",

  "I remained while the storm lasted, watching its progress with curiosity and delight",

  "I hear the rumbling thunder of the falling avalanche ",

  "the wind, which had fallen in the south, now rose with great violence in the west"

];

let currentImage;

let currentText;

​

let sequence = [1, 2, 3, 4, 5, 6, 5, 4, 3, 2, 1]; // temperature change - sequence can be modified

let counter = 0;

let forwards = true;

​

function preload() {

  //below this line we are pushing images for category 1

  catImg1.push(loadImage("1_a.jpg"), loadImage("1_b.jpg"));

  //below this line we are pushing images for category 2

  catImg2.push(loadImage("2_a.jpg"), loadImage("2_b.jpg"));

  //below this line we are pushing images for category 3

  catImg3.push(loadImage("3_a.jpg"), loadImage("3_b.jpg"));

  //below this line we are pushing images for category 4

  catImg4.push(loadImage("4_a.jpg"), loadImage("4_b.jpg"));

  //below this line we are pushing images for category 5

  catImg5.push(loadImage("5_a.jpg"), loadImage("5_b.jpg"));

  //below this line we are pushing images for category 6

  catImg6.push(loadImage("6_a.jpg"), loadImage("6_b.jpg"));

}

​

function setup() {

  createCanvas(windowWidth, windowWidth / (16 / 9));

}

​

function draw() {

  if (frameCount % 400 == 0) {

    //change duration by changing the percentage value. Higher value = slower speed

    if (forwards == true && counter == sequence.length) {

      forwards = false;

    } else if (forwards == false && counter == 0) {

      forwards = true;

    }

    if (forwards == true) {

      counter = counter + 1;

    } else {

      counter = counter - 1;

    }

​

    if (sequence[counter] == 1) {

      currentImage = random(catImg1);

      currentText = random(catTxt1);

    } else if (sequence[counter] == 2) {

      currentImage = random(catImg2);

      currentText = random(catTxt2);

    } else if (sequence[counter] == 3) {

      currentImage = random(catImg3);

      currentText = random(catTxt3);

    } else if (sequence[counter] == 4) {

      currentImage = random(catImg4);

      currentText = random(catTxt4);

    } else if (sequence[counter] == 5) {

      currentImage = random(catImg5);

      currentText = random(catTxt5);

    } else if (sequence[counter] == 6) {

      currentImage = random(catImg6);

      currentText = random(catTxt6);

    }

  }

  if (currentImage) {

    background(currentImage, 40); //to remove the fade change 20 to 255

    fill(0,0,0,255) //to remove the fade change 20 to 255

    textAlign(CENTER);

    textSize(width / 80);

    fill(255, 255, 0);

    stroke(0);

    textStyle(ITALIC);

    strokeWeight(4);

    text(currentText, 0, height / 1.1, width - width / 50); //change height of text by changing height / x

  }

}

​