/* Autocomplete with jquery/json server requests.
 * Slightly modified by HWG from original source at:
 * http://fromvega.com/wordpress/2007/05/05/auto-complete-field-with-jquery-json-php/ */

var acListTotal   =  0;
var acListCurrent = -1;
var acDelay       = 500;
var acURL         = null;
var acFormId      = null;
var acSearchId	  = null;
var acResultsId	  = null;
var acParentId    = null;
var acSearchField = null;
var acResultsDiv  = null;

function setAutoComplete(form_id, field_id, results_id, parent_id, get_url)
{
    // initialize vars
    acFormId    = "#" + form_id;
    acSearchId  = "#" + field_id;
    acResultsId = "#" + results_id;
    acParentId  = "#" + parent_id;
    acURL 		= get_url;

    // create the results div
    $(acParentId).append('<div id="' + results_id + '"></div>');

    // register mostly used vars (jQuery object)
    acSearchField	= $(acSearchId);
    acResultsDiv	= $(acResultsId);

    // reposition div
    repositionResultsDiv();

    // on blur listener
    acSearchField.blur(function(){ setTimeout("clearAutoComplete()", 200) });

    // on key up listener
    acSearchField.keyup(function (e) 
    {
        // get keyCode (window.event is for IE)
        var keyCode = e.keyCode || window.event.keyCode;
        var lastVal = acSearchField.val();

        // check and treat up and down arrows
        if(updownArrow(keyCode))
        {
            return;
        }

        // check for an ENTER or ESC
        if(keyCode == 13 || keyCode == 27)
        {
            clearAutoComplete();
            return;
        }

        // if is text, call with delay
        setTimeout(function () {autoComplete(lastVal)}, acDelay);
    });
}

// treat the auto-complete action
function autoComplete(lastValue)
{
    // get the field value
    var part = acSearchField.val();

    // if it's empty clear the resuts box and return
    if(part == ''){
            clearAutoComplete();
            return;
    }

    // if it's equal the value from the time of the call, allow
    if(lastValue != part){
            return;
    }
    
    // get remote data as JSON
    $.getJSON(acURL + part, function(json)
    {
        // get the total of results
        var ansLength = acListTotal = json.length;

        // if there are results populate the results div
        if(ansLength > 0)
        {
            var newData = '';
            // create a div for each result
            for(i=0; i < ansLength; i++)
            {
                newData += '<div class="unselected">' + json[i] + '</div>';
            }

            // update the results div
            acResultsDiv.html(newData);
            acResultsDiv.css("display","block");

            // for all divs in results
            var divs = $(acResultsId + " > div");

            // on mouse over clean previous selected and set a new one
            divs.mouseover( function()
            {
                divs.each(function(){ this.className = "unselected"; });
                this.className = "selected";
            });

            // on click copy the result text to the search field and hide
            divs.click( function() {
                acSearchField.val(this.childNodes[0].nodeValue);
                clearAutoComplete();
            });
        } else {
            clearAutoComplete();
        }
    });
}

// clear auto complete box
function clearAutoComplete()
{
    acResultsDiv.html('');
    acResultsDiv.css("display","none");
}

// reposition the results div accordingly to the search field
function repositionResultsDiv()
{
    // get the field position
    var sf_pos    = acSearchField.offset();
    var sf_top    = sf_pos.top;
    var sf_left   = sf_pos.left;

    // get the field size
    var sf_height = acSearchField.height();
    var sf_width  = acSearchField.width();

    // apply the css styles - optimized for Firefox
    acResultsDiv.css("position","absolute");
    acResultsDiv.css("left", sf_left - 2);
    acResultsDiv.css("width", sf_width - 2);
}

// treat up and down key strokes defining the next selected element
function updownArrow(keyCode) 
{
    if(keyCode == 40 || keyCode == 38)
    {    
        if(keyCode == 38) // keyUp
        {
            if(acListCurrent == 0 || acListCurrent == -1)
            {
                acListCurrent = acListTotal-1;
            } else {
                acListCurrent--;
            }
        } else { // keyDown
            if(acListCurrent == acListTotal-1)
            {
                acListCurrent = 0;
            } else {
                acListCurrent++;
            }
        }

        // loop through each result div applying the correct style
        acResultsDiv.children().each(function(i)
        {
            if(i == acListCurrent)
            {
                acSearchField.val(this.childNodes[0].nodeValue);
                this.className = "selected";
            } else {
                this.className = "unselected";
            }
        });

        return true;
    } else {
        // reset
        acListCurrent = -1;
        return false;
    }
}