GarrettRauck-Project-10

sketch

//Garrett Rauck
//Section C
//grauck@andrew.cmu.edu
//Assignment-07a-Bar Chart

/////////////////////////////////
// INIT VARIABLES
/////////////////////////////////
//canvas vars
var canvasWidth, canvasHeight;
//artwork vars
var horizon;
var landscapes = []; //array to store landscape objects
//cactus vars
var minCactusSize, maxCactusSize;
var minCactusSpeed, maxCactusSpeed;
var minCactusY, maxCactusY;
var cacti = []; //array to store cactus objects
//colors
var cactusFill, cactusStroke;
var skyColor, skyColor1, skyColor2, skyFaderVal, skyFaderSpeed;

/////////////////////////////////
// HELPER FNS
/////////////////////////////////
function drawMovingLandscape() {
	//draw backdrop
	for (var i=0; i<landscapes.length; i++) landscapes[i].draw();
	//draw cacti
    for (var j=0; j<cacti.length; j++) cacti[j].draw();
}

function moveCacti() {
	//move each cactus in stored list of cacti
	for (var i=0; i<cacti.length; i++) cacti[i].move();
}

function removeCactiOutOfView() {
	var cactiToKeep = [];
	for (var i=0; i<cacti.length; i++) {
		if (cacti[i].x + cacti[i].size/2 > 0) {
			cactiToKeep.push(cacti[i]);
		}
	}
	cacti = cactiToKeep;
}

// function adapted from Stack Overflow thread
// http://stackoverflow.com/questions/12788051/
// how-to-sort-an-associative-array-by-value
function sortArray(a) {
	a.sort(function(a,b) {
		return a.y - b.y;
	})
}

function updateSkyColor() {
	//update sky fader val
	skyFaderVal = ((millis()*skyFaderSpeed)%1000)/1000;
	if (Math.floor(millis()/1000*skyFaderSpeed)%2 == 0) {
		skyColor = lerpColor(skyColor1, skyColor2, skyFaderVal);
	}
	else {
		skyColor = lerpColor(skyColor2, skyColor1, skyFaderVal);
	}
}

/////////////////////////////////
// LANDSCAPE CLASS
/////////////////////////////////
function makeLandscape(inCY, inRange, inSpeed, inDetail, inColor, inStroke) {
	landscape = {cy: inCY,
		 range: inRange,
		 speed: inSpeed,
		 detail: inDetail,
		 c: inColor,
		 s: inStroke,
		 draw: drawLandscape
	     }
	landscapes.push(landscape);
}

function drawLandscape() {
	// Landscape generator adapted from code provided by 15-104 staff

	fill(this.c);
	stroke(this.s)
	beginShape();
	vertex(0,canvasHeight);
	for (var x=0; x<canvasWidth; x++) {
		var t = (x*this.detail) + (millis()*this.speed);
        var y = map(noise(t), 0, 1, this.cy-this.range/2, this.cy+this.range/2);
        vertex(x,y);
	}
	vertex(canvasWidth, canvasHeight);
	endShape(CLOSE);
}

/////////////////////////////////
// CACTUS CLASS
/////////////////////////////////
function makeCactus(scale) {
	//get properties
	inSize = map(scale, 0, 1, maxCactusSize, minCactusSize);
	inX = canvasWidth + 100 + inSize;
	inY = map(scale, 0, 1, maxCactusY, minCactusY);
	inSpeed = map(scale, 0, 1, maxCactusSpeed, minCactusSpeed);
	//create cactus instance
	cactus = {x: inX,
	          y: inY,
	          size: inSize,
	          speed: inSpeed,
	          draw: drawCactus,
	          move: moveCactus
	    }
	//store new cactus in cacti array
	cacti.push(cactus);
}

function moveCactus() {
	this.x -= this.speed;
}

function drawCactus() {
	//set drawing properties
	// fill(-1);
	stroke(cactusStroke);
	//draw trunk
	beginShape();
	vertex(
		this.x-this.size*0.1,
		this.y);
	vertex(
		this.x-this.size*0.1,
		this.y-this.size*0.5);
	vertex(
		this.x-this.size*0.4,
		this.y-this.size*0.5);
	vertex(
		this.x-this.size*0.4,
		this.y-this.size*0.8);
	vertex(
		this.x-this.size*0.25,
		this.y-this.size*0.8);
	vertex(
		this.x-this.size*0.25,
		this.y-this.size*0.65);
	vertex(
		this.x-this.size*0.1,
		this.y-this.size*0.65);
	vertex(
		this.x-this.size*0.1,
		this.y-this.size*1.0);
	vertex(
		this.x+this.size*0.1,
		this.y-this.size*1.0);
	vertex(
		this.x+this.size*0.1,
		this.y-this.size*0.5);
	vertex(
		this.x+this.size*0.2,
		this.y-this.size*0.5);
	vertex(
		this.x+this.size*0.2,
		this.y-this.size*0.75);
	vertex(
		this.x+this.size*0.35,
		this.y-this.size*0.75);
	vertex(
		this.x+this.size*0.35,
		this.y-this.size*0.35);
	vertex(
		this.x+this.size*0.1,
		this.y-this.size*0.35);
	vertex(
		this.x+this.size*0.1,
		this.y);
	endShape(CLOSE);
}

/////////////////////////////////
// EVENTS
/////////////////////////////////

/////////////////////////////////
// RUN!
/////////////////////////////////
function setup() {
	// INIT VARS
	//canvas
	canvasWidth = 600;
	canvasHeight = 400;
	//artwork
	horizon = 250;
	//cactus vars
	minCactusSize = 5;
	maxCactusSize = 100;
	minCactusSpeed = 1;
	maxCactusSpeed = 4;
	minCactusY = horizon+5;
	maxCactusY = canvasHeight+10;
	//colors
	cactusStroke = 255;
	skyColor1 = color(218, 165, 32);
	skyColor2 = color(72, 61, 139);
	skyColor = skyColor1;
	skyFaderVal = 0;
	skyFaderSpeed = .1;

	// CANVAS SETUP
    createCanvas(canvasWidth, canvasHeight);

    //INIT OBJECTS
    //far mountains
    makeLandscape(50, 100, 0.0001, .01, color(0), color(255));
    //close mountains
    makeLandscape(125, 75, 0.0002, .009, color(0), color(255));
    //ground
    makeLandscape(horizon, 10, 0.0003, .005, color(0), color(255));
    //test cactus
    makeCactus(random(0,canvasHeight-horizon));
}

function draw() {
	background(skyColor); //update background

	//UPDATE MODEL
	// new cactus 2% of the time
	if (random(0,1) < 0.02) {
		//new cactus with random distance from bottom of canvas
		makeCactus(random(0,1));
	}
	//move cacti
	moveCacti();
	//remove
	removeCactiOutOfView();
	//sort cacti by distance from view
	sortArray(cacti);
	//update sky color
	updateSkyColor();

	//DRAW THE LANDSCAPE
	drawMovingLandscape();
}

Leave a Reply