var RichSuggestionField = {
	last_call_id: Object(),
	last_entered_text: Object(),
	active_element_colors: Object(),

	suggestionFieldServerCall: function(url, vars, callbackFunction) {
		var request = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("MSXML2.XMLHTTP.3.0");

		request.open("POST", url, true);
		request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

		request.onreadystatechange = function() {
			if (request.readyState == 4 && request.status == 200) {
				callbackFunction(request.responseText);
			}
		}
		request.send(vars);
	},

	suggestionFieldKeyUp: function(event, id, url, color, timeout, allResultsUrl, label) {
		RichSuggestionField.active_element_colors[id] = color;

		var mykeycode = event.keyCode;

		if(mykeycode == 38) {
			RichSuggestionField.arrowUp(id);
			return;
		} else if(mykeycode == 40) {
			RichSuggestionField.arrowDown(id);
			return;
		} else if(mykeycode == 13) {
			return(RichSuggestionField.enterKey(id));
		}

		var field = document.getElementById(id);
		RichSuggestionField.last_entered_text[id] = field.value;

		if(field.value.length < 3) return;

		if (!RichSuggestionField.last_call_id[id]) {
			RichSuggestionField.last_call_id[id] = 0;
		}

		RichSuggestionField.last_call_id[id]++;
		var callid = RichSuggestionField.last_call_id[id];

		var waitwheel = document.getElementById('waitwheel_' + id);
		if(waitwheel) {
			waitwheel.style.display = 'block';
		}

		setTimeout(
				function() {
					RichSuggestionField.suggestionFieldKeyUp_timeout(callid, id, url, allResultsUrl, label)
				}
				, parseInt(timeout));
	},

	suggestionFieldKeyUp_timeout: function(callid, id, url, allResultsUrl, label) {
		if (callid != RichSuggestionField.last_call_id[id]) return;

		var field = document.getElementById(id);

		RichSuggestionField.suggestionFieldServerCall(url + encodeURIComponent(field.value), "", function(responsetext) {
			RichSuggestionField.suggestionFieldKeyUp_callback(
					responsetext, callid, id, allResultsUrl, label
					)
		})
	},

	suggestionFieldKeyUp_callback: function(responsetext, callid, id, allResultsUrl, label) {
		if (callid != RichSuggestionField.last_call_id[id]) return;

		var waitwheel = document.getElementById('waitwheel_' + id);
		if(waitwheel) {
			waitwheel.style.display = '';
		}

		var dropdown = document.getElementById('dropdown_' + id);

		dropdown.style.display = '';
		if (!responsetext) return;

		var field = document.getElementById(id);
		var fieldpos = findCumulativePos(field)

		dropdown.style.top = (fieldpos[1]+field.offsetHeight)+'px';
		dropdown.style.left = fieldpos[0]+'px';
		dropdown.style.display = 'block';
		dropdown.style.zIndex = '2000';
		dropdown.innerHTML = responsetext+"<div onclick=\"document.location='"+allResultsUrl+encodeURIComponent(field.value)+"';\" onmouseover=\"addClassName(this,'hover');\" onmouseout=\"removeClassName(this,'hover');\" class=\"richsuggestionviewallresults\">"+label+"</div>";

		if(window.innerWidth) {
			if(window.innerWidth < (fieldpos[0] + dropdown.offsetWidth)) {
				dropdown.style.left = (fieldpos[0] + field.offsetWidth - dropdown.offsetWidth)+"px"
			}
		} else if(document.body.clientWidth) {
			if(document.body.clientWidth < (fieldpos[0] + dropdown.offsetWidth)) {
				dropdown.style.left = (fieldpos[0] + field.offsetWidth - dropdown.offsetWidth)+"px"
			}
		}

		document.body.appendChild(dropdown);
	},

	arrowUp: function(id) {
		var dropdown = document.getElementById('dropdown_' + id);

		if(dropdown.childNodes.length < 1) return;
		if(dropdown.style.display.toLowerCase() != 'block') return;

		for(var i=0; i<dropdown.childNodes.length; i++) {
			var entry = dropdown.childNodes[i];

			if(!entry.tagName) continue;
			if(entry.tagName.toLowerCase() != 'div') continue;

			if(hasClassName(entry, "active")) {
				removeClassName(entry, "active");
				entry.style.backgroundColor = '';

				while(i>0) {
					i--;

					if(!dropdown.childNodes[i].tagName) continue;
					if(dropdown.childNodes[i].tagName.toLowerCase() != 'div') continue;
					if(dropdown.childNodes[i].className.toLowerCase() == 'richsuggestiongroup') continue;

					addClassName(dropdown.childNodes[i], "active");
					try {
						dropdown.childNodes[i].style.backgroundColor = RichSuggestionField.active_element_colors[id];
					} catch(e) {
						dropdown.childNodes[i].style.backgroundColor = '#CCC';
					}
					return;
				}
				return;
			}
		}

		// nothing found, select bottommost
		// last is always an a
		addClassName(dropdown.childNodes[dropdown.childNodes.length - 1], "active");
		try {
			dropdown.childNodes[dropdown.childNodes.length - 1].style.backgroundColor = RichSuggestionField.active_element_colors[id];
		} catch(e) {
			dropdown.childNodes[dropdown.childNodes.length - 1].style.backgroundColor = '#CCC';
		}
	},

	arrowDown: function(id) {
		var dropdown = document.getElementById('dropdown_' + id);

		if(dropdown.childNodes.length < 1) return;
		if(dropdown.style.display.toLowerCase() != 'block') return;

		for(var i=0; i<dropdown.childNodes.length; i++) {
			var entry = dropdown.childNodes[i];

			if(!entry.tagName) continue;
			if(entry.tagName.toLowerCase() != 'div') continue;

			if(hasClassName(entry, "active")) {
				removeClassName(entry, "active");
				entry.style.backgroundColor = '';

				i++;
				while(i<dropdown.childNodes.length) {

					if(!dropdown.childNodes[i].tagName) {
						i++;
						continue;
					}
					if(dropdown.childNodes[i].tagName.toLowerCase() != 'div') {
						i++;
						continue;
					}
					if(dropdown.childNodes[i].className.toLowerCase() == 'richsuggestiongroup') {
						i++;
						continue;
					}

					addClassName(dropdown.childNodes[i], "active");
					try {
						dropdown.childNodes[i].style.backgroundColor = RichSuggestionField.active_element_colors[id];
					} catch(e) {
						dropdown.childNodes[i].style.backgroundColor = '#CCC';
					}
					i++;
					return;
				}
				return;
			}
		}

		// nothing found, select topmost
		for(var i=0; i<dropdown.childNodes.length; i++) {
			var entry = dropdown.childNodes[i];

			if(!entry.tagName) continue;
			if(entry.tagName.toLowerCase() != 'div') continue;
			if(entry.className.toLowerCase() == 'richsuggestiongroup') continue;

			addClassName(entry, "active");
			try {
				entry.style.backgroundColor = RichSuggestionField.active_element_colors[id];
			} catch(e) {
				entry.style.backgroundColor = '#CCC';
			}
			return;
		}
	},

	enterKey: function(id) {
		var dropdown = document.getElementById('dropdown_' + id);

		if(dropdown.childNodes.length < 1) return;
		if(dropdown.style.display.toLowerCase() != 'block') return;

		for(var i=0; i<dropdown.childNodes.length; i++) {
			var entry = dropdown.childNodes[i];

			if(!entry.tagName) continue;
			if(entry.tagName.toLowerCase() != 'div') continue;

			if(hasClassName(entry, "active")) {
				entry.onclick();
				return(true);
			}
		}
	},

	suggestionFieldBlur: function(event, id) {
		// set timeout to allow click on link before menu disappears
		var dropdown = document.getElementById('dropdown_' + id);
		dropdown.style.filter = "alpha(opacity=75)";
		dropdown.style.opacity = '.75';

		setTimeout( function(){
			dropdown.style.filter = "alpha(opacity=50)";
			dropdown.style.opacity = '.5';
		}, 70);
		setTimeout( function(){
			dropdown.style.filter = "alpha(opacity=25)";
			dropdown.style.opacity = '.25';
		}, 140);
		setTimeout( function(){
			dropdown.style.display = '';
			dropdown.style.filter = '';
			dropdown.style.opacity = '';
		}, 210);
	},

	trim: function(str) {
		return str.replace(/^\s+/g, '').replace(/\s+$/g, '');
	}
}
