function getResult()
{
	result = new Array("Lorem ipsum adipiscing",
		"Lorem ipsum volutpat");
	return result;
}

function AutoComplete()
{
	//A variable to access the AutoSuggest object
	//from the elem's event handlers defined below.
	var autocomplete = this;

	//A reference to the element we're binding the list to.
	var elem = document.getElementById("search-query");

	//If autocomplete is turned of -> return
	if(false)
	{
	//A div to use to create the dropdown.
	this.div = document.getElementById("autocomplete-wrapper");
	
	//Arrow to store a subset of eligible suggestions that match the user's input
	this.eligible = new Array();

	//The text input by the user.
	this.inputText = null;

	//A pointer to the index of the highlighted eligible item. -1 means nothing highlighted.
	this.highlighted = -1;

	//Do you want to remember what keycode means what? Me neither.
	var TAB = 9;
	var ESC = 27;
	var KEYUP = 38;
	var KEYDN = 40;

	/********************************************************
	onkeydown event handler for the input elem.
	********************************************************/
	elem.onkeydown = function(ev)
	{
		var key = autocomplete.getKeyCode(ev);
		switch(key) {
			case TAB:
			autocomplete.useSuggestion();
			break;
			
			case ESC:
			autocomplete.hideDiv();
			break;
			
			case KEYUP:
			if(autocomplete.highlighted > 0) {
				autocomplete.highlighted--;
			}
			autocomplete.changeHighlight(key);
			break;
			
			case KEYDN:
			if(autocomplete.highlighted < (autocomplete.eligible.length - 1)) {
				autocomplete.highlighted++;
			}
			autocomplete.changeHighlight(key);
			break;
		}
	};

	/********************************************************
	onkeyup handler for the elem
	If the text is of sufficient length, and has been changed,
	then display a list of eligible suggestions.
	********************************************************/
	elem.onkeyup = function(ev)
	{
		var key = autocomplete.getKeyCode(ev);
		switch(key) {
		//The control keys were already handled by onkeydown, so do nothing.
		case TAB:
		case ESC:
		case KEYUP:
		case KEYDN:
			return;
		default:
			autocomplete.inputText = document.getElementById(elem);
			if(this.value != autocomplete.inputText && this.value.length > 0) {
				autocomplete.inputText = this.value;
				autocomplete.getEligible();
				autocomplete.createDiv();
				autocomplete.showDiv();
			} else {
				autocomplete.hideDiv();
			}
		}
	};

	/********************************************************
	Insert the highlighted suggestion into the input box, and
	remove the suggestion dropdown.
	********************************************************/
	this.useSuggestion = function()
	{
		if(this.highlighted > -1) {
			elem.value = this.eligible[this.highlighted];
			this.hideDiv();
			//It's impossible to cancel the Tab key's default behavior.
			//So this undoes it by moving the focus back to our field right after
			//the event completes.
			setTimeout("document.getElementById('" + elem.id + "').focus()",0);
		}
	};

	/********************************************************
	Display the dropdown.
	********************************************************/
	this.showDiv = function()
	{
		this.div.style.display = 'block';
	};

	/********************************************************
	Hide the dropdown and clear any highlight.
	********************************************************/
	this.hideDiv = function()
	{
		this.div.style.display = 'none';
		this.highlighted = -1;
	};

	/********************************************************
	Modify the HTML in the dropdown to move the highlight.
	********************************************************/
	this.changeHighlight = function()
	{
		var lis = this.div.getElementsByTagName('LI');
		for(i in lis) {
			var li = lis[i];
			if(this.highlighted == i) {
				li.className = "selected";
			} else {
				li.className = "";
			}
		}
	};

	/********************************************************
	Build the HTML for the dropdown div
	********************************************************/
	this.createDiv = function()
	{
		var ul = document.createElement('ul');
		ul.className = "autocomplete";
		//Create an array of LI's for the suggestions.
		for(i in this.eligible) {
			var suggestion = this.eligible[i];
			var li = document.createElement('li');
			var a = document.createElement('a');
			a.href="javascript:void(0);";
			a.innerHTML = suggestion;
			li.appendChild(a);
			if(autocomplete.highlighted == i) {
				li.className = "selected";
			}
			ul.appendChild(li);
		}
		this.div.replaceChild(ul,this.div.childNodes[0]);

		/********************************************************
		mouseover handler for the dropdown ul
		move the highlighted suggestion with the mouse
		********************************************************/
		ul.onmouseover = function(ev)
		{
			//Walk up from target until you find the LI.
			var target = autocomplete.getEventSource(ev);
			while(target.parentNode && target.tagName.toUpperCase() != 'LI') {
				target = target.parentNode;
			}
			var lis = autocomplete.div.getElementsByTagName('LI');
			for(i in lis) {
				var li = lis[i];
				if(li == target) {
					autocomplete.highlighted = i;
					break;
				}
			}
			autocomplete.changeHighlight();
		};
		/********************************************************
		click handler for the dropdown ul
		insert the clicked suggestion into the input
		********************************************************/
		ul.onclick = function(ev)
		{
			autocomplete.useSuggestion();
			autocomplete.hideDiv();
			autocomplete.cancelEvent(ev);
			return false;
		};
		
	};

	/********************************************************
	determine which of the suggestions matches the input
	********************************************************/
	this.getEligible = function()
	{
		this.eligible = getResult();
	};

	/********************************************************
	Helper function to determine the keycode pressed in a
	browser-independent manner.
	********************************************************/
	this.getKeyCode = function(ev)
	{
		//Mozilla
		if(ev) {
			return ev.keyCode;
		}
		//IE
		if(window.event) {
			return window.event.keyCode;
		}
	};

	/********************************************************
	Helper function to determine the event source element in a
	browser-independent manner.
	********************************************************/
	this.getEventSource = function(ev)
	{
		//Moz
		if(ev) {
			return ev.target;
		}
		//IE
		if(window.event) {
			return window.event.srcElement;
		}
	};

	/********************************************************
	Helper function to cancel an event in a
	browser-independent manner.
	********************************************************/
	this.cancelEvent = function(ev)
	{
		//Moz
		if(ev) {
			ev.preventDefault();
			ev.stopPropagation();
		}
		//IE
		if(window.event) {
			window.event.returnValue = false;
		}
	}
	}
}