![[OLD FALL 2020] 15-104 • Introduction to Computing for Creative Practice](https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2021/08/cropped-notcurrentsemester.jpg){kind=small}
![[OLD FALL 2020] 15-104 • Introduction to Computing for Creative Practice](https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2021/09/stop-banner.png)
Y-sketch-landscapeDownload
//Huijun Shen
//huijuns@andrew.cmu.edu
//section D
// the general idea of this project is presenting an array of buildings
//which are on the hill and are coverd by trees.
var buildings = [];
var trees = [];
var noiseParam = 0;
var noiseStep = 0.02;
var hillHeight = [];
// var clouds = [];
// var land = [];
// var cX = random(100,200);
// var cY = random(100,200);
function setup(){
createCanvas(480,480);
//hill
for (var i = 0; i <= width/3; i+=1){
var n = noise(noiseParam);
var value = map(n,0,1,0,width);
//hillHeight.shift();
hillHeight.push(value);
noiseParam += noiseStep;
}
//buildings
for(var i = 0; i < 10; i ++){
var rx = random(width);
buildings[i]=makeBuilding(rx);
}
frameRate(10);
}
function draw(){
background(144,232,232);
//sun
fill(223,242,136);
circle(400,50,50);
//hill
noStroke();
var n = noise(noiseParam);
var value = map(n,0,1,0,width);
hillHeight.shift(); //update value in array
hillHeight.push(value);
noiseParam += noiseStep;
for (var i = 0; i < width/5 ; i += 1){
fill(50,120,20); //square shape
beginShape();
vertex(5*i,hillHeight[i]);
vertex(5*i+5, hillHeight[i+1]);
vertex(5*i+5,height);
vertex(5*i,height);
endShape();
}
//displayHorizon();
//buildings
updateBuildings();
removeBuilding();
addNewBuilding();
//tree
updateTrees();
removeTrees();
addNewTrees();
fill(181,170,156);
rect(0,460,480,30);
}
//horizon
function displayHorizon(){
stroke(0);
line(0,height-50,width,height-50);
}
//buildings
function updateBuildings(){
for (var i = 0; i < buildings.length; i ++){
buildings[i].move();
buildings[i].display();
}
}
function removeBuilding(){
var buildingsToKeep = [];
for (var i = 0; i < buildings.length; i ++){
if (buildings[i].x + buildings[i].breadth > 0){
buildingsToKeep.push(buildings[i]);
}
}
buildings = buildingsToKeep;
}
function addNewBuilding(){
if(random(0,1)<0.03){
buildings.push(makeBuilding(width-2));
}
}
function buildingMove(){
this.x += this.speed;
}
function makeBuilding(birthLocationX){
var bldg = {
x:birthLocationX,
y:random(400,450),
breadth:random(30,50),
r:random(255),
b:random(255),
g:random(255),
speed : -2.0,
nFloors : round(random(2,6)),
move:buildingMove,
display:buildingDisplay
}
return bldg;
}
function buildingDisplay(){
var floorHeight = 25;
var bHeight = this.nFloors*floorHeight;
fill(this.r,this.g,this.b);
stroke(0);
push();
translate(this.x,this.y);
rect (0,-bHeight-10,this.breadth,bHeight);
stroke(200);
for(var i = 0; i < this.nFloors; i ++){
fill(this.r+10,this.g-20,this.b+50);
//rect(5,-15-(i*floorHeight),this.breadth-10, 10);
rect(5,-20-(i*floorHeight),this.breadth-10, 10);
}
pop();
}
//tree
function updateTrees(){
for (var i = 0; i < trees.length; i ++){
trees[i].move();
trees[i].display();
}
}
function removeTrees(){
var treesToKeep = [];
for (var i = 0; i < trees.length; i ++){
if (trees[i].x + trees[i].breadth > 0){
treesToKeep.push(trees[i]);
}
}
trees = treesToKeep;
}
function addNewTrees(){
if(random(0,1)<0.1){
trees.push(makeTrees(width+30));
}
}
function treeMove(){
this.x += this.speed;
}
function makeTrees(birthLocationX){
var tree = {
x:birthLocationX,
y:random(400,450),
treeHeight:random(30,150),
breadth:random(10,20),
width:random(50,80),
r:random(100,120),
b:random(120,130),
g:random(150,255),
speed : -5.0,
move:treeMove,
display:treeDraw,
}
return tree;
}
function treeDraw(){
var treeHeight;
push();
translate(this.x,this.y);
fill(128,101,64);
rect(0,0,10,50);
fill(this.r,this.g,this.b);
ellipse (0,0,this.width,treeHeight);
pop();
}
