/***
@title:
Live Search

@version:
2.0

@requires:
jquery, jquery.liveSearch.css

@does:
Use this plug-in to turn a normal form-input in to a live ajax search widget. The plug-in displays any HTML you like in the results and the search-results are updated live as the user types.

@howto:
jQuery('#q').liveSearch({url: '/ajax/search.php?q='}); would add the live-search container next to the input#q element and fill it with the contents of /ajax/search.php?q=THE-INPUTS-VALUE onkeyup of the input.

***/
jQuery.fn.liveSearch = function (conf) {
    var config = jQuery.extend({
        url:      '/?module=SearchResults&q=',
        id:       'jquery-live-search-result',
        duration:   400,
        typeDelay:    200,
        loadingClass: 'loading',
        onSlideUp:    function () {}
    }, conf);
    var liveSearch  = jQuery('#' + config.id);

    if (!liveSearch.length) {
        liveSearch = jQuery('<div id="' + config.id + '"></div>').appendTo(document.body).hide().slideUp(0);

        jQuery(document.body).click(function(event) {
            var clicked = jQuery(event.target);

            if (!(clicked.is('#' + config.id) || clicked.parents('#' + config.id).length || clicked.is('input'))) {
                liveSearch.slideUp(config.duration, function () {
                    config.onSlideUp();
                });
            }
        });
    }


    return this.each(function () {
        var input   = jQuery(this).attr('autocomplete', 'off');
        var resultsShit = parseInt(liveSearch.css('paddingLeft'), 10) + parseInt(liveSearch.css('paddingRight'), 10) + parseInt(liveSearch.css('borderLeftWidth'), 10) + parseInt(liveSearch.css('borderRightWidth'), 10);
        var inputThis = this;
        var searching = false;

        jQuery(this.form).submit(function() {
            if(inputThis.value.length < 3) {
                inputThis.lastValue = inputThis.value;
                liveSearch.slideUp(config.duration, function () {
                    config.onSlideUp();
                });
                inputThis.timer = setTimeout(function () {

                    var tmpOffset = input.offset();
                    var inputDim  = {
                        left:   tmpOffset.left,
                        top:    tmpOffset.top,
                        width:    input.outerWidth(),
                        height:   input.outerHeight()
                    };

                    inputDim.topNHeight = inputDim.top + inputDim.height;
                    inputDim.widthNShit = inputDim.width - resultsShit;

                    liveSearch.css({
                        position: 'absolute',
                        left:   inputDim.left + 'px',
                        top:    inputDim.topNHeight + 'px',
                        width:    inputDim.widthNShit + 'px',
                        height: 'auto'
                    });

                    liveSearch.html('please type at least 3 carachters').slideDown(config.duration);
                }, config.typeDelay);
            }
            else{

                if (inputThis.value != inputThis.lastValue) {

                    input.addClass(config.loadingClass);
                    var q = inputThis.value;

                    if (inputThis.timer) {
                        clearTimeout(this.timer);
                    }

                    inputThis.timer = setTimeout(function () {
                        jQuery.get(config.url + q, function (data) {
                            input.removeClass(config.loadingClass);

                            if (data.length && q.length) {
                                var tmpOffset = input.offset();
                                var inputDim  = {
                                    left:   tmpOffset.left,
                                    top:    tmpOffset.top,
                                    width:    input.outerWidth(),
                                    height:   input.outerHeight()
                                };

                                inputDim.topNHeight = inputDim.top + inputDim.height;
                                inputDim.widthNShit = inputDim.width - resultsShit;

                                liveSearch.css({
                                    position: 'absolute',
                                    left:   inputDim.left + 'px',
                                    top:    inputDim.topNHeight + 'px',
                                    width:    inputDim.widthNShit + 'px',
                                    height:  'auto'
                                });

                                liveSearch.html(data);

                                if(liveSearch.height() > liveSearch.css('max-height').substr(0,(liveSearch.css('max-height').length-2))) {
                                    liveSearch.css('height', liveSearch.css('max-height'));
                                }
                                liveSearch.slideDown(config.duration);
                            }
                            else {
                                liveSearch.slideUp(config.duration, function () {
                                    config.onSlideUp();
                                });
                            }
                        });
                    }, config.typeDelay);

                    inputThis.lastValue = inputThis.value;

                } else {

                    if (inputThis.timer) {
                        clearTimeout(this.timer);
                    }

                    inputThis.timer = setTimeout(function () {

                        var tmpOffset = input.offset();
                        var inputDim  = {
                            left:   tmpOffset.left,
                            top:    tmpOffset.top,
                            width:    input.outerWidth(),
                            height:   input.outerHeight()
                        };

                        inputDim.topNHeight = inputDim.top + inputDim.height;
                        inputDim.widthNShit = inputDim.width - resultsShit;

                        liveSearch.css({
                            position: 'absolute',
                            left:   inputDim.left + 'px',
                            top:    inputDim.topNHeight + 'px',
                            width:    inputDim.widthNShit + 'px',
                            height:  'auto'
                        });

                        if(liveSearch.height() > liveSearch.css('max-height').substr(0,(liveSearch.css('max-height').length-2))) {
                            liveSearch.css('height', liveSearch.css('max-height'));
                        }
                        liveSearch.slideDown(config.duration);

                    }, config.typeDelay);

                }
            }
            return false;
        });
    });
};