Project 11: Landscape Story

//Rachel Kim
//15-104(Section C)
//rachelki@andrew.cmu.edu
//Project 11


//global variables
var fish = [];

//background variables 
var mountainShapeA= 0.035;
var mountainSpeedA = 0.0009;

var mountainShapeB = 0.0175;
var mountainSpeedB = 0.0005;

var waterShape = 0.003;
var waterSpeed = 0.00005;


function setup() {
    
    createCanvas(480, 480);
    frameRate(10);

    //number of fish
    for (var j = 0; j < 30; j++) {

        fishX = random(width);
        fishY = random(350, 450);
        fish[j] = makeFish(fishX, fishY);

    }

}

function draw(){

    background(255, 225, 225);
    sun();
    mountainB();
    mountainA();
    boatPeople();
    water();
    drawFishies();

}

//LANDSCAPE BKGD ---MOUNTAINS, SUN, WATER
function mountainA(){
    noStroke();
    fill(255, 241, 224);
    beginShape();
    
    for (var i = 0; i < width; i ++){
        var x = (i * mountainShapeA) + (millis() * mountainSpeedA);
        var y = map(noise(x), 0, 1.2, 150, 250);
        vertex(i, y);
    }
    
    vertex(width, height);
    vertex(0, height);
    endShape();
}

function mountainB(){
    noStroke();
    fill(255, 251, 240);
    beginShape();
    
    for (var i = 0; i < width; i ++){
        var x = (i * mountainShapeB) + (millis() * mountainSpeedB);
        var y = map(noise(x), 0, 1.5, 50, 300);
        vertex(i, y);
    }
    
    vertex(width, height);
    vertex(0, height);
    endShape();
}

function sun(){

    noStroke();
    fill(255, 210, 210);
    ellipse(240, 180, 450, 450);
    fill(255, 195, 195);
    ellipse(240, 180, 400, 400);
    fill(255, 187.5, 187.5);
    ellipse(240, 180, 350, 350);
    fill(255, 183, 183);
    ellipse(240, 180, 300, 300);
    fill(255, 175, 175);
    ellipse(240, 180, 250, 250);
    fill(255, 157, 157);
    ellipse(240, 180, 200, 200);
    fill(255, 135, 135);
    ellipse(240, 180, 150, 150);
    fill(255, 123, 123);
    ellipse(240, 180, 100, 100);

}


function water(){

    noStroke();
    fill(255, 218, 203);
    beginShape();
    
    for (var i = 0; i < width; i ++){
        var x = (i * waterShape) + (millis() * waterSpeed);
        var y = map(noise(x), 0, 1.5, 320, 240);
        vertex(i, y);
    }

    vertex(width, height);
    vertex(0, height);
    endShape();

    noStroke();
    fill(255, 228, 213);
    beginShape();
    
    for (var i = 0; i < width; i ++){
        var x = (i * waterShape) + (millis() * waterSpeed);
        var y = map(noise(x), 0, 1.5, 320, 250);
        vertex(i, y);
    }

    vertex(width, height);
    vertex(0, height);
    endShape();
}

//TRAVELLERS
function boatPeople(){

	noStroke();
	fill(217, 154, 144);
    ellipse(330,280, 5, 20);
    ellipse(330, 270, 5, 5);
    ellipse(300,280, 5, 20);
    ellipse(300, 270, 5, 5);
    ellipse(270,280, 5, 20);
    ellipse(270, 270, 5, 5);
    ellipse(250,280, 5, 20);
    ellipse(250, 270, 5, 5);
    ellipse(220,280, 5, 20);
    ellipse(220, 270, 5, 5);
    ellipse(200,280, 5, 20);
    ellipse(200, 270, 5, 5);
    ellipse(175,280, 5, 20);
    ellipse(175, 270, 5, 5);

    noStroke();
    fill(239, 168, 158);
    triangle(258, 250, 140, 250, 258, 100);
    triangle(262, 250, 375, 250, 262, 100);

	strokeWeight(1.5);
	stroke(239, 168, 158);
	line(260, 100, 260, 300);//flag pole

    noStroke();
    fill(239, 168, 158);//color of boat
    arc(255,280, 200, 150, 0, PI); //boat
}

//FISH DETAILS
function drawFish() {
    var tailLength = 7;

    noStroke();
    fill(this.fishColor);
    ellipse(this.fx, this.fy, 12, 6);
    triangle(this.fx + (tailLength / 2.5), this.fy, this.fx + tailLength, this.fy - 2, this.fx + tailLength, this.fy + 2);
}

function makeFish(fishX, fishY) {//fish as object 
    
    var fish = {
    	fishColor: color(random(150,200), 100, 110),
    	fishSpeed: random(-1, -10),
    	fishAction: fishMotion,
        fx: fishX,
        fy: fishY,
        fishMaker: drawFish
    }

    return fish;
}

function fishMotion() { //movement of fish
    this.fx += this.fishSpeed;
    if (this.fx <= -20) {
        this.fx += width;
    }
}

function drawFishies() { //show onto canvas 
    for (i = 0; i < fish.length; i++) {
        fish[i].fishAction();
        fish[i].fishMaker();
    }

}