Project – 11 – Landscape

// Emily Franco
// efranco
// Section C
// Project 11 



//CHANGING FEATURES
//verticle coordinates 
var hill = [];
var noiseParam = 0; 
//hill frequency
var noiseStep = 0.02; 

var tree;
var forest = []; 
var sky = [];

//state of person walking
var state = 0;

function moon(){
    var oMoon = 30;
    var dim = 100;
    noStroke();
    fill(252,250,252,230);
    circle(300,90,dim);
    //halo
    for(var i=0; i<3; i++){
        oMoon -= 5*i;
        dim +=30;
        fill(252,250,252,oMoon);
        circle(300,90,dim);
    }
}

//constructor for stars
function makeStar(){
    var star = {x:random(width),y:random(height),size:random(0.25,2), 
                opacity:random(100,255),
                drawFunction: drawStar};
    return star;
}

function drawStar(){
    stroke(252,250,252,this.opacity);
    strokeWeight(this.size);
    point(this.x,this.y);
}

function stepTree(){
    this.x++;
}

function drawTree(){
    noStroke();
    var side;
    var triangleY;
    var branchLen;
    
    fill(this.color);
    rect(this.x,0,this.w,height);
    //branches
    switch(this.side){
        case 0:
        triangle(this.x,this.triangleY,this.x-this.branchLen,this.triangleY-6,this.x,this.triangleY+10);
        break;
        case 1: 
        triangle(this.x+this.w,this.triangleY,this.x+this.w+this.branchLen,this.triangleY-6,this.x+this.w,this.triangleY+10);
        break;
    }  
}

//tree constructor
function makeTrees(tx,tw,treeColor){
    var tree = {x: tx, w:tw, color:treeColor, side:floor(random(2)), 
                triangleY:random(height-100), branchLen:random(10,55),
                drawFunction:drawTree, stepFunction: stepTree};

    return tree;
}

//center if person is center of face circle
function person(x, y,state){
    //LEGS
    //state 1
    if(state==0){
        strokeWeight(2);
        stroke(248,232,212);
        line(x-6,y+58,x-8,y+68);
        line(x+4,y+58,x+4,y+68);
        stroke(0);
        line(x-8,y+68,x-9,y+81);
        line(x+4,y+68,x+7,y+81);
        //shadow
        noStroke();
        fill(0,0,0,90);
        rect(x-10,y+81,30,5);
    }
    //state 2
    if(state==1){
        strokeWeight(2);
        stroke(248,232,212);
        line(x-3,y+58,x-8,y+67);
        line(x+5,y+58,x+6,y+68);
        stroke(0);
        line(x-8,y+67,x-6,y+81);
        line(x+6,y+68,x+9,y+81);
        //shadow
        noStroke();
        fill(0,0,0,90);
        rect(x-12,y+81,35,5);
    }
    //state 3
    if(state==2){
        strokeWeight(2);
        stroke(248,232,212);
        line(x-3,y+58,x-6,y+69);
        line(x,y+58,x,y+68);
        stroke(0);
        line(x-6,y+69,x+3,y+81);
        line(x,y+68,x,y+81);
        //shadow
        noStroke();
        fill(0,0,0,90);
        rect(x-5,y+81,15,5);
    }
    noStroke();
    //BODY
    //hair in back
    fill(43,28,28);
    rect(x-10,y,17.5,29.8);

    //head
    fill(248,232,212);
    circle(x,y,20);
    //neck
    rect(x-1,y+10,2,5);
    //hair
    fill(56,38,33);
    arc(x,y,20,20,radians(180),radians(0),CHORD);
    rect(x+4.6,y,5.4,29.9);
    //eye
    ellipse(x-6,y+2,1,2);
    //dress
    fill(33,30,45);
    beginShape();
    vertex(x-6.5,y+15);
    vertex(x-15,y+59);
    vertex(x+15,y+59);
    vertex(x+6.5,y+15);
    endShape(CLOSE);
}

function moveHill(){
    //hill.shift();

    //add new coordinate to hill arry
    n = noise(noiseParam); 
    val = map(n,0,1,height-100,height);
    hill.pop();
    hill.unshift(val);
    noiseParam = noiseParam + noiseStep;

}
function defineHill(){
    var n;
    var val;
    for(var i=0; i<(width/5)+1; i++){
        n = noise(noiseParam);
        //map noise output to height of canvas
        val = map(n,0,1,height-100,height);
        hill.unshift(val);
        //increment to change curve
        noiseParam = noiseParam + noiseStep;
    }
}

function setup(){
    createCanvas(400, 400);
    frameRate(5);

    //STARS 
    for(var i=0; i<200; i++){
        sky[i] = makeStar();
    }

    //TREES
    for(var i=0; i<=18;i++){
          //furthest back
        if(i<=4){
            c = color(50,36,81);
        }
        //middle
        if(i>4 & i<=10){
            c = color(35,29,71);
        }
        if(i>10){
            c = color(25,18,66);
        }
        //front
        tree = makeTrees(random(width),random(5,15),c);
        forest.push(tree);
    }

    //HILL
    defineHill();
    
}

function draw(){
    background(69,55,89);
    var drawSetBack = floor(random(30));
    //------BACKGROUND--------
    moon();
    for(var i=0; i<sky.length-1; i++){
        //make stars twinkle
        if(i%5==0){
            sky[i].size = random(0.25,3.5);
        }
        var str = sky[i];
        str.drawFunction();
    }
    //back hills
    fill(49, 34, 66);
    noStroke();
    beginShape();
    curveVertex(400,235);
    curveVertex(400,235);
    curveVertex(316,283);
    curveVertex(232,285);
    curveVertex(194,400);
    curveVertex(400,400);
    endShape(CLOSE);

    fill(62, 47, 79);
    noStroke();
    beginShape();
    curveVertex(0,245);
    curveVertex(0,245);
    curveVertex(35,204);
    curveVertex(87,273);
    curveVertex(192,258);
    curveVertex(272,320);
    curveVertex(400,400);
    curveVertex(0,400);
    endShape(CLOSE);

    //------MIDGROUND--------
    //find index of most right tree
    var currentX=0; 
    var xHigh=0;

    for(var i=0; i<=forest.length-1;i++){
        currentX = forest[i].x;
        if(currentX>xHigh){
            xHigh=currentX;
            furthestTree = i;
        }
    }

    //move last tree to start of canvas
    if(forest[furthestTree].x > width){
        forest[furthestTree].x = 0-forest[furthestTree].w;
    }

    for(var i=0; i<=forest.length-1;i++){
        var t = forest[i];
        t.drawFunction();
        t.stepFunction();
    }

    //------FOREGROUND--------
    //draw hill
    for(var i=0; i<(width/5);i++){
        fill(125, 104, 135);
        beginShape();
        vertex(i*5,hill[i]);
        vertex(i*5,height);
        vertex((i+1)*5,height);
        vertex((i+1)*5,hill[i+1]);
        endShape(CLOSE);
    }
    moveHill();

    //move person according to hill value
    person(260,hill[53]-79,state%3);
    state++;
}