var MooSelect = new Class({
	initialize: function(selectID, options){
		this.setOptions({
			"selectClass":"MooSelect",
			"fxDuration": 300,
			"fxTransition": Fx.Transitions.Quad.easeOut,
			"onSelect": Class.empty
		}, options);
	
		if(!$(selectID) || $(selectID).getTag() != "select") return;
		
		this.selectBox = $(selectID);
		if(!this.selectBox.hasClass("MooSelect-replaced")){
			this.render();
		}
	},
	
	reset: function(){
		this.selected.setText(this.boxValues[0][1]);
		this.selectBox.value = "";
	},
	
	expand: function(){
		this.fx.slideIn();
	},
	
	collapse: function(){
		this.fx.slideOut();
	},
	
	toggle: function(){
		this.fx.toggle();
	},
	
	changeSelected: function(el){
		var v = el.getProperty("rel");
		var t = el.getText();
	
		this.selected.setProperty("rel", v);
		this.selected.setText(t);
		this.selectBox.value = v;
		
		if(this.options.onSelect) this.options.onSelect(v, t, this);
		
		this.collapse();
		
	},
	
	getSelected: function(){
		return [this.selected.getProperty("rel"), this.selected.getText(), this];
	},
	
	render: function(){
		this.boxValues = [];
		this.list = new Element("ul", { "class": this.options.selectClass + "_options"});
		
		this.selectBox.getChildren().each(function(o, i){
			this.boxValues.push([o.getProperty("value"), o.getText()]);
				
			if(o.getProperty("value") != ""){
				var li = new Element("li", {
					"class": this.options.selectClass + "_option",
					"rel": this.boxValues[i][0],
					"events": {
						"mouseover": function(){ this.addClass("hover"); },
						"mouseout": function(){ this.removeClass("hover"); }
					}
				}).setText(this.boxValues[i][1]).injectInside(this.list)
			
				li.addEvent("click", (function(e){
					new Event(e).stop();
					this.changeSelected(li);
				}).bind(this));
			}
		}, this);
		
		var pos = this.selectBox.getCoordinates();
		
		this.dropbox = new Element("div", {
			"class": this.options.selectClass
		});
		
		/*
		this.dropbox = new Element("div", {
			"class": this.options.selectClass
		}).setStyles({
			"position": "relative",
			"padding": this.selectBox.getStyle("padding"),
			"margin": this.selectBox.getStyle("margin"),
			"width": pos.width,
			"line-height": pos.height
		});
		*/
		
		this.selected = new Element("div", {
			"class":"selected", 
			"rel": this.boxValues[0][0],
			"events":{
				"click": (function(e){
					new Event(e).stop();
					this.toggle();
				}).bind(this)
			}
		}).setText(this.boxValues[0][1]).injectInside(this.dropbox);
		
		this.dropbox.adopt(this.list);
		
		
		this.selectBox.addClass("MooSelect-replaced").setStyles({
			"visibility":"hidden",
			"display":"none"
		});
		
		this.dropbox.injectBefore(this.selectBox);
		
		this.fx = new Fx.Slide(this.list, {
			"duration": this.options.fxDuration,
			"transition": this.options.fxTransition
		}).hide();
		
		$(document.body).addEvent("click", this.collapse.bind(this));
	}
});

MooSelect.implement(new Options);