Category: Project-11-Landscape

/*
 * Eric Zhao
 * ezhao2@andrew.cmu.edu
 *
 * Generative ladnscape 
 *
 */

var hillHeights = [];
var mountainHeights = [];
//arrays for foreground and background
var noiseParam = 0;
var noiseParam2 = 0;
var noiseStep = 0.01;
var numpoints = 80;
//bottom 4 used as placemarkers and attempts
//to make the hobbit holes not disappear on screen
var xInc;
var circleRad; 
var breadth = 25;
var marginRatio = (numpoints+breadth)/numpoints;

function drawMountain(hill, numpoints){
    //draws a perlin noise mountain
    beginShape();
    vertex(width - width*marginRatio, height);
    vertex(width - width*marginRatio, height);
    for(let i = -breadth; i <= numpoints+breadth; i++){
        vertex(i * xInc, hill[i]);
    }
    vertex(width*marginRatio, height);
    vertex(width*marginRatio, height);   

    endShape();
}

function stepMountain(param, step, hill, numpoints){
    //generates array of perlin values used for mountain and trees
    hill.shift();
    for(let i = -breadth; i <= numpoints+breadth; i++){
        var n = noise(param);
        var value = map(n, 0, 1, 0, height);
        hill.push(value);
        param += step;
    }
    noiseParam = param;
}

function drawHole(circleRad){
    //hobbit hole draw function
    fill(22, 98, 71);
    ellipse(0, 0, circleRad, circleRad);
    fill(random(0, 360), 94, 25);
    ellipse(0, 0, circleRad*0.8, circleRad*0.8);
    stroke(0);
    noFill();
    for(var i = 0; i <= 8; i ++){
        arc(0, 0, circleRad*0.8, circleRad*0.8, i*(PI/8), -i*(PI/8), CHORD);
    }
    fill(50, 80, 90);
    ellipse(0, 0, max(10, circleRad*0.1), max(10, circleRad*0.1));
}

function setup() {
    createCanvas(600, 400);
    colorMode(HSB);
    frameRate(30);
    noStroke();
    strokeWeight(2);
    stepMountain(noiseParam, noiseStep, hillHeights);
}

function draw() {
    xInc = width/numpoints;
    background(183, 33, 95);
    //draws background/dark green mountain
    fill(120, 100, 20);
    stepMountain(noiseParam2, 0.4, mountainHeights, 320)
    drawMountain(mountainHeights, 320);
    //draws foreground scenery
    fill(110, 64, 52);
    stepMountain(noiseParam, noiseStep, hillHeights, numpoints);
    drawMountain(hillHeights, numpoints);
    push();
    translate(0, 20);
    fill(42, 30, 90);
    drawMountain(hillHeights, numpoints);
    //at peaks of hill, add a hobbit hole
    for(let i = -breadth; i <= numpoints+breadth; i++){
            if(i != -breadth & i !=numpoints+breadth){
                if (hillHeights[i] < hillHeights[i-1] &&
                hillHeights[i] < hillHeights[i+1]){
                    push();
                    fill(0);
                    translate(i * xInc, (height + hillHeights[i])/2);
                    drawHole((height-hillHeights[i])/1.5);
                    pop();              
                }

            }
        }
    pop();

}

//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();
}