var DropDownMenu = Class.create();

DropDownMenu.prototype = {
    initialize: function(menulink, menudiv) {
        this.menulink = $(menulink);
        this.menudiv = $(menudiv);
        this.toggled = false;
	    this.isSliding = false;
        
        this.bfx = this.documentClicked.bindAsEventListener(this);
        
        this.displayEventListener = this.toggle.bindAsEventListener(this);
        Event.observe(this.menulink, "mouseover", this.displayEventListener);
    },
       
    toggle: function() {
	    if (this.toggled == true) {
		    this.hide();
	    }
	    else {
		    this.display();
	    }
    },
  
    display: function() {
	    if (this.isSliding == true) {
	        return;
	    }
  	
	    var self = this;
	    Effect.SlideDown(this.menudiv, { 
					                duration: 0.4, 
					                beforeStart: function() {
						                self.isSliding = true;
					                },
					                afterFinish: function() { 
						                Event.observe(document, "click", self.bfx); 
						                self.isSliding = false;
					                }
				                });
  						            
	    this.toggled = true;					  
    },
  
    hide: function() {
  	    if (this.isSliding == true) {
		    return;
	    }
	
	    var self = this;
        Event.stopObserving(document, "click", self.bfx);
        Effect.SlideUp(this.menudiv, { 
					                      duration: 0.1,
					                      beforeStart: function() {
						                      self.isSliding = true;
					                      },
					                      afterFinish: function() {
						                      self.isSliding = false;
					                      }
				                      });
    				                  
         this.toggled = false;
    },
  
    documentClicked: function(evt) {
	    this.hide();
    }
};