var MenuDesplegable = Class.create()
    
    MenuDesplegable.prototype = { 

       initialize : function() {
		   	var opciones = $$("#menu-productos a");
            for(cont = 0; cont < opciones.length; cont++){
		        Event.observe(opciones[cont], 'mouseover', this.desplegar.bind(this))
        	}
			
			Event.observe($("ocultador"), "mouseover", this.ocultarTodo.bind(this));
        },

        desplegar : function(evt){
			$("ocultador").show();
			
            var elemento = Event.findElement(evt, 'LI');
            $(elemento).siblings().each(function(item){
                this.plegar(item);
            }.bind(this));

            hijos = elemento.immediateDescendants();

            $(hijos).each(function(item){
				if (item.match('ul')) {
//					item.style.display = ((item.style.display == 'block') ? "none" : "block");
					item.style.display = "block";
				}
			});            

        },
        
        plegar : function(item){
            item.immediateDescendants().each(function(item2) {
            		if (item2.match('ul')) {
                		item2.style.display = "none";
                	}else{
                		this.plegar(item2);	
                	}
            }.bind(this));                
		},
		
		ocultarTodo : function(item){
			elemento = Event.findElement(item, "div");
			//alert(elemento.id);
			if(elemento.id == "ocultador"){
				$("ocultador").hide();
			
				$$("ul.ocultar").each(function(item2){
					item2.hide();
				});
			}
		}
	}
	
		
	Event.observe(window,"load", function(){ new MenuDesplegable(); });