var window_width=1024;
var window_height=768;
var radius=8;
var margin_top=60;
var margin_left=30;
const endTime= new Date(2016,3,18,15,47,32);
var curShowTimeSeconds=0;
window.onload=function(){
?? ?var canvas=document.getElementById("canvas");
?? ?var context=canvas.getContext("2d");
?? ?canvas.width=window_width;
?? ?canvas.height=window_height;
?? ?curShowTimeSeconds=getCurrentShowTimeSeconds();
?? ?render(context);
}
function getCurrentShowTimeSeconds(){
?? ?var curTime=new Date();
?? ?var ret=endTime.getTime()-curTime.getTime();
?? ?ret= Math.round(ret/1000);
?? ?return ret>=0?ret:0;
}
function render(cxt){
?? ?var hour=parseInt(curShowTimeSeconds/3600);
?? ?var minutes=parseInt((curShowTimeSeconds-hour*3600)/60);
?? ?var seconds=curShowTimeSeconds%60;
?? ?renderDigit(margin_left,margin_top,parseInt(hour/10),cxt);
?? ?renderDigit(margin_left+15*(radius+1),margin_top,parseInt(hour%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 renderDigit(x,y,num,cxt){
?? ?cxt.fillStyle="rgb(0,102,153)";
?? ?for(var i=0;i<digit[num].length;i++){
?? ??? ?for(var j=0;j<digit[num][i].length;j++){
?? ??? ??? ?if(digit[i][j]==1){
?? ??? ??? ??? ?cxt.beginPath();
?? ??? ??? ??? ?cxt.arc(x+j*2*(radius+1)+(radius+1),y+i*2*(radius+1)+(radius+1),radius,0,2*Math.PI);
?? ??? ??? ??? ?cxt.closePath();
?? ??? ??? ??? ?cxt.fill();
?? ??? ??? ?}
?? ??? ?}
?? ?}
}