document.observe("dom:loaded", function() {

	if ($('searchInput')) {
		var input = $$('#searchInput input')[0];
	
		// hide firefox' autocompletition
		input.setAttribute('autocomplete', 'off');
		input.setAttribute('maxlength', '300');
		
		var preview = new Element('div', {'id': 'autocomplete_suggestions'});
		
		with (preview) {
			with (style) {
				border = '1px solid silver';
				padding = '3px';
				background = '#fff';
				position = 'absolute';
				width = (input.offsetWidth-8)+'px';
				left = 73+'px';
				top = 32+'px';
				color = '#000';
				fontWeight = 'normal';
				fontSize = '12px';
				zIndex = 1000;
				maxHeight = '200px';
				overflow = 'auto';
			}
			innerHTML = '';	
		}
		
		input.parentNode.appendChild(preview);
		preview.hide();
		
		$('autocomplete_suggestions').selectedIndex = -1;
		$('autocomplete_suggestions').reqTimer = null;
				
		input.observe('keydown', function(event) {
		
			event = (event) ? event : window.event;
						
			if ($('autocomplete_suggestions').childNodes.length > 0 && (event.keyCode == 38 || event.keyCode == 40 || event.keyCode == 13 || event.keyCode == 27)) {

				switch (event.keyCode) {
					case 40:
						// down
						$('autocomplete_suggestions').show();
						if ($('autocomplete_suggestions').selectedIndex < $('autocomplete_suggestions').childNodes.length-1) {
							$('autocomplete_suggestions').selectedIndex++;
							if ($('autocomplete_suggestions').userInput == null) $('autocomplete_suggestions').userInput = input.value;
							input.value = '"'+$('autocomplete_suggestions').childNodes[$('autocomplete_suggestions').selectedIndex].title+'"';
						}
						break;
					case 38:
						// up
						$('autocomplete_suggestions').show();
						if ($('autocomplete_suggestions').selectedIndex > 0) {
							$('autocomplete_suggestions').selectedIndex--;
							if ($('autocomplete_suggestions').userInput == null) $('autocomplete_suggestions').userInput = input.value;
							input.value = '"'+$('autocomplete_suggestions').childNodes[$('autocomplete_suggestions').selectedIndex].title+'"';
						}
						break;
					case 13:
						// up
						// if ($('autocomplete_suggestions').selectedIndex > -1) input.value = '"'+$('autocomplete_suggestions').childNodes[$('autocomplete_suggestions').selectedIndex].title+'"';
						return;
						break;
					case 27:
						// esc
						if ($('autocomplete_suggestions').userInput != null) {
							input.value = $('autocomplete_suggestions').userInput;
							$('autocomplete_suggestions').userInput = null;
						}
						$('autocomplete_suggestions').hide();
						return;
						break;
				}
				$$('#autocomplete_suggestions a').each(function(el) { el.removeClassName('active'); });
				with ($('autocomplete_suggestions')) {
					childNodes[selectedIndex].addClassName('active');
					if (childNodes[selectedIndex].offsetTop > 150) $('autocomplete_suggestions').scrollTop = childNodes[selectedIndex].offsetTop - 150;
					else $('autocomplete_suggestions').scrollTop = 0;
				}
				
			} else {
				
				$('autocomplete_suggestions').userInput = null;
				
				if (!this.oldValue || this.oldValue != this.value) {
					this.oldValue = this.value;
					
					if (this.value != '') {
					
						if ($('autocomplete_suggestions').reqTimer != null) {
							window.clearTimeout($('autocomplete_suggestions').reqTimer);
						}
						
						$('autocomplete_suggestions').reqTimer = window.setTimeout( function() {
							$('autocomplete_suggestions').reqTimer = null;
							new Ajax.Request('autocomplete.server.php?q='+this.value, {
								method: 'get', 
								onSuccess: function(transport) {
									if (transport.responseJSON.suggestions.length > 0) {
										$('autocomplete_suggestions').show();
										$('autocomplete_suggestions').innerHTML = '';
										for (var c=0; c<transport.responseJSON.suggestions.length; c++) {
											var line = new Element('a');
											line.style.display = 'block';
											line.innerHTML = transport.responseJSON.suggestions[c].highlighted;
											line.title = transport.responseJSON.suggestions[c].text;
											line.onclick = function() {
												$('autocomplete_suggestions').hide();
												input.value = '"'+this.title+'"';
												return false;
											}
											$('autocomplete_suggestions').appendChild(line);
										}
									} else {
										$('autocomplete_suggestions').innerHTML = '<em>nichts gefunden</em>';
										$('autocomplete_suggestions').show();
									}
								}
							});
						}.bind(this), 300);
						
					} else {
						$('autocomplete_suggestions').hide();
					}
				}			
			}

		});
		
		$('autocomplete_suggestions').observe('focus', function() {
			this.keepFocus = true;
		});
		$('autocomplete_suggestions').observe('blur', function() {
			this.keepFocus = false;
		});
				
		input.observe('blur', function() {
			window.setTimeout(function() {
				if (!$('autocomplete_suggestions').keepFocus) {
					$('autocomplete_suggestions').hide();
				}
			}, 400);
		});
		
		input.observe('focus', function() {
			if ($('autocomplete_suggestions').innerHTML != '')	$('autocomplete_suggestions').show();
		});
		
	}
});