// メニュー
$(function() {
	$('.main_nav')
	.find('a').hover(
		function(){
			$(this).stop().animate({'opacity' : '0'}, 300);
		},
		function(){
			$(this).stop().animate({'opacity' : '1'}, 300);
		}
	);
});
// 時計
(function () {
	if(window.addEventListener) {
		window.addEventListener("load",init,false);
	} else if(window.attachEvent) {
		window.attachEvent("onload",init);
	}

	var g = new Object();

	function init(){
		var canvas = document.getElementById('canvas');
		g.ctx = canvas.getContext('2d');
		g.w = parseInt(canvas.width);
		g.h = parseInt(canvas.height);
		g.x = g.w / 2;
		g.y = g.h / 2;
		g.r = Math.min(g.x,g.y) * 0.9;
		g.img = new Image();
		g.img.src = "img/clock.png?" + new Date().getTime();
		g.img.onload = function() {
			setInterval(display, 1000);
		};
	}
	
	function display() {
		g.ctx.clearRect(0, 0, g.w, g.h);
		g.ctx.drawImage(g.img, 0, 0);
		var d = new Date();
		var h = d.getHours();
		var m = d.getMinutes();
		var s = d.getSeconds();
		if(h > 12) { h = h -12; }
		// 短針
		var angle1 = Math.PI * 2 * ( 3 - ( h + m / 60 )) / 12;
		var length1 = g.r * 0.7;
		var width1 = 3;
		var color1 = "#99ccff";
		drawhand(angle1, length1, width1, color1);
		// 長針
		var angle2 = Math.PI * 2 * ( 15 - ( m + s / 60 )) / 60;
		var length2 = g.r * 0.9;
		var width2 = 2;
		var color2 = "#99ccff";
		drawhand(angle2, length2, width2, color2);
		// 秒針
		var angle3 = Math.PI * 2 * ( 15 - s ) / 60;
		var length3 = g.r;
		var width3 = 1;
		var color3 = "#99ccff";
		drawhand(angle3, length3, width3, color3);
	}

	function drawhand(angle, len, width, color) {
		var x = g.x + len * Math.cos(angle);
		var y = g.y - len * Math.sin(angle);

		g.ctx.strokeStyle = color;
		g.ctx.lineWidth = width;
		g.ctx.lineCap = "round";
		g.ctx.beginPath();
		g.ctx.moveTo(g.x, g.y);
		g.ctx.lineTo(x, y);
		g.ctx.stroke();
	}
})();