document.onkeydown = checkKey;
var eCurrentElement = null;

	//
	//	See if the tab or enter key was entered
	//
function checkKey(e) {
	// console.log(e.keyCode);
	if ( window.event) {
		e = window.event;
	}
	if ( typeof(e) != 'undefined' && (e.keyCode == 9 || e.keyCode == 13) && !(eCurrentElement == null))  {
		if ( document.getElementById('CurrentOption') ) {
			sOptions = document.getElementById('CurrentOption').innerHTML;
		} else {
			sOptions = '';
		}
		//console.log(sOptions + ":" + sOptions.length);
		if ( sOptions.length > 0 ) {
			//console.log(sOptions);
			addSelectedTag(sOptions, eCurrentElement)
				// Cancel event any further actions of this event in IE and FF to avoid tabbing off the field or submitting the form.
			if ( window.event ) {
				window.event.cancelBubble = true;	// IE
			} else {
				e.stopPropagation();				// FF
			}
			return false;
		}
	}
	return true;
}
	//
	//	When someone clicks on a tag
	//
function clickTag(eItem) {
	sTagFieldID = eItem.parentNode.id.substr(0,eItem.parentNode.id.length-7);
	addSelectedTag(eItem.innerHTML, document.getElementById(sTagFieldID));
	document.getElementById(sTagFieldID + 'Options').innerHTML = "";
	document.getElementById(sTagFieldID).focus();
}
	//
	//	Add the selected tag to the item
	//
function addSelectedTag(sNewTag, eItem) {
	sFullString = eItem.value;			// This is the text currently in the text box, including the portion of the tag that has been typed so far
	nNewStringEnd = sFullString.lastIndexOf(", ");	// This is the position of the last "complete" tag entry in your field
	if ( nNewStringEnd > 0 ) {
		nNewStringEnd += 2	// Do this because only if a ', ' is found, then we want to add an extra character
	}
	sNewString = sFullString.substring(0, nNewStringEnd);	// This is the text in the text box minus the partial tag you are typing

	eItem.value = sNewString + sNewTag;	// Append the complete tag selected to the "complete" tags already in the box

//	eItem.value = sNewString + sNewTag + ', ';	// Append the complete tag selected to the "complete" tags already in the box
}

	//
	//	Get a list of tags based on what you've entered
	//
function getNewTag(eItem, arTags, e) {
	sFullString = eItem.value;
	// console.log(sFullString);
	
		// Set new string to be all of the characters after the last comma\
	nLastComma = sFullString.lastIndexOf(", ");
	sNewString = sFullString.substring(nLastComma + 1);
	
	// Trim off any leading spaces
	if ( sNewString.substring(0,1) == ' ' ) {
		sNewString = sNewString.substring(1);
	}
	
	// console.log(sNewString + ":" + sFullString.lastIndexOf(", "));
	sOptionTags = '';
	if ( sNewString.length > 0 ) {
		bFound = false;
		for (i=0; i<=arTags.length; i++) {
			if ( arTags[i] && arTags[i].toLowerCase() == sNewString.toLowerCase() ) {
				addSelectedTag(sNewString, eItem);
				sOptionTags = "";	// Clear the options list
				break;
			} else if ( arTags[i] && arTags[i].substring(0, sNewString.length).toLowerCase() == sNewString.toLowerCase() ) {
				//console.log(bFound + ":" + arTags[i]);
				if ( bFound == false ) {
					sOptionTags = sOptionTags + '<span id="CurrentOption" onclick="clickTag(this);" style="cursor:pointer;">' + arTags[i] + '</span>, ';
				} else {
					sOptionTags = sOptionTags + '<span onclick="clickTag(this);" style="cursor:pointer;">' + arTags[i] + '</span>, ';
				}
				bFound = true;
			} else if ( bFound ) {
				break;
			}
		}
	}
	document.getElementById(eItem.id + 'Options').innerHTML = sOptionTags;
}
function setFocusItem(eItem) {
	eCurrentElement = eItem;
}
function clearFocusItem(eItem) {
	sValue = eItem.value;
	sValue = sValue.replace(/^\s*|\s*$/g,"");
	if ( sValue.substr(sValue.length-1) == ",") {
		sValue = sValue.substring(0, sValue.length -1);
	}
	eItem.value = sValue;
	eCurrentElement = null;
}