// sMenu:
// Data Type: String
// Desc: The 'id' name of the menu container (DIV)

// sTextBoxId:
// Data Type: String
// Desc: The 'id' name of the text box (INPUT)

// fnOnClick:
// Data Type: function reference
// Desc: A callback function (with no parameters), that is called when the user clicks on a menu option.
// Notes: This value may be set to null.
function AutoComplete(sMenuId, sTextBoxId, fnOnClick){

	var isDOM = (document.getElementById ? true : false);
	var isIE4 = ((document.all && !isDOM) ? true : false);
	var isNS4 = (document.layers ? true : false);

	var sdivMenuId = sMenuId;
	var stxtInputId = sTextBoxId;
	var fnOnMenuOptionClick = fnOnClick;

	var menuElement = null;
	var textElement = null;

	var nEntries=0;

	this.init = function(){
		if(menuElement==null){
			menuElement = this.getRef(sdivMenuId);
			/*
			menuElement.style.margin='0';
			menuElement.style.padding='3';
			menuElement.style.borderColor='#dddddd';
			menuElement.style.borderSize='1';
			menuElement.style.borderStyle='solid';
			menuElement.style.backgroundColor='#f5f5f5';
			menuElement.style.zIndex='99';
			menuElement.style.position='absolute';*/
		}

		if(textElement==null) textElement = this.getRef(stxtInputId);
		if(menuElement==null || textElement==null) return false;
		menuElement.style.width = textElement.style.width;
		return true;
	};

	this.getEntries = function(){
		return nEntries;
	};

	this.toggleShowHide = function(){
		this.init();
		if(menuElement){
			if(menuElement.style.visibility == 'hidden'){
				menuElement.style.visibility='visible';
				return true;
			}
			else{
				menuElement.style.visibility = 'hidden';
			}
		}

		return false;
	};
	
	this.hide = function(){
		this.init();
		if(menuElement) menuElement.style.visibility = 'hidden';
	};

	this.show = function(){
		this.init();
		if(menuElement && nEntries>0){
			menuElement.style.visibility = 'visible';
		}
	};

	this.clear = function(){
		if(menuElement && nEntries>0){
			while (menuElement.hasChildNodes()) menuElement.removeChild(menuElement.firstChild);
			nEntries=0;
		}
	};

	this.getRef = function(id) {
		if (isDOM) return document.getElementById(id);
		else if (isIE4) return document.all[id];
		else if (isNS4) return document.layers[id];	
		return document;
	};

	// arr: Array object
	this.generate = function(arr){
		if(this.init()==false) return;
		this.clear();

		if(arr.length>10){
			menuElement.style.height='200px';
			menuElement.style.overflow='auto';
		}
		else{
			menuElement.style.height='auto';
			menuElement.style.overflow='hidden';
		}

		for(var i = 0; i < arr.length; i++){
			var entry = document.createElement('div');
			entry.style.width='100%';
			entry.innerHTML = arr[i];
			entry.onmouseover = function(){
				//this.style.backgroundColor = '#fffacd';
				this.style.cursor = 'hand';
			};
			/*entry.onmouseout = function(){
				this.style.backgroundColor = '#f5f5f5';
			};*/
			entry.onclick = function(){
				textElement.value = this.innerHTML;
				menuElement.style.visibility = 'hidden';
				if(fnOnMenuOptionClick!=null) fnOnMenuOptionClick();				
			};
			menuElement.appendChild(entry);
		}		
		nEntries = arr.length;
	};

	return this;
}