keuchuka – project -10

project10

//Fon Euchukanonchai
//15-104 Section A
//keuchuka@andrew.cmu.edu
//Project-10

var plates = [];
var plates2 = [];
var plates3 = [];

var sushi = [];
var sushi2 = [];
var sushi3 = [];

var salmon;
var roe;
var egg;
var seaweed;

//preload all images of sushi and gradients
function preload(){
	var bgLink = "https://i.imgur.com/alDAyjZ.jpg"
	var bar1Link = "https://i.imgur.com/60amesK.png"
	var bar2Link = "https://i.imgur.com/fghTsKQ.png"
	var bar3Link = "https://i.imgur.com/SCIYqYe.png"

	var salmonLink = "https://i.imgur.com/Cb4N5Lb.png"
	var roeLink = "https://i.imgur.com/rJjcqJo.png"
	var eggLink = "https://i.imgur.com/FMF2QvN.png"
	var seaweedLink = "https://i.imgur.com/QbnIWmr.png"

	salmon = loadImage(salmonLink)
	roe = loadImage(roeLink)
	egg = loadImage(eggLink)
	seaweed = loadImage(seaweedLink)

	bg = loadImage(bgLink)
	bar1 = loadImage(bar1Link)
	bar2 = loadImage(bar2Link)
	bar3 = loadImage(bar3Link)
}


function setup() {

	createCanvas(480, 360)
		
	}

//make new plates for first belt
function makenewPlates(){
	//even-ish chance of getting different types of sushi
	if(random(0,2)<0.0025 & random(0,2)> 0.000){
		plates.push(new makePlates(width,60, -6, 3.5));
		sushi.push(new makeSushi(width-30, 40, -6, 3.5, salmon))

	} else if(random(0,2)<0.005 & random(0,2)> 0.0025) {
		plates.push(new makePlates(width,60, -6, 3.5));
		sushi.push(new makeSushi(width-30, 40, -6, 3.5, egg))

	} else if(random(0,2)<0.0075 & random(0,2)> 0.005) {
		plates.push(new makePlates(width,60, -6, 3.5));
		sushi.push(new makeSushi(width-30, 40, -6, 3.5, roe))

 	} else if(random(0,2)<0.01 & random(0,2)> 0.075) {
		plates.push(new makePlates(width,60, -6, 3.5));
		sushi.push(new makeSushi(width-30, 40, -6, 3.5, seaweed))
 
	}
}

//make new plates for second belt
function makenewPlates2(){

	if(random(0,2)<0.0025 & random(0,2)> 0.000){
		plates2.push(new makePlates(93,0, 5, 3));
		sushi2.push(new makeSushi(63, -25, 5, 3, salmon))

	} else if(random(0,2)<0.005 & random(0,2)> 0.0025) {
		plates2.push(new makePlates(93,0, 5, 3));
		sushi2.push(new makeSushi(63, -25, 5, 3, egg))

	} else if(random(0,2)<0.0075 & random(0,2)> 0.005) {
		plates2.push(new makePlates(93,0, 5, 3));
		sushi2.push(new makeSushi(63, -25, 5, 3, roe))

 	} else if(random(0,2)<0.01 & random(0,2)> 0.075) {
		plates2.push(new makePlates(93,0, 5, 3));
		sushi2.push(new makeSushi(63, -25, 5, 3, seaweed))
 
	}
}


//make new plates for third belt
function makenewPlates3(){

	if(random(0,2)<0.0025 & random(0,2)> 0.000){
		plates3.push(new makePlates(0, 170, 6, -3.5));
		sushi3.push(new makeSushi(-30, 150, 6, -3.5, salmon))

	} else if(random(0,2)<0.005 & random(0,2)> 0.0025) {
		plates3.push(new makePlates(0, 170, 6, -3.5));
		sushi3.push(new makeSushi(-30, 150, 6, -3.5, egg))

	} else if(random(0,2)<0.0075 & random(0,2)> 0.005) {
		plates3.push(new makePlates(0, 170, 6, -3.5));
		sushi3.push(new makeSushi(-30, 150, 6, -3.5, roe))

 	} else if(random(0,2)<0.01 & random(0,2)> 0.075) {
		plates3.push(new makePlates(0, 170, 6, -3.5));
		sushi3.push(new makeSushi(-30, 150, 6, -3.5, seaweed))
 
	}
}


function draw(){

	// sushi travels slowly
	frameRate(25)

	//background image
	image(bg, 0,0)

	//call to push plates into array
	makenewPlates();
	makenewPlates2();
	makenewPlates3();

	//conveyor belt 1
	image(bar1, 0,0)

	//move and display sushi and plates in first set of array
	for (var i = 0; i < plates.length; i++){
		plates[i].move();
		plates[i].display();
		sushi[i].move();
		sushi[i].display();
	}

	//conveyor belt 2
	image(bar2, 0,0)

	//move and display sushi and plates in second set of array
	for (var i = 0; i < plates2.length; i++){
		plates2[i].move();
		plates2[i].display();
		sushi2[i].move();
		sushi2[i].display();
		}

	//conveyor belt 3
	image(bar3, 0,0)

	//move and display sushi and plates in third set of array
	for (var i = 0; i < plates3.length; i++){
		plates3[i].move();
		plates3[i].display();
		sushi3[i].move();
		sushi3[i].display();		
		}
	}
	

// constructing the plates and their behavior
function makePlates(makeX, makeY, speedX, speedY){

	this.x = makeX
	this.y = makeY


	this.Xspeed = speedX
	this.Yspeed = speedY

	this.color = color(255,0,0)

	this.move = function() {

	this.x += this.Xspeed
	this.y += this.Yspeed
	
	}
	this.display = function(){
		noStroke();
		fill(170, 170, 170);
		ellipse(this.x-5, this.y+12, 102, 57)		
		fill(199, 222, 202)
		ellipse(this.x, this.y+2, 113,66)
		fill(240, 249, 250)
		ellipse(this.x, this.y, 113, 66)
		fill(203,233,230)
		ellipse(this.x, this.y, 95, 56)
		fill(240, 249, 250)
		ellipse(this.x, this.y+3, 89, 51)
	}
}

// constructing the different sushis and their behavior
function makeSushi(makeX, makeY, speedX, speedY, top){

	this.x = makeX
	this.y = makeY

	this.fish = top

	this.Xspeed = speedX
	this.Yspeed = speedY

	this.color = color(255,0,0)

	this.move = function() {

	this.x += this.Xspeed
	this.y += this.Yspeed
	}

	this.display = function(){

		image(this.fish,this.x, this.y)
	}
}

initial sketches

I didn’t really want a traditional landscape, so I thought about representing either faces or food. The phrase “stuff passing by” really reminded me of a sushi conveyor belt, so I decided to use that as my landscape. Having one felt like the conveyor belt was more an object, therefore I made three in order to make the piece a bit more spatial and landscape-y. I started by drawing the bars and sushi itself with code, but it wasn’t too efficient and I couldn’t get to the level of detail I wanted. I ended up drawing it somewhere else and animating it with p5. The result is some abstract land with some sushi flying around on colorful carousels.