Selectbox = Class.create({
	initialize: function(parent_element, options){
		this.options = {
			parentElement: '',
			label: "More Actions...",
			effect: 'blind',
			effectDuration: 0.2,
			makeTypable: false,
			direction: 'down',
			showing: false,
			actions: {}
		};
		this.keyhandler = function(e){
			if($$("#"+parent_element+" ul.selectbox_actions li.active")[0])
				var activeListItem = $$("#"+parent_element+" ul.selectbox_actions li.active")[0];
			else var activeListItem = $$("#"+parent_element+" ul.selectbox_actions li")[0];
			activeListItem.addClassName('active');
			if(e.keyCode == Event.KEY_DOWN){
				if(activeListItem.next()){
					activeListItem.removeClassName('active');
					activeListItem.next().addClassName('active');
					activeListItem = activeListItem.next();
				}
			}
			else if(e.keyCode == Event.KEY_UP){
				if(activeListItem.previous()){
					activeListItem.removeClassName('active');
					activeListItem.previous().addClassName('active');
					activeListItem = activeListItem.previous();
				}
			}
			else if(e.keyCode == Event.KEY_RETURN){
				var k = activeListItem.innerText;
				$H(clone.options.actions).get(k)();
				document.stopObserving('keydown', this.keyHandler);
				return clone.hide();
			}
			else if(e.keyCode == Event.KEY_ESC){
				return clone.hide();
			}
		};
		Object.extend(this.options, options);
		this.options.parentElement = parent_element;
		$(parent_element).insert("<div class=\"selectbox\">"+
		(this.options.direction == "up" ? "<ul style=\"display: none;\" class=\"selectbox_actions\"></ul>" : "")+
		"<p><a href=\"#selectbox\">"+this.options.label+"</a></p>"+
		(this.options.direction == "down" ? "<ul style=\"display: none;\" class=\"selectbox_actions\"></ul>" : "")+
		"<img src=\"images/up_arrow.png\" class=\"selectbox_arrow\" alt=\"^\"></div>");
		var list = $$("#"+parent_element+" ul.selectbox_actions");
		var clone = this;
		$$("#"+parent_element+" div.selectbox")[0].observe('click', function(){clone.toggle()});
		this.options.actions.each(function(action){
			clone.add(action.key, action.value);
		});
		return clone;
	},
	
	//isShowing Selectbox -> bool
	isShowing: function(){
		return this.options.showing;
	},
	
	//show Selectbox -> Selectbox
	show: function(){
		if(this.isShowing()) return this;
		else{
			if(!$$("#"+this.options.parentElement+" ul.selectbox_actions li.active")[0])
				$$("#"+this.options.parentElement+" ul.selectbox_actions li")[0].addClassName('active');
			$$("#"+this.options.parentElement+" img.selectbox_arrow")[0].setAttribute("src", "images/down_arrow.png");
			var list = $$("#"+this.options.parentElement+" ul.selectbox_actions")[0];
			if(this.options.effect == "none")
				list.show();
			else
				new Effect.toggle(list, this.options.effect, {duration: this.options.effectDuration});
			document.observe('keydown', this.keyhandler);
			document.fire("selectbox:show");
			this.options.showing = true;
		}
		return this;
	},
	
	//hide Selectbox -> Selectbox
	hide: function(){
		Event.stopObserving(document, 'keydown', this.keyhandler);
		if(!this.isShowing()) return this;
		else{
			$$("#"+this.options.parentElement+" img.selectbox_arrow")[0].setAttribute("src", "images/icons/up_arrow.png");
			var list = $$("#"+this.options.parentElement+" ul.selectbox_actions")[0];
			if(this.options.effect == "none")
				$$("#"+this.options.parentElement+" ul.selectbox_actions")[0].hide();
			else
				new Effect.toggle(list, this.options.effect,{duration: this.options.effectDuration});
			this.options.showing = false;
		}
		document.fire("selectbox:hide");
		return this;
	},
	
	//toggle Selectbox -> Selectbox
	toggle: function(){
		if(this.isShowing()) return this.hide();
		else return this.show();
	},
	
	//add string*function -> 
	add: function(label, fn){
		$$("#"+this.options.parentElement+" ul.selectbox_actions")[0].insert({bottom: "<li>"+label+"</li>"});
		var actions = $$("#"+this.options.parentElement+" ul.selectbox_actions li");
		actions[actions.length-1].observe('click', fn);
		return this;
	},
	
	//remove string -> Selectbox
	remove: function(label){
		$$("#"+this.options.parentElement+" ul.selectbox_actions li").each(function(n){
			if(n.innerText == label){
				n.stopObserving();
				n.remove();
			}
		});
		return this;
	}
});