rgriswol_project-10

For this project, I wanted to keep the landscape design relatively simple so I could focus on actually understanding what I was coding.

sketch

/*
* Rachel Griswold
* rgriswol@andrew.cmu.edu
* Section B
* Project 10
*
*/

var terrainSpeed = 0.0003; //speed of hills
var terrainDetail = 0.005;
var terrain = [];
var treeX = [];
var treeY = [];
var treeN = [];
var cloudX = [];
var cloudY = [];



function updateLocation(){ //moves the trees + clouds
	for(i = 0; i < treeN.length; i++){
		treeX[i] = treeX[i] - 1;
			if(treeX[i] < -50){ //makes the trees go away
				treeX.splice(i,1);
				treeY.splice(i,1);
				treeN.splice(i,1);
			}
	}
	for(i = 0; i < cloudX.length; i++){
		cloudX[i] = cloudX[i] - 1;
			if(cloudX[i] < -50){ //makes the clouds go away
				cloudX.splice(i,1);
				cloudY.splice(i,1);
			}
	}
}


function drawTree1(x, y){ // creates tree type 1
	var tw = 20; // tree width
	var th = 70; // tree height
	fill(80, 40, 20);
	rect(x, y, tw, th); // tree trunk
	//tree leaves
	fill(150, 230, 80);
	ellipse(x + tw/2, y - 20, 40, 40);
	ellipse(x, y, 40, 40);
	ellipse(x + tw, y, 40, 40);
}

function drawTree2(x, y){ // creates tree type 2
	var tw = 10; // tree width
	var th = 40; // tree height
	fill(80, 40, 20);
	rect(x, y, tw, th); // tree trunk
	//tree leaves
	fill(150, 230, 80);
	ellipse(x + tw/2, y - 25, 50, 50);
}

function drawTree3(x, y){ // creates tree type 3
	var tw = 15; // tree width
	var th = 50; // tree height
	fill(80, 40, 20);
	rect(x, y, tw, th); // tree trunk
	//tree leaves
	fill(150, 230, 80);
	ellipse(x, y, 30, 30);
	ellipse(x + tw, y, 30, 30);
	ellipse(x, y - 20, 30, 30);
	ellipse(x + tw, y - 20, 30, 30);
}

function drawTrees(){ //places trees
	for(i = 0; i < treeX.length; i++){
		if(treeN[i] == 1){
			drawTree1(treeX[i], treeY[i]);
		}
		if(treeN[i] == 2){
			drawTree2(treeX[i], treeY[i]);
		}
		if(treeN[i] == 3){
			drawTree3(treeX[i], treeY[i]);
		}
	}
}

function drawCloud(x, y){ //creates cloud
	var cw = 80;
	var ch = 20;
	fill(255);
	ellipse(x, y, cw, ch);
}

function drawClouds(){ //places clouds
	for(i = 0; i < cloudX.length; i++){
		drawCloud(cloudX[i], cloudY[i]);
	}

}


function setup(){
	createCanvas(600, 400);
}

function draw() {
    background(190, 240, 255);

    drawClouds();
    if(random(0, 100) < 1){
    	cloudX.push(620);
    	cloudY.push(random(20, 200));
    }
    
    noStroke();
    fill(0, 80, 0);
    beginShape(); //creates "noise" for hill background
    vertex(0,height);
    for (var x = 0; x < width; x++) {
        var t = (x * terrainDetail) + (millis() * terrainSpeed);
        var y = map(noise(t), 0,1, 0, height);
        vertex(x, y); 
    }
    vertex(width,height);
    endShape(CLOSE);

    fill(0, 120, 0); //creates foreground
    rect(0, 300, 600, 400);

    drawTrees();
    updateLocation();

    if(random(0, 100) < 1){
    	treeX.push(620);
    	treeY.push(300);
    	var n = random(0,3);
    	if(n < 1){
    		treeN.push(1);
    	}
    	else if(n < 2){
    		treeN.push(2);
    	}
  		else{
  			treeN.push(3);
  		}
    }

}