$(function() {
	var applyMenuEffect = function(titleSelector, submenuSelector) {
		var hover = false;
		var visible = false;
		var showSubmenu = function() {
			$(submenuSelector).show();
			setTimeout(function() {if (visible) $($(submenuSelector + " a").get(2)).addClass("submenu-display", 200);}, 100);
			setTimeout(function() {if (visible) $($(submenuSelector + " a").get(1)).addClass("submenu-display", 200);}, 200);
			setTimeout(function() {if (visible) $($(submenuSelector + " a").get(0)).addClass("submenu-display", 200);}, 300);
		};
		var hideSubmenu = function() {
			setTimeout(function() {if (!visible) $($(submenuSelector + " a").get(0)).removeClass("submenu-display", 200);}, 100);
			setTimeout(function() {if (!visible) $($(submenuSelector + " a").get(1)).removeClass("submenu-display", 200);}, 200);
			setTimeout(function() {if (!visible) $($(submenuSelector + " a").get(2)).removeClass("submenu-display", 200);}, 300);
			setTimeout(function() {if (!visible) $(submenuSelector).hide();}, 1000);
		};
		$(titleSelector).hover(
			function() {
				hover = true;
				if(!visible) {
					visible = true;
					showSubmenu();
				}
			}, 
			function() {
				hover = false;
				setTimeout(function() {
					if (!hover && visible) {
						visible = false;
						hideSubmenu();
					}
				}, 400);
			}
		);
		$(submenuSelector).hover(
			function() {
				hover = true;
			},
			function() {
				hover = false;
				setTimeout(function() {
					if (!hover && visible) {
						visible = false;
						hideSubmenu();
					}
				}, 400);
			}
		);
		$(submenuSelector).hide();
	};
	applyMenuEffect("#about-title", "#about-submenu");
	applyMenuEffect("#music-title", "#music-submenu");
	applyMenuEffect("#media-title", "#media-submenu");
	applyMenuEffect("#contact-title", "#contact-submenu");
	var applySubmenuEffect = function(submenuSelector) {
		$(submenuSelector + " a").hover(
			function() {
				$(this).addClass("submenu-hover", 200);
			},
			function() {
				$(this).removeClass("submenu-hover", 200);
			}
		);
	};
	applySubmenuEffect("#about-submenu");
	applySubmenuEffect("#music-submenu");
	applySubmenuEffect("#media-submenu");
	applySubmenuEffect("#contact-submenu");
	
	var circle = {
			fillStyle: "#CC9966",
			x: 865,
			y: 0,
			radius: 5
	};
	var draw = function() {
		$("#headerCanvas").clearCanvas().drawArc(circle);
	};
	draw();
	yCoords = [0, 1, 2, 4, 9, 16, 25, 36, 49, 49, 36, 25, 16, 9, 4, 2, 1, 0];
	var time = 0;
	var step = function() {
		if (time < 119) {
			circle.x = circle.x - 4;
			circle.y = yCoords[time%16]+5;
			draw();
			time++;
			setTimeout(step, 40);
		} else {
			circle.x = 386;
			circle.y = 44;
			draw();
			setTimeout(function() {circle.x = 385; circle.y = 47; draw();}, 40);
			setTimeout(function() {circle.x = 385; circle.y = 49; draw();}, 80);
			setTimeout(function() {circle.x = 385; circle.y = 50; draw();}, 120);
		}
	};
	step();
	$(".link").hover(function() {$(this).toggleClass("linkHover", 200);});
	$(".imgLink").hover(function() {$(this).toggleClass("imgLinkHover", 200);});
	$(".left-nav-bar-black").hover(function() {$(this).toggleClass("left-nav-bar-hover", 200);});
});