var loading_img = document.createElement('IMG');
$(loading_img).attr('class', 'loading_img');
$(loading_img).attr('src', '/shared/img/ajax-loader.gif');


function start_filter()
{
    $('.loading_img').remove();
    $(this).parents('.pane').find('input[type="button"]').attr('disabled', 'disabled');
    $(loading_img).insertAfter($(this).parents('.pane').find('input[type="button"]').first());
    $(loading_img).show();
}


function stop_filter()
{
    $(this).parents('.pane').find('input[type="button"]').removeAttr('disabled');
    $('.loading_img').remove();
}


function find_location(req, add)
{
    $(this).children('.find_results').html('');
    $(this).children('.location_string').html('');
    if ('object' == typeof xhr)
    {
        xhr.abort();
    }
    xhr = $.ajax({
        url: location_search_url,
        dataType: 'json',
        type: 'POST',
        data: req,
        success: function(data){
            if (data.response == 'true') {
                add(data.message);
            }
        }
    });
}


function search_location(search_btn)
{
    start_filter.call($(search_btn));

    var search_field = $(this);
    var term = $(this).val();
    // clear old data
    $('.find_results').html('');
    $("#signup_dialog").html('');
    //$(this).children('.location_string').html('');
    if ('object' == typeof xhr)
    {
        xhr.abort();
    }
    xhr = $.ajax({
        url: location_search_url,
        dataType: 'json',
        type: 'POST',
        data: {
            term: term
        },
        success: function(data){
            if (data.response == 'true') {
                // populate dialog with search results
                $.each(data.message, function (index, value) {
                    var link = document.createElement('a');
                    var location = value.label;
                    // var capitalString = location.charAt(0).toUpperCase() + location.slice(1);
                    var capitalString = location.replace(/\w\S*/g, function(txt){
                        return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
                    })
                    $(link).html(capitalString + "<br>");
                    $(link).attr('city_id', value.city_id);
                    $(link).attr('state_id', value.state_id);
                    $(link).attr('country_id', value.country_id);
                    // each result is a link with a click event calling select_location
                    $(link).click(function() {
                        var ui = {
                            'item': {}
                        };
                        ui.item.city_id = $(this).attr('city_id');
                        ui.item.state_id = $(this).attr('state_id');
                        ui.item.country_id = $(this).attr('country_id');
                        select_location.call($(search_field), '', ui);
                        $(search_field).val($(this).html());

                        $(search_btn).click();

                        stop_filter.call($(search_btn));

                        $("#signup_dialog").dialog('close');
                        $("#signup_dialog").html('');
                    });

                    $(link).appendTo($("#signup_dialog"));
                });
                $('.loading_img').remove();
                $("#signup_dialog").dialog({
                    model: true,
                    width: 500,
                    height:400,
                    title: "Please select your location",
                    close: function() {
                        stop_filter.call($(search_btn));
                    }
                });
            }
            else
            {
                $('.loading_img').remove();
                $(search_field).parents('.pane').find('.find_results').html("Sorry, we're not familiar with that location.");
                stop_filter.call($(search_btn));
            }
        }
    });
}


function select_location(event, ui)
{
    $(this).parents('.pane').find('.country_id').val(ui.item.country_id);
    $(this).parents('.pane').find('.state_id').val(ui.item.state_id);
    $(this).parents('.pane').find('.city_id').val(ui.item.city_id);
}


$(document).ready(function()
{
    $('#destination_search, #departure_search').autocomplete({
        source: function( request, response )
        {
            start_filter.call($(this));

            // delegate back to autocomplete
            response( $.ui.autocomplete.filter( location_data, request.term ) );

            stop_filter.call($(this));
        }
        , minLength: 2
        , select: function( event, ui )
        {
            select_location.call(this, event, ui);
        }
    });

});