$(document).ready(function()
{

	// Set Vars, create hightlight image
	var $active = $('#linkContainer a[rel="on"]');
	var $highlight = $('#highlight');
	var $hlImg = $('<img src="/img/layout/highlight.png" id="highlight" />');
	var $hlW = $highlight.width();

	// get the sizing for each link
	linkSize();
	
	// set the highlight position and show it
	$highlight.animate({'left' : $active.attr('title')});
	$highlight.html($hlImg);

	// move highlight back to active link when mouse leaves nav
	$('#linkContainer').live('mouseleave', function()
	{
		$highlight.animate({'left' : $('#linkContainer a[rel="on"]').attr('title')}, 'fast');
		$active.fadeTo('fast', 1);
	});

	// bind all events so its possible to unbind during active transition
//	$('#linkContainer a').bind('mouseover', mouseover).bind('mouseout', mouseout).bind('click', click);
	$('#linkContainer a').bind('mouseover', mouseover).bind('mouseout', mouseout);

	function mouseover()
	{
		$highlight.animate({'left' : $(this).attr('title')}, 'fast');
		$(this).switchClass('off', 'over');
	}
	function mouseout()
	{
		$(this).switchClass('over', 'off');
	}
	function click()
	{
		$('#linkContainer a[rel="on"]').attr('rel', 'off');
		$(this).attr('rel', 'on');	
		$(this).unbind('mouseout', mouseout);
		$(this).unbind('mouseover', mouseover);

		$('a.active').switchClass('active', 'off', 'fast', function()
		{
			$(this).bind('mouseout', mouseout).bind('mouseover', mouseover);
		});

		$(this).switchClass('over', 'active', 'fast');		
	}
	function linkSize()
	{
		$('#linkContainer a').each(function()
		{
			var $p = $(this).position();
			var $w = $(this).width();
			var $pos = ($w / 2) - ($hlW / 2) + $p.left;
			$(this).attr('title', $pos);
		});
	}

	//update position when resize, but prfent from running while being dragged
	function resizeStuff() 
	{
		linkSize();
		$highlight.animate({'left' : $active.attr('title')});
	}	

	var TO = false;
	$(window).resize(function()
	{
		if(TO !== false)
		clearTimeout(TO);
		TO = setTimeout(resizeStuff, 200); //200 is time in miliseconds
	});
});

