Project_06_abstract clock

	// Huijun Shen  session D
    // huijuns@andrew.cmu.edu

var x  ;
var y  ;
var mx ;
var my ;
var hx ;
var hy ;
var bigR = 200 ;
var mbigR = 100;
var hbigR = 50 ;
var size = 10 ;
var theta = 0;
var theta2 = 30;
var theta3 = 60;
var traceX = [];
var traceY = [];





 
function setup() {
    createCanvas(480,480);
    background(180);  
    frameRate(1) ;
}


function draw() {
    background(180);
   

    push();
    translate(240,240);
    fill(0);
    circle(0,0,3);

    fill(150,50,30);  // for the hour circle
    hx = hbigR * cos(radians(theta3));
    hy = hbigR * sin(radians(theta3));
    circle ( hx,hy,30);

    theta3 += 360/60/60;

    fill(240,100,80); // for the minutes circle
    mx = mbigR * cos(radians(theta2));
    my = mbigR * sin(radians(theta2));
    circle(mx,my,20);

    theta2 += 360/60/60;

    print("m"+ theta2);



    
    noStroke();
    fill(240,144,105);  //for the second circle
    x = bigR * cos(radians(theta));
    y = bigR * sin(radians(theta));
    circle(x,y,size);

    theta += 360/60;

    if(bigR <= 200){  // the radius is shortening when time passes
        bigR = bigR - 200/59;
    }
    if(bigR<=0){
        bigR = 200;
    }

    //print(bigR);

    traceX.push(x);  // the doc after the second circle
    traceY.push(y);
    for(var i =0; i < traceX.length; i++ ){
        fill(120,100,30);

        circle(traceX[i],traceY[i],3);    
        


    }

    if (traceX.length > 20){ // the length of the docs
        traceX.shift();
        traceY.shift();
    }


    pop();

    
}