var currentItem;
var scrollPrecision = 10000;

 $(document).ready(
	 function()
	 {
		$("#productBrowser_line_menu")[0].style.top = '0px';
		$("#productBrowser_line_menu")[0].style.position = 'relative';

		$("#productBrowser_line_menu_clip").mousemove
		(
			function(event)
			{
				//var mx = event.pageX - this.offsetLeft;
				var my = event.pageY - this.offsetTop;
				var fullHeight 		= $("#productBrowser_line_menu").innerHeight();
				var scrollHeight 	= $(this).innerHeight();
				var overflow 		= fullHeight - (scrollHeight + 10);
				var percent 		= Math.round((my / scrollHeight) * scrollPrecision) / scrollPrecision;
				//$("#status").html(event.pageX +', '+ event.pageY);

				if(fullHeight > scrollHeight)
				{
					$("#productBrowser_line_menu")[0].style.top = -(percent * overflow) + 'px';
					//$("#status").html($("#productBrowser_line_menu")[0].style.color);
					//console.log($("#productBrowser_line > ul")[0].style.top);
				}
			}
		)

		$("#productBrowser_products_menu")[0].style.top = '0px';
		$("#productBrowser_products_menu")[0].style.position = 'relative';

		$("#productBrowser_products_menu_clip").mousemove
		(
			function(event)
			{
				//var mx = event.pageX - this.offsetLeft;
				var my = event.pageY - this.offsetTop;
				var fullHeight 		= $("#productBrowser_products_menu").innerHeight();
				var scrollHeight 	= $(this).innerHeight();
				var overflow 		= fullHeight - (scrollHeight + 10);
				var percent 		= Math.round((my / scrollHeight) * scrollPrecision) / scrollPrecision;
				//$("#status").html(event.pageX +', '+ event.pageY);

				if(fullHeight > scrollHeight)
				{
					$("#productBrowser_products_menu")[0].style.top = -(percent * overflow) + 'px';
					//$("#status").html($("#productBrowser_line_menu")[0].style.color);
					//console.log($("#productBrowser_line > ul")[0].style.top);
				}
			}
		)


		$("#productBrowser_back").click
		(
			function(event)
			{
				if(currentItem)
				{
					//alert(currentItem);
					var prev = currentItem.prev();
					if(prev.size() > 0)
					{
						handleProductClick(prev.children("a"));

					}
				}

				//Capture and stop anchor click.
				event.preventDefault();
			}
		)

		$("#productBrowser_next").click
		(
			function(event)
			{
				if(currentItem)
				{
					var next = currentItem.next();
					if(next.size() > 0)
					{
						handleProductClick(next.children("a"));

					}
				}

				//Capture and stop anchor click.
				event.preventDefault();
			}
		)

		$("#productBrowser_line_menu > li > a").click
		(
			function(event)
			{
				//Display Setup
				$("#productBrowser_line_menu > li > a").removeClass('selected');
				$(this).addClass('selected');
				$("#productBrowser_products_menu")[0].style.top = '0px';
			  	$("#productBrowser_products > ul > li").remove();

				//Ajax
			  	$.getJSON('/category/json/'+$(this).attr("cat_id"),handleProductsData);


				//Capture and stop anchor click.
				event.preventDefault();
			}
		);

		$('a.selected').click();
	 }
 );

function handleProductClick(object)
{
	currentItem = object.parent();

	data = jQuery.data( object.parent()[0] ,'productInfo');

	object.addClass('selected');
	$("#product_image").animate(
	{
		backgroundPosition: "-130px 0px",
		opacity:0
	}, 200,
		function()
		{
			$(this)[0].style.background = 'url('+ data.ImageUrl +') no-repeat';
			$(this).animate(
			{
				backgroundPosition: "8px 0px",
				opacity:1
			}, 200)

		}
	);
	$("#product > h2").animate(
	{
		opacity:0
	}, 200,
		function()
		{
			$(this).text(data.name)
			$(this).animate(
			{
				opacity:1
			},200)
		}
	);
	$("#productBrowser_buyOnline")[0].href = data.buyUrl;
	$("#product > h3 > a")[0].href = data.infoUrl;
	$("#product > h3").animate(
	{
		opacity:0
	}, 200,
		function()
		{
			$(this).animate(
			{
				opacity:1
			},200)
		}
	);

}


function handleProductsData(data)
{
	productsData = new Array();

	$("#productBrowser_products > div > ul").html('');

	$.each(data.products,
		function(i,product)
		{
			$("#productBrowser_products > div > ul").append('<li><a href="">'+product.name+'</a></li>');
			var li = $("#productBrowser_products > div > ul > li:last-child")[0];
			jQuery.data(li, "productInfo", product);

		}
	);

	$("#productBrowser_products > div > ul > li > a").click
	(

		function(event)
		{
			handleProductClick($(this))
			//Capture and stop anchor click.
			event.preventDefault();
		}
	);

	$("#productBrowser_products > div > ul > li > a:first-child").click();
}