/**
 * AutoComplete Field - JavaScript Code
 *
 * This is a sample source code provided by fromvega.
 * Search for the complete article at http://www.fromvega.com
 *
 * Enjoy!
 *
 * @author fromvega
 *
 */

// global variables
var acListTotal   =  0;
var acListCurrent = -1;
var acDelay		  = 400;
var acURL		  = null;
var acSearchId	  = null;
var acResultsId	  = null;
var acSearchField = null;
var acResultsDiv  = null;
var time = null;
var acCharCount = 0;

function setAutoComplete(field_id, results_id, get_url){
	//alert('test');
	// initialize vars
	acSearchId  = "#" + field_id;
	acResultsId = "#" + results_id;
	acURL 		= get_url;
	
	
	// create the results div
	jQuery("body").append('<div id="' + results_id + '"></div>');

	// register mostly used vars
	acSearchField	= jQuery(acSearchId);
	acResultsDiv	= jQuery(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 an treat up and down arrows
		if(updownArrow(keyCode)){
			return;
		}
		
		// capture alt/ctrl/shift keystrokes
		if (keyCode == 16 || keyCode == 17 || keyCode == 18){ 
			return;
		}
			
		// check an treat up and down arrows
		if(updownArrow(keyCode)){
			return;
		}

		// check for an ENTER or ESC
		if(keyCode == 13 || keyCode == 27){
			clearAutoComplete();
			return;
		}
				
		acCharCount = acCharCount+1;
		//checks for backspace
		if(keyCode == 8){
			acCharCount = acCharCount-2;
		}
		
		if (acCharCount > 2){
		// if is text, call with delay
			if(time == null){
				//alert("already null");
				time = setTimeout(function () {autoComplete(lastVal);}, acDelay);
			} else {
				//alert(time+"to null");
				clearTimeout(time);
				time = setTimeout(function () {autoComplete(lastVal);}, acDelay);
			}
		}
	});
}

//var callcount = 0;
//function testCallCount(){
//	alert(callcount);
//}

// treat the auto-complete action (delayed function)
function autoComplete(lastValue)
{
	//callcount = callcount + 1;
	
	//alert(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
	//jQuery.getJSON(acURL + part, function(json){
	var json;
		//alert(acURL + part);
		//part = jQuery.URLEncode(part);
		//alert(part);
		jQuery.ajax({
	        type: 		"GET",
	        dataType: 	"json",
	        url: 		acURL + part,
	        async: 		false, // we need to call this synchronously, to block Browser's and user's activity!
	        cache:      true,
	        success: function(result){
	    		//alert(result.autocompletearray[0]);
				json = result.autocompletearray;
	        },
	        error: function (XMLHttpRequest, textStatus, errorThrown) {
	        	json = ""; //this; // the options for this ajax request
	      	  	//alert('XMLHttpRequest:'+XMLHttpRequest+', textStatus:'+textStatus+', errorThrown:'+errorThrown);
	      	}
	    });
		// get the total of results
		var ansLength = acListTotal = json.length;
		//alert(ansLength);
		// 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].alt + '</div>';
			}

			// update the results div
			acResultsDiv.html(newData);
			acResultsDiv.css("display","block");
			
			// for all divs in results
			var divs = jQuery(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();
				setTimeout(function() { document.SimpleSearchForm.submit(); }, 300);
				//document.SimpleSearchForm.submit();
			});

		} 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("top", sf_top + sf_height + 5);
	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;
	}
}