Jinhee Lee; Project 06

jinheel1_project-06

//Jinhee Lee
//Section C
//jinheel1@andrew.cmu.edu
//Project-06

var theSunX = 0; //starting coordinates for the Sun/Moon at midnight
var theSunY = 200;
var theMoonX = 0;
var theMoonY = -200;

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

function draw() {
	var h = hour();
	var m = minute();
	var s = second();
	var daySecs = 86400; //# of seconds in a day
	var timeSecs = (h * 60 * 60 + m * 60 + s); //current time in seconds
	var theSun = 100; //size of theSun
	var theMoon = 100; //size of theMoon
	var skyDayCol = color(135,206,235); //sky color at day
	var skyNightCol = color(0); //sky color at night
	var gDayCol = color(222,184,135); //ground color at day
	var gNightCol = color(139,69,19); //ground color at night

	//various times of day in seconds
	var dawn = daySecs/5;
	var dusk = 4 * daySecs/5;
	var sunrise = 3 * daySecs/10;
	var sunset = 7 * daySecs/10;

	//for future lerpColor() functions
	var twilight1 = map(timeSecs,dawn,sunrise,0,1); //"amt" arguments for lerpColor
	var twilight2 = map(timeSecs,sunset,dusk,0,1);
	var cG1 = lerpColor(gNightCol,gDayCol,twilight1); //color changes during twilight
	var cG2 = lerpColor(gDayCol,gNightCol,twilight2);
	var cSky1 = lerpColor(skyNightCol,skyDayCol,twilight1);
	var cSky2 = lerpColor(skyDayCol,skyNightCol,twilight2);

	//sky
	if (timeSecs < dawn || timeSecs > dusk) { //between dawn and dusk
		background(skyNightCol);
	} else if (timeSecs > sunrise & timeSecs < sunset) { //between sunrise and sunset
		background(skyDayCol);
	} else if (timeSecs >= dawn & timeSecs <= sunrise) { //during 1st twilight
		background(cSky1);
	} else if (timeSecs >= sunset & timeSecs <= dusk) { //during 2nd twilight
		background(cSky2);
	}

	//rising/setting sun and moon
	push();
	translate(width/2,height/2);
	rotate(TWO_PI * timeSecs / daySecs);

	fill("yellow");
	ellipse(theSunX,theSunY,theSun,theSun);
	fill("white");
	ellipse(theMoonX,theMoonY,theMoon,theMoon);
	pop();

	//ground
	if (timeSecs < dawn || timeSecs > dusk) { //between dawn and dusk
		fill(gNightCol);
		rect(0,height/2,width,height/2);
	} else if (timeSecs > sunrise & timeSecs < sunset) { //between sunrise and sunset
		fill(gDayCol);
		rect(0,height/2,width,height/2);
	} else if (timeSecs >= dawn & timeSecs <= sunrise) { //during 1st twilight
		fill(cG1);
		rect(0,height/2,width,height/2);
	} else if (timeSecs >= sunset & timeSecs <= dusk) { //during 2nd twilight
		fill(cG2);
		rect(0,height/2,width,height/2);
	}
}

Coming up with the individual parts, such as defining certain times of day like dusk and dawn and determining arguments for lerpColor() functions, wasn’t difficult. However, implementing them to work in combination was a tougher task. In an attempt to piecemeal the process, I came up with various “if” statements detailing different periods of time during the day, and duplicating said “if” statements so I could use them for changing the ground and sky separately (otherwise there would have been a layering error where the Sun was “on top” of the ground instead of in the horizon).

I initially had an explicit time display, but after reading that conventional numerals were disallowed, I had to take it out. I didn’t want there to just be a black sky at night, so I also added a moon to take the place of the Sun at night. Though you’ll see both of them during the twilight times.