Ext.ns('Ext.ux');

Ext.ux.SimpleDropdown = Ext.extend(Ext.util.Observable, {
	el: null,
	triggerEl: null,
	triggerEvent: 'click',
	height: 0,
	hideOnReady: true,
	hidden: false,
	constructor: function(el, config)
	{
		config = config || {};
		Ext.apply(this, config);
		this.el = el;

		Ext.ux.SimpleDropdown.superclass.constructor.call(this, config);

		this.addEvents(
			'trigger',
			'triggered'
		);

		this.initMarkup();
		this.initListeners();
	},

	initMarkup: function()
	{
		var xy = this.el.getXY();
		this.el.setPositioning({position: 'absolute'});
		this.el.setXY(xy);
		this.height = this.el.getHeight();
		this.el.setStyle('overflow', 'hidden');
		if (this.hideOnReady) this.hide(true);
	},

	initListeners: function(ev)
	{
		this.triggerEl.on(this.triggerEvent, function(){
			Ext.EventObject.preventDefault();
			Ext.EventObject.stopPropagation();
			var cmd = '';
			if (this.hidden)
			{
				cmd = 'show';
				this.fireEvent('trigger', cmd, this);
				this.show();
			}
			else
			{
				cmd = 'hide';
				this.fireEvent('trigger', cmd, this);
				this.hide();
			}

			this.fireEvent('triggered', cmd, this);
			return false;
		}, this);
		Ext.each(this.el.query('a'), function(item){
			Ext.get(item).on('click', function(ev){
				window.location.href=ev.target.href;
			});
		}, this);
	},

	hide: function(immediatly)
	{
		this.hidden = true;
		if (immediatly)
		{
			this.el.setHeight(0);
		}
		else
		{
			this.el.setHeight(0, true);
		}
	},

	show: function()
	{
		this.hidden = false;
		this.el.setHeight(this.height, true);
	}
});