var MENU_TIMEOUT = 500;

var menuTimer = 0;
var menuItem = 0;
var prdArray = new Array();
var photoCarousel = null;

window.addEvent("domready", function()
{
	// initialisation menu
	document.getElements('#menu li.menuItem').addEvent('mouseover', menu_open);
	document.getElements('#menu li.menuItem').addEvent('mouseout', menu_timer);


	// effet special sur les gros carrés présents sur la home
	var items = ["cloisons", "plafonds-suspendus", "planchers-sureleves", "second-oeuvre"];
	var colors = new Array();

	if ($("cloisons-item"))
	{
		for (var i = 0; i < items.length; i++)
		{
			var id = items[i] + "-item";

			colors[id] = $(id).getElement("span:first-child").getStyle("backgroundColor");

			$(id).addEvents(
			{
				mouseenter: function()
				{
					this.getElement("span:first-child").morph(
					{
						"background-color": "#004374"
					});
				},
				mouseleave: function()
				{
					this.getElement("span:first-child").morph(
					{
						backgroundColor: colors[this.id]
					});
				}
			});		
		}
	}

	// mise en place de l'effet "accordeon" sur les categories	
	if ($defined($("categories")))
	{
		var toggles = $$('#categories li a.toggler');
		var content = $$('#categories li ol');

		var AccordionObject = new Accordion(toggles, content, { "display": -1 });
	}
	
	// mise en place du petit compo "scroller"
	if ($("main") && $("scroller"))
	{
		new ScrollBar('main', 'scroller', { 'hScroll': false });
	}

	var slides = [];
	if ($("blinds"))
	{
		slides =
		[
			{
				image: '01.jpg',
				caption: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit'
			},
			{
				image: '02.jpg',
				caption: 'Excepteur sint occaecat cupidatat non proident'
			},
			{
				image: '03.jpg',
				caption: 'Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore.'
			}
		];

		$('blinds').floom(slides,
		{
			captions: false,
			//progressbar: false,
			interval: 4000,
			slidesBase: 'img/home/',
			sliceFxIn:
			{
				top: 20
			}
		});
	}
});

/**********************************************************************************************************************/
/** MENU
/**********************************************************************************************************************/
function menu_open()
{
	menu_canceltimer();
	menu_close();
	if ($(this).getElement('ol'))
	{
		menuItem = $(this).getElement('ol').setStyle('visibility', 'visible');
	}
}
function menu_close()
{
	if (menuItem) menuItem.setStyle('visibility', 'hidden');
}
function menu_timer()
{
	menuTimer = window.setTimeout(menu_close, MENU_TIMEOUT);
}
function menu_canceltimer()
{
	if (menuTimer)
	{
		window.clearTimeout(menuTimer);
		menuTimer = null;
	}
}

document.onclick = menu_close;

/**********************************************************************************************************************/
/** DISPLAY PRODUCT
/**********************************************************************************************************************/
function DisplayProduct(aId, aLneName, aPrdName)
{
	var prdData = JSON.decode(prdArray[aId]);

	//$("picture").setStyle("visibility", "visible");
	$("picture").setStyle("background-image", "url(/img/character.jpg)");

	// affichage des thumbnails
	$("photo-thumbs").setStyle("display", "block");

	// on masque les blocs "philosophy"
	$("right-content-philosophy1").setStyle("display", "none");
	$("right-content-philosophy2").setStyle("display", "none");

	// on affiche le bloc "product"
	$("right-content-product").setStyle("display", "block");

	// affichage de la description de la photo
	$("product-caption").setStyle("visibility", "visible");

	// mise a jour du product path
	$("product-path").set("html", aLneName + " // " + aPrdName);

	// mise a jour du product description
	$("product-description").set("html", prdData.description);

	// on vide les 2 listes d'images
	$("photo-big").empty();
	$("photo-thumbs").empty();

	navDisplay = "none";
	if (photoListCount[aId] && photoListCount[aId] > 0)
	{
		for (var i = 1; i <= photoListCount[aId]; i++)
		{
			var imgName = i;
			var index = (i-1);
			if (i < 10) { imgName = "0" + i; }
			if (i > 99) { imgName = "0" + i; }

			imgName += ".jpg";

			var itemBig = new Element("li", { "class": "carousel" }).inject($("photo-big"));
			var linkBig = new Element("a", { "href": "javascript:void(0)" }).inject(itemBig);
			new Element("img", { src: "/img/product/" + aId + "/big/" + imgName }).inject(linkBig);

			var itemThumb = new Element("li").inject($("photo-thumbs"));
			var linkThumb = new Element("a", { id: "thumb" + index, "href": "javascript:void(0)" }).inject(itemThumb);
			new Element("img", { src: "/img/product/" + aId + "/thumb/" + imgName }).inject(linkThumb);
		}

		photoCarousel = new iCarousel("photo-big",
		{
			/*idPrevious: "photo-prev",
			idNext: "photo-next",*/
			idToggle: "undefined",
			item:
			{
				klass: "carousel",
				size: 368
			},
			animation:
			{
				type: "scroll",
				duration: 500,
				amount: 1
			}
		});

		for (var i = 0; i < photoListCount[aId]; i++)
		{
			$("thumb" + i).addEvent("click", function(event){ new Event(event).stop(); photoCarousel.goTo(this.id.replace("thumb", "")) });
		}

		navDisplay = (photoListCount[aId] > 1) ? "block" : "none";

	}
	// affichage / masquage de la nav
	//$("photo-nav").setStyle("display", navDisplay);
}