Rewrite of Mark's plugin, replacing the externals with CDN links, upd…

…ating to 1.8 widget factory, integrating jQuery UI Autocomplete into the tokenlist widget and cleaning up various stuff
jzaefferer · Mar 28, 2010 · 4031aec · 4031aec
1 parent 0e04cf4
commit 4031aec
Show file tree

Hide file tree

Showing 17 changed files with 62 additions and 155 deletions.
diff --git a/Makefile b/Makefile
diff --git a/README.md b/README.md
@@ -0,0 +1,6 @@
+jQuery Tokenlist Plugin
+=====================
+
+A fork of [Mark Gibson's Tokenlist](http://github.com/jollytoad/jquery.ui-tokenlist).
+
+Uses jQuery UI for themeing and autocomplete.
diff --git a/build b/build
diff --git a/demo/demo.css b/demo/demo.css
diff --git a/demo/demo.html b/demo/demo.html
diff --git a/demo/demo.js b/demo/demo.js
diff --git a/demo/index.html b/demo/index.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+	<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
+	<title>Token List Demo</title>
+	<link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/themes/base/jquery-ui.css" rel="stylesheet" />
+	<link rel="stylesheet" href="../jquery.tokenlist.css" type="text/css" />	
+</head>
+<body>
+	<h1>Token List Demo</h1>
+
+	<p>Convert a plain text field into a facebook style list builder:</p>
+
+	<label for="test1">Numbers from one to ten please, no duplicates:</label>
+	<input id="test1" type="text" value="one, two, four" class="test"/>
+
+	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
+	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.js"></script>
+	<script type="text/javascript" src="../jquery.tokenlist.js"></script>
+	<script type="text/javascript">
+	$('.test').tokenlist({
+		validate: ['one','two','three','four','five','six','seven','eight','nine','ten']
+	});
+	</script>
+</body>
+</html>
+
diff --git a/demo/jquery.js b/demo/jquery.js
diff --git a/demo/ui-css b/demo/ui-css
diff --git a/demo/ui-src b/demo/ui-src
diff --git a/external/jquery b/external/jquery
diff --git a/external/jquery-ui b/external/jquery-ui
diff --git a/css/ui.tokenlist.css → jquery.tokenlist.css b/css/ui.tokenlist.css → jquery.tokenlist.css
diff --git a/src/jquery.ui.tokenlist.js → jquery.tokenlist.js b/src/jquery.ui.tokenlist.js → jquery.tokenlist.js
@@ -1,17 +1,27 @@
 /*!
- * jQuery UI Token List @VERSION
+ * jQuery Token List Plugin
  *
- * Copyright (c) 2009 Adaptavist.com
+ * Copyright 2010 Jörn Zaefferer
  * Dual licensed under the MIT and GPL licenses.
- */
-/* Depends:
- *  ui.core.js
+ * 
+ * Based on work by Mark Gibson (http://github.com/jollytoad/jquery.ui-tokenlist)
+ *
+ * Depends:
+ *  jquery.ui.widget.js
  */
 (function($) {
 
 $.widget('ui.tokenlist', {
+
+	options: {
+		split: /\s*,\s*/,
+		join: ', ',
+		removeTip: "Remove Item",
+		duplicates: false,
+		validate: false // May be false, an array of allowed values, or a validation function
+	},
 
-	_init: function() {
+	_create: function() {
 		var self = this, key = $.ui.keyCode;
 
 		if ( !this.options.items ) {
@@ -117,6 +127,14 @@ $.widget('ui.tokenlist', {
 					if (self.add($(this).val()).length) {
 						$(this).val('');
 					}
+				}).autocomplete({
+					source: this.options.validate,
+					delay: 0,
+					select: function() {
+						setTimeout(function() {
+							self.inputElem.trigger("change.tokenlist");
+						}, 13);
+					}
 				});
 
 		// Add the new item input field
@@ -259,19 +277,10 @@ $.widget('ui.tokenlist', {
 				.trigger('change');
 		}
 		this.element.trigger('change');
-	}
-});
-
-$.extend($.ui.tokenlist, {
-	getter: "add input items value",
-	version: "@VERSION",
-
-	defaults: {
-		split: /\s*,\s*/,
-		join: ', ',
-		removeTip: "Remove Item",
-		duplicates: false,
-		validate: false // Maybe false, an array of allowed values, or a validation function
+	},
+
+	_getData: function(data) {
+		return this.options[data];
 	}
 });
 

diff --git a/src/jquery.ui.autocomplete.js b/src/jquery.ui.autocomplete.js
diff --git a/src/jquery.ui.menu.js b/src/jquery.ui.menu.js
diff --git a/version.txt b/version.txt