--- tag_complete/tag_complete.js	2006/08/18 17:23:51	41
+++ tag_complete/tag_complete.js	2006/08/18 21:58:54	45
@@ -7,8 +7,94 @@
 var _tag = {
 	name: new Array(),
 	obj: new Array(),
-	selected_name: new Array(),
-	selected_obj: new Array()
+	selected_obj: new Array(),
+
+	select: function( tag ) {
+
+		$.log.info('filter '+tag);
+
+		_tag.selected_obj = Array();
+		var j = 0;
+		var tag_len = tag.length;
+		var suggest = '<ul>';
+
+		for(var i = 0; i < _tag.name.length; i++) {
+			var t = _tag.name[i];
+			if ( t.substr(0, tag_len) == tag ) {
+				$.log.debug('selected ['+i+']: ' + t );
+
+				jQuery.className.add( _tag.obj[i], 'selected' );
+
+				suggest += '<li>' + t + '</li> ';
+				_tag.selected_obj[j] = _tag.obj[i];
+				j++;
+			}
+		}
+
+		suggest += '</ul>';
+
+		$('#suggest').html( suggest );
+		if (j > 0) {
+			$('#suggest li:nth(0)').addClass('selected');
+			_tag.current = 0;
+		}
+
+	},
+
+	clean_selected: function() {
+		for(var i = 0; i < _tag.selected_obj.length; i++) {
+			jQuery.className.remove( _tag.selected_obj[i], 'selected' );
+		}
+
+		var c = _tag.current;
+		if (c == null) return;
+
+		$('#suggest').html('');
+		_tag.current = null;
+	},
+
+
+	take_suggested: function() {
+		if (_tag.current == null) return;
+		var s = $('#suggest li:nth('+_tag.current+')').html();
+		$.log.info('take suggestion: '+s);
+		$('#tags').val(
+			$('#tags').val().replace(
+				/^([^ ][^ ]* )*[^ ]*$/, '$1' + s + ' '
+			)
+		);
+		_tag.focus();
+	},
+
+	move_suggested: function( where ) {
+		var c = _tag.current;
+		if (c == null) {
+			$.log.error('_tag.current is null');
+			return;
+		}
+		var to = c + where;
+		$.log.info('move_suggested('+where+') '+c+' -> '+to);
+		if (to < 0 || to >= _tag.selected_obj.length) {
+			$.log.error('move to invalid element '+to);
+			return;
+		}
+		var s = '#suggest li:nth('+c+')';
+		$( s ).removeClass('selected');
+		$.log.debug('remove selected from '+s);
+		s = '#suggest li:nth('+to+')';
+		$( s ).addClass('selected');
+		$.log.debug('add selected to '+s);
+		_tag.current = to;
+	},
+
+	last_tag: function() {
+		return $('#tags').val().replace(/^([^ ][^ ]* )*/, '');
+	},
+	focus: function() {
+		// $('#tags').focus() doesn't work!
+		document.getElementById('tags').focus();
+	}
+
 };
 
 $(document).ready( function() {
@@ -20,46 +106,65 @@
 	$.log.info( 'found ' + _tag.name.length + ' tags' );
 
 	$.log.info( 'hook onchange to #tags_form' );
-	$('#tags_form').change( function() {
-		$.log.debug('submit #tags_form');
-		//this.submit();
-		return false;
-	}).keyup( function() {
-		var t = $('#tags').val().replace(/^([^ ][^ ]* )*/, '');
+	$('#tags_form').keyup( function(e) {
 
-		if (! t ) return;
+		$.log.debug('keyup: '+e.keyCode);
 
-		$.log.debug('tag: ' + t);
+		switch (e.keyCode) {
+			case 38:	// up
+				e.preventDefault();
+				_tag.move_suggested( -1 );
+				return false;
+				break;
+			case 40:	// down
+				e.preventDefault();
+				_tag.move_suggested( +1 );
+				return false;
+				break;
+			case 9:		// tab
+			case 13:	// return
+				e.preventDefault();
+				_tag.take_suggested();
 
-		for(var i = 0; i < _tag.selected_obj.length; i++) {
-			jQuery.className.remove( _tag.selected_obj[i], 'selected' );
+				return false;
+				break;
 		}
 
-		_tag.selected_name = Array();
-		_tag.selected_obj = Array();
-		var j = 0;
 
-		if (t == '') return;
+		var t = _tag.last_tag();
 
-		for(var i = 0; i < _tag.name.length; i++) {
-			if ( _tag.name[i].substr(0, t.length) == t ) {
-				var t = _tag.name[i];
-				$.log.debug('selected ' + t );
+		$.log.debug('tag: ' + t + ' ['+t.length+']');
 
-				jQuery.className.add( _tag.obj[i], 'selected' );
+		_tag.clean_selected();
 
-				_tag.selected_obj[j] = _tag.obj[i];
-				_tag.selected_name[j] = _tag.name[i];
-				j++;
-			}
-		}
+		if (t == '') return false;
 
-		$.log.debug('selected ' + _tag.selected_obj.length + ' tags');
+		_tag.select(t);
+
+		$.log.info('selected ' + _tag.selected_obj.length + ' tags');
+
+		return true;
+	}).submit( function() {
+		$.log.debug('submit');
+		if (_tag.current == null) {
+			_tag.clean_selected();
+			return true;
+		} else {
+			return false;
+		}
+	}).blur( function() {
+		$.log.debug('blur');
+		_tag.clean_selected();
+		if (_tag.current == null) {
+			return true;
+		} else {
+			_tag.focus();
+			return false;
+		}
+	});
 
-		$('#suggest').html( _tag.selected_name.join(" ") );
-	}).focus();
-	
 	$.log.toggle();
 
+	_tag.focus();
 });