rgroves – Landscape – Section B

sketch

//Rebecca Groves
//Section B
//rgroves@andrew.cmu.edu
//Landscape

var middlecacti = [];
var foregroundcacti = [];
var shrubs = [];
var buttes = [];

var MiddlegroundSpeed = .0003;
var MiddlegroundDetail = .004;
var ForegroundSpeed = .0005;
var ForegroundDetail = .005;

var middleTerrain = [];
var foregroundTerrain = [];

function setup() {
    createCanvas(480, 250);
    //pregenerated vegetation
    for (var i = 0; i < 4; i++) {
		buttes[i] = makeButte(random(width));
	}
	for (var i = 0; i < 5; i++) {
		middlecacti[i] = makeCactus(floor(random(width))); 
	}
	for (var i = 0; i < 3; i++) {
		foregroundcacti[i] = makeCactus(floor(random(width))); 
	}
	for (var i = 0; i < 100; i++) {
		shrubs[i] = makeShrub(random(width));
	}

}

//LANDSCAPES

function drawForeground() {
	noStroke();
	fill(223, 194, 140);
	beginShape();
	for (var x = 0; x <= width; x++) {
		var t = (x * ForegroundDetail) + (millis() * ForegroundSpeed);
		var y = map(noise(t), 0, 1, 2 * height/3, height);
		vertex(x,y);
		foregroundTerrain[x] = y;

	} 
	vertex(width, height);
	vertex(0, height);
	endShape();
	if (random(0, 1) < .003) {
		foregroundcacti.push(makeCactus(width))
	}
	for (var i = 0; i < foregroundcacti.length; i++) {
		foregroundcacti[i].move();
		foregroundcacti[i].foregrounddraw();
	}
}

function drawMiddleground() {
	noStroke();
	fill(210, 170, 100);
	beginShape();
	for (var x = 0; x <= width; x++) {
		var t = (x * MiddlegroundDetail) + (millis() * MiddlegroundSpeed);
		var y = map(noise(t), 0, 1, height/2, height);
		vertex(x,y);
		middleTerrain[x] = y;
	} 
	vertex(width, height);
	vertex(0, height);
	endShape();
	if (random(0, 1) < .005) {
		middlecacti.push(makeCactus(width))
	}
	for (var i = 0; i < middlecacti.length; i++) {
		middlecacti[i].move();
		middlecacti[i].middledraw();
	}
}

function drawBackground() {
	fill(230, 190, 90);
	noStroke();
	rect(0, 2 * height/3, width, height/3);

	if (random(0, 1) < .01) {
		buttes.push(makeButte(width))
	}
	for (var i = 0; i < buttes.length; i++) {
		buttes[i].move();
		buttes[i].draw();
	}
	if (random(0, 1) < .5) {
		shrubs.push(makeShrub(width))
	}
	for (var i = 0; i < shrubs.length; i++) {
		shrubs[i].move();
		shrubs[i].draw();
	}
}

//REMOVE UNUSED OBJECTS

function removeButtes() {
	var buttesToKeep = [];
	for (var i = 0; i < buttes.length; i++) {
		if (buttes[i].x + buttes[i].breadth > 0)
			buttesToKeep.push(buildings[i]);

	}
	buttes = buttesToKeep;
}

function removemiddleCacti() {
	var middlecactiToKeep = [];
	for (var i = 0; i < middlecacti.length; i++) {
		if (middlecacti[i].x > 0)
			middlecactiToKeep.push(middlecacti[i]);

	}
	middlecacti = middlecactiToKeep;
}

function removeforegroundCacti() {
	var foregroundcactiToKeep = [];
	for (var i = 0; i < foregroundcacti.length; i++) {
		if (foregroundcacti[i].x > 0)
			foregroundcactiToKeep.push(foregroundcacti[i]);

	}
	foregroundcacti = foregroundcactiToKeep;

}

//BUTTES

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

function drawButte() {
	beginShape();
	vertex(this.x + this.breadth, 2 * height/3);
	vertex(this.x + this.breadth, 2 * height/3);
	vertex(this.x + this.breadth - 10, (2 * height/3) - this.tall);
	vertex(this.x + 10, (2 * height/3) - this.tall);
	vertex(this.x, 2 * height/3);
	endShape();
	
}

function makeButte(birthlocationX) {
	var butte = {x: birthlocationX,
				breadth: random(40, 150),
				tall: random(10, 30),
				speed: -1,
				move: butteMove,
				draw: drawButte}
	return butte;
}

//VEGETATION

function cactusMove() {
	this.x -= 1;
}

function drawmiddleCactus() {
	strokeWeight(10);
	stroke('green');
	line(this.x, middleTerrain[this.x], this.x, middleTerrain[this.x] - this.height);
	for (i = 0; i < this.limbs; i++) {
		if (i%2 == 0) {	
			line(this.x - 10, middleTerrain[this.x] - this.height/(1.25 * i) - 15, this.x, middleTerrain[this.x] - this.height/(1.25 * i));
		} else {
			line(this.x + 10, middleTerrain[this.x] - this.height/(1.25 * i) - 15, this.x, middleTerrain[this.x] - this.height/(1.25 * i));

		}
	}
	noStroke();
	if (this.flowercolor < .3) {
		fill(236, 96, 160);
	} else if (this.flowercolor > .3 & this.flowercolor < .6) {
		fill(255, 255, 0);
	} else {
		noFill();
	}
	push();
	translate(this.x, middleTerrain[this.x] - this.height);
	rotate(-90);
	for (i = 0; i < 3; i++) {
		angleMode(DEGREES);
		var angle = 45;
		rotate(angle);
		angle += 45 * i;
		ellipse(0, -5, -7, 15);
	}
	pop();
	

}

function drawforegroundCactus() {
	strokeWeight(10);
	stroke('green');
	line(this.x, foregroundTerrain[this.x], this.x, foregroundTerrain[this.x] - this.height);
	for (i = 0; i < this.limbs; i++) {
		if (i%2 == 0) {	
			line(this.x - 10, foregroundTerrain[this.x] - this.height/(1.25 * i) - 15, this.x, foregroundTerrain[this.x] - this.height/(1.25 * i));
		} else {
			line(this.x + 10, foregroundTerrain[this.x] - this.height/(1.25 * i) - 15, this.x, foregroundTerrain[this.x] - this.height/(1.25 * i));
		}
	}
	noStroke();
	if (this.flowercolor < .3) {
		fill(236, 96, 160);
	} else if (this.flowercolor > .3 & this.flowercolor < .6) {
		fill(255, 255, 0);
	} else {
		noFill();
	}
	push();
	translate(this.x, foregroundTerrain[this.x] - this.height);
	rotate(-90);
	for (i = 0; i < 3; i++) {
		angleMode(DEGREES);
		var angle = 45;
		rotate(angle);
		angle += 45 * i;
		ellipse(0, -5, -7, 15);
	}
	pop();
}

function makeCactus(locationX) {
	var cactus = {x: locationX,
				height: random(20, 70),
				limbs: floor(random(1, 4)),
				middledraw: drawmiddleCactus,
				foregrounddraw: drawforegroundCactus,
				move: cactusMove,
				flowercolor: random(0, 1)}
	return cactus;
}

function shrubMove() {
	this.x += this.speed
}

function drawShrub() {
	fill(50, 100, 100);
	ellipse(this.x, this.y, 3, 3);
}

function makeShrub(locationX) {
	var shrub = {x: locationX, y: random(2 * height/3, height),
				speed: -1,
				draw: drawShrub,
				move: shrubMove}
	return shrub;
}

function draw() {
    background("skyblue");
    drawBackground();
    drawMiddleground();
	drawForeground();

}

For my landscape I was inspired by driving through New Mexico this summer. Unfortunately I could not figure out how make the cacti move at the same speed as the landscape. I borrowed the code for the landscape from the class website and I think maybe if I understood how that worked a little better I might have been able to make the speeds match. I will keep thinking about it. Other than that, I thought this project went pretty well. I’m glad I was finally able to figure out objects, even at a pretty basic level. I still find them confusing but I can use them!