
var SelectLikeDropDown = new Class({
	Implements: [Events, Options],
	options: {
		trigger: null,
		dropDown: null,
		animInSpeed: 600,
		animOutSpeed: 300
	},
	initialize: function(options) {
		this.setOptions(options);
		this.isExtended = false;
		this.isAnimating = false;
		this.trigger = $(this.options.trigger);
		this.dropDown = $(this.options.dropDown);
		this.menuHeight = this.dropDown.getSize().y;
		this.trigger.addEvent('click', this.showHide.bind(this));
		document.addEvent('click', this.windowClick.bind(this));
	},
	showHide: function(e) {
		if (Browser.Engine.trident) this.trigger.blur();
		if (!this.isExtended && !this.isAnimating) {
			this.animateMenuIn();
		} else if (this.isExtended && !this.isAnimating) {
			this.animateMenuOut();
		}
	},
	windowClick: function(e) {
		if (this.isExtended) {
			(function() { if (this.isExtended && !this.isAnimating) { this.animateMenuOut(); } }).delay(1, this);
		}
	},
	animateMenuIn: function() {
		this.isAnimating = true;
		this.dropDown.setStyles({ 'height': 0, 'display': 'block', 'visibility': 'visible' });
		new Fx.Morph(this.dropDown, { 'duration': this.options.animInSpeed }).set({ 'height': 0 }).start({ 'height': this.menuHeight }).chain(function() {
			this.isAnimating = false;
			this.isExtended = true;
			return false;
		}.bind(this));
	},
	animateMenuOut: function() {
		this.isAnimating = true;
		new Fx.Morph(this.dropDown, { 'duration': this.options.animOutSpeed }).set({ 'height': this.menuHeight }).start({ 'height': 0 }).chain(function() {
			this.isAnimating = false;
			this.isExtended = false;
			return false;
		} .bind(this));
	}
});
