

searchfield = function(){

	var useSearchSuggest = true;
	var field = $('searchfield');	
	var arrOptions = new Array();
	var lastValue = "";
	var noResults = false;
	
	
	this.safari = ((parseInt(navigator.productSub)>=20020000)&&(navigator.vendor.indexOf("Apple Computer")!=-1));
	if(field && !safari){	

		field.onblur = function(){
			clearList();
		}

		var selectedIndex = 0;
		
		var divOpen = document.createElement("div");
		var imgOpen = document.createElement("img");
		imgOpen.setAttribute('src', 'images/searchOpen.gif');
		imgOpen.setAttribute('border', '0');		
		imgOpen.onclick = function(){
			var ele = $('searchfield');
			ele.setAttribute("autocomplete", "off");
			var open = $('searchOpen');
			open.style.visibility = 'hidden';
			useSearchSuggest = true;
			startList(field.value);
		}	
		divOpen.setAttribute('id', 'searchOpen');				
		divOpen.className = "searchOpen";		
		divOpen.appendChild(imgOpen);
		
		var fromtop = findeO(field);
        var fromleft = findeL(field);
		
		divOpen.style.visibility = 'hidden';
		divOpen.style.top = fromtop + 5;
		divOpen.style.left = fromleft + field.offsetWidth - 16;
		
		
		
		field.parentNode.appendChild(divOpen);

		field.setAttribute("autocomplete", "off");
		var div = document.createElement("div");
		var list = document.createElement("ul");
		list.style.display = "none";
		div.className = "sf_suggestion";
		if(field.offsetWidth < 140){
			list.style.width = "140px";
		} else {
			list.style.width = field.offsetWidth + "px";
		}
		div.appendChild(list);	
		
		divClose = createDivClose();	
		
			
		field.parentNode.appendChild(div);

		field.onkeypress = function(e){

			var key = getKeyCode(e);
			if(list.style.display == "block" && selectedIndex > 0){
				if(key == 13){ // enter
					selectList();
					selectedIndex = 0;
					return false;
				}
			}
			

		}

		field.onkeyup = function(e){

			var key = getKeyCode(e);

			switch(key){
			case 13:
				clearList();
				break;
			case 27:  // esc
				field.value = "";
				selectedIndex = 0;
				clearList();
				break;
			case 38: // up
				navList("up");
				break;
			case 40: // down
				navList("down");
				break;
			default:
				startList(field.value);
				break;
			}
		}

		function startList(feld){			
			if(feld.length > 0 && useSearchSuggest){			    
				//abfragen ob, die ergebnisssuche weniger als 13 Elemente hat, dann einfach die menge verkleinern
				if(feld.length <= lastValue.length || ((arrOptions.length >= 15 || arrOptions.length == 0) && !noResults) || feld.indexOf(lastValue) != 0){
					new Ajax.Request('php/searchSuggest.php',
						{
					    method:'get',
					    onSuccess: function(transport){
							eval(transport.responseText);
							createList(feld);
					    },
						parameters: {search: feld}

					  });					  
				} else {
					createList(feld);
				
				}
			} else {
				clearList();
			}		
			lastValue = feld;			
		}

		function createList(feld){
				if(feld.length == field.value.length) {
					resetList();
					if(arrOptions.length == 0){
						noResults = true
					} else {
						noResults = false;
					}
					var j = 0;
					for(var i = 0; i < arrOptions.length; ++i){
						var text = addHTML(arrOptions[i]);
						if(text.length > 0){							
							li = document.createElement("li"); 
							a = document.createElement("a");
						
							a.j = j+1;
							a.innerHTML = text;
							li.j = j+1;
							li.onmouseover = function(){
								navListItem(this.j);
							}
							a.onmousedown = function(){
								selectedIndex = this.j;
								selectList();
							}
							li.appendChild(a);
							if(j%2 == 0){
								li.style.background = "#CBD4D9";
							}
							list.appendChild(li);
							j++;
						}					
					}					
					
					list.appendChild(divClose); 
					list.style.display = "block"; 
				}	

					
			};

			this.resetList = function(){
				var li = list.getElementsByTagName("li");
				var len = li.length;
				for(var i=0;i<len;i++){
					list.removeChild(li[0]);
				};	
				
				
			};

			this.navList = function(dir){
				selectedIndex += (dir == "down") ? 1 : -1;
				li = list.getElementsByTagName("li");
				if (selectedIndex < 1) selectedIndex =  li.length; 
				if (selectedIndex > li.length) selectedIndex =  1;
				navListItem(selectedIndex);
			};

			this.navListItem = function(index){
				selectedIndex = index;
				li = list.getElementsByTagName("li");
				for(var i=0;i<li.length;i++){
					li[i].className = (i==(selectedIndex-1)) ? "selected" : "";
				};
			};

			this.selectList = function(){
				li = list.getElementsByTagName("li");
				a = li[selectedIndex-1].getElementsByTagName("a")[0];
				field.value = trimHTML(a.innerHTML);
				clearList();
			};


	};

	function addHTML(name){	 	
	
	var regExp = new RegExp(field.value,"i")
	var str= new String(name);
	var aStart = str.search(regExp);
	if(aStart == -1){
		return "";
	}
	var matchedText = str.substring(aStart,
          aStart + field.value.length);
	var newName = str.replace(regExp, "<font color='red'>"+ matchedText +"</font>");
	
	 return newName;
	}
	
	
	function trimHTML(name){
	var newName = "";
	var html = false;
	for (i=0; i < name.length ; i++) {
	    if(html){
			if(name.charAt(i) == ">"){
				html = false;
			}
		} else {
			if(name.charAt(i) == "<"){
			   html = true;
			} else {
			  newName += name.charAt(i)
			}
		}
	}
	return newName.replace(/&amp;/g,"&");
	}

	function clearList(){
		if(list){
			list.style.display = "none";
			selectedIndex = 0;
		};
	};
	function getKeyCode(e){
		var code;
		if (!e) var e = window.event;
		if (e.keyCode) code = e.keyCode;
		return code;
	};
	function createDivClose(){
		divClose = document.createElement("div");
		divClose.setAttribute('id', 'divClose');	
		
		tableClose = document.createElement("table");		
		tableClose.setAttribute('rules','groups');		
		tableClose.setAttribute('cellpadding','3');
		tableClose.className = "tableClose";
		
		tableRow = document.createElement("tr");
		tableColumn1 = document.createElement("td");
		tableColumn1.setAttribute('width', '90%');
		tableColumn1.innerHTML = "Vorschl&auml;ge ausblenden";
		tableColumn2 = document.createElement("td");
		tableColumn2.setAttribute('align', 'right');
		tableColumn2.setAttribute('width', '10%');
		
		imgClose = document.createElement("img");
		imgClose.setAttribute('src', 'images/searchClose.gif');
		imgClose.setAttribute('border', '0');						
		imgClose.setAttribute('id', 'imgClose');						
		divClose.onmousedown = function(){
			var ele = $('searchfield');
			ele.setAttribute("autocomplete", "on");
			var open = $('searchOpen');
			open.style.visibility = 'visible';
			useSearchSuggest = false;
			clearList();
		}	
		tableBody = document.createElement("tbody");
		tableColumn2.appendChild(imgClose);	
		tableRow.appendChild(tableColumn1);
		tableRow.appendChild(tableColumn2);	
		tableBody.appendChild(tableRow);	
		tableClose.appendChild(tableBody);	
		divClose.appendChild(tableClose);	
		
		return divClose;
	
	}
	
	function findeL(obj){
		var lPos = 0;
		if (obj.offsetParent){
			while (obj.offsetParent){
				lPos += obj.offsetLeft
				obj = obj.offsetParent;
			}
		}
		else if (obj.x)
			lPos += obj.x;
		return lPos;
	}
	function findeO(obj){
		var oPos = 0;
		if (obj.offsetParent){
			while (obj.offsetParent){
				oPos += obj.offsetTop
				obj = obj.offsetParent;
			}
		}
		else if (obj.y)
			oPos += obj.y;
		return oPos;
} 

};

// script initiates on page load.

addEvent = function(obj,type,fn){
	if(obj.attachEvent){
		obj['e'+type+fn] = fn;
		obj[type+fn] = function(){obj['e'+type+fn](window.event );}
		obj.attachEvent('on'+type, obj[type+fn]);
	} else {
		obj.addEventListener(type,fn,false);
	};
};
addEvent(window,"load",searchfield);


