/**
 * @author andres
 * Clase que controla y gestiona el menu de la aekm 
 * Esta invocada dentro del archivo global de la app.
 * Inicia los elementos del menu y muestra el que corresponda en cada caso.
 * Al pulsar elimina accion relativa al elemento y pasa a no hacer nada.
 * Al hacer roll muestra el submenu correspondiente activa la clase css on y desactiva la 
 * actual.
 * TODO: Al hacer rollOver sobre la opcion del menu mostrar el submenu y ocultar el anterior.
 */
var MenuAEKM = new Class({
	/**
	 * Propiedades.
	 */
	contenedorGeneral:"",
	contenedorMenu:"",
	contenedorSubmenu:"",
	elementoInicial:"",
	subElementoInicial:"",
	subContenedorInicial:"",
	elementoActual:"",
	elementoAnterior:"",
	claseActiva:"on",
	cadenaExtra:"_submenu",
	/**
	 * Constructora de la clase.
	 * @param {Element} contenedorGeneral, elemento que contiene tanto el menu como el submenu.
	 * @param {Element} contenedorMenu, elemento que contiene el menu principal.
	 * @param {Element} contenedorSubmenu, elemento que contiene los diferentes submenus.
	 * @param {Element} elementoInicial, elemento actualmente activo.
	 * @param {string} claseActiva, cadena de texto de la clase que activa los elementos.
	 * @param {string} cadenaExtra, cadena extra que define la id del submenu partiendo de la id del elemento en el que estemos.
	 */
	initialize: function(contenedorGeneral, contenedorMenu, contenedorSubmenu, elementoInicial, subContenedorInicial, subElementoInicial, claseActiva, cadenaExtra ){
		this.contenedorGeneral = contenedorGeneral;
		this.contenedorMenu = contenedorMenu;
		this.contenedorSubmenu = contenedorSubmenu;
		if (!elementoInicial) {
			this.elementoInicial = "";
		}else{
			this.elementoInicial = elementoInicial;
		}
		if (!subElementoInicial) {
			subElementoInicial = ""
		}else{
			this.subElementoInicial = subElementoInicial;
		}
		if (!subContenedorInicial){
			subContenedorInicial = "";
		}else{
			this.subContenedorInicial = subContenedorInicial;
		}
		this.claseActiva = claseActiva;
		this.cadenaExtra = cadenaExtra;
		this.initMenu();
    },
	/**
	 * Inicializamos los elementos.
	 */
	initMenu: function (){
		this.reInitMenu();
		this.contenedorGeneral.addEvent('mouseleave', this.reInitMenu.bind(this));
		this.unsetAnchors();
	},
	/**
	 * Reiniciamos el menu a su posicion Original.
	 */
	reInitMenu: function (){
		this.desSeleccionar(this.contenedorGeneral);
		if (this.subContenedorInicial != "") {
			this.subContenedorInicial.set('class', 'on');
		}
		if (this.subElementoInicial) {
			this.subElementoInicial.set('class', 'on');
		}
		if (this.elementoInicial != "") {
			this.elementoInicial.set('class', 'on');
			this.elementoActual = this.elementoInicial.get('id');
		}
	},
	/**
	 * Quitamos las acciones de todas las anclas cuyo submenu asociado no tenga elemetos
	 */
	unsetAnchors: function(){
		var elementsMenu = this.contenedorMenu.getElements('a');
		// Buscamos la id de cada elemento
		elementsMenu.each(function(item, index){
			var id = item.get('id');
			var idSubmenu = id+this.cadenaExtra;
			// Si el elemento asociado no tiene items dejamos que linke si no, no.
			var donde = this; // SCope.
				// A–adimos acciones vinculadas a la clase.
				item.addEvents({
				    'mouseover': function(){
						if (donde.elementoActual != ""){
							// ocultamos los anteriores.
							$(donde.elementoActual).erase('class');
							$(donde.elementoActual+donde.cadenaExtra).erase('class');
						}
						$(idSubmenu).set('class', 'on');
						$(id).set('class', 'on');
						donde.elementoActual = id;
				    },
					'mouseleave': function(){
						
					},
				    'click': function(){
						if(donde.checkSubMenuElements(idSubmenu)){
				        	return false;
						}
				    }
				})
		}, this);
	},
	/**
	 * Comprobamos que elementos por la id tiene o no hijos.
	 * @param {Object} idSubmenu
	 */
	checkSubMenuElements: function(idSubmenu){
		if ($(idSubmenu)){
			if ($(idSubmenu).getElements('li').length > 0){
				return true;
			}else{
				return false;
			}
		}
	},
	/**
	 * Quitamos la claseActiva dentro de elemento que pasamos como parametro.
	 * @param {Object} el
	 */
	desSeleccionar: function(el){
		var activos = el.getElements('*.'+this.claseActiva);
		// Quitamos la claseActiva en cada elemento del array
		activos.each(function(item, index){
		    item.erase('class');
		}, this);
	}
});