// CONTENT SENT FROM SERVER **MUST** BE SENT AS text/xml!!!
var req;
function loadXMLDoc(url) {
    document.getElementById("cityField").disabled=true;
    // branch for native XMLHttpRequest object
    if (window.XMLHttpRequest) {
        req = new XMLHttpRequest();
        req.onreadystatechange = processReqChange;
        req.open("GET", url, true);
        req.send(null);
    // branch for IE/Windows ActiveX version
    } else if (window.ActiveXObject) {
        req = new ActiveXObject("Microsoft.XMLHTTP");
        if (req) {
            req.onreadystatechange = processReqChange;
            req.open("GET", url, true);
            req.send();
        }
    } else {
        // The browser cannot support dynamic City loading - say so
        elem = document.getElementById('cityField');
        clearElemChildren(elem);
        var opt = document.createElement("option");
        opt.value = "";
        opt.appendChild(document.createTextNode('Your browser cannot support City searching'));
        elem.appendChild(opt);
    }
}

function clearElemChildren(elem) {
    while (elem.childNodes.length > 0) {
        elem.removeChild(elem.firstChild);
    }
}

function processReqChange() {
    // only if req shows "loaded"
    if (req.readyState == 4) {
        // only if "OK"
        if (req.status == 200) {
            // ...processing statements go here...
            var elem = document.getElementById('cityField');
            while (elem.childNodes.length > 0) {
                elem.removeChild(elem.firstChild);
            }
            elem.disabled = false;
            buildCityList();
        } else {
            // We had an error - keep the element disabled and write an error
            elem = document.getElementById('cityField');
            clearElemChildren(elem);
            var opt = document.createElement("option");
            opt.value = "";
            opt.appendChild(document.createTextNode('Cannot retrieve City data'));
            elem.appendChild(opt);
        }
    }
}

function buildCityList() {
    var select = document.getElementById("cityField");
    var items = req.responseXML.getElementsByTagName("city");
    appendToSelect(select,'', 'City');
    for (var i=0; i<items.length; i++) {
        appendToSelect(select, items[i].attributes[0].value, items[i].childNodes[0].nodeValue);
    }

    if (items.length == 0) { appendToSelect(select,"", 'No Cities Found'); }
    // Try to set the city drop-down to the session City value, if it is present.
    var cityField = select;
    if (currCity) {
        for (var n=0; n < cityField.options.length; n++) {
            if( cityField.options[n].value == currCity ) {
                if((document.all)) {
                    cityField.options[n].setAttribute('selected',true);
                } else {
                    cityField.selectedIndex = n;
                }
                break;
            }
        }
    }
}

function appendToSelect(select, value, content) {
    var opt;
    opt = document.createElement("option");
    opt.value = value;
    opt.appendChild(document.createTextNode(content));
    select.appendChild(opt);
}

function changedCountry() {
    var countryField = document.getElementById("country");
    var stateProvince = document.getElementById("stateProvince");
    var cityField = document.getElementById("cityField");
    if ((countryField.value == "US") || (countryField.value == "CA")) {
        if (stateProvince.value == "") {
            stateProvince.disabled = false;
            clearElemChildren(cityField);
            appendToSelect(cityField,'', 'City');
            cityField.disabled = true;
        } else {
            stateProvince.value = "";
            stateProvince.disabled = false;
            clearElemChildren(cityField);
            appendToSelect(cityField,'', 'City');
            cityField.disabled = true;
        }
    } else {
        if (countryField.value != "") {
            stateProvince.value = "";
            stateProvince.disabled = true;
            constructXMLQuery();
        } else {
            stateProvince.value = "";
            stateProvince.disabled = true;
            clearElemChildren(cityField);
            appendToSelect(cityField,'', 'City');
            cityField.disabled = true;
        }
    }

    if ((countryField.value != "US") && (f.rateRange)) { f.rateRange.disabled = true; f.rateRange.value = ""; }
    else { if (f.rateRange) { f.rateRange.disabled = false; } }
}

function changedStateProv() {
    var countryField = document.getElementById("country");
    var stateProvince = document.getElementById("stateProvince");
    var cityField = document.getElementById("cityField");
    if (self.setCountry) { setCountry(f, f.stateProvince); }
    if (self.stateProvince_onChange) { stateProvince_onChange(); }
    if (stateProvince.value != "") {
        if (countryField.value != "") {
            constructXMLQuery();
        }
    }
}

function constructXMLQuery() {
    var countryField = document.getElementById("country").value;
    var stateProvince = document.getElementById("stateProvince").value;
    var url = "/dp/en_US/common/search/get_cities.jsp?" + "country=" + countryField + "&state=" + stateProvince;
    loadXMLDoc(url);
}

// Initialize form correctly
function initCities() {
    var countryField = document.getElementById("country");
    var stateProvince = document.getElementById("stateProvince");
    var cityField = document.getElementById("cityField");
    if ((countryField.value == "US") || (countryField.value == "CA")) {
        stateProvince.disabled = false;
        if (stateProvince.value != "") {
            constructXMLQuery();
        }
    } else {
        if (countryField.value != "") {
            constructXMLQuery();
        } else {
            stateProvince.value = "";
            stateProvince.disabled = true;
            cityField.value = "";
            cityField.disabled = true;
        }
    }

    if ((countryField.value != "US") && (f.rateRange)) { f.rateRange.disabled = true; f.rateRange.value = ""; }
    else { if (f.rateRange) { f.rateRange.disabled = false; } }
}

function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            oldonload();
            func();
        }
    }
}

addLoadEvent(function () {
    initCities();
});