/src/main/webapp/public/js/lib/jquery.autocomplete.js

  1/*
  2 * jQuery Autocomplete plugin 1.1
  3 *
  4 * Copyright (c) 2009 J??rn Zaefferer
  5 *
  6 * Dual licensed under the MIT and GPL licenses:
  7 *   http://www.opensource.org/licenses/mit-license.php
  8 *   http://www.gnu.org/licenses/gpl.html
  9 *
 10 * Revision: $Id: jquery.autocomplete.js 15 2009-08-22 10:30:27Z joern.zaefferer $
 11 */
 12
 13;(function($) {
 14	
 15$.fn.extend({
 16	autocomplete: function(urlOrData, options) {
 17		var isUrl = typeof urlOrData == "string";
 18		options = $.extend({}, $.Autocompleter.defaults, {
 19			url: isUrl ? urlOrData : null,
 20			data: isUrl ? null : urlOrData,
 21			delay: isUrl ? $.Autocompleter.defaults.delay : 10,
 22			max: options && !options.scroll ? 10 : 150
 23		}, options);
 24		
 25		// if highlight is set to false, replace it with a do-nothing function
 26		options.highlight = options.highlight || function(value) { return value; };
 27		
 28		// if the formatMatch option is not specified, then use formatItem for backwards compatibility
 29		options.formatMatch = options.formatMatch || options.formatItem;
 30		
 31		return this.each(function() {
 32			new $.Autocompleter(this, options);
 33		});
 34	},
 35	result: function(handler) {
 36		return this.bind("result", handler);
 37	},
 38	search: function(handler) {
 39		return this.trigger("search", [handler]);
 40	},
 41	flushCache: function() {
 42		return this.trigger("flushCache");
 43	},
 44	setOptions: function(options){
 45		return this.trigger("setOptions", [options]);
 46	},
 47	unautocomplete: function() {
 48		return this.trigger("unautocomplete");
 49	}
 50});
 51
 52$.Autocompleter = function(input, options) {
 53
 54	var KEY = {
 55		UP: 38,
 56		DOWN: 40,
 57		DEL: 46,
 58		TAB: 9,
 59		RETURN: 13,
 60		ESC: 27,
 61		COMMA: 188,
 62		PAGEUP: 33,
 63		PAGEDOWN: 34,
 64		BACKSPACE: 8
 65	};
 66
 67	// Create $ object for input element
 68	var $input = $(input).attr("autocomplete", "off").addClass(options.inputClass);
 69
 70	var timeout;
 71	var previousValue = "";
 72	var cache = $.Autocompleter.Cache(options);
 73	var hasFocus = 0;
 74	var lastKeyPressCode;
 75	var config = {
 76		mouseDownOnSelect: false
 77	};
 78	var select = $.Autocompleter.Select(options, input, selectCurrent, config);
 79	
 80	var blockSubmit;
 81	
 82	// prevent form submit in opera when selecting with return key
 83	$.browser.opera && $(input.form).bind("submit.autocomplete", function() {
 84		if (blockSubmit) {
 85			blockSubmit = false;
 86			return false;
 87		}
 88	});
 89	
 90	// only opera doesn't trigger keydown multiple times while pressed, others don't work with keypress at all
 91	$input.bind(($.browser.opera ? "keypress" : "keydown") + ".autocomplete", function(event) {
 92		// a keypress means the input has focus
 93		// avoids issue where input had focus before the autocomplete was applied
 94		hasFocus = 1;
 95		// track last key pressed
 96		lastKeyPressCode = event.keyCode;
 97		switch(event.keyCode) {
 98		
 99			case KEY.UP:
100				event.preventDefault();
101				if ( select.visible() ) {
102					select.prev();
103				} else {
104					onChange(0, true);
105				}
106				break;
107				
108			case KEY.DOWN:
109				event.preventDefault();
110				if ( select.visible() ) {
111					select.next();
112				} else {
113					onChange(0, true);
114				}
115				break;
116				
117			case KEY.PAGEUP:
118				event.preventDefault();
119				if ( select.visible() ) {
120					select.pageUp();
121				} else {
122					onChange(0, true);
123				}
124				break;
125				
126			case KEY.PAGEDOWN:
127				event.preventDefault();
128				if ( select.visible() ) {
129					select.pageDown();
130				} else {
131					onChange(0, true);
132				}
133				break;
134			
135			// matches also semicolon
136			case options.multiple && $.trim(options.multipleSeparator) == "," && KEY.COMMA:
137			case KEY.TAB:
138			case KEY.RETURN:
139				if( selectCurrent() ) {
140					// stop default to prevent a form submit, Opera needs special handling
141					event.preventDefault();
142					blockSubmit = true;
143					return false;
144				}
145				break;
146				
147			case KEY.ESC:
148				select.hide();
149				break;
150				
151			default:
152				clearTimeout(timeout);
153				timeout = setTimeout(onChange, options.delay);
154				break;
155		}
156	}).focus(function(){
157		// track whether the field has focus, we shouldn't process any
158		// results if the field no longer has focus
159		hasFocus++;
160	}).blur(function() {
161		hasFocus = 0;
162		if (!config.mouseDownOnSelect) {
163			hideResults();
164		}
165	}).click(function() {
166		// show select when clicking in a focused field
167		if ( hasFocus++ > 1 && !select.visible() ) {
168			onChange(0, true);
169		}
170	}).bind("search", function() {
171		// TODO why not just specifying both arguments?
172		var fn = (arguments.length > 1) ? arguments[1] : null;
173		function findValueCallback(q, data) {
174			var result;
175			if( data && data.length ) {
176				for (var i=0; i < data.length; i++) {
177					if( data[i].result.toLowerCase() == q.toLowerCase() ) {
178						result = data[i];
179						break;
180					}
181				}
182			}
183			if( typeof fn == "function" ) fn(result);
184			else $input.trigger("result", result && [result.data, result.value]);
185		}
186		$.each(trimWords($input.val()), function(i, value) {
187			request(value, findValueCallback, findValueCallback);
188		});
189	}).bind("flushCache", function() {
190		cache.flush();
191	}).bind("setOptions", function() {
192		$.extend(options, arguments[1]);
193		// if we've updated the data, repopulate
194		if ( "data" in arguments[1] )
195			cache.populate();
196	}).bind("unautocomplete", function() {
197		select.unbind();
198		$input.unbind();
199		$(input.form).unbind(".autocomplete");
200	});
201	
202	
203	function selectCurrent() {
204		var selected = select.selected();
205		if( !selected )
206			return false;
207		
208		var v = selected.result;
209		previousValue = v;
210		
211		if ( options.multiple ) {
212			var words = trimWords($input.val());
213			if ( words.length > 1 ) {
214				var seperator = options.multipleSeparator.length;
215				var cursorAt = $(input).selection().start;
216				var wordAt, progress = 0;
217				$.each(words, function(i, word) {
218					progress += word.length;
219					if (cursorAt <= progress) {
220						wordAt = i;
221						return false;
222					}
223					progress += seperator;
224				});
225				words[wordAt] = v;
226				// TODO this should set the cursor to the right position, but it gets overriden somewhere
227				//$.Autocompleter.Selection(input, progress + seperator, progress + seperator);
228				v = words.join( options.multipleSeparator );
229			}
230			v += options.multipleSeparator;
231		}
232		
233		$input.val(v);
234		hideResultsNow();
235		$input.trigger("result", [selected.data, selected.value]);
236		return true;
237	}
238	
239	function onChange(crap, skipPrevCheck) {
240		if( lastKeyPressCode == KEY.DEL ) {
241			select.hide();
242			return;
243		}
244		
245		var currentValue = $input.val();
246		
247		if ( !skipPrevCheck && currentValue == previousValue )
248			return;
249		
250		previousValue = currentValue;
251		
252		currentValue = lastWord(currentValue);
253		if ( currentValue.length >= options.minChars) {
254			$input.addClass(options.loadingClass);
255			if (!options.matchCase)
256				currentValue = currentValue.toLowerCase();
257			request(currentValue, receiveData, hideResultsNow);
258		} else {
259			stopLoading();
260			select.hide();
261		}
262	};
263	
264	function trimWords(value) {
265		if (!value)
266			return [""];
267		if (!options.multiple)
268			return [$.trim(value)];
269		return $.map(value.split(options.multipleSeparator), function(word) {
270			return $.trim(value).length ? $.trim(word) : null;
271		});
272	}
273	
274	function lastWord(value) {
275		if ( !options.multiple )
276			return value;
277		var words = trimWords(value);
278		if (words.length == 1) 
279			return words[0];
280		var cursorAt = $(input).selection().start;
281		if (cursorAt == value.length) {
282			words = trimWords(value)
283		} else {
284			words = trimWords(value.replace(value.substring(cursorAt), ""));
285		}
286		return words[words.length - 1];
287	}
288	
289	// fills in the input box w/the first match (assumed to be the best match)
290	// q: the term entered
291	// sValue: the first matching result
292	function autoFill(q, sValue){
293		// autofill in the complete box w/the first match as long as the user hasn't entered in more data
294		// if the last user key pressed was backspace, don't autofill
295		if( options.autoFill && (lastWord($input.val()).toLowerCase() == q.toLowerCase()) && lastKeyPressCode != KEY.BACKSPACE ) {
296			// fill in the value (keep the case the user has typed)
297			$input.val($input.val() + sValue.substring(lastWord(previousValue).length));
298			// select the portion of the value not typed by the user (so the next character will erase)
299			$(input).selection(previousValue.length, previousValue.length + sValue.length);
300		}
301	};
302
303	function hideResults() {
304		clearTimeout(timeout);
305		timeout = setTimeout(hideResultsNow, 200);
306	};
307
308	function hideResultsNow() {
309		var wasVisible = select.visible();
310		select.hide();
311		clearTimeout(timeout);
312		stopLoading();
313		if (options.mustMatch) {
314			// call search and run callback
315			$input.search(
316				function (result){
317					// if no value found, clear the input box
318					if( !result ) {
319						if (options.multiple) {
320							var words = trimWords($input.val()).slice(0, -1);
321							$input.val( words.join(options.multipleSeparator) + (words.length ? options.multipleSeparator : "") );
322						}
323						else {
324							$input.val( "" );
325							$input.trigger("result", null);
326						}
327					}
328				}
329			);
330		}
331	};
332
333	function receiveData(q, data) {
334		if ( data && data.length && hasFocus ) {
335			stopLoading();
336			select.display(data, q);
337			autoFill(q, data[0].value);
338			select.show();
339		} else {
340			hideResultsNow();
341		}
342	};
343
344	function request(term, success, failure) {
345		if (!options.matchCase)
346			term = term.toLowerCase();
347		var data = cache.load(term);
348		// recieve the cached data
349		if (data && data.length) {
350			success(term, data);
351		// if an AJAX url has been supplied, try loading the data now
352		} else if( (typeof options.url == "string") && (options.url.length > 0) ){
353			
354			var extraParams = {
355				timestamp: +new Date()
356			};
357			$.each(options.extraParams, function(key, param) {
358				extraParams[key] = typeof param == "function" ? param() : param;
359			});
360			// modified this method as we need to build urls on rest based <Abhishek>
361			$.ajax({
362				// try to leverage ajaxQueue plugin to abort previous requests
363				mode: "abort",
364				// limit abortion to this input
365				port: "autocomplete" + input.name,
366				dataType: options.dataType,
367				url: options.url + lastWord(term) + '.json',
368				success: function(data) {
369					var parsed = options.parse && options.parse(data) || parse(data);
370					cache.add(term, parsed);
371					success(term, parsed);
372				}
373			});
374		} else {
375			// if we have a failure, we need to empty the list -- this prevents the the [TAB] key from selecting the last successful match
376			select.emptyList();
377			failure(term);
378		}
379	};
380	
381	function parse(data) {
382		var parsed = [];
383		var rows = data.split("\n");
384		for (var i=0; i < rows.length; i++) {
385			var row = $.trim(rows[i]);
386			if (row) {
387				row = row.split("|");
388				parsed[parsed.length] = {
389					data: row,
390					value: row[0],
391					result: options.formatResult && options.formatResult(row, row[0]) || row[0]
392				};
393			}
394		}
395		return parsed;
396	};
397
398	function stopLoading() {
399		$input.removeClass(options.loadingClass);
400	};
401
402};
403
404$.Autocompleter.defaults = {
405	inputClass: "ac_input",
406	resultsClass: "ac_results",
407	loadingClass: "ac_loading",
408	minChars: 1,
409	delay: 400,
410	matchCase: false,
411	matchSubset: true,
412	matchContains: false,
413	cacheLength: 10,
414	max: 100,
415	mustMatch: false,
416	extraParams: {},
417	selectFirst: true,
418	formatItem: function(row) { return row[0]; },
419	formatMatch: null,
420	autoFill: false,
421	width: 0,
422	multiple: false,
423	multipleSeparator: ", ",
424	highlight: function(value, term) {
425		return value.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + term.replace(/([\^\$\(\)\[\]\{\}\*\.\+\?\|\\])/gi, "\\$1") + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<strong>$1</strong>");
426	},
427    scroll: true,
428    scrollHeight: 180
429};
430
431$.Autocompleter.Cache = function(options) {
432
433	var data = {};
434	var length = 0;
435	
436	function matchSubset(s, sub) {
437		if (!options.matchCase) 
438			s = s.toLowerCase();
439		var i = s.indexOf(sub);
440		if (options.matchContains == "word"){
441			i = s.toLowerCase().search("\\b" + sub.toLowerCase());
442		}
443		if (i == -1) return false;
444		return i == 0 || options.matchContains;
445	};
446	
447	function add(q, value) {
448		if (length > options.cacheLength){
449			flush();
450		}
451		if (!data[q]){ 
452			length++;
453		}
454		data[q] = value;
455	}
456	
457	function populate(){
458		if( !options.data ) return false;
459		// track the matches
460		var stMatchSets = {},
461			nullData = 0;
462
463		// no url was specified, we need to adjust the cache length to make sure it fits the local data store
464		if( !options.url ) options.cacheLength = 1;
465		
466		// track all options for minChars = 0
467		stMatchSets[""] = [];
468		
469		// loop through the array and create a lookup structure
470		for ( var i = 0, ol = options.data.length; i < ol; i++ ) {
471			var rawValue = options.data[i];
472			// if rawValue is a string, make an array otherwise just reference the array
473			rawValue = (typeof rawValue == "string") ? [rawValue] : rawValue;
474			
475			var value = options.formatMatch(rawValue, i+1, options.data.length);
476			if ( value === false )
477				continue;
478				
479			var firstChar = value.charAt(0).toLowerCase();
480			// if no lookup array for this character exists, look it up now
481			if( !stMatchSets[firstChar] ) 
482				stMatchSets[firstChar] = [];
483
484			// if the match is a string
485			var row = {
486				value: value,
487				data: rawValue,
488				result: options.formatResult && options.formatResult(rawValue) || value
489			};
490			
491			// push the current match into the set list
492			stMatchSets[firstChar].push(row);
493
494			// keep track of minChars zero items
495			if ( nullData++ < options.max ) {
496				stMatchSets[""].push(row);
497			}
498		};
499
500		// add the data items to the cache
501		$.each(stMatchSets, function(i, value) {
502			// increase the cache size
503			options.cacheLength++;
504			// add to the cache
505			add(i, value);
506		});
507	}
508	
509	// populate any existing data
510	setTimeout(populate, 25);
511	
512	function flush(){
513		data = {};
514		length = 0;
515	}
516	
517	return {
518		flush: flush,
519		add: add,
520		populate: populate,
521		load: function(q) {
522			if (!options.cacheLength || !length)
523				return null;
524			/* 
525			 * if dealing w/local data and matchContains than we must make sure
526			 * to loop through all the data collections looking for matches
527			 */
528			if( !options.url && options.matchContains ){
529				// track all matches
530				var csub = [];
531				// loop through all the data grids for matches
532				for( var k in data ){
533					// don't search through the stMatchSets[""] (minChars: 0) cache
534					// this prevents duplicates
535					if( k.length > 0 ){
536						var c = data[k];
537						$.each(c, function(i, x) {
538							// if we've got a match, add it to the array
539							if (matchSubset(x.value, q)) {
540								csub.push(x);
541							}
542						});
543					}
544				}				
545				return csub;
546			} else 
547			// if the exact item exists, use it
548			if (data[q]){
549				return data[q];
550			} else
551			if (options.matchSubset) {
552				for (var i = q.length - 1; i >= options.minChars; i--) {
553					var c = data[q.substr(0, i)];
554					if (c) {
555						var csub = [];
556						$.each(c, function(i, x) {
557							if (matchSubset(x.value, q)) {
558								csub[csub.length] = x;
559							}
560						});
561						return csub;
562					}
563				}
564			}
565			return null;
566		}
567	};
568};
569
570$.Autocompleter.Select = function (options, input, select, config) {
571	var CLASSES = {
572		ACTIVE: "ac_over"
573	};
574	
575	var listItems,
576		active = -1,
577		data,
578		term = "",
579		needsInit = true,
580		element,
581		list;
582	
583	// Create results
584	function init() {
585		if (!needsInit)
586			return;
587		element = $("<div/>")
588		.hide()
589		.addClass(options.resultsClass)
590		.css("position", "absolute")
591		.appendTo(document.body);
592	
593		list = $("<ul/>").appendTo(element).mouseover( function(event) {
594			if(target(event).nodeName && target(event).nodeName.toUpperCase() == 'LI') {
595	            active = $("li", list).removeClass(CLASSES.ACTIVE).index(target(event));
596			    $(target(event)).addClass(CLASSES.ACTIVE);            
597	        }
598		}).click(function(event) {
599			$(target(event)).addClass(CLASSES.ACTIVE);
600			select();
601			// TODO provide option to avoid setting focus again after selection? useful for cleanup-on-focus
602			input.focus();
603			return false;
604		}).mousedown(function() {
605			config.mouseDownOnSelect = true;
606		}).mouseup(function() {
607			config.mouseDownOnSelect = false;
608		});
609		
610		if( options.width > 0 )
611			element.css("width", options.width);
612			
613		needsInit = false;
614	} 
615	
616	function target(event) {
617		var element = event.target;
618		while(element && element.tagName != "LI")
619			element = element.parentNode;
620		// more fun with IE, sometimes event.target is empty, just ignore it then
621		if(!element)
622			return [];
623		return element;
624	}
625
626	function moveSelect(step) {
627		listItems.slice(active, active + 1).removeClass(CLASSES.ACTIVE);
628		movePosition(step);
629        var activeItem = listItems.slice(active, active + 1).addClass(CLASSES.ACTIVE);
630        if(options.scroll) {
631            var offset = 0;
632            listItems.slice(0, active).each(function() {
633				offset += this.offsetHeight;
634			});
635            if((offset + activeItem[0].offsetHeight - list.scrollTop()) > list[0].clientHeight) {
636                list.scrollTop(offset + activeItem[0].offsetHeight - list.innerHeight());
637            } else if(offset < list.scrollTop()) {
638                list.scrollTop(offset);
639            }
640        }
641	};
642	
643	function movePosition(step) {
644		active += step;
645		if (active < 0) {
646			active = listItems.size() - 1;
647		} else if (active >= listItems.size()) {
648			active = 0;
649		}
650	}
651	
652	function limitNumberOfItems(available) {
653		return options.max && options.max < available
654			? options.max
655			: available;
656	}
657	
658	function fillList() {
659		list.empty();
660		var max = limitNumberOfItems(data.length);
661		for (var i=0; i < max; i++) {
662			if (!data[i])
663				continue;
664			var formatted = options.formatItem(data[i].data, i+1, max, data[i].value, term);
665			if ( formatted === false )
666				continue;
667			if(options.highlight(formatted, term) == undefined) 
668			    continue;
669			var li = $("<li/>").html( options.highlight(formatted, term) ).addClass(i%2 == 0 ? "ac_even" : "ac_odd").appendTo(list)[0];
670			$.data(li, "ac_data", data[i]);
671		}
672		listItems = list.find("li");
673		if ( options.selectFirst ) {
674			listItems.slice(0, 1).addClass(CLASSES.ACTIVE);
675			active = 0;
676		}
677		// apply bgiframe if available
678		if ( $.fn.bgiframe )
679			list.bgiframe();
680	}
681	
682	return {
683		display: function(d, q) {
684			init();
685			data = d;
686			term = q;
687			fillList();
688		},
689		next: function() {
690			moveSelect(1);
691		},
692		prev: function() {
693			moveSelect(-1);
694		},
695		pageUp: function() {
696			if (active != 0 && active - 8 < 0) {
697				moveSelect( -active );
698			} else {
699				moveSelect(-8);
700			}
701		},
702		pageDown: function() {
703			if (active != listItems.size() - 1 && active + 8 > listItems.size()) {
704				moveSelect( listItems.size() - 1 - active );
705			} else {
706				moveSelect(8);
707			}
708		},
709		hide: function() {
710			element && element.hide();
711			listItems && listItems.removeClass(CLASSES.ACTIVE);
712			active = -1;
713		},
714		visible : function() {
715			return element && element.is(":visible");
716		},
717		current: function() {
718			return this.visible() && (listItems.filter("." + CLASSES.ACTIVE)[0] || options.selectFirst && listItems[0]);
719		},
720		show: function() {
721			var offset = $(input).offset();
722			element.css({
723				width: typeof options.width == "string" || options.width > 0 ? options.width : $(input).width(),
724				top: offset.top + input.offsetHeight,
725				left: offset.left
726			}).show();
727            if(options.scroll) {
728                list.scrollTop(0);
729                list.css({
730					maxHeight: options.scrollHeight,
731					overflow: 'auto'
732				});
733				
734                if($.browser.msie && typeof document.body.style.maxHeight === "undefined") {
735					var listHeight = 0;
736					listItems.each(function() {
737						listHeight += this.offsetHeight;
738					});
739					var scrollbarsVisible = listHeight > options.scrollHeight;
740                    list.css('height', scrollbarsVisible ? options.scrollHeight : listHeight );
741					if (!scrollbarsVisible) {
742						// IE doesn't recalculate width when scrollbar disappears
743						listItems.width( list.width() - parseInt(listItems.css("padding-left")) - parseInt(listItems.css("padding-right")) );
744					}
745                }
746                
747            }
748		},
749		selected: function() {
750			var selected = listItems && listItems.filter("." + CLASSES.ACTIVE).removeClass(CLASSES.ACTIVE);
751			return selected && selected.length && $.data(selected[0], "ac_data");
752		},
753		emptyList: function (){
754			list && list.empty();
755		},
756		unbind: function() {
757			element && element.remove();
758		}
759	};
760};
761
762$.fn.selection = function(start, end) {
763	if (start !== undefined) {
764		return this.each(function() {
765			if( this.createTextRange ){
766				var selRange = this.createTextRange();
767				if (end === undefined || start == end) {
768					selRange.move("character", start);
769					selRange.select();
770				} else {
771					selRange.collapse(true);
772					selRange.moveStart("character", start);
773					selRange.moveEnd("character", end);
774					selRange.select();
775				}
776			} else if( this.setSelectionRange ){
777				this.setSelectionRange(start, end);
778			} else if( this.selectionStart ){
779				this.selectionStart = start;
780				this.selectionEnd = end;
781			}
782		});
783	}
784	var field = this[0];
785	if ( field.createTextRange ) {
786		var range = document.selection.createRange(),
787			orig = field.value,
788			teststring = "<->",
789			textLength = range.text.length;
790		range.text = teststring;
791		var caretAt = field.value.indexOf(teststring);
792		field.value = orig;
793		this.selection(caretAt, caretAt + textLength);
794		return {
795			start: caretAt,
796			end: caretAt + textLength
797		}
798	} else if( field.selectionStart !== undefined ){
799		return {
800			start: field.selectionStart,
801			end: field.selectionEnd
802		}
803	}
804};
805
806})(jQuery);