var CustomSelect = Class.create();

CustomSelect.prototype = {
	initialize: function(name)
	{
		if (!($(name))) return;
		this.name = name;
		Event.observe(document, 'click', this.toggle.bindAsEventListener(this));
		Event.observe(document, 'keyup', this.close.bindAsEventListener(this));
	},

	toggle: function(event)
	{
		var target = Event.element(event);
		if (target.id == this.name+'Control')
		{
			event.stop();
			if ($(this.name).getStyle('display') == 'block')
				$(this.name).setStyle({display: 'none'});
			else
				$(this.name).setStyle({display: 'block'});
		}
		else
		{
			$(this.name).setStyle({display: 'none'});
		}
	},

	close: function(event)
	{
		if (event.keyCode == 27)
			$(this.name).setStyle({display: 'none'});
	}
}

document.observe('dom:loaded', function()
{
	new CustomSelect('CityList');
});