# Project 06: Abstract Clock

``````//Alana Wu
//ID: alanawu
//Project 06 Abstract Clock

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

function draw()
{
//color of background changes by minute
fill (minute()*5, minute()*3 + 100, 255 - minute());
rect (0, 0, 400, 400);

//how many curves are drawn depends on hour
if (hour() > 0)
{
anenome (100, 240, 240, 10, 65);
}
if (hour() > 1)
{
anenome (200, 255, 230, 35, 53)
}
if (hour() > 2)
{
anenome (200, 0, 200, 17, 35);
}
if (hour() > 3)
{
anenome (255, 200, 230, 25, 5);
}
if (hour() > 4)
{
anenome (255, 100, 170, 30, 75);
}
if (hour() > 5)
{
anenome (100, 240, 240, 10, 65);
}
if (hour() > 6)
{
anenome (255, 255, 200, 15, 25);
}
if (hour() > 7)
{
anenome (200, 220, 50, 25, 40);
}
if (hour() > 8)
{
anenome (150, 100, 255, 10, 85);
}
if (hour() > 9)
{
anenome (0, 200, 255, 24, 30);
}
if (hour() > 10)
{
anenome (200, 180, 255, 8, 30);
}
if (hour() > 11)
{
anenome (255, 50, 50, 28, 92);
}

//draws 3 octopi, each of which display, hour, minute, or second
octopus(mouseX, mouseY - 25, minute());
octopus(mouseX + 30, mouseY + 25, second());
octopus(mouseX - 30, mouseY + 25, hour());

//while within the canvas, waves move down each second
waveRows(constrain (second()*25 + 50, 0, height+20));

}

//grid of waves
function waveRows (start)
{
red = 10;
green = 100;
blue = 255;
for (var h = start; h < height + 60; h +=50)
{
row3(h);
row4(h);
}
}

//horizontal row of 3 waves
function row3 (y)
{
for (var x = 85; x <= width; x += 125)
{
for (var i = 5; i > 0; i--)
{
strokeWeight (1);
fill (red, green, blue);
ellipse (x, y - 25, i*20, i*20);
red += 30;
green += 30;
}

red = 10;
green = 100;
}
}

//horizontal row of 4 waves
function row4 (y)
{
for (var x = 25; x <= width; x += 125)
{
for (var i = 5; i > 0; i--)
{
strokeWeight (1);
fill (red, green, blue);
ellipse (x, y, i*20, i*20);
red += 30;
green += 30;
}

red = 10;
green = 100;
}
}

//draws colorful wavy curve
function anenome (red, green, blue, length, tilt)
{
push();
translate (10, 350);
frameRate (6);
for (var n = 0; n < 10; n++)
{
for (var x = 0; x < length; x += .1)
{
noStroke();
fill (red, green, blue);
circle (x*20 + random (0,15), -25*cos(x) + random (0, 15), 13-x);

}
}
pop ();
}

//draws octopus w/ a color that changes by the minute
function octopus (x, y, time)
{
noStroke();
fill (minute()*10, 255 - minute(), 250);
ellipse (x, y, 50, 40);
for (var i = 0; i < 5; i++)
{
push();
translate (x, y);
ellipse (15 - i*6.8, 22, 10, 20);
pop();
}
fill (0);
ellipse (x - 12, y + 2, 8, 8);
ellipse (x + 12, y + 2, 8, 8);
noFill();
stroke(0);
arc (x, y+7, 8, 8, 0, PI, OPEN);
strokeWeight (1);
textSize (10);
text (time, x - 14, y - 6);

}

``````

In this project, the abstract waves change by second, the three octopi reflect the time, the number of colorful curves (I was originally thinking anemone, but it really didn’t translate and I liked these anyways) change by the hour, and the colors of the background and the octopi change as the time changes.