var verticalMenu = new Class( {
  options : {
		interval : 300,
		out : 0.8,
		over : 1,
		id: 1
	},
	
	initialize : function(options) {
	   this.setOptions(options);
  	 this.menu = $$("div#gi_vert"+this.options.id+" div#gi_vert_menu"+this.options.id+" div.menu");
  	 this.menu.each(function(menu,i){ menu.submenu = menu.getElementById('sub'+menu.id)});
  	 this.menu.each(function(menu, i){
  	                    menu.setStyle("opacity", this.options.out);
  	                    menu.fx = new Fx.Style(menu, 'opacity', {duration: this.options.interval})
                        menu.verticalMenu = this;
                        menu.addEvent("mouseenter", function(){this.verticalMenu.enter(this)}, menu);
                        menu.addEvent("mouseleave", function(){this.verticalMenu.leave(this)}, menu);
                    },this);
  	 this.submenus = $$("div#gi_vert"+this.options.id+" div#gi_vert_menu"+this.options.id+" div.submenus");
  	 this.setup();
	},
	
	setup : function(){
  	 $$("div#gi_vert"+this.options.id+" div#gi_vert_menu"+this.options.id+" div.menuborder").each(function(border, i) {
  	    border.setStyle("opacity", this.options.out);
  	 }, this);
  	 this.submenus.each(function(submenu, i) {
  	    submenu.fx = new Fx.Style(submenu, 'opacity', {duration: this.options.interval})
  	    submenu.setStyle("opacity", 0);
  	 },this);
  },
  
  enter : function(menu){
    menu.fx.stop();
    if(menu.submenu){
      menu.submenu.fx.stop();
      menu.submenu.setStyle("display", "block");
      menu.submenu.fx.start(1);
    }
    menu.fx.start(this.options.over);
  },
  
  leave : function(menu){
    menu.fx.stop();
    if(menu.submenu){
      menu.submenu.fx.stop();
      menu.submenu.fx.start(0).chain(function() {
		if (menu.submenu.getStyle('opacity') == 0) menu.submenu.setStyle("display", "none");
	  }.bind(this));
    }
    menu.fx.start(this.options.out);
  }
  
});

verticalMenu.implement(new Events, new Options);