// JavaScript Document
/*
jQuery.imageMenu
Basé sur phatfusion image Menu. pour mootools (http://www.phatfusion.net/imagemenu/index.htm);
*/

function imageMenu()
{
	var self = this;
	
	this.build = function(selectMenu,selectElem,extendHeight,selectAppearOnHover)
	{
		self.menu = $(selectMenu)
		self.elems = $(selectElem,$(selectMenu));
		self.selectAppearOnHover = selectAppearOnHover;
		self.menuHeight = self.menu.height();
		self.extendHeight = extendHeight;
		self.elems.hover(self.rollHover,self.rollOut);
		
		$(self.selectAppearOnHover,self.elems).animate({'opacity':0},'fast');

		self.menu.css('position','relative');
		self.menu.append('<div style="position:absolute;height:'+($(selectMenu).height()*2)+'px;width:'+$(selectMenu).width()+'px;clip: rect(0px '+$(selectMenu).height()+'px '+$(selectMenu).width()+'px 0px);" class="imageMenuContainer"></div>');
		self.elems.appendTo($('.imageMenuContainer',self.menu));
		
		self.elems.eq(self.elems.length-1).height(self.menuHeight);
		self.elems = self.elems.slice(0,self.elems.length-1)
	}
	
	this.rollHover = function()
	{
		var menuHeight = self.menuHeight;
		var singleHeight = Math.floor(menuHeight/(self.elems.length+1));

		var outHeight = Math.floor((menuHeight-(singleHeight+self.extendHeight))/(self.elems.length));
		var hoverHeight = menuHeight - outHeight * (self.elems.length);
		//console.debug(outWidth+' '+hoverWidth)
		$(this).removeClass('out');

		$(self.selectAppearOnHover,self.elems).stop();
		$(self.selectAppearOnHover,self.elems).animate({'opacity':0},'fast');

		$(self.selectAppearOnHover,this).stop();
		$(self.selectAppearOnHover,this).animate({'opacity':1},'fast');

		self.elems.stop();
		$(self.elems).animate({'height':outHeight},'fast');
		$(this).stop();
		$(this).animate({'height':hoverHeight},'fast');
	}
	
	this.rollOut = function()
	{
		var menuHeight = self.menu.height();
		var singleHeight = Math.floor(menuHeight/(self.elems.length+1));
		
		$(this).addClass('out');

		$(self.selectAppearOnHover,this).stop();
		$(self.selectAppearOnHover,this).animate({'opacity':0},'fast');
		
		self.elems.stop();
		self.elems.animate({'height':singleHeight},'fast');
	}
}