From caaef2492e17b397bb2ee3d60edfaf830ead51e5 Mon Sep 17 00:00:00 2001 From: Matthias Andreas Benkard Date: Mon, 27 Feb 2012 20:18:20 +0100 Subject: Book Marx: Implement tag auto-completion. --- static/js/bookmarx-submit.js | 55 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 55 insertions(+) create mode 100644 static/js/bookmarx-submit.js (limited to 'static') diff --git a/static/js/bookmarx-submit.js b/static/js/bookmarx-submit.js new file mode 100644 index 0000000..6e5ad01 --- /dev/null +++ b/static/js/bookmarx-submit.js @@ -0,0 +1,55 @@ +// Based on the jQuery UI autocomplete example. +// http://jqueryui.com/demos/autocomplete/#multiple + +$(function() { + var availableTags; + $.ajax('tags', { + success: function(data){ + availableTags = data; + } + }); + function split(val) { + return val.split(/,\s*/); + } + function extractLast(term) { + return split(term).pop(); + } + + $("#bookmark-tags-field") + // don't navigate away from the field on tab when selecting an item + .bind("keydown", function(event) { + if (event.keyCode === $.ui.keyCode.TAB && + $(this).data("autocomplete").menu.active) { + event.preventDefault(); + } + }) + .bind("keyup", function(event) { + if (event.keyCode === $.ui.keyCode.TAB && + $(this).data("autocomplete").menu.active) { + event.preventDefault(); + } + }) + .autocomplete({ + minLength: 0, + source: function(request, response) { + // delegate back to autocomplete, but extract the last term + response($.ui.autocomplete.filter( + availableTags, extractLast(request.term))); + }, + focus: function() { + // prevent value inserted on focus + return false; + }, + select: function(event, ui) { + var terms = split(this.value); + // remove the current input + terms.pop(); + // add the selected item + terms.push(ui.item.value); + // add placeholder to get the comma-and-space at the end + terms.push(""); + this.value = terms.join(", "); + return false; + } + }); +}); -- cgit v1.2.3