var SelectField = function ()
{
	this.mode = 'default';
	this.MODE_DEFAULT = 'default';
	this.MODE_MULTI = 'multi'; //multiple select field mode. Adds special handling on form.getData()
	this.type = 'SelectField';
	var ref = this;
	
	this.dom_label = createElement ('div', 'label');
	this.dom_root = createElement ('div', 'SelectField');
	this.dom_input = createElement ('select');
  this.dom_description = createElement('div','description');
  this._domErrorMessage = createElement('div', 'errorMessage');
  this._domErrorMessage.style.display = 'none';
  
	this.hook_select = function()
	{
		// This function is needed even though it is empty. Do not remove it.
	}
	
	this.getDomRoot = function()
	{
		return this.dom_root;
	}
	
	this.getMode = function()
	{
		return this.mode;
	}
	this.setMode = function(mode)
	{
		//if we are switching to a multi select field, we need to recreate the select field. IE 6 doesnt like changing select fields to multiple, after creation
		if(this.mode != this.MODE_MULTI && mode == this.MODE_MULTI)
		{
			var b = new Browser()
			if(b.isIE)
			{
				var tmpName = this.getName();
				this.dom_input = createElement ('<select multiple="true"></select>');
				this.setName(tmpName);
			}
		}
		this.mode = mode;		
		if(this.getMode() == this.MODE_MULTI)
		{
			this.dom_input.multiple = 'true';
		}
	}
  
	this.setError = function(message)
	{
    var parts = ref.dom_root.className.split(' error');
    ref.dom_root.className = parts[0]+' error';
    ref._domErrorMessage.innerHTML = message;
    ref._domErrorMessage.style.display = 'block';
	}
  
	this.unsetError = function()
	{
    var parts = ref.dom_root.className.split(' error');
    ref.dom_root.className = parts[0];
    ref._domErrorMessage.style.display = 'none';
	}
  
	this.draw = function ()
	{
		if(this.getHidden())
		{
			return createElement('div', 'hiddenControl');
		}
		removeAllChildren(this.dom_label);
    this.dom_label.innerHTML = this.label;
		this.dom_input.name = this.name;
		this.dom_input.id = this.name;
		this.dom_input.onchange = function()
		{
			ref.hook_select(ref.getValue());
		}
		
		if(this.getMode() == this.MODE_MULTI)
		{
			this.dom_input.multiple = true;
		}
		
		if(this.getTabOrder() !== null && this.getTabOrder() !== undefined)
		{
			this.dom_input.tabIndex = this.getTabOrder();
		}
		
		if(this.description)
		{
			this.dom_description.innerHTML = this.description;
		}
		this.dom_root.appendChild (this.dom_label);
		this.dom_root.appendChild (this.dom_input);
		this.dom_root.appendChild(this.dom_description);

		this.getDomRoot().appendChild(this._domErrorMessage);

		return this.dom_root;
	}
	
	this.setValue = function (value)
	{
		this.value = value;
	}
	
	this.getValue = function()
	{
		return this.getSelected();
	}
	
	this.setOptions = function(options)
	{
		var option;
		if(this.mode != this.MODE_MULTI)
		{
			// probably need to make please select configurable
			option = createElement('option','option');
			option.setAttribute('value','');
			// this should also be configurable as it forces someone to select the value
	    //option.disabled = true;
			option.innerHTML = 'Please select...';
			this.dom_input.appendChild(option);
		}
		
		
		for(value in options)
		{
			// skip blank options
			if(options[value] == '')
			{
				continue;
			}
			option = createElement('option','option');
			option.setAttribute('value', value);
			if(value == this.getValue())
			{
				option.selected = true;
			}
			option.appendChild(document.createTextNode(options[value]));
			this.dom_input.appendChild(option);
		}
	}
	
	this.clearOptions = function()
	{
		removeAllChildren(this.dom_input);
	}
	
	this.setSelected = function(selectedOptions)
	{
		if(this.getMode() == this.MODE_MULTI)
		{
			var newindex = 0;
			
			for(select in selectedOptions)
			{
				var i = parseInt(selectedOptions[select]);
				//FOR..IN loop here breaks in IE!
				for(var optkey = 0; optkey < this.dom_input.options.length; optkey++)
				{
					if (this.dom_input.options[optkey].value==i)
					{
						this.dom_input.options[optkey].selected = true;
					}
				}
			}
		}
		else
		{
			this.dom_input.value = selectedOptions;
		}
	}
	
	this.getSelected = function()
	{
		//if a multi select field, return an array/object of selected values
		if(this.getMode() == this.MODE_MULTI)
		{
			var selectedOptions = new Object();	
			var newindex = 0;
			
			for (var optkey = 0; optkey < this.dom_input.options.length; optkey++)
			{
				if (this.dom_input.options[optkey].selected)
				{
					selectedOptions[newindex] = this.dom_input.options[optkey].value;
					newindex++;
				}
			}
			
			return selectedOptions;
		}
		
		//for normal selects just return selected value
		return this.dom_input.value;
	}
	
	this.disable = function()
	{
		this.dom_input.disabled = true;
	}
	
	this.enable = function()
	{
		this.dom_input.disabled = false;
	}
}

SelectField.prototype = new FormField();