//typeahead
var typeAheadKeyPos = [];
var typeAheadInput = [];
var typeAheadDiv = [];
var typeAheadMouseActive = [];

function typeAhead(input,evt,taid,formid,values){
	var taDiv = document.getElementById(taid + '_div');
	typeAheadInput[taid] = input;
	typeAheadDiv[taid] = taDiv;
	var taHTML = '';
	//check array if field val not emtpy
	if(input.value.length > 0){
		var eventsStr = ' onmouseover=\'typeAheadMouseOver("'+taid+'",this.id);\'';
		eventsStr += ' onmouseout=\'typeAheadMouseOut("'+taid+'");\'';
		eventsStr += ' onclick=\'typeAheadSetValue("'+taid+'")\' ';
		var idval = 0;
		for (var i = 0; i < values.length; i++) {
			var val = values[i].toLowerCase();
			if (val.indexOf(input.value.toLowerCase()) == 0 
					&& val.length > input.value.length) {
				//add the value to ta
				taHTML += '<div id=\'' + idval++ + '\' class=\'typeAheadItem\'' + eventsStr + '>' + values[i] + '</div>';
			}
		}
	}
	if(taHTML){
		var table = document.getElementById(formid + '_table');
		var pos = getPos(input,table.offsetParent);
		taDiv.style.top = (pos[0] - 3) + 'px';
		taDiv.style.left = (pos[1] + 6) + 'px';
		taDiv.innerHTML = taHTML;
		taDiv.style.display = '';
	} else {
		taDiv.style.display = 'none';
	}
	//check for up & down arrow keys & return 
	if(taDiv.style.display != 'none'){
		if(evt.keyCode == 40){ //keydown
			if(typeAheadKeyPos[taid] == undefined) {
				typeAheadKeyPos[taid] = 0;
			} else {
				typeAheadKeyPos[taid]++;
			}
			typeAheadSetSelected(taid);
		} else if(evt.keyCode == 38){ //keyup
			if (typeAheadKeyPos[taid] == undefined){
				typeAheadKeyPos[taid] = taDiv.childNodes.length - 1;
			} else {
				//set to last item
				typeAheadKeyPos[taid]--;				
			}
			typeAheadSetSelected(taid);
		} else if(evt.keyCode == 13 || evt.keyCode == 39) { //return key or key right
			if(!(typeAheadKeyPos[taid] == undefined)){
				typeAheadSetValue(taid);
			}
		} else if(evt.keyCode == 27 || evt.keyCode == 37){ //esc key or key left
			typeAheadHide(taid,true);
		}
	}
}

function typeAheadSetSelected(taid){
	var tadiv = typeAheadDiv[taid];
	var c = tadiv.childNodes.length;
	var pos = typeAheadKeyPos[taid];
	//if higher than available set to first
	if(pos > (c - 1)){
		pos = 0;
		typeAheadKeyPos[taid] = pos;
	} 
	//if lower set to last
	if(pos < 0){
		pos = c -1;
		typeAheadKeyPos[taid] = pos;
	}
	//reset all then highlight selected
	for(var i=0;i < tadiv.childNodes.length;i++){
		tadiv.childNodes[i].className='typeAheadItem';
	}
	tadiv.childNodes[pos].className = 'typeAheadItemSelected';
}

function typeAheadSetValue(taid){
	var input = typeAheadInput[taid];
	var tadiv = typeAheadDiv[taid];
	var pos = typeAheadKeyPos[taid];
	var val = tadiv.childNodes[pos].firstChild.nodeValue;
	input.value = val;
	typeAheadHide(taid,true);
	input.focus();
}

function typeAheadMouseOver(taid,pos){
	typeAheadKeyPos[taid] = pos;
	typeAheadSetSelected(taid);
	typeAheadMouseActive[taid] = true;
}

function typeAheadMouseOut(taid){
	typeAheadMouseActive[taid] = false;
}

function typeAheadHide(taid,force){
	//don't hide if mouse over is true unless force is true, this is to stop onblur clearing the div when mouse clicked
	if(!force && typeAheadMouseActive[taid]){
		return;
	}
	document.getElementById(taid + '_div').style.display='none';
	//clear stored position
	typeAheadKeyPos[taid] = null;
}