# Judy Li-Project-10-Landscape

``````/*
Judy Li
Section A
judyli@andrew.cmu.edu
Project-10
*/

var terrainSpeed = 0.0005;
var terrainDetail = 0.002;
var terrainDetail1 = 0.00125;
var terrainDetail2 = 0.001;
var terrainDetail3 = 0.0005;
var yaxis = 1;
var c;
var c1;
var c2;
var star = [];

function setup() {
createCanvas(480, 480);
frameRate(10);
c2 = color(179, 77, 37);
c1 = color(64, 40, 74);
c = color(247, 222, 85);

star.push(drawStar());
}

function wave1() {
beginShape();
stroke(26, 20, 95);
for (var x = 0; x < width; x++) {
var t = (x * terrainDetail) + (millis() * terrainSpeed);
var y = map(noise(t), 0, 5, 0, height / 4);
line(x, y + (height / 2), x, height);
}
endShape();
}

function wave2() {
beginShape();
stroke(26, 40, 95);
for (var x = 0; x < width; x++) {
var t = (x * terrainDetail1) + (millis() * terrainSpeed);
var y = map(noise(t), 0, 4, 0, height / 2);
line(x, y + 15 + (height / 2), x, height);
}
endShape();
}

function wave3() {
beginShape();
stroke(26, 60, 95);
for (var x = 0; x < width; x++) {
var t = (x * terrainDetail2) + (millis() * terrainSpeed);
var y = map(noise(t), 0, 3.5, 0, height);
line(x, y + 25 + (height / 2), x, height);
}
endShape();
}

function wave4() {
beginShape();
stroke(26, 70, 95);
for (var x = 0; x < width; x++) {
var t = (x * terrainDetail3) + (millis() * terrainSpeed);
var y = map(noise(t), 0, 3, 0, height);
line(x, y + 50 + (height / 2), x, height);
}
endShape();
}

function draw() {
background("white");
nStar();
nPosition();
nArray();
setGradient(0, 0, width, height / 3, c1, c2, yaxis);
setGradient(0, height / 3, width, 2 * (height / 3), c2, c, yaxis);

fill(247, 222, 125);
ellipse(width / 2, 25 + (height / 2), 50, 50);

push();
strokeWeight(1.5);
stroke(255, 255, 255, 100);
ellipse(width - 50, 50, 50, 50);
fill(247, 222, 200);
ellipse(width - 50, 50, 49, 49);
pop();

for (var i = 0; i < star.length; i++) {
star[i].display();
}

push();
wave1();
wave2();
wave3();
wave4();
noFill();
rect(0, 0, width, height);
pop();
}

function nStar() {
if (random(0, 250) < 50) {
star.push(drawStar());
}
}

function nPosition() {
for (var i = 0; i < star.length; i++) {
star[i].move();
}
}

function nArray() {
var ogStar = [];
for (var i = 0; i < star.length; i++) {
if (star[i].x > 0) {
ogStar.push(star[i]);
}
}
star = ogStar;
}

function moveStar() {
this.x -= this.speed;
}

function seeStar() {
stroke(255, 255, 255, 250);
strokeWeight(random(1, 5));
point(this.x, this.y);
}

function drawStar() {
var star = {x: width,
pdist: 100,
speed: 5,
starsize: round(random(0, 5)),
y: round(random(0, height / 4)),
move: moveStar,
display: seeStar
}
return star;
}

function setGradient(x, y, w, h, c1, c2, axis) {
noFill();
if (axis == yaxis) {  // Top to bottom gradient
for (var i = y; i <= y+h; i++) {
var inter = map(i, y, y+h, 0, 1);
var c = lerpColor(c1, c2, inter);
stroke(c);
line(x, i, x + w, i);
}
}
}
``````

For this project, I wanted to mimic the moment of a sunset on the horizons of an ocean. I used four waves to create a different movement between the others. I also included stars slowly throughout to capture the day to night lapse. And to make it a little fun on the part of the sun, the stroke weights were in a random order so that it captures the movement of the disappearing sun. I had a lot of fun with this project, but I struggled a bit in the beginning with the details of the wave. But I think that the templates on the course page helped a lot with my other objects.