$(function() {
    function loadStates() {
        var country = $('#country').val();
        if (!country) return;

        if (country == 'United States' || country == 'Canada') {
            $('#state').removeAttr('disabled');
            $('#state').html('<option>Loading...</option>');
            $.getJSON('/search/get-states', { country: country }, function(states) {
                var html = '<option value="">Select a state</option>';
                $(states).each(function() {
                    html += '<option value="' + this + '">' + this + '</option>';
                });
                $('#state').html(html);
                loadCities();
            });
        } else {
            $('#state').html('<option>Not Available</option>').attr('disabled', true);
            loadCities();
        }
    };

    function loadCities() {
        $('#city').html('<option>Loading...</option>');
        $.getJSON('/search/get-cities', { country: $('#country').val(), state: $('#state').attr('disabled') ? '' : $('#state').val() }, function(cities) {
            var html = '<option value="">Select a city</option>';
            $(cities).each(function() {
                html += '<option value="' + this + '">' + this + '</option>';
            });
            $('#city').html(html);
        });
    };

    $('#country').change(loadStates);

    $('#state').change(loadCities);

    $('.finder-do').click(function() {
        $('#finder').submit();
    });

    $('#country').change();
    $('#city').change();
    $('.date').datepicker();
});