1 | /*
|
---|
2 | * bootstrap-tagsinput v0.8.0
|
---|
3 | *
|
---|
4 | */
|
---|
5 |
|
---|
6 | (function ($) {
|
---|
7 | "use strict";
|
---|
8 |
|
---|
9 | var defaultOptions = {
|
---|
10 | tagClass: function(item) {
|
---|
11 | return 'label label-info';
|
---|
12 | },
|
---|
13 | focusClass: 'focus',
|
---|
14 | itemValue: function(item) {
|
---|
15 | return item ? item.toString() : item;
|
---|
16 | },
|
---|
17 | itemText: function(item) {
|
---|
18 | return this.itemValue(item);
|
---|
19 | },
|
---|
20 | itemTitle: function(item) {
|
---|
21 | return null;
|
---|
22 | },
|
---|
23 | freeInput: true,
|
---|
24 | addOnBlur: true,
|
---|
25 | maxTags: undefined,
|
---|
26 | maxChars: undefined,
|
---|
27 | confirmKeys: [13, 44],
|
---|
28 | delimiter: ',',
|
---|
29 | delimiterRegex: null,
|
---|
30 | cancelConfirmKeysOnEmpty: false,
|
---|
31 | onTagExists: function(item, $tag) {
|
---|
32 | $tag.hide().fadeIn();
|
---|
33 | },
|
---|
34 | trimValue: false,
|
---|
35 | allowDuplicates: false,
|
---|
36 | triggerChange: true
|
---|
37 | };
|
---|
38 |
|
---|
39 | /**
|
---|
40 | * Constructor function
|
---|
41 | */
|
---|
42 | function TagsInput(element, options) {
|
---|
43 | this.isInit = true;
|
---|
44 | this.itemsArray = [];
|
---|
45 |
|
---|
46 | this.$element = $(element);
|
---|
47 | this.$element.hide();
|
---|
48 |
|
---|
49 | this.isSelect = (element.tagName === 'SELECT');
|
---|
50 | this.multiple = (this.isSelect && element.hasAttribute('multiple'));
|
---|
51 | this.objectItems = options && options.itemValue;
|
---|
52 | this.placeholderText = element.hasAttribute('placeholder') ? this.$element.attr('placeholder') : '';
|
---|
53 | this.inputSize = Math.max(1, this.placeholderText.length);
|
---|
54 |
|
---|
55 | this.$container = $('<div class="bootstrap-tagsinput"></div>');
|
---|
56 | this.$input = $('<input type="text" placeholder="' + this.placeholderText + '"/>').appendTo(this.$container);
|
---|
57 |
|
---|
58 | this.$element.before(this.$container);
|
---|
59 |
|
---|
60 | this.build(options);
|
---|
61 | this.isInit = false;
|
---|
62 | }
|
---|
63 |
|
---|
64 | TagsInput.prototype = {
|
---|
65 | constructor: TagsInput,
|
---|
66 |
|
---|
67 | /**
|
---|
68 | * Adds the given item as a new tag. Pass true to dontPushVal to prevent
|
---|
69 | * updating the elements val()
|
---|
70 | */
|
---|
71 | add: function(item, dontPushVal, options) {
|
---|
72 | var self = this;
|
---|
73 |
|
---|
74 | if (self.options.maxTags && self.itemsArray.length >= self.options.maxTags)
|
---|
75 | return;
|
---|
76 |
|
---|
77 | // Ignore falsey values, except false
|
---|
78 | if (item !== false && !item)
|
---|
79 | return;
|
---|
80 |
|
---|
81 | // Trim value
|
---|
82 | if (typeof item === "string" && self.options.trimValue) {
|
---|
83 | item = $.trim(item);
|
---|
84 | }
|
---|
85 |
|
---|
86 | // Throw an error when trying to add an object while the itemValue option was not set
|
---|
87 | if (typeof item === "object" && !self.objectItems)
|
---|
88 | throw("Can't add objects when itemValue option is not set");
|
---|
89 |
|
---|
90 | // Ignore strings only containg whitespace
|
---|
91 | if (item.toString().match(/^\s*$/))
|
---|
92 | return;
|
---|
93 |
|
---|
94 | // If SELECT but not multiple, remove current tag
|
---|
95 | if (self.isSelect && !self.multiple && self.itemsArray.length > 0)
|
---|
96 | self.remove(self.itemsArray[0]);
|
---|
97 |
|
---|
98 | if (typeof item === "string" && this.$element[0].tagName === 'INPUT') {
|
---|
99 | var delimiter = (self.options.delimiterRegex) ? self.options.delimiterRegex : self.options.delimiter;
|
---|
100 | var items = item.split(delimiter);
|
---|
101 | if (items.length > 1) {
|
---|
102 | for (var i = 0; i < items.length; i++) {
|
---|
103 | this.add(items[i], true);
|
---|
104 | }
|
---|
105 |
|
---|
106 | if (!dontPushVal)
|
---|
107 | self.pushVal(self.options.triggerChange);
|
---|
108 | return;
|
---|
109 | }
|
---|
110 | }
|
---|
111 |
|
---|
112 | var itemValue = self.options.itemValue(item),
|
---|
113 | itemText = self.options.itemText(item),
|
---|
114 | tagClass = self.options.tagClass(item),
|
---|
115 | itemTitle = self.options.itemTitle(item);
|
---|
116 |
|
---|
117 | // Ignore items allready added
|
---|
118 | var existing = $.grep(self.itemsArray, function(item) { return self.options.itemValue(item) === itemValue; } )[0];
|
---|
119 | if (existing && !self.options.allowDuplicates) {
|
---|
120 | // Invoke onTagExists
|
---|
121 | if (self.options.onTagExists) {
|
---|
122 | var $existingTag = $(".tag", self.$container).filter(function() { return $(this).data("item") === existing; });
|
---|
123 | self.options.onTagExists(item, $existingTag);
|
---|
124 | }
|
---|
125 | return;
|
---|
126 | }
|
---|
127 |
|
---|
128 | // if length greater than limit
|
---|
129 | if (self.items().toString().length + item.length + 1 > self.options.maxInputLength)
|
---|
130 | return;
|
---|
131 |
|
---|
132 | // raise beforeItemAdd arg
|
---|
133 | var beforeItemAddEvent = $.Event('beforeItemAdd', { item: item, cancel: false, options: options});
|
---|
134 | self.$element.trigger(beforeItemAddEvent);
|
---|
135 | if (beforeItemAddEvent.cancel)
|
---|
136 | return;
|
---|
137 |
|
---|
138 | // register item in internal array and map
|
---|
139 | self.itemsArray.push(item);
|
---|
140 |
|
---|
141 | // add a tag element
|
---|
142 |
|
---|
143 | var $tag = $('<span class="tag ' + htmlEncode(tagClass) + (itemTitle !== null ? ('" title="' + itemTitle) : '') + '">' + htmlEncode(itemText) + '<span data-role="remove"></span></span>');
|
---|
144 | $tag.data('item', item);
|
---|
145 | self.findInputWrapper().before($tag);
|
---|
146 | $tag.after(' ');
|
---|
147 |
|
---|
148 | // Check to see if the tag exists in its raw or uri-encoded form
|
---|
149 | var optionExists = (
|
---|
150 | $('option[value="' + encodeURIComponent(itemValue) + '"]', self.$element).length ||
|
---|
151 | $('option[value="' + htmlEncode(itemValue) + '"]', self.$element).length
|
---|
152 | );
|
---|
153 |
|
---|
154 | // add <option /> if item represents a value not present in one of the <select />'s options
|
---|
155 | if (self.isSelect && !optionExists) {
|
---|
156 | var $option = $('<option selected>' + htmlEncode(itemText) + '</option>');
|
---|
157 | $option.data('item', item);
|
---|
158 | $option.attr('value', itemValue);
|
---|
159 | self.$element.append($option);
|
---|
160 | }
|
---|
161 |
|
---|
162 | if (!dontPushVal)
|
---|
163 | self.pushVal(self.options.triggerChange);
|
---|
164 |
|
---|
165 | // Add class when reached maxTags
|
---|
166 | if (self.options.maxTags === self.itemsArray.length || self.items().toString().length === self.options.maxInputLength)
|
---|
167 | self.$container.addClass('bootstrap-tagsinput-max');
|
---|
168 |
|
---|
169 | // If using typeahead, once the tag has been added, clear the typeahead value so it does not stick around in the input.
|
---|
170 | if ($('.typeahead, .twitter-typeahead', self.$container).length) {
|
---|
171 | self.$input.typeahead('val', '');
|
---|
172 | }
|
---|
173 |
|
---|
174 | if (this.isInit) {
|
---|
175 | self.$element.trigger($.Event('itemAddedOnInit', { item: item, options: options }));
|
---|
176 | } else {
|
---|
177 | self.$element.trigger($.Event('itemAdded', { item: item, options: options }));
|
---|
178 | }
|
---|
179 | },
|
---|
180 |
|
---|
181 | /**
|
---|
182 | * Removes the given item. Pass true to dontPushVal to prevent updating the
|
---|
183 | * elements val()
|
---|
184 | */
|
---|
185 | remove: function(item, dontPushVal, options) {
|
---|
186 | var self = this;
|
---|
187 |
|
---|
188 | if (self.objectItems) {
|
---|
189 | if (typeof item === "object")
|
---|
190 | item = $.grep(self.itemsArray, function(other) { return self.options.itemValue(other) == self.options.itemValue(item); } );
|
---|
191 | else
|
---|
192 | item = $.grep(self.itemsArray, function(other) { return self.options.itemValue(other) == item; } );
|
---|
193 |
|
---|
194 | item = item[item.length-1];
|
---|
195 | }
|
---|
196 |
|
---|
197 | if (item) {
|
---|
198 | var beforeItemRemoveEvent = $.Event('beforeItemRemove', { item: item, cancel: false, options: options });
|
---|
199 | self.$element.trigger(beforeItemRemoveEvent);
|
---|
200 | if (beforeItemRemoveEvent.cancel)
|
---|
201 | return;
|
---|
202 |
|
---|
203 | $('.tag', self.$container).filter(function() { return $(this).data('item') === item; }).remove();
|
---|
204 | $('option', self.$element).filter(function() { return $(this).data('item') === item; }).remove();
|
---|
205 | if($.inArray(item, self.itemsArray) !== -1)
|
---|
206 | self.itemsArray.splice($.inArray(item, self.itemsArray), 1);
|
---|
207 | }
|
---|
208 |
|
---|
209 | if (!dontPushVal)
|
---|
210 | self.pushVal(self.options.triggerChange);
|
---|
211 |
|
---|
212 | // Remove class when reached maxTags
|
---|
213 | if (self.options.maxTags > self.itemsArray.length)
|
---|
214 | self.$container.removeClass('bootstrap-tagsinput-max');
|
---|
215 |
|
---|
216 | self.$element.trigger($.Event('itemRemoved', { item: item, options: options }));
|
---|
217 | },
|
---|
218 |
|
---|
219 | /**
|
---|
220 | * Removes all items
|
---|
221 | */
|
---|
222 | removeAll: function() {
|
---|
223 | var self = this;
|
---|
224 |
|
---|
225 | $('.tag', self.$container).remove();
|
---|
226 | $('option', self.$element).remove();
|
---|
227 |
|
---|
228 | while(self.itemsArray.length > 0)
|
---|
229 | self.itemsArray.pop();
|
---|
230 |
|
---|
231 | self.pushVal(self.options.triggerChange);
|
---|
232 | },
|
---|
233 |
|
---|
234 | /**
|
---|
235 | * Refreshes the tags so they match the text/value of their corresponding
|
---|
236 | * item.
|
---|
237 | */
|
---|
238 | refresh: function() {
|
---|
239 | var self = this;
|
---|
240 | $('.tag', self.$container).each(function() {
|
---|
241 | var $tag = $(this),
|
---|
242 | item = $tag.data('item'),
|
---|
243 | itemValue = self.options.itemValue(item),
|
---|
244 | itemText = self.options.itemText(item),
|
---|
245 | tagClass = self.options.tagClass(item);
|
---|
246 |
|
---|
247 | // Update tag's class and inner text
|
---|
248 | $tag.attr('class', null);
|
---|
249 | $tag.addClass('tag ' + htmlEncode(tagClass));
|
---|
250 | $tag.contents().filter(function() {
|
---|
251 | return this.nodeType == 3;
|
---|
252 | })[0].nodeValue = htmlEncode(itemText);
|
---|
253 |
|
---|
254 | if (self.isSelect) {
|
---|
255 | var option = $('option', self.$element).filter(function() { return $(this).data('item') === item; });
|
---|
256 | option.attr('value', itemValue);
|
---|
257 | }
|
---|
258 | });
|
---|
259 | },
|
---|
260 |
|
---|
261 | /**
|
---|
262 | * Returns the items added as tags
|
---|
263 | */
|
---|
264 | items: function() {
|
---|
265 | return this.itemsArray;
|
---|
266 | },
|
---|
267 |
|
---|
268 | /**
|
---|
269 | * Assembly value by retrieving the value of each item, and set it on the
|
---|
270 | * element.
|
---|
271 | */
|
---|
272 | pushVal: function() {
|
---|
273 | var self = this,
|
---|
274 | val = $.map(self.items(), function(item) {
|
---|
275 | return self.options.itemValue(item).toString();
|
---|
276 | });
|
---|
277 |
|
---|
278 | self.$element.val(val, true);
|
---|
279 |
|
---|
280 | if (self.options.triggerChange)
|
---|
281 | self.$element.trigger('change');
|
---|
282 | },
|
---|
283 |
|
---|
284 | /**
|
---|
285 | * Initializes the tags input behaviour on the element
|
---|
286 | */
|
---|
287 | build: function(options) {
|
---|
288 | var self = this;
|
---|
289 |
|
---|
290 | self.options = $.extend({}, defaultOptions, options);
|
---|
291 | // When itemValue is set, freeInput should always be false
|
---|
292 | if (self.objectItems)
|
---|
293 | self.options.freeInput = false;
|
---|
294 |
|
---|
295 | makeOptionItemFunction(self.options, 'itemValue');
|
---|
296 | makeOptionItemFunction(self.options, 'itemText');
|
---|
297 | makeOptionFunction(self.options, 'tagClass');
|
---|
298 |
|
---|
299 | // Typeahead Bootstrap version 2.3.2
|
---|
300 | if (self.options.typeahead) {
|
---|
301 | var typeahead = self.options.typeahead || {};
|
---|
302 |
|
---|
303 | makeOptionFunction(typeahead, 'source');
|
---|
304 |
|
---|
305 | self.$input.typeahead($.extend({}, typeahead, {
|
---|
306 | source: function (query, process) {
|
---|
307 | function processItems(items) {
|
---|
308 | var texts = [];
|
---|
309 |
|
---|
310 | for (var i = 0; i < items.length; i++) {
|
---|
311 | var text = self.options.itemText(items[i]);
|
---|
312 | map[text] = items[i];
|
---|
313 | texts.push(text);
|
---|
314 | }
|
---|
315 | process(texts);
|
---|
316 | }
|
---|
317 |
|
---|
318 | this.map = {};
|
---|
319 | var map = this.map,
|
---|
320 | data = typeahead.source(query);
|
---|
321 |
|
---|
322 | if ($.isFunction(data.success)) {
|
---|
323 | // support for Angular callbacks
|
---|
324 | data.success(processItems);
|
---|
325 | } else if ($.isFunction(data.then)) {
|
---|
326 | // support for Angular promises
|
---|
327 | data.then(processItems);
|
---|
328 | } else {
|
---|
329 | // support for functions and jquery promises
|
---|
330 | $.when(data)
|
---|
331 | .then(processItems);
|
---|
332 | }
|
---|
333 | },
|
---|
334 | updater: function (text) {
|
---|
335 | self.add(this.map[text]);
|
---|
336 | return this.map[text];
|
---|
337 | },
|
---|
338 | matcher: function (text) {
|
---|
339 | return (text.toLowerCase().indexOf(this.query.trim().toLowerCase()) !== -1);
|
---|
340 | },
|
---|
341 | sorter: function (texts) {
|
---|
342 | return texts.sort();
|
---|
343 | },
|
---|
344 | highlighter: function (text) {
|
---|
345 | var regex = new RegExp( '(' + this.query + ')', 'gi' );
|
---|
346 | return text.replace( regex, "<strong>$1</strong>" );
|
---|
347 | }
|
---|
348 | }));
|
---|
349 | }
|
---|
350 |
|
---|
351 | // typeahead.js
|
---|
352 | if (self.options.typeaheadjs) {
|
---|
353 |
|
---|
354 | // Determine if main configurations were passed or simply a dataset
|
---|
355 | var typeaheadjs = self.options.typeaheadjs;
|
---|
356 | if (!$.isArray(typeaheadjs)) {
|
---|
357 | typeaheadjs = [null, typeaheadjs];
|
---|
358 | }
|
---|
359 | var valueKey = typeaheadjs[1].valueKey; // We should test typeaheadjs.size >= 1
|
---|
360 | var f_datum = valueKey ? function (datum) { return datum[valueKey]; }
|
---|
361 | : function (datum) { return datum; }
|
---|
362 | $.fn.typeahead.apply(self.$input,typeaheadjs).on('typeahead:selected', $.proxy(function (obj, datum) {
|
---|
363 | self.add( f_datum(datum) );
|
---|
364 | self.$input.typeahead('val', '');
|
---|
365 | }, self));
|
---|
366 |
|
---|
367 | }
|
---|
368 |
|
---|
369 | self.$container.on('click', $.proxy(function(event) {
|
---|
370 | if (! self.$element.attr('disabled')) {
|
---|
371 | self.$input.removeAttr('disabled');
|
---|
372 | }
|
---|
373 | self.$input.focus();
|
---|
374 | }, self));
|
---|
375 |
|
---|
376 | if (self.options.addOnBlur && self.options.freeInput) {
|
---|
377 | self.$input.on('focusout', $.proxy(function(event) {
|
---|
378 | // HACK: only process on focusout when no typeahead opened, to
|
---|
379 | // avoid adding the typeahead text as tag
|
---|
380 | if ($('.typeahead, .twitter-typeahead', self.$container).length === 0) {
|
---|
381 | self.add(self.$input.val());
|
---|
382 | self.$input.val('');
|
---|
383 | }
|
---|
384 | }, self));
|
---|
385 | }
|
---|
386 |
|
---|
387 | // Toggle the 'focus' css class on the container when it has focus
|
---|
388 | self.$container.on({
|
---|
389 | focusin: function() {
|
---|
390 | self.$container.addClass(self.options.focusClass);
|
---|
391 | },
|
---|
392 | focusout: function() {
|
---|
393 | self.$container.removeClass(self.options.focusClass);
|
---|
394 | },
|
---|
395 | });
|
---|
396 |
|
---|
397 | self.$container.on('keydown', 'input', $.proxy(function(event) {
|
---|
398 | var $input = $(event.target),
|
---|
399 | $inputWrapper = self.findInputWrapper();
|
---|
400 |
|
---|
401 | if (self.$element.attr('disabled')) {
|
---|
402 | self.$input.attr('disabled', 'disabled');
|
---|
403 | return;
|
---|
404 | }
|
---|
405 |
|
---|
406 | switch (event.which) {
|
---|
407 | // BACKSPACE
|
---|
408 | case 8:
|
---|
409 | if (doGetCaretPosition($input[0]) === 0) {
|
---|
410 | var prev = $inputWrapper.prev();
|
---|
411 | if (prev.length) {
|
---|
412 | self.remove(prev.data('item'));
|
---|
413 | }
|
---|
414 | }
|
---|
415 | break;
|
---|
416 |
|
---|
417 | // DELETE
|
---|
418 | case 46:
|
---|
419 | if (doGetCaretPosition($input[0]) === 0) {
|
---|
420 | var next = $inputWrapper.next();
|
---|
421 | if (next.length) {
|
---|
422 | self.remove(next.data('item'));
|
---|
423 | }
|
---|
424 | }
|
---|
425 | break;
|
---|
426 |
|
---|
427 | // LEFT ARROW
|
---|
428 | case 37:
|
---|
429 | // Try to move the input before the previous tag
|
---|
430 | var $prevTag = $inputWrapper.prev();
|
---|
431 | if ($input.val().length === 0 && $prevTag[0]) {
|
---|
432 | $prevTag.before($inputWrapper);
|
---|
433 | $input.focus();
|
---|
434 | }
|
---|
435 | break;
|
---|
436 | // RIGHT ARROW
|
---|
437 | case 39:
|
---|
438 | // Try to move the input after the next tag
|
---|
439 | var $nextTag = $inputWrapper.next();
|
---|
440 | if ($input.val().length === 0 && $nextTag[0]) {
|
---|
441 | $nextTag.after($inputWrapper);
|
---|
442 | $input.focus();
|
---|
443 | }
|
---|
444 | break;
|
---|
445 | default:
|
---|
446 | // ignore
|
---|
447 | }
|
---|
448 |
|
---|
449 | // Reset internal input's size
|
---|
450 | var textLength = $input.val().length,
|
---|
451 | wordSpace = Math.ceil(textLength / 5),
|
---|
452 | size = textLength + wordSpace + 1;
|
---|
453 | $input.attr('size', Math.max(this.inputSize, $input.val().length));
|
---|
454 | }, self));
|
---|
455 |
|
---|
456 | self.$container.on('keypress', 'input', $.proxy(function(event) {
|
---|
457 | var $input = $(event.target);
|
---|
458 |
|
---|
459 | if (self.$element.attr('disabled')) {
|
---|
460 | self.$input.attr('disabled', 'disabled');
|
---|
461 | return;
|
---|
462 | }
|
---|
463 |
|
---|
464 | var text = $input.val(),
|
---|
465 | maxLengthReached = self.options.maxChars && text.length >= self.options.maxChars;
|
---|
466 | if (self.options.freeInput && (keyCombinationInList(event, self.options.confirmKeys) || maxLengthReached)) {
|
---|
467 | // Only attempt to add a tag if there is data in the field
|
---|
468 | if (text.length !== 0) {
|
---|
469 | self.add(maxLengthReached ? text.substr(0, self.options.maxChars) : text);
|
---|
470 | $input.val('');
|
---|
471 | }
|
---|
472 |
|
---|
473 | // If the field is empty, let the event triggered fire as usual
|
---|
474 | if (self.options.cancelConfirmKeysOnEmpty === false) {
|
---|
475 | event.preventDefault();
|
---|
476 | }
|
---|
477 | }
|
---|
478 |
|
---|
479 | // Reset internal input's size
|
---|
480 | var textLength = $input.val().length,
|
---|
481 | wordSpace = Math.ceil(textLength / 5),
|
---|
482 | size = textLength + wordSpace + 1;
|
---|
483 | $input.attr('size', Math.max(this.inputSize, $input.val().length));
|
---|
484 | }, self));
|
---|
485 |
|
---|
486 | // Remove icon clicked
|
---|
487 | self.$container.on('click', '[data-role=remove]', $.proxy(function(event) {
|
---|
488 | if (self.$element.attr('disabled')) {
|
---|
489 | return;
|
---|
490 | }
|
---|
491 | self.remove($(event.target).closest('.tag').data('item'));
|
---|
492 | }, self));
|
---|
493 |
|
---|
494 | // Only add existing value as tags when using strings as tags
|
---|
495 | if (self.options.itemValue === defaultOptions.itemValue) {
|
---|
496 | if (self.$element[0].tagName === 'INPUT') {
|
---|
497 | self.add(self.$element.val());
|
---|
498 | } else {
|
---|
499 | $('option', self.$element).each(function() {
|
---|
500 | self.add($(this).attr('value'), true);
|
---|
501 | });
|
---|
502 | }
|
---|
503 | }
|
---|
504 | },
|
---|
505 |
|
---|
506 | /**
|
---|
507 | * Removes all tagsinput behaviour and unregsiter all event handlers
|
---|
508 | */
|
---|
509 | destroy: function() {
|
---|
510 | var self = this;
|
---|
511 |
|
---|
512 | // Unbind events
|
---|
513 | self.$container.off('keypress', 'input');
|
---|
514 | self.$container.off('click', '[role=remove]');
|
---|
515 |
|
---|
516 | self.$container.remove();
|
---|
517 | self.$element.removeData('tagsinput');
|
---|
518 | self.$element.show();
|
---|
519 | },
|
---|
520 |
|
---|
521 | /**
|
---|
522 | * Sets focus on the tagsinput
|
---|
523 | */
|
---|
524 | focus: function() {
|
---|
525 | this.$input.focus();
|
---|
526 | },
|
---|
527 |
|
---|
528 | /**
|
---|
529 | * Returns the internal input element
|
---|
530 | */
|
---|
531 | input: function() {
|
---|
532 | return this.$input;
|
---|
533 | },
|
---|
534 |
|
---|
535 | /**
|
---|
536 | * Returns the element which is wrapped around the internal input. This
|
---|
537 | * is normally the $container, but typeahead.js moves the $input element.
|
---|
538 | */
|
---|
539 | findInputWrapper: function() {
|
---|
540 | var elt = this.$input[0],
|
---|
541 | container = this.$container[0];
|
---|
542 | while(elt && elt.parentNode !== container)
|
---|
543 | elt = elt.parentNode;
|
---|
544 |
|
---|
545 | return $(elt);
|
---|
546 | }
|
---|
547 | };
|
---|
548 |
|
---|
549 | /**
|
---|
550 | * Register JQuery plugin
|
---|
551 | */
|
---|
552 | $.fn.tagsinput = function(arg1, arg2, arg3) {
|
---|
553 | var results = [];
|
---|
554 |
|
---|
555 | this.each(function() {
|
---|
556 | var tagsinput = $(this).data('tagsinput');
|
---|
557 | // Initialize a new tags input
|
---|
558 | if (!tagsinput) {
|
---|
559 | tagsinput = new TagsInput(this, arg1);
|
---|
560 | $(this).data('tagsinput', tagsinput);
|
---|
561 | results.push(tagsinput);
|
---|
562 |
|
---|
563 | if (this.tagName === 'SELECT') {
|
---|
564 | $('option', $(this)).attr('selected', 'selected');
|
---|
565 | }
|
---|
566 |
|
---|
567 | // Init tags from $(this).val()
|
---|
568 | $(this).val($(this).val());
|
---|
569 | } else if (!arg1 && !arg2) {
|
---|
570 | // tagsinput already exists
|
---|
571 | // no function, trying to init
|
---|
572 | results.push(tagsinput);
|
---|
573 | } else if(tagsinput[arg1] !== undefined) {
|
---|
574 | // Invoke function on existing tags input
|
---|
575 | if(tagsinput[arg1].length === 3 && arg3 !== undefined){
|
---|
576 | var retVal = tagsinput[arg1](arg2, null, arg3);
|
---|
577 | }else{
|
---|
578 | var retVal = tagsinput[arg1](arg2);
|
---|
579 | }
|
---|
580 | if (retVal !== undefined)
|
---|
581 | results.push(retVal);
|
---|
582 | }
|
---|
583 | });
|
---|
584 |
|
---|
585 | if ( typeof arg1 == 'string') {
|
---|
586 | // Return the results from the invoked function calls
|
---|
587 | return results.length > 1 ? results : results[0];
|
---|
588 | } else {
|
---|
589 | return results;
|
---|
590 | }
|
---|
591 | };
|
---|
592 |
|
---|
593 | $.fn.tagsinput.Constructor = TagsInput;
|
---|
594 |
|
---|
595 | /**
|
---|
596 | * Most options support both a string or number as well as a function as
|
---|
597 | * option value. This function makes sure that the option with the given
|
---|
598 | * key in the given options is wrapped in a function
|
---|
599 | */
|
---|
600 | function makeOptionItemFunction(options, key) {
|
---|
601 | if (typeof options[key] !== 'function') {
|
---|
602 | var propertyName = options[key];
|
---|
603 | options[key] = function(item) { return item[propertyName]; };
|
---|
604 | }
|
---|
605 | }
|
---|
606 | function makeOptionFunction(options, key) {
|
---|
607 | if (typeof options[key] !== 'function') {
|
---|
608 | var value = options[key];
|
---|
609 | options[key] = function() { return value; };
|
---|
610 | }
|
---|
611 | }
|
---|
612 | /**
|
---|
613 | * HtmlEncodes the given value
|
---|
614 | */
|
---|
615 | var htmlEncodeContainer = $('<div />');
|
---|
616 | function htmlEncode(value) {
|
---|
617 | if (value) {
|
---|
618 | return htmlEncodeContainer.text(value).html();
|
---|
619 | } else {
|
---|
620 | return '';
|
---|
621 | }
|
---|
622 | }
|
---|
623 |
|
---|
624 | /**
|
---|
625 | * Returns the position of the caret in the given input field
|
---|
626 | * http://flightschool.acylt.com/devnotes/caret-position-woes/
|
---|
627 | */
|
---|
628 | function doGetCaretPosition(oField) {
|
---|
629 | var iCaretPos = 0;
|
---|
630 | if (document.selection) {
|
---|
631 | oField.focus ();
|
---|
632 | var oSel = document.selection.createRange();
|
---|
633 | oSel.moveStart ('character', -oField.value.length);
|
---|
634 | iCaretPos = oSel.text.length;
|
---|
635 | } else if (oField.selectionStart || oField.selectionStart == '0') {
|
---|
636 | iCaretPos = oField.selectionStart;
|
---|
637 | }
|
---|
638 | return (iCaretPos);
|
---|
639 | }
|
---|
640 |
|
---|
641 | /**
|
---|
642 | * Returns boolean indicates whether user has pressed an expected key combination.
|
---|
643 | * @param object keyPressEvent: JavaScript event object, refer
|
---|
644 | * http://www.w3.org/TR/2003/WD-DOM-Level-3-Events-20030331/ecma-script-binding.html
|
---|
645 | * @param object lookupList: expected key combinations, as in:
|
---|
646 | * [13, {which: 188, shiftKey: true}]
|
---|
647 | */
|
---|
648 | function keyCombinationInList(keyPressEvent, lookupList) {
|
---|
649 | var found = false;
|
---|
650 | $.each(lookupList, function (index, keyCombination) {
|
---|
651 | if (typeof (keyCombination) === 'number' && keyPressEvent.which === keyCombination) {
|
---|
652 | found = true;
|
---|
653 | return false;
|
---|
654 | }
|
---|
655 |
|
---|
656 | if (keyPressEvent.which === keyCombination.which) {
|
---|
657 | var alt = !keyCombination.hasOwnProperty('altKey') || keyPressEvent.altKey === keyCombination.altKey,
|
---|
658 | shift = !keyCombination.hasOwnProperty('shiftKey') || keyPressEvent.shiftKey === keyCombination.shiftKey,
|
---|
659 | ctrl = !keyCombination.hasOwnProperty('ctrlKey') || keyPressEvent.ctrlKey === keyCombination.ctrlKey;
|
---|
660 | if (alt && shift && ctrl) {
|
---|
661 | found = true;
|
---|
662 | return false;
|
---|
663 | }
|
---|
664 | }
|
---|
665 | });
|
---|
666 |
|
---|
667 | return found;
|
---|
668 | }
|
---|
669 |
|
---|
670 | /**
|
---|
671 | * Initialize tagsinput behaviour on inputs and selects which have
|
---|
672 | * data-role=tagsinput
|
---|
673 | */
|
---|
674 | $(function() {
|
---|
675 | $("input[data-role=tagsinput], select[multiple][data-role=tagsinput]").tagsinput();
|
---|
676 | });
|
---|
677 | })(window.jQuery);
|
---|