Final Project

/*Name:Camellia(Siyun) Wang; 
Section: C; 
Email Address: siyunw@andrew.cmu.edu;
Assignment-14;*/

//start page
var page = "start";

//scene1
var meadows = [];
var cows1 = [];
var cows1n = [];
var cows2 = [];
var cows2b = [];
var groups = [];
var horses = [];
var horses2 = [];
var cows3 = [];
var birds = [];
var mountains = [];

//scene2
var meadows2 = [];
var cows12 = [];
var cows1n2 = [];
var cows22 = [];
var cows2b2 = [];
var groups2 = [];
var houses = [];
var houses2 = [];
var birds2 = [];
var mountains2 = [];
var factorys = [];
var skys = [];
var towns = [];

//scene3
var angle = 0;
var ices1 = [];
var ices1n = [];
var ices2 = [];
var ices2b = [];
var ices2c = [];
var ices3 = [];
var bears = [];
var penguins = [];
var factorys2 = [];
var seas = [];
var droughts = [];

function preload(){
    //startpage
    sun = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/sun.png");
    pre = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/pre-pic.png");
    indus = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/industrial-pic.png");
    post = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/post-pic.png");

    //scene1
    backgroundImage = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/back.jpeg");
    mountain = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/mountains.png")
    cow1 = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/cow1.png");
    cow2 = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/cow2.png");
    sheeps = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/sheeps.png");
    horse = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/horse.png");
    meadow = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/background.png");
    cow3 = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/cow3.png");
    bird = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/birds.png");

    //scene2
    sky = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/sky.png");
    mountain2 = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/mountain.png");
    meadow2 = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/meadow.png");
    house = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/house.png");
    house2 = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/house2.png");
    factory = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/factory-1.png");
    town = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/town.png");

    //scene3
    sea = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/sea.png");
    bear = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/polar-bear.png");
    penguin = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/penguin.png");
    ice1 = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/iceburg2.png");
    ice2 = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/iceburg3.png");
    ice3 = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/iceburg1.png");
    factory2 = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/factory.png");
    drought = loadImage("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/12/deforestation.png");
}

function setup() {
    createCanvas(480, 400); 

    //scene1
    //the meadow
    var mea = makeMeadow(1,400);
    meadows.push(mea);
    //the mountain
    var mon = makeMountain(120,50);
    mountains.push(mon);
    //cow1
    var cow1 = makeCow1(150,250);
    cows1.push(cow1);
    //cow1n
    var cow1n = makeCow1n(1100,270);
    cows1n.push(cow1n);
    //cow2
    var cow2 = makeCow2(610,240);
    cows2.push(cow2);
    //group
    var gro = makeGroup(650,280);
    groups.push(gro);
    //horse
    var hor = makeHorse(300,190);
    horses.push(hor);
    //horse2
    var hor2 = makeHorse2(900,150);
    horses2.push(hor2);
    //cow3
    var cow3 = makeCow3(1200,325);
    cows3.push(cow3);
    //bird
    var bird = makeBird(1220,25);
    birds.push(bird);


    //scene2
    //the town
    var town = makeTown(810,-20);
    towns.push(town);
    // the sky
    var sky = makeSky(0,100);
    skys.push(sky);
    //the meadow
    var mea2 = makeMeadow2(1,400);
    meadows2.push(mea2);
    //the mountain
    var mon2 = makeMountain2(1,50);
    mountains2.push(mon2);
    //cow12
    var cow12 = makeCow12(50,220);
    cows12.push(cow12);
    //cow1n2
    var cow1n2 = makeCow1n2(150,200);
    cows1n2.push(cow1n2);
    //cow2
    var cow22 = makeCow22(240,220);
    cows22.push(cow22);
    //group
    var gro2 = makeGroup2(600,260);
    groups2.push(gro2);
    //house
    var hou = makeHouse(550,-20);
    houses.push(hou);
    //house2
    var hou2 = makeHouse2(450,50);
    houses2.push(hou2);
    //factory
    var fac = makeFactory(1050,40);
    factorys.push(fac);
    //bird
    var bird2 = makeBird2(1220,25);
    birds2.push(bird2);


    //scene3
    // the sea
    var se = makeSea(1,1);
    seas.push(se);
    //the bear
    var bea = makeBear(600,150);
    bears.push(bea);
    //the penguin
    var pen = makePenguin(50,200);
    penguins.push(pen);
    //ice1
    var ic1 = makeIce1(1,5);
    ices1.push(ic1);
    //ice1n
    var ic1n = makeIce1n(500,120);
    ices1n.push(ic1n);
    //ice2
    var ic2 = makeIce2(250,200);
    ices2.push(ic2);
    //ice2b
    var ic2b = makeIce2b(890,240);
    ices2b.push(ic2b);
    //ice2c
    var ic2c = makeIce2c(830,220);
    ices2c.push(ic2c);
    //ice3
    var ic3 = makeIce3(550,140);
    ices3.push(ic3);
    //factory
    var fac2 = makeFactory2(1000,0);
    factorys2.push(fac2);
    //the drought
    var dro = makeDrought(2000,0);
    droughts.push(dro);

    frameRate(50);
}

function keyPressed(){
    if(key == "0"){
        page = "start";
    }
    else if(key == "a"){
        page = "scene1";
    }
    else if(key == "b"){
        page = "scene2"
    }
    else if(key == "c"){
        page = "scene3"
    }
}


function draw() {
    //startpage:
    if(page == "start"){
        background(143,188,143);
        var i = 0;
        while(i <= width){
            push();
            translate(90+i,310);
            rotate(radians(angle));
            imageMode(CENTER);
            image(sun, 0, 0, 100,100);
            pop();
            angle += 1;
            i = i+150;
        }
        textSize(25);
        text('How Industrialization Changed Our Life',25,70);
        image(pre,30,125,120,150);
        image(indus,180,125,120,150);
        image(post,330,125,120,150);
        textSize(15);
        text('Pre-Industrial',45,120);
        text('Industrial',210,120);
        text('Post-Industrial',345,120);
         //message at bottom
        fill(0);
        textSize(15);
        text("Please type a to see Pre-Industrial, b to see Industrial,",30, height - 35);
        text("and c to see Post-Industrial. Press 0 to reset", 30, height - 15);
    }

    //scene1
    if(page == "scene1"){
         background(backgroundImage);

        updateAndDisplayMountain();
        removeMountainThatHaveSlippedOutOfView();

        updateAndDisplayHorse2();
        removeHorse2ThatHaveSlippedOutOfView();

        updateAndDisplayMeadow();
        removeMeadowThatHaveSlippedOutOfView();

        updateAndDisplayHorse();
        removeHorseThatHaveSlippedOutOfView();

        updateAndDisplayCow2();
        removeCow2ThatHaveSlippedOutOfView();

        updateAndDisplayBird();
        removeBirdThatHaveSlippedOutOfView();

        updateAndDisplayGroup();
        removeGroupThatHaveSlippedOutOfView();

        updateAndDisplayCow1();
        removeCow1ThatHaveSlippedOutOfView();
        updateAndDisplayCow1n();
        removeCow1nThatHaveSlippedOutOfView();

        updateAndDisplayCow3();
        removeCow3ThatHaveSlippedOutOfView();
    }

    else if(page == "scene2"){
        background(255);
        updateAndDisplaySky();
        removeSkyThatHaveSlippedOutOfView();

        updateAndDisplayHouse2();
        removeHouse2ThatHaveSlippedOutOfView();

        updateAndDisplayMountain2();
        removeMountain2ThatHaveSlippedOutOfView();

        updateAndDisplayFactory();
        removeFactoryThatHaveSlippedOutOfView();

        updateAndDisplayTown();
        removeTownThatHaveSlippedOutOfView();

        updateAndDisplayMeadow2();
        removeMeadow2ThatHaveSlippedOutOfView();


        updateAndDisplayHouse();
        removeHouseThatHaveSlippedOutOfView();

        updateAndDisplayCow22();
        removeCow22ThatHaveSlippedOutOfView();

        updateAndDisplayBird2();
        removeBird2ThatHaveSlippedOutOfView();

        updateAndDisplayGroup2();
        removeGroup2ThatHaveSlippedOutOfView();

        updateAndDisplayCow12();
        removeCow12ThatHaveSlippedOutOfView();
        updateAndDisplayCow1n2();
        removeCow1n2ThatHaveSlippedOutOfView();
    }

    else if(page == "scene3"){
        background(255);

        updateAndDisplaySea();
        removeSeaThatHaveSlippedOutOfView();

        updateAndDisplayFactory2();
        removeFactory2ThatHaveSlippedOutOfView();

        updateAndDisplayDrought();
        removeDroughtThatHaveSlippedOutOfView();

        updateAndDisplayIce1();
        removeIce1ThatHaveSlippedOutOfView();

        updateAndDisplayIce1n();
        removeIce1nThatHaveSlippedOutOfView();

        updateAndDisplayIce2();
        removeIce2ThatHaveSlippedOutOfView();

        updateAndDisplayIce2c();
        removeIce2cThatHaveSlippedOutOfView();

        updateAndDisplayIce2b();
        removeIce2bThatHaveSlippedOutOfView();

        updateAndDisplayIce3();
        removeIce3ThatHaveSlippedOutOfView();

        updateAndDisplayBear();
        removeBearThatHaveSlippedOutOfView();

        updateAndDisplayPenguin();
        removePenguinThatHaveSlippedOutOfView();
    }

    
}



//scene 1: Pre-industrial


//the meadow
function makeMeadow(xm,ym) {
    var M = {
        x: xm, 
        y: ym,
        move: meadowMove,
        speed: -1,
        display: meadowDisplay};
    return M;
}

function meadowMove() {
    this.x += this.speed;
}

function meadowDisplay(xm) {
   image(meadow, this.x, 0,1400,400);
}

function updateAndDisplayMeadow(){
    for(var i = 0; i < meadows.length; i++){
        meadows[i].move();
        meadows[i].display();
    }
}

function removeMeadowThatHaveSlippedOutOfView(){
    for (var i = 0; i < meadows.length; i++){
        if (meadows[i].x == -900) {
            page = "start";
        }
    }
}

//the mountain
function makeMountain(xmo,ymo) {
    var Mo = {
        x: xmo, 
        y: ymo,
        move: mountainMove,
        speed: -1,
        display: mountainDisplay};
    return Mo;
}

function mountainMove() {
    this.x += this.speed;
}

function mountainDisplay(xmo) {
   image(mountain, this.x, 0,1200,430);
}

function updateAndDisplayMountain(){
    for(var i = 0; i < mountains.length; i++){
        mountains[i].move();
        mountains[i].display();
    }
}

function removeMountainThatHaveSlippedOutOfView(){
    for (var i = 0; i < mountains.length; i++){
        if (mountains[i].x < -1440) {
            mountains.shift(mountains[i]);
        }
    }
}

//cow1
function makeCow1(xc1,yc1){
    var C1 = {
        x: xc1, 
        y: yc1,
        move: cow1Move,
        speed: -1,
        display: cow1Display};
    return C1;
}

function cow1Move(){
    this.x +=this.speed;
}

function cow1Display(xc1,yc1){
    image(cow1, this.x, this.y,100,80);
}

function updateAndDisplayCow1(){
    for(var i = 0; i < cows1.length; i++){
        cows1[i].move();
        cows1[i].display();
    }
}

function removeCow1ThatHaveSlippedOutOfView(){
    for (var i = 0; i < cows1.length; i++){
        if (cows1[i].x < -1440) {
            cows1.shift(cows1[i]);
        }
    }
}

//cow1n
function makeCow1n(xc1n,yc1n){
    var C1n = {
        x: xc1n, 
        y: yc1n,
        move: cow1nMove,
        speed: -1,
        display: cow1nDisplay};
    return C1n;
}

function cow1nMove(){
    this.x +=this.speed;
}

function cow1nDisplay(xc1,yc1){
    image(cow1, this.x, this.y,100,80);
}

function updateAndDisplayCow1n(){
    for(var i = 0; i < cows1n.length; i++){
        cows1n[i].move();
        cows1n[i].display();
    }
}

function removeCow1nThatHaveSlippedOutOfView(){
    for (var i = 0; i < cows1n.length; i++){
        if (cows1n[i].x < -1440) {
            cows1n.shift(cows1n[i]);
        }
    }
}



//cow2
function makeCow2(xc2,yc2){
    var C2 = {
        x: xc2, 
        y: yc2,
        move: cow2Move,
        speed: -1,
        display: cow2Display};
    return C2;
}

function cow2Move(){
    this.x +=this.speed;
}

function cow2Display(xc2,yc2){
    image(cow2, this.x, this.y,150,150);
}

function updateAndDisplayCow2(){
    for(var i = 0; i < cows2.length; i++){
        cows2[i].move();
        cows2[i].display();
    }
}

function removeCow2ThatHaveSlippedOutOfView(){
    for (var i = 0; i < cows2.length; i++){
        if (cows2[i].x < -1440) {
            cows2.shift(cows2[i]);
        }
    }
}


//group
function makeGroup(xg,yg){
    var G = {
        x: xg, 
        y: yg,
        move: groupMove,
        speed: -1,
        display: groupDisplay};
    return G;
}

function groupMove(){
    this.x +=this.speed;
}

function groupDisplay(xg,yg){
    image(sheeps, this.x, this.y,150,150);
}

function updateAndDisplayGroup(){
    for(var i = 0; i < groups.length; i++){
        groups[i].move();
        groups[i].display();
    }
}

function removeGroupThatHaveSlippedOutOfView(){
    for (var i = 0; i < groups.length; i++){
        if (groups[i].x < -1440) {
            groups.shift(groups[i]);
        }
    }
}


//horse
function makeHorse(xw,yw){
    var W = {
        x: xw, 
        y: yw,
        move: horseMove,
        speed: -1,
        display: horseDisplay};
    return W;
}

function horseMove(){
    this.x +=this.speed;
}

function horseDisplay(xw,yw){
    image(horse, this.x, this.y,200,200);
}

function updateAndDisplayHorse(){
    for(var i = 0; i < horses.length; i++){
        horses[i].move();
        horses[i].display();
    }
}

function removeHorseThatHaveSlippedOutOfView(){
    for (var i = 0; i < horses.length; i++){
        if (horses[i].x < -1440) {
            horses.shift(horses[i]);
        }
    }
}

//horse2
function makeHorse2(xw2,yw2){
    var W2= {
        x: xw2, 
        y: yw2,
        move: horse2Move,
        speed: -1,
        display: horse2Display};
    return W2;
}

function horse2Move(){
    this.x +=this.speed;
}

function horse2Display(xw2,yw2){
    image(horse, this.x, this.y,200,200);
}

function updateAndDisplayHorse2(){
    for(var i = 0; i < horses2.length; i++){
        horses2[i].move();
        horses2[i].display();
    }
}

function removeHorse2ThatHaveSlippedOutOfView(){
    for (var i = 0; i < horses2.length; i++){
        if (horses2[i].x < -1440) {
            horses2.shift(horses2[i]);
        }
    }
}

//cows3
function makeCow3(xs,ys){
    var S = {
        x: xs, 
        y: ys,
        move: cow3Move,
        speed: -1,
        display: cow3Display};
    return S;
}

function cow3Move(){
    this.x +=this.speed;
}

function cow3Display(xs,ys){
    image(cow3, this.x, this.y,75,75);
}

function updateAndDisplayCow3(){
    for(var i = 0; i < cows3.length; i++){
        cows3[i].move();
        cows3[i].display();
    }
}

function removeCow3ThatHaveSlippedOutOfView(){
    for (var i = 0; i < cows3.length; i++){
        if (cows3[i].x < -1440) {
            cows3.shift(cows3[i]);
        }
    }
}


//birds
function makeBird(xf,yf){
    var F = {
        x: xf, 
        y: yf,
        move: birdMove,
        speed: -2.0,
        display: birdDisplay};
    return F;
}

function birdMove(){
    this.x +=this.speed;
}

function birdDisplay(xf,yf){
    image(bird, this.x, this.y,200,200);
}

function updateAndDisplayBird(){
    for(var i = 0; i < birds.length; i++){
        birds[i].move();
        birds[i].display();
    }
}

function removeBirdThatHaveSlippedOutOfView(){
    for (var i = 0; i < birds.length; i++){
        if (birds[i].x < -1440) {
            birds.shift(birds[i]);
        }
    }
}

//scene 2: Industrial


//the town
function makeTown(xt,yt) {
    var T = {
        x: xt, 
        y: yt,
        move: townMove,
        speed: -1,
        display: townDisplay};
    return T;
}

function townMove() {
    this.x += this.speed;
}

function townDisplay(xt,yt) {
   image(town, this.x,this.y ,700,700);
}

function updateAndDisplayTown(){
    for(var i = 0; i < towns.length; i++){
        towns[i].move();
        towns[i].display();
    }
}

function removeTownThatHaveSlippedOutOfView(){
    for (var i = 0; i < towns.length; i++){
        if (towns[i].x < -1440) {
            towns.shift(towns[i]);
        }
    }
}

//the factory
function makeFactory(xf,yf) {
    var F = {
        x: xf, 
        y: yf,
        move: factoryMove,
        speed: -1,
        display: factoryDisplay};
    return F;
}

function factoryMove() {
    this.x += this.speed;
}

function factoryDisplay(xf,yf) {
   image(factory, this.x, this.y,350,350);
}

function updateAndDisplayFactory(){
    for(var i = 0; i < factorys.length; i++){
        factorys[i].move();
        factorys[i].display();
    }
}

function removeFactoryThatHaveSlippedOutOfView(){
    for (var i = 0; i < factorys.length; i++){
        if (factorys[i].x < -1440) {
            factorys.shift(factorys[i]);
        }
    }
}

// the sky
function makeSky(xs,ys) {
    var S = {
        x: xs, 
        y: ys,
        move: skyMove,
        speed: -1,
        display: skyDisplay};
    return S;
}

function skyMove() {
    this.x += this.speed;
}

function skyDisplay(xb) {
   image(sky, this.x, 0,1800,400);
}

function updateAndDisplaySky(){
    for(var i = 0; i < skys.length; i++){
        skys[i].move();
        skys[i].display();
    }
}

function removeSkyThatHaveSlippedOutOfView(){
    for (var i = 0; i < skys.length; i++){
        if (skys[i].x < -1440) {
            skys.shift(skys[i]);
        }
    }
}

//the meadow2
function makeMeadow2(xm2,ym2) {
    var M2 = {
        x: xm2, 
        y: ym2,
        move: meadow2Move,
        speed: -1,
        display: meadow2Display};
    return M2;
}

function meadow2Move() {
    this.x += this.speed;
}

function meadow2Display(xm2) {
   image(meadow2, this.x, 0,1400,400);
}

function updateAndDisplayMeadow2(){
    for(var i = 0; i < meadows2.length; i++){
        meadows2[i].move();
        meadows2[i].display();
    }
}

function removeMeadow2ThatHaveSlippedOutOfView(){
    for (var i = 0; i < meadows2.length; i++){
        if (meadows2[i].x == -920) {
            page = "start";
        }
    }
}

//the mountain2
function makeMountain2(xmo2,ymo2) {
    var Mo2 = {
        x: xmo2, 
        y: ymo2,
        move: mountain2Move,
        speed: -1,
        display: mountain2Display};
    return Mo2;
}

function mountain2Move() {
    this.x += this.speed;
}

function mountain2Display(xmo2) {
   image(mountain2, this.x, 0,1400,400);
}

function updateAndDisplayMountain2(){
    for(var i = 0; i < mountains2.length; i++){
        mountains2[i].move();
        mountains2[i].display();
    }
}

function removeMountain2ThatHaveSlippedOutOfView(){
    for (var i = 0; i < mountains2.length; i++){
        if (mountains2[i].x < -1440) {
            mountains2.shift(mountains2[i]);
        }
    }
}

//cow12
function makeCow12(xc12,yc12){
    var C12 = {
        x: xc12, 
        y: yc12,
        move: cow12Move,
        speed: -1,
        display: cow12Display};
    return C12;
}

function cow12Move(){
    this.x +=this.speed;
}

function cow12Display(xc12,yc12){
    image(cow1, this.x, this.y,100,80);
}

function updateAndDisplayCow12(){
    for(var i = 0; i < cows12.length; i++){
        cows12[i].move();
        cows12[i].display();
    }
}

function removeCow12ThatHaveSlippedOutOfView(){
    for (var i = 0; i < cows12.length; i++){
        if (cows12[i].x < -1440) {
            cows12.shift(cows12[i]);
        }
    }
}

//cow1n2
function makeCow1n2(xc1n2,yc1n2){
    var C1n2 = {
        x: xc1n2, 
        y: yc1n2,
        move: cow1n2Move,
        speed: -1,
        display: cow1n2Display};
    return C1n2;
}

function cow1n2Move(){
    this.x +=this.speed;
}

function cow1n2Display(xc12,yc12){
    image(cow1, this.x, this.y,100,80);
}

function updateAndDisplayCow1n2(){
    for(var i = 0; i < cows1n2.length; i++){
        cows1n2[i].move();
        cows1n2[i].display();
    }
}

function removeCow1n2ThatHaveSlippedOutOfView(){
    for (var i = 0; i < cows1n2.length; i++){
        if (cows1n2[i].x < -1440) {
            cows1n2.shift(cows1n2[i]);
        }
    }
}



//cow22
function makeCow22(xc22,yc22){
    var C22 = {
        x: xc22, 
        y: yc22,
        move: cow2Move,
        speed: -1,
        display: cow22Display};
    return C22;
}

function cow22Move(){
    this.x +=this.speed;
}

function cow22Display(xc22,yc22){
    image(cow2, this.x, this.y,150,150);
}

function updateAndDisplayCow22(){
    for(var i = 0; i < cows22.length; i++){
        cows22[i].move();
        cows22[i].display();
    }
}

function removeCow22ThatHaveSlippedOutOfView(){
    for (var i = 0; i < cows22.length; i++){
        if (cows22[i].x < -1440) {
            cows22.shift(cows22[i]);
        }
    }
}


//group2
function makeGroup2(xg2,yg2){
    var G2 = {
        x: xg2, 
        y: yg2,
        move: group2Move,
        speed: -1,
        display: group2Display};
    return G2;
}

function group2Move(){
    this.x +=this.speed;
}

function group2Display(xg2,yg2){
    image(sheeps, this.x, this.y,150,150);
}

function updateAndDisplayGroup2(){
    for(var i = 0; i < groups2.length; i++){
        groups2[i].move();
        groups2[i].display();
    }
}

function removeGroup2ThatHaveSlippedOutOfView(){
    for (var i = 0; i < groups2.length; i++){
        if (groups2[i].x < -1440) {
            groups2.shift(groups2[i]);
        }
    }
}


//house
function makeHouse(xh,yh){
    var H = {
        x: xh, 
        y: yh,
        move: houseMove,
        speed: -1,
        display: houseDisplay};
    return H;
}

function houseMove(){
    this.x +=this.speed;
}

function houseDisplay(xh,yh){
    image(house, this.x, this.y,500,500);
}

function updateAndDisplayHouse(){
    for(var i = 0; i < houses.length; i++){
        houses[i].move();
        houses[i].display();
    }
}

function removeHouseThatHaveSlippedOutOfView(){
    for (var i = 0; i < houses.length; i++){
        if (houses[i].x < -1440) {
            houses.shift(houses[i]);
        }
    }
}

//house2
function makeHouse2(xh2,yh2){
    var H2= {
        x: xh2, 
        y: yh2,
        move: house2Move,
        speed: -1,
        display: house2Display};
    return H2;
}

function house2Move(){
    this.x +=this.speed;
}

function house2Display(xh2,yh2){
    image(house2, this.x, this.y,500,500);
}

function updateAndDisplayHouse2(){
    for(var i = 0; i < houses2.length; i++){
        houses2[i].move();
        houses2[i].display();
    }
}

function removeHouse2ThatHaveSlippedOutOfView(){
    for (var i = 0; i < houses2.length; i++){
        if (houses2[i].x < -1440) {
            houses2.shift(houses2[i]);
        }
    }
}


//birds2
function makeBird2(xb,yb){
    var B = {
        x: xb, 
        y: yb,
        move: bird2Move,
        speed: -2.0,
        display: bird2Display};
    return B;
}

function bird2Move(){
    this.x +=this.speed;
}

function bird2Display(xb,yb){
    image(bird, this.x, this.y,200,200);
}

function updateAndDisplayBird2(){
    for(var i = 0; i < birds2.length; i++){
        birds2[i].move();
        birds2[i].display();
    }
}

function removeBird2ThatHaveSlippedOutOfView(){
    for (var i = 0; i < birds2.length; i++){
        if (birds2[i].x < -1440) {
            birds2.shift(birds2[i]);
        }
    }
}


//scene 3: Post-industrial

//the drought
function makeDrought(xd,yd) {
    var D = {
        x: xd, 
        y: yd,
        move: droughtMove,
        speed: -1,
        display: droughtDisplay};
    return D;
}

function droughtMove() {
    this.x += this.speed;
}

function droughtDisplay(xd,yd) {
   image(drought, this.x,this.y ,1000,400);
}

function updateAndDisplayDrought(){
    for(var i = 0; i < droughts.length; i++){
        droughts[i].move();
        droughts[i].display();
    }
}

function removeDroughtThatHaveSlippedOutOfView(){
    for (var i = 0; i < droughts.length; i++){
        if (droughts[i].x == -450) {
            page = "start";
        }
    }
}

//the factory
function makeFactory2(xf2,yf2) {
    var F2 = {
        x: xf2, 
        y: yf2,
        move: factory2Move,
        speed: -1,
        display: factory2Display};
    return F2;
}

function factory2Move() {
    this.x += this.speed;
}

function factory2Display(xf2,yf2) {
   image(factory2, this.x, this.y,1000,400);
}

function updateAndDisplayFactory2(){
    for(var i = 0; i < factorys2.length; i++){
        factorys2[i].move();
        factorys2[i].display();
    }
}

function removeFactory2ThatHaveSlippedOutOfView(){
    for (var i = 0; i < factorys2.length; i++){
        if (factorys2[i].x < -1440) {
            factorys2.shift(factorys2[i]);
        }
    }
}

// the sea
function makeSea(xs,ys) {
    var S = {
        x: xs, 
        y: ys,
        move: seaMove,
        speed: -1,
        display: seaDisplay};
    return S;
}

function seaMove() {
    this.x += this.speed;
}

function seaDisplay(xb) {
   image(sea, this.x, 0,1400,400);
}

function updateAndDisplaySea(){
    for(var i = 0; i < seas.length; i++){
        seas[i].move();
        seas[i].display();
    }
}

function removeSeaThatHaveSlippedOutOfView(){
    for (var i = 0; i < seas.length; i++){
        if (seas[i].x < -1440) {
            seas.shift(seas[i]);
        }
    }
}

//the bear
function makeBear(xb,yb) {
    var B = {
        x: xb, 
        y: yb,
        move: bearMove,
        speed: -1,
        display: bearDisplay};
    return B;
}

function bearMove() {
    this.x += this.speed;
}

function bearDisplay(xb,yb) {
   image(bear, this.x, this.y,200,200);
}

function updateAndDisplayBear(){
    for(var i = 0; i < bears.length; i++){
        bears[i].move();
        bears[i].display();
    }
}

function removeBearThatHaveSlippedOutOfView(){
    for (var i = 0; i < bears.length; i++){
        if (bears[i].x < -1440) {
            bears.shift(bears[i]);
        }
    }
}

//the penguin
function makePenguin(xp,yp) {
    var P = {
        x: xp, 
        y: yp,
        move: penguinMove,
        speed: -1,
        display: penguinDisplay};
    return P;
}

function penguinMove() {
    this.x += this.speed;
}

function penguinDisplay(xp,yp) {
   image(penguin, this.x, this.y,400,400);
}

function updateAndDisplayPenguin(){
    for(var i = 0; i < penguins.length; i++){
        penguins[i].move();
        penguins[i].display();
    }
}

function removePenguinThatHaveSlippedOutOfView(){
    for (var i = 0; i < penguins.length; i++){
        if (penguins[i].x < -1440) {
            penguins.shift(penguins[i]);
        }
    }
}

//ice1
function makeIce1(xc1,yc1){
    var C1 = {
        x: xc1, 
        y: yc1,
        move: ice1Move,
        speed: -1,
        display: ice1Display};
    return C1;
}

function ice1Move(){
    this.x +=this.speed;
}

function ice1Display(xc1,yc1){
    image(ice1, this.x, this.y,400,400);
}

function updateAndDisplayIce1(){
    for(var i = 0; i < ices1.length; i++){
        ices1[i].move();
        ices1[i].display();
    }
}

function removeIce1ThatHaveSlippedOutOfView(){
    for (var i = 0; i < ices1.length; i++){
        if (ices1[i].x < -1440) {
            ices1.shift(ices1[i]);
        }
    }
}

//ice1n
function makeIce1n(xc1n,yc1n){
    var C1n = {
        x: xc1n, 
        y: yc1n,
        move: ice1nMove,
        speed: -1,
        display: ice1nDisplay};
    return C1n;
}

function ice1nMove(){
    this.x +=this.speed;
}

function ice1nDisplay(xc1,yc1){
    image(ice1, this.x, this.y,200,200);
}

function updateAndDisplayIce1n(){
    for(var i = 0; i < ices1n.length; i++){
        ices1n[i].move();
        ices1n[i].display();
    }
}

function removeIce1nThatHaveSlippedOutOfView(){
    for (var i = 0; i < ices1n.length; i++){
        if (ices1n[i].x < -1440) {
            ices1n.shift(ices1n[i]);
        }
    }
}



//ice2
function makeIce2(xc2,yc2){
    var C2 = {
        x: xc2, 
        y: yc2,
        move: ice2Move,
        speed: -1,
        display: ice2Display};
    return C2;
}

function ice2Move(){
    this.x +=this.speed;
}

function ice2Display(xc2,yc2){
    image(ice2, this.x, this.y,200,200);
}

function updateAndDisplayIce2(){
    for(var i = 0; i < ices2.length; i++){
        ices2[i].move();
        ices2[i].display();
    }
}

function removeIce2ThatHaveSlippedOutOfView(){
    for (var i = 0; i < ices2.length; i++){
        if (ices2[i].x < -1440) {
            ices2.shift(ices2[i]);
        }
    }
}


//ice2b
function makeIce2b(xw,yw){
    var W = {
        x: xw, 
        y: yw,
        move: ice2bMove,
        speed: -1,
        display: ice2bDisplay};
    return W;
}

function ice2bMove(){
    this.x +=this.speed;
}

function ice2bDisplay(xw,yw){
    image(ice2, this.x, this.y,200,200);
}

function updateAndDisplayIce2b(){
    for(var i = 0; i < ices2b.length; i++){
        ices2b[i].move();
        ices2b[i].display();
    }
}

function removeIce2bThatHaveSlippedOutOfView(){
    for (var i = 0; i < ices2b.length; i++){
        if (ices2b[i].x < -1440) {
            ices2b.shift(ices2b[i]);
        }
    }
}

//ice2c
function makeIce2c(xw2,yw2){
    var W2= {
        x: xw2, 
        y: yw2,
        move: ice2cMove,
        speed: -1,
        display: ice2cDisplay};
    return W2;
}

function ice2cMove(){
    this.x +=this.speed;
}

function ice2cDisplay(xw2,yw2){
    image(ice2, this.x, this.y,200,200);
}

function updateAndDisplayIce2c(){
    for(var i = 0; i < ices2c.length; i++){
        ices2c[i].move();
        ices2c[i].display();
    }
}

function removeIce2cThatHaveSlippedOutOfView(){
    for (var i = 0; i < ices2c.length; i++){
        if (ices2c[i].x < -1440) {
            ices2c.shift(ices2c[i]);
        }
    }
}


//ice3
function makeIce3(xf,yf){
    var F = {
        x: xf, 
        y: yf,
        move: ice3Move,
        speed: -1.0,
        display: ice3Display};
    return F;
}

function ice3Move(){
    this.x +=this.speed;
}

function ice3Display(xf,yf){
    image(ice3, this.x, this.y,300,300);
}

function updateAndDisplayIce3(){
    for(var i = 0; i < ices3.length; i++){
        ices3[i].move();
        ices3[i].display();
    }
}

function removeIce3ThatHaveSlippedOutOfView(){
    for (var i = 0; i < ices3.length; i++){
        if (ices3[i].x < -1440) {
            ices3.shift(ices3[i]);
        }
    }
}