Project 3 – Dynamic Drawing

// Yoo Jin Kim
// 15104 - section D
// yoojink1@andrew.cmu.edu
// Project-03

var wavy = 10;
var toggle = 0;
var bird = 255;

function setup() {
    createCanvas(450, 600);
}

function draw() {
	//background - color changes from light blue to light purple as y-axis changes
	background(212 + mouseY / 50, 235 - mouseY / 53, 242 - mouseY / 49);

	//sun - size changes as y-axis changes 
	stroke(255);
	fill('#FFB7B2');
	ellipse(225, 418, min((mouseY), 260));

	//waves - position shift as y-axis changes 
	fill(255);
    var points = 5;
    var wav = wavy + mouseX / (width * 20);
    var step = mouseY / height * 100;

    beginShape();
    vertex(0, height);
    vertex(0, height / 1.5  + step);
    curveVertex(0, height / 1.5  + step);
    curveVertex(width / points, height / 1.5 + wav + step);
    curveVertex(2 * width / points, height / 1.5  - wav + step);
    curveVertex(3 * width / points, height / 1.5  + wav + step);
    curveVertex(4 * width / points, height / 1.5  - wav + step);
    curveVertex(5 * width / points, height / 1.5  + step);
    vertex(5 * width / points, height / 2 + step);
    vertex(width, height);
    vertex(0, height);
    vertex(0, height);
    endShape(CLOSE);

    //toggle when waves get high
    if (wav >= 15) {
    	toggle = 0;
    } else if (wav <= -15) {
    	toggle = 1;
    }

    //wave movement correction
    if (toggle == 0) {
    	wavy = wavy - 0.3;
    } else if (toggle == 1) {
    	wavy = wavy + 0.3;
    }

	//top right cloud - position shift as y-asis changes
	push();
	fill(255, 255, 255, 110);
	ellipse(440 - mouseY / 10, 320, (constrain(mouseY, 120, 320)), 25);
	pop();

	//bottom left cloud - position shift as y-axis changes
	fill(255, 255, 255, 100);
	ellipse(mouseY / 5.5, 370,(constrain(mouseY, 100, 340)), 20);

	//birds' right wings - birds move along with the mouse
	noStroke();
	fill(bird);
	arc(mouseX, mouseY, 20, 4, 0, PI + QUARTER_PI, PIE);
	arc(mouseX + 15, mouseY + 13, 20, 4, 0, PI + QUARTER_PI, PIE);
	arc(mouseX + 25, mouseY + 7, 20, 4, 0, PI + QUARTER_PI, PIE);
	arc(mouseX + 65, mouseY + 9, 20, 4, 0, PI + QUARTER_PI, PIE);
	arc(mouseX + 145, mouseY + 30, 20, 4, 0, PI + QUARTER_PI, PIE);

	//birds' left wings - birds move along with the mouse
	ellipse(mouseX - 4, mouseY - 3, 3, 10);
	ellipse(mouseX + 12, mouseY + 9, 3, 10);
	ellipse(mouseX + 22, mouseY + 3, 3, 10);
	ellipse(mouseX + 62, mouseY + 5, 3, 10);	
	ellipse(mouseX + 142, mouseY + 26, 3, 10);	

	//when the white birds go below the water, birds color changes to gray
	if (mouseY > 500) {
		bird = 205; 
	} else {
		bird = 255;
	}
}