描述的清楚吗?

彩色小球一闪就没了 ,没有运动 ,  时间在变, 变一次闪过一次小球. 代码如下.

/**
 * Created by WILL on 15/3/13.
 */
var WINDOW_WIDTH = 1024;
var WINDOW_HEIGHT = 768;
var RADIUS = 8;
var MARGIN_TOP = 60;
var MARGIN_LEFT = 30;
var pi = Math.PI;
const endTime = new Date(2015,2,18,18,47,52);
var curShowTimeSeconds = 0;
var balls = [];

const colors = ["#33B5E5","#0099CC","#AA66CC","#9933CC","#99CC00","#669900","#FFBB33","#FF8800","#FF4444","#CC0000"];
window.onload = function (){
    var canvas = document.getElementById('canvas');
    canvas.width = WINDOW_WIDTH;
    canvas.height = WINDOW_HEIGHT;
    var context = canvas.getContext('2d');
    curShowTimeSeconds = getCurrentShowTimeSecond();
    setInterval(function(){
        render(context);
        update();
    },
        50
    );
};
function update(){
    var nextShowTimeSeconds = getCurrentShowTimeSecond();
    var nextHours = parseInt(nextShowTimeSeconds/3600),
        nextMinutes = parseInt((nextShowTimeSeconds-nextHours*3600)/60),
        nextSeconds = nextShowTimeSeconds%60;
    var hours = parseInt(curShowTimeSeconds/3600),
        minutes = parseInt((curShowTimeSeconds-hours*3600)/60),
        seconds = curShowTimeSeconds%60;
    if(nextSeconds != seconds){
        if( parseInt(hours/10) != parseInt(nextHours/10) ){
            addBalls( MARGIN_LEFT + 0 , MARGIN_TOP , parseInt(hours/10) );
        }
        if( parseInt(hours%10) != parseInt(nextHours%10) ){
            addBalls( MARGIN_LEFT + 15*(RADIUS+1) , MARGIN_TOP , parseInt(hours/10) );
        }
        if( parseInt(minutes/10) != parseInt(nextMinutes/10) ){
            addBalls( MARGIN_LEFT + 39*(RADIUS+1) , MARGIN_TOP , parseInt(minutes/10) );
        }
        if( parseInt(minutes%10) != parseInt(nextMinutes%10) ){
            addBalls( MARGIN_LEFT + 54*(RADIUS+1) , MARGIN_TOP , parseInt(minutes%10) );
        }
        if( parseInt(seconds/10) != parseInt(nextSeconds/10) ){
            addBalls( MARGIN_LEFT + 78*(RADIUS+1) , MARGIN_TOP , parseInt(seconds/10) );
        }
        if( parseInt(seconds%10) != parseInt(nextSeconds%10) ){
            addBalls( MARGIN_LEFT + 93*(RADIUS+1) , MARGIN_TOP , parseInt(nextSeconds%10) );
        }
        curShowTimeSeconds = nextShowTimeSeconds;
    }
    updateBalls();
}
function updateBalls(){
    for(var i=0 ; i<balls.length ; i++){
        balls[i].x += balls[i].vx;
        balls[i].y += balls[i].vy;
        balls[i].vy += balls[i].g;
        if(balls[i].y >= WINDOW_HEIGHT-RADIUS){
            balls[i].y = WINDOW_HEIGHT-RADIUS;
            balls[i].vy = -balls[i].vy*0.75;
        }
    }
}
function addBalls(x,y,num){
    for( var i=0 ; i<digit[num].length ; i++)
        for( var j=0 ; j<digit[num][i].length ; j++)
            if(digit[num][i][j] == 1){
                var aBall = {
                    x:x+j*2*(RADIUS +1)+(RADIUS+1),
                    y:y+i*2*(RADIUS +1)+(RADIUS+1),
                    r:1.5+Math.random(),
                    vx:Math.pow(-1,Math.ceil(Math.random()*1000))*4,
                    vy:-5,
                    color:colors[Math.floor(Math.random()*colors.length)]
                };
                balls.push(aBall);
            }
}
function getCurrentShowTimeSecond(){
    var curTime = new Date();
    var ret = endTime.getTime()-curTime.getTime();
    ret = Math.round(ret/1000);
    return ret>=0 ? ret : 0;
}
function render(c){
    c.clearRect(0,0,WINDOW_WIDTH,WINDOW_HEIGHT);
    var hours = parseInt(curShowTimeSeconds/3600),
        minutes = parseInt((curShowTimeSeconds-hours*3600)/60),
        seconds = curShowTimeSeconds%60;
    renderDigit(MARGIN_LEFT,MARGIN_TOP,parseInt(hours/10),c);
    renderDigit(MARGIN_LEFT+15*(RADIUS+1),MARGIN_TOP,parseInt(hours%10),c);
    renderDigit(MARGIN_LEFT+30*(RADIUS+1),MARGIN_TOP,10,c);
    renderDigit(MARGIN_LEFT+39*(RADIUS+1),MARGIN_TOP,parseInt(minutes/10),c);
    renderDigit(MARGIN_LEFT+54*(RADIUS+1),MARGIN_TOP,parseInt(minutes%10),c);
    renderDigit(MARGIN_LEFT+69*(RADIUS+1),MARGIN_TOP,10,c);
    renderDigit(MARGIN_LEFT+78*(RADIUS+1),MARGIN_TOP,parseInt(seconds/10),c);
    renderDigit(MARGIN_LEFT+93*(RADIUS+1),MARGIN_TOP,parseInt(seconds%10),c);

    for( var i = 0 ; i < balls.length ; i ++ ){
        c.fillStyle=balls[i].color;
        c.beginPath();
        c.arc( balls[i].x , balls[i].y , RADIUS , 0 , 2*Math.PI , true );
        c.closePath();
        c.fill();
    }
}
function renderDigit(x,y,num,c){
    c.fillStyle = "rgb(0,102,153)";
//    c.fillStyle = "red";
    for(var i=0;i<digit[num].length;i++){
        for(var j=0;j<digit[num][i].length;j++){
            if(digit[num][i][j] == 1){
                c.beginPath();
                c.arc(x+j*2*(RADIUS+1)+(RADIUS+1),y+i*2*(RADIUS+1)+(RADIUS+1),RADIUS,0,2*pi);
                c.closePath();
                c.fill();
            }
        }
    }
}