window.onload = function() {
    hookUpAutosubmitElements();
    hookUpRolloverImages();
//    hookUpStartOverButton();
    hookUpLinkToTop();
}

/**
 * Add a confirmation prompt to the "Start Over" button.
 */
function hookUpStartOverButton() {
    var startOverLink = document.getElementById("startover");
    if (startOverLink)
        startOverLink.onclick = function() {
            return confirm("Are you sure you want to start over?  If you answer 'Yes', all vehicles in the selector will be cleared.");
        };
}

/**
 * Look for links and drop-downs with the "autosubmit" style, and set up
 * handlers that will submit their immediate parent FORM when the links
 * are clicked or the drop-down selection is changed.
 */
function hookUpAutosubmitElements() {
    var elements = document.getElementsByTagName("a");
    for (var i = 0; i < elements.length; i++)
        if (elements[i].className.indexOf("autosubmit") != -1)
            elements[i].onclick = submitParentForm;
    elements = document.getElementsByTagName("select");
    for (var i = 0; i < elements.length; i++)
        if (elements[i].className.indexOf("autosubmit") != -1)
            elements[i].onchange = submitAjax;
}

/**
 * This function is attached to certain elements to respond to user events
 * by submitting a FORM.  The FORM is found by navigating the DOM, starting
 * with the element to which this is attached and working upward through
 * several parent elements.  When an element whose 'name' attribute contains
 * "form", it is taken to be a FORM and submitted.
 *
 * Also, when this is attached to a drop-down, prior to submitting the form,
 * all other drop-downs found after the one triggering this function are
 * reset to index 0.
 */
function submitParentForm() {
    var parentForm = this.parentNode;
    for (var i = 10; (i > 0) && parentForm; i--)
        if (parentForm.name && (parentForm.name.indexOf("form") == 0)) {
            var foundMyself = false;
            for (var j = 0; j < parentForm.elements.length; j++)
                if (parentForm.elements[j] == this)
                    foundMyself = true;
                else if (foundMyself)
                    parentForm.elements[j].selectedIndex = 0;
            parentForm.submit();
            break;
        }
        else
            parentForm = parentForm.parentNode;
    return false;
}

/**
 * Submit an Ajax request to the server on behalf of one of the SELECT controls
 * on the Selector Page.  Set up a callback to populate the other drop-downs
 * according to the result.
 */
function submitAjax() {
    var url = "selector-ajax?" + this.name + "=" + this.options[this.selectedIndex].value;
    var thisSelect = this;
    var callback = function(data) {
        populateFromAjax(thisSelect, data);
    };
    doAjaxCall(url, callback);
}

/**
 * Populate the given SELECT control with the keys and values in 'data'.
 * Iterating through the controls within that selector's parent form,
 * remove all but the first (default) option in each subsequent drop-down.
 */
function populateFromAjax(select, data) {
    var phase = 0;
    for (var i = 0; i < select.form.length; i++) {
        if (select.form.elements[i] == select)
            phase = 1;
        else if (phase >= 1) {
            select = select.form.elements[i];
            while (select.length >= phase)
                select.removeChild(select.lastChild);
            if (phase == 1) {
                for (var j = 0; j < data.length; j++) {
                    var option = document.createElement("option");
                    option.value = data[j][0];
                    option.appendChild(document.createTextNode(data[j][1]));
                    select.appendChild(option);
                }
                phase = 2;
            }
        }
    }
}

/**
 * Look for any images on the page having a 'longDesc' attribute, which is
 * used to indicate a rollover image URL, and set up rollover handlers to
 * toggle between the normal image and the rollover image.
 */
function hookUpRolloverImages() {
    var elements = document.getElementsByTagName("img");
    for (var i = 0; i < elements.length; i++)
        if (elements[i].longDesc) {
            elements[i].normalImage = new Image();
            elements[i].normalImage.src = elements[i].src;
            elements[i].rolloverImage = new Image();
            elements[i].rolloverImage.src = elements[i].longDesc;
            elements[i].onmouseover = function() {
                this.src = this.rolloverImage.src;
            };
            elements[i].onmouseout = function() {
                this.src = this.normalImage.src;
            };
        }
}

/**
 * Find the "Back to top" link at the bottom of the page, and set up a smart
 * on-click handler that will scroll to the very top of the page.  This is
 * necessary because the client's Flash-header-insertion JavaScript code bumps
 * our anchor link down from the top of the page, so that just using the link
 * doesn't scroll all the way up.
 */
function hookUpLinkToTop() {
    var link = document.getElementById("backToTop");
    if (link && window.scrollTo)
        link.onclick = function() {
            window.scrollTo(0, 0);
            return false;
        };
}