function SelectBox(element)
{
    if (element.addEventHandler == null)
        element = Control(element);
        
    element.setOptions    = SelectBox.prototype.setOptions;
    element.removeOptions = SelectBox.prototype.removeOptions;
    element.addOption     = SelectBox.prototype.addOption;
    element.getValue      = SelectBox.prototype.getValue;
    element.getText       = SelectBox.prototype.getText;
    element.getIndex      = SelectBox.prototype.getIndex;
    element.setValue      = SelectBox.prototype.setValue;
    element.setText       = SelectBox.prototype.setText;
    element.setIndex      = SelectBox.prototype.setIndex;
    
    return element;
}

// Set the select box's available options.
SelectBox.prototype.setOptions = function(options)
{
    this.removeOptions();
    
    if (options instanceof Array)
    {
        for (var i = 0; i < options.length; ++i)
            this.addOption(options[i], options[i]);
    
    }
    else
    {
        for (var value in options)
            this.addOption(value, options[value]);
    }
}

SelectBox.prototype.removeOptions = function()
{
    this.setContent([]);
}

SelectBox.prototype.addOption = function(value, label, index)
{
    if (index == null)
        index = this.options.length;
        
    this.insertBefore
    (
        createElement("option", {"value": value}, label),
        this.options[index]
    );
}

// Gets the value of the selected option.
SelectBox.prototype.getValue = function()
{
    if (this.selectedIndex < 0 || this.selectedIndex >= this.options.length)
        return null;
        
    return this.options[this.selectedIndex].value;
};

// Gets the text of the selected option.
SelectBox.prototype.getText = function()
{
    if (this.selectedIndex < 0 || this.selectedIndex >= this.options.length)
        return null;
        
    return this.options[this.selectedIndex].text;
};

// Gets the index of the selected option.
SelectBox.prototype.getIndex = function()
{
    return this.selectedIndex;
};

// Sets the value of the select box.
SelectBox.prototype.setValue = function(value)
{
    for (var i = 0; i < this.options.length; ++i)
    {
        if (this.options[i].value == value)
        {
            this.setIndex(i);
            return;
        }
    }
};

// Sets the text of the select box.
SelectBox.prototype.setText = function(text)
{
    for (var i = 0; i < this.options.length; ++i)
    {
        if (this.options[i].text == text)
        {
            this.setIndex(i);
            return;
        }
    }
};

// Sets the index of the selected option.
SelectBox.prototype.setIndex = function(index)
{
    this.selectedIndex = index;
    this.triggerEvent("change");
};

