jennyzha-Project 06

sketch

// Jenny Zhang
// Section D
// jennyzha@andrew.cmu.edu
// Project 06

var eyeSize = 20;
var faceWidth = 100;
var faceHeight = 150;
var r = 100;
var b = 100;
var g = 100;
var e1 = 100;
var e2 = 100;
var e3 = 100;
var mouthSizeW = 5;
var mouthSizeH = 10;
var prevSec;
var millisRolloverTime;

function setup() {
    createCanvas(480, 480);
        millisRolloverTime = 0;
}

function draw() {
    background(255,250,200);

	// Fetch the current time
	var H = hour();
	var M = minute();
	var S = second();

	if (prevSec != S) {
        millisRolloverTime = millis();
    }
    prevSec = S;
    var mils = floor(millis() - millisRolloverTime);

    var hourBarWidth   = map(H, 0, 23, 0, width);
    var minuteBarWidth = map(M, 0, 59, 0, width);
    var secondBarWidth = map(S, 0, 59, 0, width);

    var secondsWithFraction   = S + (mils / 1000.0);
    var secondsWithNoFraction = S;
    var secondBarWidthChunky  = map(secondsWithNoFraction, 0, 60, 0, width);
    var secondBarWidthSmooth  = map(secondsWithFraction,   0, 60, 0, width);

    noStroke();
    fill(255, 200, 200);
    ellipse(width/2, height/2, hourBarWidth, hourBarWidth);
    var eyeLX = width/2 - hourBarWidth*0.25;
    var eyeRX = width/2 + hourBarWidth * 0.25;
    fill(0,90,150);
    ellipse(eyeLX, height/2, minuteBarWidth/3, minuteBarWidth/3);
    ellipse(eyeRX, height/2, minuteBarWidth/3, minuteBarWidth/3);
    fill(226,43,42);
    var mouth = width/2 
    ellipse(mouth, height-height/4, secondBarWidthChunky/3, secondBarWidthChunky/3)
} 

This project was inspired by our third project, the variable faces, where I made the head the hour, the eyes the minute, and the mouth a function of the seconds. I enjoyed going back to my previous project and reviewing, improving, and understanding my past code on a deeper level as I refined it into an abstract clock for this project.

Leave a Reply