var w_height=768;

var w_width=1024;

var RADIUS=8;

var MARGIN_TOP=60;

var MARGIN_LEFT=30;

const endtime=new Date(2016,7,25,11,20);

var curShowTimeSeconds = 0;

window.onload=function()

{

             var canvas=document.getElementById("canvas");

             var context=canvas.getContext("2d");

             canvas.height=w_height;

             canvas.width=w_width;

             curShowTimeSeconds =getCurrentShowTimeSeconds()

             render(context);

}

function render(cxt)

{

             var hours = parseInt( curShowTimeSeconds / 3600);

                var minutes = parseInt( (curShowTimeSeconds - hours * 3600)/60 )

                var seconds = curShowTimeSeconds % 60 ;

               renderDigit( MARGIN_LEFT , MARGIN_TOP , parseInt(hours/10) , cxt )

               renderDigit( MARGIN_LEFT + 15*(RADIUS+1) , MARGIN_TOP , parseInt(hours%10) , cxt )

               renderDigit( MARGIN_LEFT + 30*(RADIUS + 1) , MARGIN_TOP , 10 , cxt )

               renderDigit( MARGIN_LEFT + 39*(RADIUS+1) , MARGIN_TOP , parseInt(minutes/10) , cxt);

               renderDigit( MARGIN_LEFT + 54*(RADIUS+1) , MARGIN_TOP , parseInt(minutes%10) , cxt);

               renderDigit( MARGIN_LEFT + 69*(RADIUS+1) , MARGIN_TOP , 10 , cxt);

               renderDigit( MARGIN_LEFT + 78*(RADIUS+1) , MARGIN_TOP , parseInt(seconds/10) , cxt);

               renderDigit( MARGIN_LEFT + 93*(RADIUS+1) , MARGIN_TOP , parseInt(seconds%10) , cxt);

}

function getCurrentShowTimeSeconds(){

                var curTime = new Date();

                var ret = endTime.getTime() - curTime.getTime();

                ret = Math.round( ret/1000 )

                return ret >= 0 ? ret : 0;

}

function rendarDidit(x,y,num,cxt)

{

     cxt.fillStyle="#00f";

    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)

             {

                             cxt.beginPath();

                             cxt.arc(x+2*j*(RADIUS+1)+(RADIUS+1),y+2*i*(RADIUS+1)+(RADIUS+1),RADIUS,0,2*Math.PI);

                             cxt.closePath()；

                             cxt.fill()；

                }

        }

}