Final Project

// WARNING: FOR SOME REASON THE PROGRAM IS VERY LAGGY ON CHROME. HOWEVER, WORKS VERY SMOOTHLY WITH SAFARI.

var trash=["https://i.imgur.com/4OExNH5.png", "https://i.imgur.com/mNxZdnx.png", "https://i.imgur.com/2utBIl1.png", "https://i.imgur.com/onA6aUl.png"];
var recyclebin=["https://i.imgur.com/p6HfTlh.png"];
var canfact=['https://i.imgur.com/PUJEJM4.png'];
var milkfact=['https://i.imgur.com/C5jKZj9.png'];
var waterfact =['https://i.imgur.com/VcUrBbs.png'];
var winefact =['https://i.imgur.com/pWmodnq.png'];
var background =['https://i.imgur.com/Mz0ml4E.png'];

var trash1;
var trash2; 
var trash3;
var trash4;
var speed= 7;

var place=[];
var ntrash=200;
var x=0;
var speed=7;

function preload() {
    trash1=loadImage(trash[0]); // wine
    trash2=loadImage(trash[1]); // water
    trash3=loadImage(trash[2]); // milk 
    trash4=loadImage(trash[3]); // can
    recyclebin = loadImage('https://i.imgur.com/p6HfTlh.png');
    background = loadImage('https://i.imgur.com/Mz0ml4E.png')

    winefact = loadImage('https://i.imgur.com/pWmodnq.png');
    waterfact = loadImage('https://i.imgur.com/VcUrBbs.png');
    milkfact = loadImage('https://i.imgur.com/C5jKZj9.png');
    canfact = loadImage('https://i.imgur.com/PUJEJM4.png');
}

function setup() {
    createCanvas(800, 500);
    var n = 0;
    for (var i = 0; i < 1000; i++){ //
        place[i] = makePlace(n);
        n -= 200;
    }
    frameRate(30);
}

function draw() {
    image(background,0,0);
    placeShow(); 
    image(recyclebin, mouseX, mouseY);

    if (mouseIsPressed & mouseX<400 && mouseY<250) {
        image(winefact, 0, 0);
    } 

    if (mouseIsPressed & mouseX>400 && mouseY<250) {
        image(waterfact,0,0);
    }

    if (mouseIsPressed & mouseX<400 && mouseY>240) {
        image(milkfact,0,0);
    }

    if (mouseIsPressed & mouseX>400 && mouseY>250) {
        image(canfact,0,0);
    }
}

function placeGo(){
    this.x+=this.dx;
}
function placeShow(){
    for(var i = 0; i < place.length; i++){
        place[i].go();
        place[i].show();
        // plate[i].mP();
    }
}

function makePlace(px){
    var place={x: px, y:1, w:1, h:1,
    dx: 7, go:placeGo, show:drawPlace,
    trash: random([trash1, trash2, trash3, trash4]),
    }
    return place;
}

function drawPlace(){
    push();
    fill(0);
    noStroke();
    ellipse(this.x, this.y, this.w, this.h);
    stroke(185);
    noFill();
    ellipse(this.x, this.y, 0.75*this.w, 0.75*this.h);
    if (this.trash==trash1){
            image(trash1, this.x-50, 0);
        }
    if (this.trash==trash2){
        image(trash2, this.x-50, 0);
         }
    if (this.trash==trash3){
        image(trash3, this.x-50, 0);
         }
    if (this.trash==trash4){
        image(trash4, this.x-50, 0);
         } 

function keyPressed() {
  clear();
    }
}