/*
	A cup of tea javascript library
*/

$(document).ready(function(){
	var x = 0;
	var y = 0;
	var maxX = 1;
	var maxY = 1;
	var animating = false;
	var currentPanelId = "#home";

	/* Hide all panels */
	$('.panel').each(function(index, page)	{
		$(page).hide();
	});
	
	/* Show the main menu */
	showPage(currentPanelId);
	syncMenuNav(currentPanelId);

	/* Handle hash in url */
	var hash = window.location.hash;
	if (hash)
		showPage(hash);

	/* Menu nav handle click */
	$('.menunav a').click(function(){
		var pageId = $(this).attr('href');
		showPage(pageId);
		return false;
	});
	
	/* Lang switcher */
	$('a.lang-switch').click(function(){
		var href = $(this).attr("href");
		window.location = href + currentPanelId;
		return false;
	});
	
	function getCoordForPage(pageId){
		var page = $(pageId);
		return [page.attr('x'), page.attr('y')];
	}
	
	function getPageByCoord(x, y){
		return $('.panel[x='+ x +'][y='+ y +']');
	}

	function showPage(pageId){
		$('.panel').hide();
		$(pageId).show();
		var coords = getCoordForPage(pageId);
		if (coords[0]  && coords[1] ) {
			x = parseInt(coords[0]);
			y = parseInt(coords[1]);		
		}
		syncMenuNav(pageId);
		currentPanelId = pageId;
		if (pageId === "#home") {
			$('footer .menunav').addClass("green");
		} else {
			$('footer .menunav').removeClass("green");
		}
	}

	function syncMenuNav(pageId) {
		$('.menunav a').removeClass('current');
		$('.menunav a[href='+ pageId + ']').addClass('current');
	}
	
	function switchToCoord(newX, newY, callback){
		/* Don't switch if no move */
		if ( (x == newX && y == newY) || animating )
			return;
		
		/* Calculate the main direction of animation */
		var directions=[];
		if (newX > x)
			directions = ["left", "right"];
		else if (newX < x)
			directions = ["right", "left"];
		else if (newY > y)
			directions = ["up", "down"];
		else if (newY < y)
			directions = ["down", "up"];

		/* Animate */
		animating = true;
		getPageByCoord(x, y).hide("slide", { direction: directions[0] });
		getPageByCoord(newX, newY).show( "slide", {direction: directions[1] }, function(){
			animating = false;
			if (callback)
				callback();
			currentPanelId = "#"+$(this).attr('id');
		});

		/* Set new position */
		x = newX;
		y = newY;
	}

	$(document).keydown(function(e){
		if ($("#home").is(":visible"))
			return false;

		var code = e.keyCode || e.which;
		var keyCodes = {
			left: 37,
			up: 38,
			right: 39,
			down: 40
		};
		var newX = x; 
		var newY = y;
		switch(code){
			case keyCodes.left:
				newX = x==0 ? 0 : x-1;
				break;
			case keyCodes.up:
				newY = y==0 ? 0 : y-1;
				break;
			case keyCodes.right:
				newX = x==maxX ? maxX: x+1;
				break;
			case keyCodes.down:
				newY = y==maxY ? maxY: y+1;
				break;
		}
		switchToCoord(newX, newY);
	});
	
	/* Synchronise menunav links on hover */
	$('.menunav a').mouseover(function(){
		var pageId = $(this).attr('href');
		$('a[href='+ pageId + ']').toggleClass('hover');
		$('.pad-nav li[panel='+ pageId +']').toggleClass('hover');
	}).mouseout(function(){
		var pageId = $(this).attr('href');
		$('a[href='+ pageId + ']').toggleClass('hover');
		$('.pad-nav li[panel='+ pageId +']').toggleClass('hover');
	});
	
	/* Bio toggle code */
	$('#bio .close').click(function(){
		$('#bio .content').animate({
			width: 0,
			height: 0,
			mode: 'hide'
		}, function(){
			$("#bio .close").hide();
			$("#bio .open").show();
		});
		return false;
	});
	$('#bio .open').click(function(){
		$('#bio .content').animate({
			width: 180,
			height: 420,
			mode: 'show'
		}, function(){
			$("#bio .close").show();
			$("#bio .open").hide();
		});
		return false;
	});
});