```
/* Miranda Luong
Section E
mluong@andrew.cmu.edu
Project-06
*/
var prevSec;
var millisRolloverTime;
function setup() {
createCanvas(300, 300);
}
function draw() {
background(154,191,219);
// Fetch the current time
var H = hour();
var M = minute();
var S = second();
// Reckon the current millisecond,
// particularly if the second has rolled over.
// Note that this is more correct than using millis()%1000;
if (prevSec != S) {
millisRolloverTime = millis();
}
prevSec = S;
var mils = floor(millis() - millisRolloverTime);
// print current time next to corresponding colors
noStroke();
fill(0);
text("Hour: " + H, 30, 22);
text("Minute: " + M, 30, 42);
text("Second: " + S, 30, 62);
text("Millis: " + mils, 30, 82);
fill(0);
ellipse(15,18,12,12);
fill(255/3);
ellipse(15,38,12,12);
fill(255*(2/3));
ellipse(15,58,12,12);
fill(255);
ellipse(15,78,12,12);
//Hours
var hStart = 0 - HALF_PI //first arc always starts at 0
var hRadius = 100+(200/24) //first arc radius
//loop creates individual wedges, the number of wedges corresponding to current hour
for (var a = 0; a < H; a ++){
stroke(255);
fill(0);
//creates arc from point of 'start' to 'start' plus the 'i'th wedge
arc(50 + width / 2, 10 + height / 2, hRadius, hRadius, hStart, hStart + (TWO_PI/24), PIE);
//reassigns start with the addition of 'i'th wedge
hStart += (TWO_PI/24)
hRadius += (200/24)
}
//Minutes
var mStart = 0 - HALF_PI
var mRadius = 75+(200/60) //first arc radius
//loop creates individual wedges, the number of wedges corresponding to current minute
for (var a = 0; a < M; a ++){
fill(255/3);
stroke(255);
//creates arc from point of 'start' to 'start' plus the 'i'th wedge
arc(50 + width / 2, 10 + height / 2, mRadius, mRadius, mStart, mStart + (TWO_PI/60), PIE);
//reassigns start with the addition of 'i'th wedge
mStart += (TWO_PI/60)
//reassigns radius of next wedge to
mRadius += (200/60)
}
var sStart = 0 - HALF_PI
var sRadius = 25+(200/60) //first arc radius
//loop creates individual wedges, the number of wedges corresponding to number of values in array
for (var a = 0; a < S; a ++){
//loop generates shades of grey, value increasing in accordance to number of values in array
fill(255*(2/3));
stroke(255);
//creates arc from point of 'start' to 'start' plus the 'i'th wedge
arc(50 + width / 2, 10 + height / 2, sRadius, sRadius, sStart, sStart + (TWO_PI/60), PIE);
//reassigns start with the addition of 'i'th wedge
sStart += (TWO_PI/60)
sRadius += (200/60)
}
var msStart = 0 - HALF_PI
var msRadius = 0 //first arc radius
//loop creates individual wedges, the number of wedges corresponding to number of values in array
for (var a = 0; a < mils; a ++){
//loop generates shades of grey, value increasing in accordance to number of values in array
fill(255);
//creates arc from point of 'start' to 'start' plus the 'i'th wedge
arc(50 + width / 2, 10 + height / 2, msRadius, msRadius, msStart, msStart + (TWO_PI/1000), PIE);
//reassigns start with the addition of 'i'th wedge
msStart += (TWO_PI/1000)
msRadius += (200/1000)
}
}
```

This was a really fun project. I found it interesting thinking of a new way to display time. My project isn’t very abstract, in fact, I think it’s much more literal than a normal clock, seeing as it counts for every increase in every hour, minute and second of time. My code references the tally assignment we had to do the week prior, so it was a great way of implementing old knowledge.