/**
 * Example:
 *------------------------------------------------------------------
    Select.registerParentChild( 'drpCountry'
                              , 'drpState'
                              , {   getOptions: 
                                        function(val)
                                        { 
                                            return Catalog.Country.byId[val].states; 
                                        }
                                ,   emptyItemText: "Select state"
                                }
                              );
*------------------------------------------------------------------
*/
Select = function(id, classname)
{ 
    this.attributes = {id: id, "class": classname};
    this.clear();
}
Select.Item = function(text, value)
{
    this.text = text;
    this.value = value || text;
}
Select.Item.prototype.toString = function()
{
    return ['<option value="',this.value,'">', this.text, '</option>'].join("");
}
Select.prototype.add = function(text, value)
{
    this.items[this.items.length] = new Select.Item(text, value);
}
Select.prototype.clear = function()
{
    this.items = [];
}
Select.prototype.loadOptions = function(arr)
{
    for(var i = 0; i < arr.length; i++)
        this.add( arr[i].name, arr[i].id );
}
Select.prototype.toString = function()
{
    var each;
    var s = ["<select "];
    for(each in this.attributes)
    {
        s[s.length] = each;
        s[s.length] = '="';
        s[s.length] = this.attributes[each]
        s[s.length] = '" '
    }
    s[s.length] = ">"
  
    s = s.concat( this.items ); 
    
    s[s.length] = "</select>"
    
    return s.join("");
}
Select.changesEvents = {};
Select.defaults = { text: 'name'
                  , value: 'id'
                  , emptyItemValue: "0"
                  , emptyListText: "-----"
                  };
Select.bind = function (oSelect, arrOptions, oBindProps)
{
    if (typeof(oSelect) == 'string') oSelect = document.getElementById(oSelect);
    
    if (!oBindProps) oBindProps = {};
    for(each in this.defaults)
        if (!oBindProps[each]) oBindProps[each] = this.defaults[each];

    if (!oBindProps.selectedValue)
        oBindProps.selectedValue = oSelect.value;

    var o, isSelected, i = 0;
    while(i < arrOptions.length && i < oSelect.options.length)
    {
        o = oSelect.options[i];
        o.text  = (typeof(oBindProps.text) == 'function')? oBindProps.text(arrOptions[i]) : arrOptions[i][oBindProps.text];
        o.value = arrOptions[i][oBindProps.value];
        i++;
    }
    
    if (oSelect.options.remove)
    {
        while (i < oSelect.options.length)
            oSelect.options.remove(i);
    }        
    else
    {
        while (i < oSelect.options.length)
            oSelect.options[i] = null;
    }
    
    while (i < arrOptions.length){
        o = document.createElement("OPTION");
        o.text  = (typeof(oBindProps.text) == 'function')? oBindProps.text(arrOptions[i]) : arrOptions[i][oBindProps.text];
        o.value = arrOptions[i][oBindProps.value];
        oSelect.options.add(o);
        i++;
    }
    
    if (!arrOptions.length || oBindProps.emptyItemText)
    {
        o = document.createElement("OPTION");
        o.value = oBindProps.emptyItemValue.toString();
        o.text  = (arrOptions.length)? oBindProps.emptyItemText : oBindProps.emptyListText; 
        oSelect.options.add( o, 0);
    }
    
    if (oBindProps.selectedValue)
        oSelect.value = oBindProps.selectedValue;
    else
        oSelect.selectedIndex = 0;
    
    if (oSelect.value.length == 0)
        oSelect.selectedIndex = 0;
}

Select.registerParentChild = function(sParentID, sChildID, oBindPropDefaults )
{
    var oParent = document.getElementById(sParentID);
    var oChild = document.getElementById(sChildID);
    var oBindProps = oBindPropDefaults;
    oBindProps.originalParentValue = oParent.value;
    oBindProps.originalChildValue = oChild.value;
    
    Select.changesEvents[sParentID] = function()
    { 
        var arrOptions = oBindProps.getOptions(oParent.value);

        oBindProps.selectedValue = (oParent.value == oBindProps.originalParentValue)? oBindProps.originalChildValue : "0";
        Select.bind(oChild, arrOptions, oBindProps);
    }
    
    oParent.onchange = new Function("Select.changesEvents['" + sParentID + "']();");
    
    var myEvent;
    if (document.createEvent) {
        myEvent = document.createEvent("HTMLEvents");
        myEvent.initEvent("change", true, true);
        oParent.dispatchEvent(myEvent);
    } else {
        myEvent = document.createEventObject();
        myEvent.eventType = "onchange";
        oParent.fireEvent("onchange", myEvent);
    }
}