---

この一年時計のプログラム yclock.js は次の通りであるけれど、なぜ関数の中に関数を書いたのか、今では不明である（関数の参照を局所化したかったから？）。

---

	
$ cat yclock.js
window.onload = function() {
  draw();
};

function draw() {
    var canvas = document.getElementById("clockCanvas");
    var centerX = canvas.width / 2;
    var centerY = canvas.height / 2;
    var radius = Math.min(centerX, centerY) * 0.8;
    var cx = canvas.getContext("2d");

    var c = new Date();
    var cy = c.getYear();
    var cms = c.getTime();

    var s = new Date(cy + 1900, 0, 1);
    var sms = s.getTime();
    var e = new Date(cy + 1900 + 1, 0, 1);
    var ems = e.getTime();
    var unit = (ems - sms) / 12;

    function yclock() {
	canvas.width = canvas.width;

	cx.font = "bold 16px sans-serif";
	cx.textAlign = "center";
	//cx.fillStyle = "#8b0000";
	cx.fillStyle = "#0000ff";
	cx.fillText("Year clock", centerX, canvas.height);
	
	var c = new Date();
	var cms = c.getTime();
	var sangle = 2 * Math.PI * (cms - sms) / (ems - sms);

	var z = (cms - sms) % unit;
	var langle = 2 * Math.PI * z / unit;

	cx.beginPath();
	cx.lineWidth = 4;
	cx.arc(centerX, centerY, radius, 0, 2 * Math.PI, true);
	cx.stroke();

	cx.translate(centerX, centerY);
	cx.lineWidth = 8;

	cx.beginPath();
	cx.strokeStyle = "#0000ff";
	cx.rotate(sangle);
	cx.moveTo(0, 0);
	cx.lineTo(0, (-1) * radius * 0.55);
	cx.stroke();

	cx.beginPath();
	cx.rotate((-1) * sangle);
	cx.rotate(langle);
	cx.strokeStyle = "#00ff00";
	cx.moveTo(0, 0);
	cx.lineTo(0, (-1) * radius * 0.85);
	cx.stroke();
    };
    yclock();
    setInterval(yclock, 3600000); // 3600000ms = 1h
};
	
      

---