var Menu = (function(){
	var selectedId = 0;
	function initialize(){
		$("#mainmenu a").hover(
			function()
			{
				over(this);
			},
			function()
			{
				out(this);
			}
		);
	};

	var hideTimeoutID = 0,
		showTimeoutID = 0;
	function over(elt){
		clearTimeout(hideTimeoutID);
		showTimeoutID = setTimeout(
			function(){select(ExtractID(elt))},100
		);
	};

	function out(elt){
		clearTimeout(showTimeoutID);
		hideTimeoutID = setTimeout(unselect,100);
	}


	function select(id)
	{
		if(id == selectedId)
			return;
		unselect()
		selectedId = id;
		var item = GetMenuItem(id);
		getPanel(id).open();
		item.addClass("on");
		$('a',item).animate({
			backgroundColor: item.css("borderColor")
		})

	}
	function unselect()
	{
		var item = GetMenuItem(selectedId);
		if(selectedId>0)
			getPanel(selectedId).close();
		item.removeClass("on");

		$('a',item).animate({
			backgroundColor: "#303030"
		},
		{
			complete: function(){
				$('a',item).css("backgroundColor","transparent");
			}
		})
		selectedId = 0;
	}


	var panels = {};
	function getPanel(id)
	{
		if(id>0 && !panels[id])
			panels[id] = Panel(id);
		return panels[id];
	}

	/////////////////////////////

	function ExtractID(elt)
	{
		return $(elt).attr("id").match(/(\d+)$/)[0];
	}
	function GetMenuItem(id)
	{
		return $("#catalogue_item_"+id).parent();
	}
	function GetColor(id,returnHex)
	{
		var rgb = GetMenuItem(id).css("borderColor");

		if(rgb && returnHex && rgb.charAt(0) != "#")
		{
			var parts = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
			//alert(rgb)
			delete (parts[0]);
			for (var i = 1; i <= 3; ++i) {
				parts[i] = parseInt(parts[i]).toString(16);
				if (parts[i].length == 1) parts[i] = '0' + parts[i];
			}
			return parts.join(''); // "0070ff"
		}
		else if(returnHex && rgb.charAt(0) == "#")
			return rgb.substr(1);
		return rgb;

	}

	////////////////////////
	function Panel(id)
	{
		var defaultThumb;
		var color = GetColor(id),
			elt = $("<div>")
				.attr("id", "catalogue_panel_"+id)
				.addClass("catalogue_panel")
				.css("backgroundColor",color)
				.css("visibility","visible")
				.hover(function(){over(this)}, function(){out(this)})
				.append('<div class="loader"><p>Chargement du menu...<p><img src="'+site_url+'/images/menu/panel_loader.gif"></div>'),
			opened = false;
		///
		function load(){
			$.get(site_url+"/menu/menupanel.php",{
					id:id
				},function(data){
					$(".loader",elt).remove();
					elt
						.append(data)

					defaultThumb = $('.thumb',elt).attr('src');
					$('.column a',elt).hover(function(){
						setThumb($(this).parent().attr('rel'));
					},function(){
						setThumb();
					})

				},"html");
		}
		function open(){
			opened = true;
			elt
				.appendTo("#catalogue_panels")
				.slideDown(200,'linear');
		}
		function close(){
			opened = false;
			elt.slideUp(300,'linear');
		}

		var setThumbTimeout;
		function setThumb(src)
		{
			clearTimeout(setThumbTimeout);
			setThumbTimeout = setTimeout(function(){
				$('.thumb',elt).attr('src',src || defaultThumb);
			},1);
		}

		load();

		return {
			open : function(){
				open();
			},
			close: function(){
				close();
			}
		}
	}

	return {
		init: function(){
			initialize();
		}
	}
})();