// On DOM ready
$(function() {

    var container = $('#top_search'),
    input = $('[name=term]', container),
    main_search_cache = {},
    requests = [],
    request_count = 0,
    loader = $('.search-ajax-loader', container);

    $('form', container).submit(function(e) {
	    e.preventDefault();
	    input.autocomplete('search');
	});

    function blur()
    {
        if (input.width() == 188)
        {
            return;
        }
        var width = 388,
        container_width = 441;

        input.width(width);
        container.width(container_width);
        setTimeout(function () {
            var cnt = 1;
            var interv = setInterval(function() {
                input.width(input.width() - 50);
                container.width(container.width() - 50);
                cnt += 1;
                if (cnt == 5)
                {
                    clearInterval(interv);
                }
            }, 20);
        }, 100);
        console.log('bluuuur');
    }

    function focus()
    {
        var cnt = 1,
        width = 188,
        container_width = 241;

        input.width(width);
        container.width(container_width);
        var interv = setInterval(function() {
            width = 188;
            container_width = 241;
            input.width(input.width() + 50);
            container.width(container.width() + 50);
            cnt += 1;
            if (cnt == 5)
            {
                input.autocomplete('search');
                clearInterval(interv);
            }
        }, 20);
    }

    /* Search auto complete field */
    input
    .keypress(function(e) {
        $.each(requests, function(index, req) {
            req.abort();
        });
        requests = [];
        if (e.which == 13)
        {
            e.preventDefault();
            input.autocomplete('search');
        }
    })
    .focus(focus)
    .blur(blur)
    .autocomplete({
        selectFirst: true,
        source: function( request, response ) {

            var term = request.term;

            if (request.term != input.val()) return;

            if ( term in main_search_cache ) {
                loader.hide();
                response( main_search_cache[ term ] );
                return;
            }
       
            if ( ! loader.is(':visible'))
            {
                loader.show(); 
            }
          
            requests.push($.getJSON( "/search/?all=1", request, function( data, status, xhr ) {
                main_search_cache[ term ] = data;
                response( data );
                loader.hide();
            }));
            return false;
        },
        minLength: 1,
        focus: function() {
            // prevent value inserted on focus
            return false;
        },
        open: function() {
            var aut = $('.soundium-autocomplete-1');
            aut.css('top', '40px');
            
            if ( ! $('li.arrow', aut).size())
            {
                aut.prepend('<li class="arrow"></li>')
            }
            
            $('li.arrow', aut).next().addClass('first');
            $('li:last', aut).addClass('last');
        },
        select: function(e, ui) {
            load_content(ui.item.href);
            return false;
        }
    })
    .data('autocomplete')._renderItem = function( ul, item ) {
    
        var title = item.title.replace(new RegExp("(" + input.val() + ")", "gi"),'<span style="color: #fff !important;">$1</span>');

        if ( ! item.href)
        {
            item.href = "javascript: return false;";
        }

        var a = $('<a style="display: block; line-height: 1.6;"></a>')
                    .click(function() { input.autocomplete('close'); })
                    .attr('href', item.href)
                    .html(title);

        if (item.type)
        {
            a.prepend('<span style="color: #00de7e;">' + item.type  + '</span> &nbsp;');
        }
        else
        {
            a.css('background-color', '#333 !important');
        }

        var li = $('<li></li>')
            .data( "item.autocomplete", item )
            .append(a);

        if ( ! item.type)
        {
            li.css('background-color', '#333 !important').css('border-radius', '8px');
        }
            
        $(ul).addClass('soundium-autocomplete-1');
        li.appendTo(ul);
        return ul;
     };
     
});