$(document).ready(function(){
	ChangeLayout("OpeningIndex");
	var MainContentAreaScrolling = "Stop";
	var MainContentAreaTitlePositionList;
	var LeftMenuCurrentHighLight;
	
	$(".MenuSelection").mouseover(function(){
		var index = $(".MenuSelection").index(this);
		for(var i = 0, left = 0; i < index; i++ ){
			left += $($(".MenuSelection").get(i)).width() + 22;
		}
		left += ($($(".MenuSelection").get(index)).width() / 2);
		$("#MenuArrow").stop().animate({"left":(694 + left)});
	});
	
	$("img.Hover").hover(
		function(){
			$(this).attr("src", $(this).attr("src").replace(".png", "-O.png"));
		},
		function(){
			$(this).attr("src", $(this).attr("src").replace("-O.", "."));
		}
	);
	
	$("#ScrollBar").draggable({
		revert:			true,
		axis:			'y',
		containment:	'parent',
		start:	function(event, ui){
			MainContentAreaScrolling = "+=0px";
			ScrollMainContentArea();
		},
		drag:	function(event, ui){
			MainContentAreaScrolling = "+=" + ((120 - ui.position.top) / 2) + "px";
		},
		stop:	function(event, ui){
			MainContentAreaScrolling = "Stop";
		}
	})
	
	$("#ScrollBar img").hover(
		function(){
			if($(this).attr("src").indexOf("-O") == -1){
				$(this).attr("src", $(this).attr("src").replace(".png", "-O.png"));
			}
		},
		function(){
			$(this).attr("src", $(this).attr("src").replace("-O.", "."));
		}
	);
	
	function ChangeLeftMenuHighLightItem(){
		var currentPosition = $("#MainContentAreaContent").position().top * -1;
		var index;
		for(index = 0; index < MainContentAreaTitlePositionList.length; index++ ){
			if(MainContentAreaTitlePositionList[index] >= currentPosition){
				break;
			}
		}
		if(index == 0){
			index++;
		}
		LeftMenuCurrentHighLight = index - 1;
		var $Item = $("#LeftMenu .Selectable").eq(LeftMenuCurrentHighLight);
		var $ItemImage = $Item.children("img");
		if($ItemImage.attr("src").indexOf("-O") == -1){
			$PrevItem = $Item.prev().children("img");
			if($PrevItem.length != 0){
				$PrevItem.attr("src", $PrevItem.attr("src").replace("-O.", "."));
			}
			$NextItem = $Item.next().children("img");
			if($NextItem.length != 0){
				$NextItem.attr("src", $NextItem.attr("src").replace("-O.", "."));
			}
			$ItemImage.attr("src", $ItemImage.attr("src").replace(".png", "-O.png"));
		}
	}
	
	function ScrollMainContentArea(){
		ChangeLeftMenuHighLightItem();
		var offset = parseInt(MainContentAreaScrolling.replace("+=", "").replace("px", ""), 10);
		if(MainContentAreaScrolling == "Stop"){
			return false;
		}
		if(parseInt($("#MainContentAreaContent").css("top"), 10) + offset > 0){
			MainContentAreaScrolling = "15px";
		}
		if($("#MainContentArea").height() - $("#MainContentAreaContent").height() > parseInt($("#MainContentAreaContent").css("top"), 10) + offset ){
			MainContentAreaScrolling = ($("#MainContentArea").height() - $("#MainContentAreaContent").height()) + "px";
		}
		$("#MainContentAreaContent").animate({"top": MainContentAreaScrolling}, 50, "linear", ScrollMainContentArea);
	}
	
	function ChangeLayout(state){
		if(state == "OpeningIndex"){
			$("#HeadMenu").animate({"top": "-70px"});
			$("#LeftMenu").animate({"left": "-200px"});
			$("#ScrollBarArea").animate({"top": "-400px"});
			$("#MainContentArea").animate({"left": "1940px"});
			$("#Footer").animate({"bottom": "-100px"});
			$("#LeftBorder").fadeOut();
			$("#RightBorder").fadeOut();
			$("#TopBorder").fadeOut();
			$("#BottomBorder").fadeOut();
			$("#OpeningIndex").animate({"top": "0px"});
		}
		else if(state == "MainPage"){
			$("#OpeningIndex").animate({"top": -1 * ($("#TitleFlash").height() + $("#MenuArea").height())});
			$("#LeftBorder").fadeIn();
			$("#RightBorder").fadeIn();
			$("#TopBorder").fadeIn();
			$("#BottomBorder").fadeIn();
			$("#HeadMenu").animate({"top": "37px"});
			$("#LeftMenu").animate({"left": "310px"});
			$("#ScrollBarArea").animate({"top": "100px"});
			$("#MainContentArea").animate({"left": "538px"});
			$("#Footer").animate({"bottom": "0px"});
		}
	}
	
	function InitLeftMenuDrawer(){
		if($("#LeftMenu .DrawerHeader").length != 0){
			$("#LeftMenu .DrawerContent").not("#LeftMenu .DrawerContent:eq(0)").slideUp();
			$("#LeftMenu .DrawerHeader").click(function(){
				$("#LeftMenu .DrawerContent").slideUp();
				$(this).next("#LeftMenu .DrawerContent").slideDown();
			});
		}
	}
	
	$(".InterLink").click(function(){
		var clickLink = $(this).attr("alt");
		if(clickLink == "index"){
			ChangeLayout("OpeningIndex");
		}
		else{
			ChangeLayout("MainPage");
			$("#LeftMenu").slideUp(500,function(){
				$("#LeftMenu").html("");
				LeftMenuCurrentHighLight = 0;
				$.get(
					"subPage/" + clickLink + "Menu.html",
					function(data){
						$("#LeftMenu").html(data);
						$("#LeftMenu").slideDown(500, function(){
							$("#LeftMenu div img").hover(
								function(){
									if($(this).attr("src").indexOf("-O") == -1){
										$(this).attr("src", $(this).attr("src").replace(".png", "-O.png"));
									}
								},
								function(){
									$(this).not("#LeftMenu .Selectable:eq(" + LeftMenuCurrentHighLight + ") img").attr("src", $(this).attr("src").replace("-O.", "."));
								}
							);
							$("#LeftMenu .Selectable").click(function(){
								topPosition = $("#" + $(this).attr("name"), $("#MainContentAreaContent")).position().top;
								$("#MainContentAreaContent").animate({"top": (topPosition * -1) - 1}, 300, "linear", function(){
									$("#LeftMenu .Selectable").each(function(){
										$(this).children("img").attr("src", $(this).children("img").attr("src").replace("-O.", "."));
									});
									ChangeLeftMenuHighLightItem();
								});
							});
						});
						InitLeftMenuDrawer();
					}
				);
			});
			$("#MainContentArea").fadeOut(500,function(){
				$("#MainContentAreaContent").html("");
				$("#MainContentAreaContent").css({"top":"0px"});
				$.get(
					"subPage/" + clickLink + ".html",
					function(data){
						$("#MainContentAreaContent").html(data);
						$("#MainContentArea").fadeIn(500);
						MainContentAreaTitlePositionList = new Array();
						$("#MainContentAreaContent").children("h1.selectablePoint").each(function(){
							MainContentAreaTitlePositionList.push($(this).position().top);
						});
					}
				);
			});
		}
	});
});