var widther = "";
jQuery.fn.selectBox = function(o) {
	return this.each(function() {	
		var oThis = this;
		var oSelected = null;
		var state = 'closed';
		var iSelectedIndex = 0;
		var paddingRight = 20;
		var oSelectOffset = jQuery(this).offset('BODY');
		var selectWidth = jQuery(this).width();
		var selectHeight = jQuery(this).height();
		
		jQuery(this).wrap('<div></div>').css({top:'-1000px',left:'-1000px',position: 'absolute'})//hide();
		var oContainer = jQuery(this).parent().addClass(o.css).css({display:'block'});

		// append html inside the container
		oContainer.append('<div><p></p></div><ul></ul>');
		// assign toggle action

		//FA Main width-height
		if(o.p == 2)
			widther = "105px";
		else
			widther = "57px";		
		jQuery("div",oContainer).css({width: widther, height: '20px'}).toggle(function() {
			positionListElement();
			//FA says: show
			jQuery("ul",oContainer).slideDown('fast');
			jQuery("li",oContainer).removeClass('active');
			if(oSelected == null) {
				jQuery("li:eq(0)",oContainer).addClass('active');	
				oSelected = jQuery("li:eq(0)",oContainer);
			} else {
				oSelected.addClass('active');
			}
			state = 'opened';
			setFocus();
		},function() {
			//FA says: hide			
			jQuery("ul",oContainer).hide('fast');
			state = 'closed';
			setBlur();
		})

		// assign click outside dropdown.
		jQuery().click(function() {
			if(state == 'opened') {
				jQuery("div",oContainer).trigger("click");
			}
		});
		// get values from the option elements and set them in the ul list.
		jQuery(this).keyup(function() {
			setValue();
		}).focus(function() { setFocus(); }).blur(function() { setBlur();});
		oContainer.keyup(function(e) {
			
				var key = getKey(e);
				if(key == 'enter') {
					if(state == 'opened') {
						jQuery("div",oContainer).trigger("click");
					}
				}
		});
		jQuery('option',this).each(function(i) {
			var o = this;
			jQuery(this).click(function() {
				this.selected = true;
				document.getElementById(this.title).value = this.value;
			});
			//FA Says: all the elements
			jQuery("ul",oContainer).append('<li value="' + jQuery(this).text() + '">' +  jQuery(this).text() + '</li>');
			jQuery("li:eq(" + i + ")",oContainer).click(function() {
				jQuery(o).click();
				//FA Says: On close
				jQuery("div",oContainer).trigger("click");
				jQuery("div p",oContainer).html(jQuery(o).text())
				oSelected = $(this)
				//FA Says main overs
			}).mouseover(function() {
				jQuery(this).addClass('active');
				//selectedbb[0] = this;				
				//FA Says: select long combo boxes
				//setFocus();
			}).mouseout(function() {
				jQuery(this).removeClass('active');
				setBlur();
			});
		});
		// set ul list position	
		jQuery("ul",oContainer).hide();

		//FA says, make it selectable
		var selection = function(cat, which, which_value)
		{
			tmp_which = which.substr(3).toLowerCase(); //Removes "li_"
			if(tmp_which.substr(0, 3) == "all") //All is clicked
			{
				for(key in eval(cat))
					$("#li_" + eval(cat + "[key]") + "_ap").css("background-color", "");
				var tmp = eval(cat + '.length');
				eval(cat + ".splice(0, tmp)"); //Resets the combo box
				eval(cat + ".push(which_value)");
				eval(cat + "_fl = true");
			}
			else
			{
				var exist = false;	
				for(key in eval(cat))
				{
					if(eval(cat + "[key]") == oThis.value)
						exist = key;
					if(eval(cat + "[key].substr(1, 3)") == "all") //Removes the "all" element
						eval(cat + ".splice(key, 1)");
				}
				if(!exist) //If the clicked item is new add it
				{
					eval(cat + ".push(which_value)");
					$("#li_" + which_value + "_ap").css("background-color", "#4189CC");
				}
				else //If the clicked item is old, remove it
				{
					eval(cat + ".splice(exist, 1)"); //Resets the combo box	
					$("#li_" + which_value + "_ap").css("background-color", "");
				}
				eval(cat + "_fl = true");						
			}
		}
		
		var positionListElement = function() {
			//FA says: All elements width style
			var oOffset = jQuery("div",oContainer).offset('BODY');
			// FA Says: set ul list position oThis.id
			jQuery("ul",oContainer).css({
				position: 'absolute',
				width: widther,
				height: '260px',
				overflow: 'auto'
				});				
		};
		//FA Says: First loading, select titles
		var setValue = function() {
			var val = jQuery(":selected",oThis).text();
			jQuery("div p",oContainer).css("height", "10px");
			jQuery("div p",oContainer).html(val);
			oSelected = jQuery("li:eq(" + jQuery(oThis)[0].selectedIndex + ")",oContainer);
			jQuery("li",oContainer).removeClass('active');
			oSelected.addClass('active');
		};
		var setFocus = function() {
			jQuery(oThis)[0].focus();
			jQuery("div",oContainer).addClass("focus");
		};

		var setBlur = function() {
			jQuery(oThis)[0].blur();
			jQuery("div",oContainer).removeClass("focus");
		};
		var getKey = function(e) {
			var key = '';
			switch(e.keyCode) {
				case 13: // return
					key = 'enter';
					break;
				case 27:  // esc
					key = 'escape';
					break;
			}
			return key;
		};

		setValue();
				
		jQuery(window).resize(positionListElement);
	});
};