window.onload = function(){
    var s = Raphael('segmentus', 490, 200); 
    
    var NUMBERS = {
        0:[[6,4], [4,2], [6,4], [2,0], [6,0], [2,0]],
        1:[[6,4], [3,2], [4,7], [2,0], [4,2], [2,0]],
        2:[[6,4], [4,2], [4,4], [3,0], [7,0], [2,0]],
        3:[[6,4], [4,3], [7,0], [0,3], [7,2], [0,2]],
        4:[[6,4], [3,2], [7,0], [2,2], [4,2], [0,2]],
        5:[[6,4], [4,0], [6,0], [4,2], [4,2], [4,0]],
        6:[[6,4], [6,3], [7,0], [4,2], [6,2], [4,0]],
        7:[[6,4], [4,3], [7,2], [0,0], [4,2], [2,0]],
        8:[[6,2], [4,2], [0,2], [0,2], [2,2], [2,4]],
        9:[[2,0], [4,2], [4,0], [4,3], [4,7], [0,2]]
    };
    
    var frames = s.set();
    
    var digits = [];
    for(var i=0;i<4;i++){
        var dots = [];
        for (var j=0;j<6;j++){
            var pair = [];
            for(var k=0;k<2;k++){
                pair[k] = s.image("images/hand_.png", (Math.floor(i/2)*35) + (i*100) + ((j%2)*50), (Math.floor(j/2)*50), 100, 100);
                
                if(k==1){
                    switch(j){
                        case 0:frames.push(s.image('images/tl.png', 41 + (i*100) + (Math.floor(i/2)*35), 42, 8, 8));break;
                        case 1:frames.push(s.image('images/tr.png', 101 + (i*100) + (Math.floor(i/2)*35), 42, 8, 8));break;
                        case 4:frames.push(s.image('images/bl.png', 41 + (i*100) + (Math.floor(i/2)*35), 151, 8, 8));break;
                        case 5:frames.push(s.image('images/br.png', 101 + (i*100) + (Math.floor(i/2)*35), 151, 8, 8));break;
                        default:break;
                    }
                }
            }
            dots[j] = pair;
        }
        digits[i] = dots;
    }

    frames.attr({opacity:0.87});
    
    var setDigit= function (digit, number){
        if(digit.number!= number){
            digit.number = number;
            for(var i=0;i<6;i++){
                var dot = digit[i];
                for (var j=0;j<2;j++){
                    dot[j].animate({'rotation':45*NUMBERS[number][i][j]},350,">");
                }
            }
        }
    };
    
    var time = new Date();
    var baseTime = [time.getMinutes(),time.getSeconds()];
    
    setInterval(function(){
 
        setDigit(digits[0], parseInt(baseTime[0]/10));
        setDigit(digits[1], parseInt(baseTime[0]%10));
        setDigit(digits[2], parseInt(baseTime[1]/10));
        setDigit(digits[3], parseInt(baseTime[1]%10));
        
    
        baseTime[1] = (baseTime[1]+1)%60;
        if(baseTime[1]==0){baseTime[0] = (baseTime[0]+1)%60; }
    
    },1000);
    
    //this won't be wholly accurate, but still.
    
    
 
  var masks = s.set();
    masks.push(
        s.rect(6,42,36,116),
        s.rect(107,42,35,116),
        s.rect(206,42,72,116),
        s.rect(341,42,36,116),
        s.rect(441,42,38,116),
        s.rect(0,0,490,43)
        
    ).attr({fill:'#000','stroke-width':0, 'opacity':0.87});
    
    var bottomMask = s.rect(0,157,491,50).attr({fill:"90-#000-#333", opacity:0.9,'stroke-width':0});
    
     
    var colon = s.set();
    
    colon.push(
        s.circle(242, 85, 7),
        s.circle(242, 115, 7)        
    ).attr({stroke:'#999', 'stroke-width':2});
    
    s.safari();
};