window.onload = function () {
	var draw = document.getElementById('draw'),
		ctx,
		xClock,
		yClock,
		rClock;

	ctx = getCtx(draw);
	if (ctx === null) return;

	setSize(draw);

	xClock = draw.width / 2;
	yClock = draw.height / 2;
	rClock = xClock < yClock ? 0.7 * xClock : 0.7 * yClock;

	drawClock(ctx, xClock, yClock, rClock);

	setInterval(function () {
		ctx.clearRect(0, 0, draw.width, draw.height);
		drawClock(ctx, xClock, yClock, rClock);
	}, 1000);

}

function getCtx (canvas) {
	if (!canvas.getContext) {
		console.error('Your browser does not support the HTML5 <canvas>.');
		return null;
	}

	return canvas.getContext('2d');
}

function setSize (canvas) {
	canvas.width = document.body.clientWidth;
	canvas.height = document.body.clientHeight;
}

function drawClock (ctx, x, y, r) {
	var numbersAngle = 2 * Math.PI / 12,
		hourAngle = numbersAngle,
		minAngle = 2 * Math.PI / 60,
		date = new Date();

	ctx.beginPath();
	// draw outer circle
	ctx.arc(x, y, r, 0, 2 * Math.PI, false);

	// draw inner circle
	ctx.moveTo(x + r - 5, y);
	ctx.arc(x, y, r - 5, 0, 2 * Math.PI, false);

	ctx.save();

	// translate to center
	ctx.translate(x, y);

	// draw seconds hand
	ctx.save();
	ctx.rotate(minAngle * date.getSeconds());
	ctx.moveTo(0, 0);
	ctx.lineTo(0, - r + 15);
	ctx.restore();

	// draw minute hand
	ctx.save();
	ctx.rotate(minAngle * date.getMinutes());
	ctx.moveTo(0, 0);
	ctx.lineTo(0, - r + 15);
	ctx.restore();

	// draw hour hand
	ctx.save();
	ctx.rotate(hourAngle * date.getHours());
	ctx.moveTo(0, 0);
	ctx.lineTo(0, - r + 65);
	ctx.restore();

	// stroke the path
	ctx.stroke();

	// draw numbers
	ctx.font = 'bold 14px Arial';
	ctx.textAlign = 'center';
	ctx.textBaseline = 'middle';

	ctx.save();
	ctx.rotate(numbersAngle);
	for (i = 1; i <= 12; i++) {
		ctx.fillText(i, 0, - r + 20);
		ctx.rotate(numbersAngle);
	}
	ctx.restore();

	ctx.restore();
}

@@ -997,104 +997,8 @@
 );%0A%0A
-%09// draw inner circle%0A%09ctx.moveTo(x + r - 5, y);%0A%09ctx.arc(x, y, r - 5, 0, 2 * Math.PI, false);%0A%0A
 %09ctx
@@ -1139,32 +1139,33 @@
 %0A%09ctx.moveTo(0, 
+2
 0);%0A%09ctx.lineTo(
@@ -1165,34 +1165,34 @@
 lineTo(0, - r + 
-15
+30
 );%0A%09ctx.restore(
@@ -1279,32 +1279,33 @@
 %0A%09ctx.moveTo(0, 
+2
 0);%0A%09ctx.lineTo(
@@ -1317,10 +1317,10 @@
 r + 
-15
+30
 );%0A%09
@@ -1424,16 +1424,17 @@
 veTo(0, 
+2
 0);%0A%09ctx
@@ -1454,10 +1454,11 @@
 r + 
-65
+100
 );%0A%09
@@ -1493,16 +1493,36 @@
 he path%0A
+%09ctx.lineWidth = 5;%0A
 %09ctx.str

Add style