var isOpera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1);
var isTimer = false;
var lastInputText = "";
var selectLineNumber = -1;
var bWiteResponse;
var bNoResults = false;

var divSuggests;	
var inputBox;
var inputBoxId;
var inputHeroId;
var inputDirectorId;

var arraySuggests = new Array();

function SuggestIni() {	
	divSuggests = document.createElement("div");
	divSuggests.className = "suggDropdown";
	document.body.appendChild(divSuggests);
	divSuggests.style.position = "absolute";

	inputBox = document.formExtendSearch.hero;	
	inputBox.onkeyup =GetSuggests;
	inputBox.onblur = function() {StartTimeout();}
	if (isOpera) inputBox.onkeypress = GetSuggests;
	inputHeroId = document.formExtendSearch.heroid;		
	
	inputBox = document.formExtendSearch.director;	
	inputBox.onkeyup =GetSuggests;
	inputBox.onblur = function() {StartTimeout();}
	if (isOpera) inputBox.onkeypress = GetSuggests;
	inputDirectorId = document.formExtendSearch.directorid;		
}

function SetPosition() {
	var posX = 0;
	var posY = 0;
	if (!inputBox) return;	
	var inputBoxHeight = inputBox.offsetHeight;
	var inputBoxWidth = inputBox.offsetWidth;	
	var parentElement = inputBox;
	while (parentElement != null) {
		posX += parentElement.offsetLeft; 	
		posY += parentElement.offsetTop; 	
		parentElement = parentElement.offsetParent;
	}

	divSuggests.style.left = posX + 'px';
	divSuggests.style.width = inputBoxWidth + 'px';
	divSuggests.style.top = posY + inputBoxHeight + 'px';
	divSuggests.style.display = "block";
	divSuggests.onmouseout = StartTimeout; 
	divSuggests.onmouseover = EraseTimeout; 	
}

function EraseTimeout() {
	clearTimeout(isTimer);
	isTimer = false;
}

function StartTimeout() {
	isTimer = setTimeout("HideTheBox()", 1000);	
}

function HideTheBox() {
	divSuggests.style.display = "none";
	selectLineNumber = -1;
	EraseTimeout();
}

function GetSuggests(e) {
	var page;
	var intKey = -1;
	if(window.event) {
		intKey = event.keyCode;
		inputBox = event.srcElement;		
	}
	else {
		intKey = e.which;
		inputBox = e.target;
	}
	if (isTimer) EraseTimeout();
//	StartTimeout(); 	
	if (inputBox.value.length == 0 && !isOpera) {
		arraySuggests = new Array();
		HideTheBox();
		lastInputText = "";
		return false;
	}
	if (intKey == 13) {
		SetSuggest(selectLineNumber);
		return false;
	}
	else if (intKey ==  38) {
		MoveHighlight(-1);
		return false;		
	}
	else if (intKey == 40) {
		MoveHighlight(1);		
		return false;		
	}	
	if (inputBox.name == "hero") {
		inputBoxId = inputHeroId;
		page = "../common/get_heroes";
	}
	else {
		inputBoxId = inputDirectorId;
		page = "../common/get_directors";
	}
	inputBoxId.value = "0"; 
	if (inputBox.value.length == 1 || (inputBox.value.length > 1 && !(inputBox.value.indexOf(lastInputText) == 0 && bNoResults))) {
		bWiteResponse = true;
		var ppp=new net.ContentLoader(page + ".asp?sg=" + encodeURIComponent(inputBox.value), PutSuggests);	
	}
	else if (!bWiteResponse) {
			MakeList();
	}
	lastInputText = inputBox.value;
}

function PutSuggests(){
	var rTxt=this.req.responseText;
	eval(rTxt); 
	MakeList();	
	bWiteResponse = false;	
}	

function MakeList() { 
	var temp="";
	for(var i=0; i < arraySuggests.length; i++) {
		temp = temp + "<span onmouseover='SetHighColor(this)' onclick='SetSuggest(" + i + ");' id='sg_" + i + "'>" + arraySuggests[i][0] + "</span>"
	}	
	divSuggests.innerHTML = temp;
	selectLineNumber = 0;	
	SetHighColor();	
	if (arraySuggests.length > 0) {
		bNoResults = false;
		SetPosition();
	}
	else {
		bNoResults = true;		
		divSuggests.style.display = "none";
	}	
}

function SetSuggest(i){
	if ((divSuggests.style.display == "block") && (arraySuggests.length)) {
		inputBox.value = arraySuggests[i][0];
		inputBoxId.value = arraySuggests[i][1];
		divSuggests.style.display = "none";
		selectLineNumber = -1;
	}
}

function MoveHighlight(i){
	if(selectLineNumber >= 0){
		newValue = parseInt(selectLineNumber) + parseInt(i);
		if(newValue > -1 && newValue < arraySuggests.length){
			selectLineNumber = newValue;
			SetHighColor(null);
		}
	}
}

function SetHighColor(selectLine){	
	if (selectLine) selectLineNumber = selectLine.id.slice(selectLine.id.indexOf("_")+1, selectLine.id.length)
	var children=divSuggests.getElementsByTagName('span');	
		for(var i=0;i<children.length;i++){
			if (children[i].id == 'sg_' + selectLineNumber) {	
				children[i].style.background= "#efecdf";   			   	   
			}
			else {
				children[i].style.background= "#fff";	   			   	
			}
		}
}