var dubdubMenu = Class.create({

	initialize: function(content) {
		this.menus = new Array();
		
		var i = 0;

		content.each(function (item) { 
			this.menus.push(new dubdubMenuLabel(item.id,item.link,item.menu,this,i));
			
			
			i++;
		}.bind(this));	

	},

		
	choose: function(index) {
		this.chosenIndex = index;
		
		this.menus.each(function (item) {
			if (item.index != this.chosenIndex) {
				//alert(item.index+" "+this.chosenIndex);
				item.item.style.backgroundImage='';
				item.item.style.color = '#FFFFFF';	
			}
		}.bind(this));
		
	}
	
});

var dubdubMenuLabel = Class.create({

	hideMenuTimeout: 20,
	
	initialize: function(item,link,menu,parent,index) {
		this.itemLabel = item;
		this.item = $(item);
		this.parent = parent;
		this.index = index;
		this.link = link;

		this.menu = this.buildMenu(menu);
		
		
		this.bfxMouseOver = this.showMenu.bindAsEventListener(this);
		Event.observe(this.item, 'mouseover', this.bfxMouseOver);
		
		this.bfxMouseOut = this.hideMenu.bindAsEventListener(this);
		Event.observe(this.item, 'mouseout', this.bfxMouseOut);
		
		this.bfxMouseClick = this.onGlobalChoose.bindAsEventListener(this);
		Event.observe(this.item, 'click', this.bfxMouseClick);

		this.bfxhideMenuDelayed = this.hideMenuDelayed.bindAsEventListener(this);
		
		
	},

	showMenu: function() {
		//if (dropDownFx) dropDownFx.cancel();
		this.isOver = true;
		if (this.parent.chosenIndex != this.index) {
			this.item.style.color='#222222';
			this.item.style.backgroundImage='url(img/tabCurrentBackground.png)'
		}
		
		/*if (this.menu) { 
			var pos = this.item.cumulativeOffset();
			var dim = this.item.getDimensions();

			var x = pos.left;
			var y = pos.top + dim.height;
			var width = dim.width;
			this.menu.style.left = x;
			this.menu.style.top = y;
			this.menu.style.width = width;
			//this.menu.appear({duration:0.4});
			
			//alert(x+" "+y);
			this.menuShadow.style.left = x + 2;
			this.menuShadow.style.top = y;
			
			var menuDim = this.menu.getDimensions();

			this.menuShadow.style.width = menuDim.width;
			this.menuShadow.style.height = menuDim.height+2;
			
			this.menu.show();
		}*/
		//this.menuShadow.show();
		//dropDownFx = Effect.SlideDown(menu, {duration: 0.5 });

		//alert(pos.left+" "+pos.top);
	},
	
	hideMenu: function() {
		this.isOver = false;
		setTimeout(this.bfxhideMenuDelayed,this.hideMenuTimeout);
	},
	
	hideMenuDelayed: function() {
		if (!this.isOver) {
			//this.menu.fade({duration:0.4});
			if (this.menu) { 
				this.menu.hide();
				this.menuShadow.hide();
			}
			if (this.parent.chosenIndex != this.index) {
				this.item.style.color='#ffffff';
				this.item.style.backgroundImage='';
			}
		}
	},
	
	buildMenu: function(menu) {
	
		if (!menu || menu.length < 1) { return false; }
		var id = this.itemLabel+"Menu";
		$("main").insert("<div id='"+id+"' class='dropDownMenu' style='display:none'></div>");
		$("main").insert("<div id='"+id+"Shadow'class='dropDownMenuShadow' style='display:none'> </div>");
		
		this.menuShadow = $(this.itemLabel+"MenuShadow");
		
		this.bfxMenuOver = this.menuOver.bindAsEventListener(this);
		Event.observe($(id), 'mouseover', this.bfxMenuOver);
		this.bfxMenuOut = this.menuOut.bindAsEventListener(this);
		Event.observe($(id), 'mouseout', this.bfxMenuOut);
		this.bfxMenuClick = this.menuClick.bindAsEventListener(this);
		Event.observe($(id), 'click', this.bfxMenuClick);
		
		var i =0;
		menu.each(function (item) {
			//alert(item.label);
			item.id = id;
			item.i = i;
			new dubdubMenuItem(item);
			i++;
		});
		$(id).insert("<div class='dropDownMenuEnd'> </div>");
		
		
		
		return $(id);
	},
	
	menuOver: function() {
		this.isOver = true;
	},
	
	menuOut: function() {
		this.isOver = false;
		setTimeout(this.bfxhideMenuDelayed,this.hideMenuTimeout);
	},
  
	menuClick: function() {
		this.onChoose();	
	},
  
	onGlobalChoose: function() {
		if(this.index == 3) {
			window.open("http://forum.innovortex.fr/","",'');
		}
		else {
			this.onChoose();
			window.location = "?ref="+this.link;		
		}
	},
	
	onChoose: function() {
		this.parent.choose(this.index);
		this.item.style.backgroundImage='url(img/tabCurrentBackground.png)';
		this.item.style.color = "#222222";
		this.isOver = false;
		if (this.menu) { 
			setTimeout(this.bfxhideMenuDelayed,this.hideMenuTimeout);
		}
	}
  
});

var dubdubMenuItem = Class.create({
	initialize: function(item) {
		this.id = item.id+"Item"+item.i;
		this.item = item;
		$(item.id).insert("<div id='"+this.id+"' class='dropDownMenuItem'><div class='dropDownMenuItemContent'>"+item.label+"</div></div>");
		this.element = $(this.id);
		this.element.down().style.backgroundImage = "url(img/icons/"+item.icon+")";
		
		this.bfxMouseOver = this.itemOver.bindAsEventListener(this);
		Event.observe(this.element, 'mouseover', this.bfxMouseOver);
		
		this.bfxMouseOut = this.itemOut.bindAsEventListener(this);
		Event.observe(this.element, 'mouseout', this.bfxMouseOut);
		this.bfxMouseClick = this.itemClick.bindAsEventListener(this);
		Event.observe(this.element, 'click', this.bfxMouseClick);
		

	},
	
	itemOver: function() {
		//this.element.style.backgroundColor='#315598';
		this.element.style.color='#000000';
		this.element.style.backgroundImage='url("img/dropDownMenuItemBackground.png")';
		//this.element.style.backgroundColor='#315598';
		
	
	},
	
	itemOut: function() {
		//this.element.style.backgroundColor='';
		this.element.style.color='';
		this.element.style.backgroundImage='';
		//this.element.style.backgroundColor='';
	},
	
	itemClick: function() {
		//alert(this.parent);
		window.location = "?ref="+this.item.link;		
	}
});
