function init_dropdown_menu(){
	var elDDMenu = $$(".dropdown-menu");
	elDDMenu.each(function(el){
		oDropDownMenu = new DropDownMenu(el,{});
	});
}

var DropDownMenu = new Class({
	options:{
		iDDMenuStartHeight: 20, // image type_id = 1
		iFxDuration : 300
		
	},
	initialize: function(elDDMenu, aOptions) {
		var options, aOptions;
		var timerHideDDMenu, iFxDuration;
		var iDDMenuStartHeight, iDDMenuEndHeight;
		var elDDWrapper, elDDWrapperWidth, elDDWrapperHeight;
		var elDDBtn, hideDDMenuTimer;
		
		//alert(elDDMenu.getParent().getProperty("class"));
		this.setOptions(this.options, aOptions);
		
		this.elDDMenu = elDDMenu;

		this.iDDMenuEndHeight = this.calculateDropDownHeight();
		this.iDDMenuStartHeight = this.options.iDDMenuStartHeight;
		this.iFxDuration = this.options.iFxDuration;

		this.elDDWrapper = elDDMenu.getParent(); //$$(".dropdown-wrapper");
		//this.elDDWrapperHeight = this.elDDWrapper.getSize()["size"]["y"]; 
		this.elDDWrapperWidth = this.elDDWrapper.getSize()["size"]["x"]; //4 less for padding
		
		//where to do this else?
		this.elDDMenu.setStyles({ "width":this.elDDWrapperWidth });

		this.elDDBtn = elDDMenu.getElement(".dropdown-btn");
		this.hideDDMenuTimer;
		
		this.fxDDMenu = new Fx.Styles(elDDMenu, {duration:this.iFxDuration, transition:Fx.Transitions.Sine.easeInOut}); 

		this.addButtonEvents();
		this.addDDMenuEvents();
		this.addMenuItemsEvents();

	},
	hideDDMenu: function(){
		this.fxDDMenu.stop().start({'height' : this.iDDMenuStartHeight});
		//this.timerHideDDMenu = $clear(this.timerHideDDMenu);
	},
	showDDMenu: function(){
		this.fxDDMenu.stop().start({'height' : this.iDDMenuEndHeight});
		this.timerHideDDMenu = $clear(this.timerHideDDMenu);
	},
	addButtonEvents: function(){
		this.elDDBtn.addEvent("click", function(){
			if(this.elDDMenu.getSize()["size"]["y"] <= this.iDDMenuStartHeight){
				this.showDDMenu();
			} else {
				this.hideDDMenu();
			}	
		}.bindWithEvent(this));

	},
	addDDMenuEvents: function(){
		this.elDDMenu.addEvent("mouseenter", function(){
			if(this.elDDMenu.getSize()["size"]["y"] >= this.iDDMenuStartHeight){
				this.showDDMenu();
			}
			//this.elDDMenu.removeEvent("mouseenter");
		}.bindWithEvent(this));

		this.elDDMenu.addEvent("mouseleave", function(){
			this.timerHideDDMenu = this.hideDDMenu.delay(500, this);
		}.bindWithEvent(this));
	},
	calculateDropDownHeight: function(){
		//loop over amount of <a href> x 20px + the title that is active
		var retHeight = ($$(".gallerie-title .title")[0] != null) ? $$(".gallerie-title .title")[0].getSize()["size"]["y"] : 20;
		
		this.elDDMenu.getElements("a").each(function(el){
			retHeight = retHeight + el.getSize()["size"]["y"];
		});

		return retHeight;
	},
	addMenuItemsEvents: function(){
		this.elDDMenu.getElements("a").each(function(el){
			var fxListItem = new Fx.Styles(el, {duration:400, transition:Fx.Transitions.Sine.easeInOut});
			el.addEvent('mouseenter', function(){
				fxListItem.stop().start({'color' : _HOVERCOLOR});
			});
			el.addEvent('mouseleave', function(){
				fxListItem.stop().start({'color' : _NORMALCOLOR});
			});
		});
	}
	
});

DropDownMenu.implement(new Events);
DropDownMenu.implement(new Options);