var Dropdown = {
	ul : undefined,
	fx : undefined,
	toggle : undefined,
	corresponding_element : undefined,

	initialize : function(){
		this.parent();
	},

	dropdown : function(){
		this.fx = new Fx.Slide( this.getElement('ul:last-child') , {duration : 500} );
		/**
		 * set z-indexes for collisions
		 */
		var _parent;
		this.fx.addEvent( 'start' , (function(){
			if ( this.fx.open == false ) {
				this.setStyle('z-index' , counter);
				_parent = this.getParents('.inputWrap');
				if ( _parent.length > 0 )
					_parent.shift().setStyle( 'z-index' , counter );
				counter = counter + 1;
			}
		}).bind(this) );
		this.fx.addEvent( 'complete' , (function(){
			if ( this.fx.open == false ) {
				this.setStyle('z-index' , 10);
				_parent = this.getParents('.inputWrap');
				if ( _parent.length > 0 )
					_parent.shift().setStyle( 'z-index' , 10 );
			}
		}).bind(this) );
		this.fx.hide();
		this.toggle = this.getElement('a.toggle');
		this.toggle.addEvent('click' , this._toggle.bind(this) );
	},

	set_value_of : function(element){
		this.corresponding_element = element;
		this.corresponding_element.setStyle( 'display' , 'none' );
		this.getElements('ul.drop li a').addEvent('click' , this._update_value.bind(this));
	},

	_update_value : function(e){
		e.stop();
		this.corresponding_element.set('value' , e.target.get('href').replace(/^#/,''));
		this.getElement('ul.title a').set('text' , e.target.get('text') );
		this._toggle();
	},

	_toggle : function(e){
		this.fx.toggle();
		return false;
	}
},
counter = 11;

Element.implement(Dropdown);