var window_width = 1024;
var window_height = 768;
var r = 8;
var mt = 60;
var ml = 30;

const endTime = new Date(2014,12,20,15,23,56);
var currentTimeSeconds = 0

window.onload = function(){

? ?var canvas = document.getElementById('canvas');
? ?var context = canvas.getContext("2d");

? ?canvas.width = window_width;
? ?canvas.height = window_height;

? ?currentTimeSeconds = getCts()
? ?render(context)
}

function getCts(){
? ?var curTime = new Date();
? ?var ret = endTime.getTime() - curTime.getTime();
? ?ret = Math.round(ret/1000)

? ?return ret >= 0 ? ret :0;
}
function render(cxt){

? ?var hours = parseInt(currentTimeSeconds/3600);
? ?var minutes = parseInt((currentTimeSeconds-hours*3600)/60);
? ?var seconds = parseInt(currentTimeSeconds%60);

? ?renderDigit(ml,mt,parseInt(hours/10),cxt)
? ?renderDigit(ml+15*(r+1),mt,parseInt(hours%10),cxt)
? ?renderDigit(ml+30*(r+1),mt,10,cxt)
? ?renderDigit(ml+39*(r+1),mt,parseInt(minutes/10),cxt)
? ?renderDigit(ml+54*(r+1),mt,parseInt(minutes%10),cxt)
? ?renderDigit(ml+69*(r+1),mt,10,cxt)
? ?renderDigit(ml+78*(r+1),mt,parseInt(seconds/10),cxt)
? ?renderDigit(ml+93*(r+1),mt,parseInt(seconds%10),cxt)
}

function renderDigit(x,y,num,cxt){

? ?cxt.fillStyle = "blue";

? ?for(var i = 0 ; i < digit[num].length ; i++)
? ? ? ?for(var j = 0; j < digit[num].length ; j++)
? ? ? ? ? ?if(digit[num][i][j] == 1 ){
? ? ? ? ? ? ? ?cxt.beginPath();
? ? ? ? ? ? ? ?cxt.arc(x+j*2*(r+1)+(r+1),y+i*2*(r+1)+(r+1),r,0,2*Math.PI)
? ? ? ? ? ? ? ?cxt.closePath()

? ? ? ? ? ? ? ?cxt.fill()
? ? ? ? ? ?}

}
/**
* Created by Administrator on 14-12-16.
*/