Project 06 – Abstract Clock

// Emily Franco
// Section C
// efranco@andrew.cmu.edu
// Project-06
 

//twelve hr clock
var h;
var backColor;

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

    //convert hour to 12hr cycle
    if (hour()>12){
        h = hour()-12;
    }else if (hour==0){
        h = 12;
    }else {
        h = hour();
    }

    //set background to white if daytime and black for night time
    if(hour()>=5 & hour()<=19){
        backColor = color(215,218,219);
    }else {
        backColor = color("black");
    }

    background (backColor);
 }


function draw() { 
    //draw minutes
    minuteDots();
    //draw hours and seconds
    polyRotate ();
    
} 


//-----HOUR-----
//draw polygon for hour - num of vertices = hour
function polygon(x,y,rad,points){
    noFill();
    strokeWeight(0.5);
    var newX = 0;
    var newY = 0;

    //find angle increments
    var angle = 360/points;

    //if hour is 0 than shape is an ellipse
    if(h==0){
        ellipse(0,0,rad*2,rad);
    }else {
        //if house is more than 1, shape has same num of vertices
        beginShape();
        for(var i=0; i<360; i+=angle){
            newX = x + rad * cos(radians(i));
            newY = y + rad * sin(radians(i));
            vertex (newX, newY);
        }
        endShape(CLOSE);
    }
}


//-----SECOND-----
//draw rotating shape - each shape is a second
function polyRotate (){
    push();
    translate (width/2, height/2);
    var angleIncrement = 6; 

    //map to 180 not 360 since shape has 2 sides
    var secMap = map(second(),0,60,0,360);
    for(var a=0; a<=secMap; a=a+angleIncrement){
        //marking poly - light blue
        //drawing "delay"
        if(a>0){
            push();
            rotate(radians(a-angleIncrement));
            stroke(12,222,245);
            polygon(0,0,100,h);
            pop(); 
        }

        //tracking poly - magenta
        push();
        rotate(radians(a));
        strokeWeight(1);
        stroke(255,13,223);
        polygon(0,0,100,h); 
        pop();
    }
    pop();
    //restart seconds
    if(second()==59){
        background(backColor);
    }
}


//-----MINUTE-----
//draw dot in line for every minute
function minuteDots(){
    push();
    translate (width/2, 0);

    //map minutes to height of minutes bar
    var minuteHeights = map(minute(),0,60,20,height-20);

    //draw dots
    for (var d=20; d<=minuteHeights; d= d +height/60){
        strokeWeight(4);

        //marking poly - yellow
        //drawing "delay"
        if(d>20){
            stroke(237,204,14);
            point(0,d-height/60); 
        }
        
        //tracking poly - magenta
        stroke(255,13,223);
        point(0,d); 
        
    }
    pop();

    //restart minutes
    if(minute()>=60){
        background(backColor);
    }
}