mreyes-project-06

mreyes-06

//Mercedes Reys

//Section C 

//mreyes@andrew.cmu.edu

//Project-06


var m;
var s;
var h;

var dSM = 360/60;//to devide minutes and seconds into 60 points on circle 

function setup() {
    background(255);//draw second backgrond for shodow/ghost effect
    
    createCanvas(400, 400);

}

function draw() {
     
    background(190, 136, 252,50)// draw tranparent backgrond for shodow/ghost effect
    angleMode(DEGREES)

    //time varibales
    m = minute();
    s = second();
    h = hour();

    var cx = 0;//center x cordinate 
    var cy = 0;//center y cordinate   

    //seconds variables
    var sRadius = width/3; // orbit of seconds circle
    var sx = cos(dSM*s)*sRadius;//x cordinate of circle center
    var sy = sin(dSM*s)*sRadius;//y cordinate of circle center 
    
    // minutes variables
    var mRadius = sRadius+35//orbit 
    var mx = cos(dSM*m)*mRadius;//x
    var my = sin(dSM*m)*mRadius;//y

    push()
    translate(width/2,height/2);
    rotate(90);//start at bottom 
    noStroke();
    
    //seconds ellipse
    var b = map(s, 0,60, 0, 255);
    var g = map(s,0,60,0,255);
    fill(0,g,b,50)//fade from black to cyan in tune with seconds passing by 
    ellipse(sx+cx,sy+cy,5,5);

    //hours ellipse
    var b = map(h, 0,24, 0, 255);
    fill(255,255,b);//fade from yellow to white in tune with hours passing by 
    ellipse(cx,cy,h*10,h*10);//grow larger as hours go by 

    //minutes ellipse
    var g = map(m, 0,60, 0, 255);//fade from magenta to white
    noStroke();
    fill(255,g,255);
    ellipse((-mx)+cx,(-my)+cy,m,m);//negative cordinates to start at top rather than bottom
    pop();

    
 
} 

for this I just tied to incorporate the functions we were using to make the clock assignment to make shires that orbit and grow depending on the time. Here is the sketch.