/**
 * Fetch metro areas based on the selected state
 * using AJAX and fill the select options with them. 
 */


function get_metro_area_select_updater(metroarea_select, url) {
    function update_metro_area_select() {
        metroarea_select.attr('disabled', true);
        $.ajax({
            type: "GET",
            url: url,
            dataType: 'json',
            global: false,
            data: metroarea_select.parents('form').serialize(),
            error: function () { metroarea_select.attr('disabled', false); },
            success: (function (metro_area_select) { function success(data) {
                /* grab the 'Any' option if present */
                var newany = null;
                var any = metro_area_select.children('option[value=""]');
                if (any.length) {
                    newany = document.createElement('option');
                    newany.value = any.get(0).value;
                    newany.text = any.get(0).text;
                }
                /* remember the selected one */
                options = metroarea_select.children();
                selected = null;
                for (i=0; i<options.length; i++) {
                    if (options[i].selected) {
                        selected = options[i].value;
                        break;
                    }
                }
                metroarea_select.empty();
                if (newany != null) {
                    metroarea_select.get(0)[0] = newany;
                    offset = 1;
                } else {
                    offset = 0;
                }
                for (i=0; i<data.length; i++) {
                    option = document.createElement('option');
                    option.value = data[i].pk;
                    option.text = data[i].fields.name;
                    if (selected == option.value) {
                        option.selected = true;
                    }
                    metroarea_select.get(0)[i+offset] = option;
                }
                metroarea_select.attr('disabled', false);
            }
            return success;
        })(metroarea_select)}
        );
    }
    return update_metro_area_select;
}

function init_metro_area_select(state_select, metro_area_select, url) {
    var update_metro_area_select = get_metro_area_select_updater(metro_area_select, url);
    if (state_select.children('option').size() > 1) {
        update_metro_area_select();
    }
    state_select.change(function (event) {
        update_metro_area_select();
    });
    return false;
}

$(document).ready(function () {
    var default_metro_area_select = $('#id_metro_area');
    var default_state_select = $('#id_state');
    init_metro_area_select(default_state_select, default_metro_area_select, '/places/metro_areas_from_location/');
});