var resultBoxID = "ajaxLoadBox";
var resultBoxClassName = "";
var resultElementClassName = "searchElement";

var LiveSearch = new function(){
	this.searchField = null;
	this.searchSubmitButton = null;
	this.loadTimeOut = 0;
	this.catID = 1;
	
	this.resultBox = null;
	this.imgL = null;
	
	this.mouseMoveTimeout = 0;
	
	this.searchOnKeyUp = function(e){
		var code;if (!e) e = window.event;if (e.keyCode) code = e.keyCode;else if (e.which) code = e.which;
		if(code == 38){//key up
		}else if(code == 40){//key down
		}else if(code == 13){//enter key
			clearTimeout(LiveSearch.loadTimeOut);
			LiveSearch.searchSubmitButton.click();
		}else if(LiveSearch.enoughInput(LiveSearch.searchField.value)){
			clearTimeout(LiveSearch.loadTimeOut);
			LiveSearch.loadTimeOut = setTimeout(LiveSearch.loadSearch,500);
		}else{
			clearTimeout(LiveSearch.loadTimeOut);
			LiveSearch.resultBox.style.display = "none";
		}	
	}
	
	this.enoughInput = function(val){return (val != "" && val.length > 2);}
	
	this.loadSearch = function(){
		LiveSearch.imgL.style.display = "block";
		sendXMLRequestGET("/find/ajax/"+LiveSearch.catID+"/"+LiveSearch.searchField.value.replace(/\s/gi,"+")+".html",LiveSearch.searchDone,LiveSearch.searchFailed,"");
	}
	
	this.searchDone = function(request,param){
		LiveSearch.imgL.style.display = "none";
		LiveSearch.resultBox.style.display = "block";
		LiveSearch.resultBox.innerHTML = "";
		searchElements = new Array();
		eval(request.responseText);
		for(i=0;i<json.length;i++)
			LiveSearch.resultBox.addElement(json[i]);
		if(LiveSearch.resultBox.innerHTML == "")
			LiveSearch.resultBox.innerHTML = "geen resultaten gevonden";
	}
	
	this.searchFailed = function(request,param,fromAjax){
		LiveSearch.resultBox.style.display = "block";
		LiveSearch.resultBox.innerHTML = "Loading data failed";
	}
	
	this.attach = function(l,b){
		
		LiveSearch.searchField = l;
		LiveSearch.searchSubmitButton = b;
		
		LiveSearch.resultBox = document.getElementById('ajaxLoadBox');
		LiveSearch.imgL = document.getElementById('imgLoadAjaxID');
		
		LiveSearch.resultBox.style.left = find.position(l)[0]+"px";
		LiveSearch.resultBox.style.top = find.position(l)[1]+find.size(l)[1]+"px";
		LiveSearch.resultBox.style.width = find.size(l)[0]+"px";
		LiveSearch.resultBox.style.position = "absolute";
		LiveSearch.resultBox.style.display = "none";
		LiveSearch.resultBox.style.zIndex = "100";
		
		LiveSearch.resultBox.onmouseover = function(){
			clearTimeout(LiveSearch.mouseMoveTimeout);
		}
		
		LiveSearch.resultBox.onmouseout = function(){
			LiveSearch.mouseMoveTimeout = setTimeout(function(){LiveSearch.resultBox.style.display = "none";},500);
		}
		
		LiveSearch.imgL.style.left = (find.position(l)[0]+find.size(l)[0])-16+"px";
		LiveSearch.imgL.style.top = find.position(l)[1]+"px";
		LiveSearch.imgL.style.position = "absolute";
		LiveSearch.imgL.style.display = "none";
		LiveSearch.imgL.style.zIndex = "100";
		
		LiveSearch.searchField.onclick = function(){
			LiveSearch.resultBox.style.display = "block";
		}
		
		LiveSearch.resultBox.addElement = function(a){
			sE = new searchElement(a.title,a.title.replace(/(<([^>]+)>)/ig,"").replace(/\s/gi,"+"),a.count,a.relevantie,a.how);
			this.appendChild(sE.get());
		}
		
		
		//document.getElementsByTagName("body")[0].appendChild(LiveSearch.resultBox);
		//document.getElementsByTagName("body")[0].appendChild(LiveSearch.imgL);
		
		
		
		LiveSearch.searchField.setAttribute("autocomplete","off");
		LiveSearch.searchField.onkeyup = LiveSearch.searchOnKeyUp;
		
	}
}

function searchElement(name,URL,count,relevantie,how){
	this.name = name;
	this.URL = URL;
	this.count = count;
	this.relevantie = relevantie;
	this.how = how;
	this.get = function(){
		divL = document.createElement("div");
		divL.className = "searchElement";
		
		addListener(divL, "mouseover", this.mouseover);
		addListener(divL, "mouseout", this.mouseout);
		addListener(divL, "focus", this.focus);
		
		aL = document.createElement("a");
		aL.href = "/find/1/1/"+this.URL+".html";
		aL.innerHTML = this.name;
		
		divR = document.createElement("div");
		divR.style.cssFloat = "right";
		divR.appendChild(document.createTextNode("( "+this.how+" )"));
		divL.appendChild(divR);
		
		//divL.appendChild(document.createTextNode("("+Math.round(this.count)+")"));
		divL.appendChild(aL);
		//divL.appendChild(document.createTextNode("("+Math.round(this.relevantie)+")"));
		

		return divL;
	}
	
	this.mouseover = function(e){
		this.className = resultElementClassName + " " +resultElementClassName+"Hover";
	}
	
	this.mouseout = function(e){
		this.className = resultElementClassName;
	}
	
	this.focus = function(e){
		this.className = resultElementClassName + " " +resultElementClassName+"Select";
	}
}