Dmc_declars =new Array();

var MenuClass = Class.create({

	/*
	* Constructeur
	* Initialise les évèenemt out et over sur les élements de 1er et second niveau
	*/
	initialize: function(titrePageParent) {

	/************************************************************************/	
	// création de la structure d'après le contenu de addonline_declare_v4.js
	// seulement 3 niveaux
	
	// le ul de 1er niveau
	var ulNiveau1 = document.createElement("ul");
	ulNiveau1.className = "niveau1";
	
	// le template de l'item "Accueil"
	var itemAccueil = new Template("<li><a href=\"#{url}\" #{selected}><span class=\"left\"><span class=\"home\"><span class=\"right\">#{libelle}</span></span></span></a>#{sousMenu}</li>");
	
	// le template de 1er niveau
	var itemNiveau1 = new Template("<li><a href=\"#{url}\" #{selected}><span class=\"left\"><span class=\"right\">#{libelle}</span></span></a>#{sousMenu}</li>");
	
	// le Template de 3nd niveau
	var itemNiveau2 = new Template("<li><a href=\"#{url}\">#{libelle}</a></li>");
	
	// la structure finale
	var structure = "";
	
	// ajout de l'item Accueil en premier
	var selectedClass = (titrePageParent == "Accueil")? "class=\"selected\"" : "";
	structure += itemAccueil.evaluate({url: "./", selected: selectedClass, libelle: "Accueil", sousMenu: ""});
	
	var items = getArbo("menu_1");
	for(var i=1; i<items.length; i++) {
		var libelle = items[i][0];
		var url =  (items[i][1] == "")? "#" : items[i][1];
		var sousMenu = (items[i][2] == "")? "" : items[i][2];
		//var num = url.substring(url.lastIndexOf("-")+1, url.length-5);
		var htmlContent = "";
		
		// S'il existe un sous menu (niveau 2)
		if(sousMenu != "") {
			htmlContent += "<div class=\"c1\"><div class=\"c2\"><table class=\"niveau2\" cellspacing=\"0\" cellpadding=\"0\"><tr>";
			
			// Création des 6 cellules
			var sItems = getArbo(sousMenu);
			for(var j=1; j<=6; j++) {
				if(sItems[j] != undefined) {
					htmlContent += "<td><a href=\"" + sItems[j][1] + "\">" + sItems[j][0] + "</a>";
					// S'il existe un sous menu (niveau 3)
					var ssMenu = (sItems[j][2] == "")? "" : getArbo(sItems[j][2]);
					if(ssMenu != "") {
						htmlContent += "<ul class=\"niveau3\">";
						
						ssMenu.each(function(s, index) {
							if(index > 0) {
								htmlContent += itemNiveau2.evaluate({url: ssMenu[index][1], libelle: ssMenu[index][0]});
							}
						});
						
						htmlContent += "</ul>";
					}
					htmlContent += "</td>";
				} else {
					htmlContent += "<td></td>";
				}
			}
			htmlContent += "</tr></table></div></div>";
		}
		//alert(url + ", " + pageParente + " == " + num + " : " + (pageParente == num));
		//var selectedClass = (pageParente == num)? "class=\"selected\"" : "";
		selectedClass = (titrePageParent == libelle)? "class=\"selected\"" : "";
		structure += itemNiveau1.evaluate({libelle: libelle, url: url, sousMenu: htmlContent, selected: selectedClass});
		
	}
	
	ulNiveau1.innerHTML = structure;
	
	$("menu_h").appendChild(ulNiveau1);
	/************************************************************************/
	
	// la temporisation
	this.temporisationOut;
	
	this.current = new Array();
	
	/* ensemble des items de 1er niveau */
	var niveau_1 = $$("ul.niveau1 > li");
	
	/* pour tous les items de 1er niveau, on va définir les évènement over et out 
	* ATTENTION, on utilisera le A et non pas le LI comme zone réactive, puisque les listes sont imbriquées
	* Dans la boucle, item référence le LI, et item.down() le A
    */	
	niveau_1.each(function(item, index) {

		/* onmouseover */
		item.down().observe("mouseover", function(){
			
			// On cache tout de suite le sous menu potentiellement affiché
			clearInterval(this.temporisationOut);
			if(this.current[0]) {
				this.current[0].removeClassName("hoverWithChildren");;
				this.current[1].setStyle({display: "none"});
			}
			
			// l'élément a (item.down(), 1er niveau)
			var lThis = arguments[0];
			
			// existe t-il un sous menu
			var hasChild = (lThis.adjacent("div").length > 0)? true : false;
			
			// si oui : il faut l'afficher et initialiser les évènements out et over
			// si non : on change juste l'état de l'item de 1er niveau
			if(hasChild) {
				
				lThis.addClassName("hoverWithChildren");
				
				var smenu = lThis.adjacent("div")[0];
				smenu.setStyle({display: "block"});
				
				this.current[0] = lThis;
				this.current[1] = smenu;
				
				smenu.stopObserving("mouseover");
				smenu.stopObserving("mouseout");
				
				smenu.observe("mouseover", function(){
					clearInterval(this.temporisationOut);
				}.bind(this));
				smenu.observe("mouseout", function(event){
					var currentTarget = arguments[0].element();
					//$("debug").value += "\n" + currentTarget.nodeName;
					if(currentTarget.nodeName == "TABLE" || currentTarget.nodeName == "DIV") {
						this.temporisationOut = setTimeout(this.mouseout.bind(arguments[1], arguments[2]), 100);
					}
				}.bindAsEventListener(this, smenu, lThis));
				
			} else {
				lThis.addClassName("hover");
			}
			
			
		}.bind(this, item.down()))
		
		
		/* onmouseout */
		item.down().observe("mouseout", function(){

			// l'élément a (item.down(), 1er niveau)
			var lThis = arguments[0];

			// existe t-il un sous menu
			var hasChild = (lThis.adjacent("div").length > 0)? true : false;
			
			if(hasChild) {
				var smenu = lThis.adjacent("div")[0];
				this.temporisationOut = setTimeout(this.mouseout.bind(smenu, lThis), 100);
				//smenu.setStyle({display: "none"});
				
			} else {
				lThis.removeClassName("hover");
			}
			
		}.bind(this, item.down()))
		
		/* todo : état sélectionné */
		/*
		if() {
			
		}
		*/
		
	}.bind(this));
	},
	
	/*
	* Cache le sous menu et éteind le 1er niveau
	*/
	mouseout: function(event) {
		// argument[0] = l'élement a de 1er niveau
		this.setStyle({display: "none"});
		arguments[0].removeClassName("hoverWithChildren");
	}
	
})