var TopMenu = Class.create({
	initialize: function(id, options) 
	{
		this.div = $('topMenu');
		this.options = Object.extend({	delay: 1,
										opacity: 0.8,
										align: 'left',
										offset: 0,
										bOverMenuItem: false,
										bAllowHideItem: false
									}, options);
		// Référence des item courant:
		// {dl: dl, dt: dt, dd: dd, table: table}
		this.oCurrentItem = null; 
		this.timer = null;

		if(this.div != undefined)
		{
			this.div.select('dt').invoke('observe', 'mouseover', this.showItem.bindAsEventListener(this));
			// Pour que les dd reste au dessus du contenu de la page sans affecter le positionnement de son contenu
			this.div.select('dd').invoke('absolutize');
		}
		else
		{
			alert("L'élément de id=" + id + " est introuvable dans le DOM.");
		}
	},
	showItem: function (evt)
	{
		var a = evt.findElement('a');
		if(a != undefined)
		{
			var dl = a.up('dl');
			var dt = dl.down('dt');
			var dd = dl.down('dd');
			var table = dl.down('table');

			if(dl != undefined && table != undefined && !table.visible())
			{
				this.hideItem();
				this.oCurrentItem = {dl: dl, dt: dt, dd: dd, table: table};
				var ddPos = this.calculatePosition();
				this.oCurrentItem.dd.setStyle({'left': (ddPos.left + this.options.offset) + 'px', 'top': ddPos.top + 'px'});
				this.oCurrentItem.table.appear({ from: 0, to: this.options.opacity, duration: 0.5 });
				
				this.oCurrentItem.dt.observe('mouseout', this.allowHideItem.bindAsEventListener(this));
				this.oCurrentItem.dd.observe('mouseout', this.allowHideItem.bindAsEventListener(this));
				this.oCurrentItem.dt.observe('mouseover', this.forbidHideItem.bindAsEventListener(this));
				this.oCurrentItem.dd.observe('mouseover', this.forbidHideItem.bindAsEventListener(this));
				// Prepare to hide item
				this.scheduleHideItem();
				// but not before we mouse out the dl
				this.forbidHideItem();
			}
		}
	},
	hideItem: function ()
	{
		//var d = new Date();
		//$('debug2').update('call to scheduleHideItem ' + d.getTime());

		if(this.oCurrentItem != null && this.bAllowHideItem == true)
		{
			this.oCurrentItem.table.fade({ from: this.options.opacity, to: 0, duration: 0.5 });
			this.oCurrentItem.dt.stopObserving('mouseout', this.allowHideItem.bindAsEventListener(this));
			this.oCurrentItem.dd.stopObserving('mouseout', this.allowHideItem.bindAsEventListener(this));
			this.oCurrentItem.dt.stopObserving('mouseover', this.forbidHideItem.bindAsEventListener(this));
			this.oCurrentItem.dd.stopObserving('mouseover', this.forbidHideItem.bindAsEventListener(this));
			this.cancelHideItem();
			this.oCurrentItem = null;
		}
	},
	scheduleHideItem: function()
	{
		if(this.timer !=null)
			this.timer.stop()
		this.timer = new PeriodicalExecuter(this.hideItem.bind(this), this.options.delay);
	},
	cancelHideItem: function()
	{
		if(this.timer !=null)
			this.timer.stop();
	},
	allowHideItem: function()
	{
		this.bAllowHideItem = true;
		//$('debug').update('bAllowHideItem = true');
	},
	forbidHideItem: function()
	{
		this.bAllowHideItem = false;
		//$('debug').update('bAllowHideItem = false');
	},
	calculatePosition: function()
	{
		if(this.oCurrentItem == undefined)
			return false;

		// Positionne en dessus du dd, même si la fenêtre a été redimensionnée
		//debugger;
		var dlPos = this.oCurrentItem.dl.cumulativeOffset();
		var dtPos = this.oCurrentItem.dt.cumulativeOffset();
		var dtDim = this.oCurrentItem.dt.getDimensions();
		var ddDim = this.oCurrentItem.table.getDimensions();
		var larger = ddDim.width >= dtDim.width;
		var iTop = dtPos.top + dtDim.height + (Prototype.Browser.IE ? 5 : 0);

		switch (this.options.align)
		{
			case 'center':
				var ddPos = {left: larger ? dtPos.left : dtPos.left + ddDim.width/2, top: iTop};
				break;
			case 'left':
				var ddPos = this.options.bOverMenuItem ? {left: dtPos.left-10, top: dlPos.top -17} : {left: dtPos.left, top: iTop};
				break;
			case 'right':
				var ddPos = {left: larger ? dtPos.left - (dtDim.width - ddDim.width) : dtPos.left + (dtDim.width - ddDim.width), top: iTop};
				break;
			default: /* 'center' par defaut */
				var ddPos = {left: dtPos.left, top: iTop};
				break;
		}

		return ddPos;
	}
});