bootstrap_tokenfield_rails 0.0.5 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: d6119607e3aa9f6a73b3e134b85f0e55edbbc817
|
|
4
|
+
data.tar.gz: 9e71a84b6bc48258d8f6ef9c0da426276c313590
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: aefa95d223aa22025b5ea4d87aebb3192ce5975c057c17fffbdbb18ee611239f4f203ccdf588a0d238c4f5072a3beba4af091d123d664ebb5de4cb3608829db2
|
|
7
|
+
data.tar.gz: 8a960a84a56ff32acb3b67b9cad4ef18544818aeb3801d80a165c47a3d1e00277cfcb24ebfa42056d649067a05347d122347409383376baddee358ba31324a2a
|
|
@@ -1,17 +1,33 @@
|
|
|
1
|
-
|
|
2
|
-
* bootstrap-tokenfield
|
|
3
|
-
*
|
|
4
|
-
*
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
(function (root, factory) {
|
|
1
|
+
/*!
|
|
2
|
+
* bootstrap-tokenfield
|
|
3
|
+
* https://github.com/sliptree/bootstrap-tokenfield
|
|
4
|
+
* Copyright 2013-2014 Sliptree and other contributors; Licensed MIT
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
(function (factory) {
|
|
9
8
|
if (typeof define === 'function' && define.amd) {
|
|
9
|
+
// AMD. Register as an anonymous module.
|
|
10
10
|
define(['jquery'], factory);
|
|
11
|
+
} else if (typeof exports === 'object') {
|
|
12
|
+
// For CommonJS and CommonJS-like environments where a window with jQuery
|
|
13
|
+
// is present, execute the factory with the jQuery instance from the window object
|
|
14
|
+
// For environments that do not inherently posses a window with a document
|
|
15
|
+
// (such as Node.js), expose a Tokenfield-making factory as module.exports
|
|
16
|
+
// This accentuates the need for the creation of a real window or passing in a jQuery instance
|
|
17
|
+
// e.g. require("bootstrap-tokenfield")(window); or require("bootstrap-tokenfield")($);
|
|
18
|
+
module.exports = global.window && global.window.$ ?
|
|
19
|
+
factory( global.window.$ ) :
|
|
20
|
+
function( input ) {
|
|
21
|
+
if ( !input.$ && !input.fn ) {
|
|
22
|
+
throw new Error( "Tokenfield requires a window object with jQuery or a jQuery instance" );
|
|
23
|
+
}
|
|
24
|
+
return factory( input.$ || input );
|
|
25
|
+
};
|
|
11
26
|
} else {
|
|
12
|
-
|
|
27
|
+
// Browser globals
|
|
28
|
+
factory(jQuery);
|
|
13
29
|
}
|
|
14
|
-
}(
|
|
30
|
+
}(function ($, window) {
|
|
15
31
|
|
|
16
32
|
"use strict"; // jshint ;_;
|
|
17
33
|
|
|
@@ -25,16 +41,35 @@
|
|
|
25
41
|
this.textDirection = this.$element.css('direction');
|
|
26
42
|
|
|
27
43
|
// Extend options
|
|
28
|
-
this.options = $.extend({}, $.fn.tokenfield.defaults, { tokens: this.$element.val() }, options)
|
|
44
|
+
this.options = $.extend(true, {}, $.fn.tokenfield.defaults, { tokens: this.$element.val() }, this.$element.data(), options)
|
|
29
45
|
|
|
30
46
|
// Setup delimiters and trigger keys
|
|
31
47
|
this._delimiters = (typeof this.options.delimiter === 'string') ? [this.options.delimiter] : this.options.delimiter
|
|
32
48
|
this._triggerKeys = $.map(this._delimiters, function (delimiter) {
|
|
33
49
|
return delimiter.charCodeAt(0);
|
|
34
50
|
});
|
|
51
|
+
this._firstDelimiter = this._delimiters[0];
|
|
52
|
+
|
|
53
|
+
// Check for whitespace, dash and special characters
|
|
54
|
+
var whitespace = $.inArray(' ', this._delimiters)
|
|
55
|
+
, dash = $.inArray('-', this._delimiters)
|
|
56
|
+
|
|
57
|
+
if (whitespace >= 0)
|
|
58
|
+
this._delimiters[whitespace] = '\\s'
|
|
59
|
+
|
|
60
|
+
if (dash >= 0) {
|
|
61
|
+
delete this._delimiters[dash]
|
|
62
|
+
this._delimiters.unshift('-')
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
var specialCharacters = ['\\', '$', '[', '{', '^', '.', '|', '?', '*', '+', '(', ')']
|
|
66
|
+
$.each(this._delimiters, function (index, char) {
|
|
67
|
+
var pos = $.inArray(char, specialCharacters)
|
|
68
|
+
if (pos >= 0) _self._delimiters[index] = '\\' + char;
|
|
69
|
+
});
|
|
35
70
|
|
|
36
71
|
// Store original input width
|
|
37
|
-
var elRules = (typeof window.getMatchedCSSRules === 'function') ? window.getMatchedCSSRules( element ) : null
|
|
72
|
+
var elRules = (window && typeof window.getMatchedCSSRules === 'function') ? window.getMatchedCSSRules( element ) : null
|
|
38
73
|
, elStyleWidth = element.style.width
|
|
39
74
|
, elCSSWidth
|
|
40
75
|
, elWidth = this.$element.width()
|
|
@@ -48,8 +83,16 @@
|
|
|
48
83
|
}
|
|
49
84
|
|
|
50
85
|
// Move original input out of the way
|
|
51
|
-
var hidingPosition = $('body').css('direction') === 'rtl' ? 'right' : 'left'
|
|
52
|
-
|
|
86
|
+
var hidingPosition = $('body').css('direction') === 'rtl' ? 'right' : 'left',
|
|
87
|
+
originalStyles = { position: this.$element.css('position') };
|
|
88
|
+
originalStyles[hidingPosition] = this.$element.css(hidingPosition);
|
|
89
|
+
|
|
90
|
+
this.$element
|
|
91
|
+
.data('original-styles', originalStyles)
|
|
92
|
+
.data('original-tabindex', this.$element.prop('tabindex'))
|
|
93
|
+
.css('position', 'absolute')
|
|
94
|
+
.css(hidingPosition, '-10000px')
|
|
95
|
+
.prop('tabindex', -1)
|
|
53
96
|
|
|
54
97
|
// Create a wrapper
|
|
55
98
|
this.$wrapper = $('<div class="tokenfield form-control" />')
|
|
@@ -63,6 +106,7 @@
|
|
|
63
106
|
.appendTo( this.$wrapper )
|
|
64
107
|
.prop( 'placeholder', this.$element.prop('placeholder') )
|
|
65
108
|
.prop( 'id', id + '-tokenfield' )
|
|
109
|
+
.prop( 'tabindex', this.$element.data('original-tabindex') )
|
|
66
110
|
|
|
67
111
|
// Re-route original input label to new input
|
|
68
112
|
var $label = $( 'label[for="' + this.$element.prop('id') + '"]' )
|
|
@@ -123,19 +167,23 @@
|
|
|
123
167
|
// Initialize autocomplete, if necessary
|
|
124
168
|
if ( ! $.isEmptyObject( this.options.autocomplete ) ) {
|
|
125
169
|
var side = this.textDirection === 'rtl' ? 'right' : 'left'
|
|
126
|
-
var autocompleteOptions = $.extend({
|
|
170
|
+
var autocompleteOptions = $.extend({
|
|
127
171
|
minLength: this.options.showAutocompleteOnFocus ? 0 : null,
|
|
128
172
|
position: { my: side + " top", at: side + " bottom", of: this.$wrapper }
|
|
129
|
-
})
|
|
173
|
+
}, this.options.autocomplete )
|
|
130
174
|
this.$input.autocomplete( autocompleteOptions )
|
|
131
175
|
}
|
|
132
176
|
|
|
133
177
|
// Initialize typeahead, if necessary
|
|
134
178
|
if ( ! $.isEmptyObject( this.options.typeahead ) ) {
|
|
135
|
-
var typeaheadOptions = $.extend({
|
|
136
|
-
|
|
179
|
+
var typeaheadOptions = $.extend({
|
|
180
|
+
minLength: this.options.showAutocompleteOnFocus ? 0 : null
|
|
181
|
+
}, this.options.typeahead)
|
|
182
|
+
this.$input.typeahead( null, typeaheadOptions )
|
|
137
183
|
this.typeahead = true
|
|
138
184
|
}
|
|
185
|
+
|
|
186
|
+
this.$element.trigger('tokenfield:initialize')
|
|
139
187
|
}
|
|
140
188
|
|
|
141
189
|
Tokenfield.prototype = {
|
|
@@ -153,36 +201,36 @@
|
|
|
153
201
|
|
|
154
202
|
var _self = this
|
|
155
203
|
, value = $.trim(attrs.value)
|
|
156
|
-
, label = attrs.label.length ? $.trim(attrs.label) : value
|
|
204
|
+
, label = attrs.label && attrs.label.length ? $.trim(attrs.label) : value
|
|
157
205
|
|
|
158
206
|
if (!value.length || !label.length || value.length < this.options.minLength) return
|
|
159
207
|
|
|
160
208
|
if (this.options.limit && this.getTokens().length >= this.options.limit) return
|
|
161
209
|
|
|
162
210
|
// Allow changing token data before creating it
|
|
163
|
-
var
|
|
164
|
-
|
|
211
|
+
var prepareEvent = $.Event('tokenfield:preparetoken')
|
|
212
|
+
prepareEvent.token = {
|
|
165
213
|
value: value,
|
|
166
214
|
label: label
|
|
167
215
|
}
|
|
168
|
-
this.$element.trigger(
|
|
216
|
+
this.$element.trigger( prepareEvent )
|
|
169
217
|
|
|
170
|
-
if (!
|
|
218
|
+
if (!prepareEvent.token) return
|
|
171
219
|
|
|
172
|
-
value =
|
|
173
|
-
label =
|
|
220
|
+
value = prepareEvent.token.value
|
|
221
|
+
label = prepareEvent.token.label
|
|
174
222
|
|
|
175
223
|
// Check for duplicates
|
|
176
224
|
if (!this.options.allowDuplicates && $.grep(this.getTokens(), function (token) {
|
|
177
225
|
return token.value === value
|
|
178
226
|
}).length) {
|
|
179
227
|
// Allow listening to when duplicates get prevented
|
|
180
|
-
var
|
|
181
|
-
|
|
228
|
+
var preventDuplicateEvent = $.Event('tokenfield:preventduplicate')
|
|
229
|
+
preventDuplicateEvent.token = {
|
|
182
230
|
value: value,
|
|
183
231
|
label: label
|
|
184
232
|
}
|
|
185
|
-
this.$element.trigger(
|
|
233
|
+
this.$element.trigger( preventDuplicateEvent )
|
|
186
234
|
// Add duplicate warning class to existing token for 250ms
|
|
187
235
|
var duplicate = this.$wrapper.find( '.token[data-value="' + value + '"]' ).addClass('duplicate')
|
|
188
236
|
setTimeout(function() {
|
|
@@ -197,7 +245,7 @@
|
|
|
197
245
|
.append('<a href="#" class="close" tabindex="-1">×</a>')
|
|
198
246
|
|
|
199
247
|
// Insert token into HTML
|
|
200
|
-
if (this.$input.hasClass('tt-
|
|
248
|
+
if (this.$input.hasClass('tt-input')) {
|
|
201
249
|
this.$input.parent().before( token )
|
|
202
250
|
} else {
|
|
203
251
|
this.$input.before( token )
|
|
@@ -247,17 +295,17 @@
|
|
|
247
295
|
_self.activate( token, e.shiftKey, e.shiftKey )
|
|
248
296
|
})
|
|
249
297
|
.on('dblclick', function (e) {
|
|
250
|
-
if (_self.disabled) return false;
|
|
298
|
+
if (_self.disabled || !_self.options.allowEditing ) return false;
|
|
251
299
|
_self.edit( token )
|
|
252
300
|
})
|
|
253
301
|
|
|
254
302
|
closeButton
|
|
255
303
|
.on('click', $.proxy(this.remove, this))
|
|
256
304
|
|
|
257
|
-
var
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
this.$element.trigger(
|
|
305
|
+
var createEvent = $.Event('tokenfield:createtoken')
|
|
306
|
+
createEvent.token = prepareEvent.token
|
|
307
|
+
createEvent.relatedTarget = token.get(0)
|
|
308
|
+
this.$element.trigger( createEvent )
|
|
261
309
|
|
|
262
310
|
var changeEvent = $.Event('change')
|
|
263
311
|
changeEvent.initiator = 'tokenfield'
|
|
@@ -280,6 +328,7 @@
|
|
|
280
328
|
|
|
281
329
|
if (typeof tokens === 'string') {
|
|
282
330
|
if (this._delimiters.length) {
|
|
331
|
+
// Split based on delimiters
|
|
283
332
|
tokens = tokens.split( new RegExp( '[' + this._delimiters.join('') + ']' ) )
|
|
284
333
|
} else {
|
|
285
334
|
tokens = [tokens];
|
|
@@ -298,7 +347,7 @@
|
|
|
298
347
|
var data = token.map(function() {
|
|
299
348
|
var $token = $(this);
|
|
300
349
|
return {
|
|
301
|
-
value: $token.attr('data-value')
|
|
350
|
+
value: $token.attr('data-value'),
|
|
302
351
|
label: $token.find('.token-label').text()
|
|
303
352
|
}
|
|
304
353
|
}).get();
|
|
@@ -321,7 +370,7 @@
|
|
|
321
370
|
}
|
|
322
371
|
|
|
323
372
|
, getTokensList: function(delimiter, beautify, active) {
|
|
324
|
-
delimiter = delimiter || this.
|
|
373
|
+
delimiter = delimiter || this._firstDelimiter
|
|
325
374
|
beautify = ( typeof beautify !== 'undefined' && beautify !== null ) ? beautify : this.options.beautify
|
|
326
375
|
|
|
327
376
|
var separator = delimiter + ( beautify && delimiter !== ' ' ? ' ' : '')
|
|
@@ -383,18 +432,9 @@
|
|
|
383
432
|
return false
|
|
384
433
|
})
|
|
385
434
|
.on('typeahead:selected', function (e, datum, dataset) {
|
|
386
|
-
var valueKey = 'value'
|
|
387
|
-
|
|
388
|
-
// Get the actual valueKey for this dataset
|
|
389
|
-
$.each(_self.$input.data('ttView').datasets, function (i, set) {
|
|
390
|
-
if (set.name === dataset) {
|
|
391
|
-
valueKey = set.valueKey
|
|
392
|
-
}
|
|
393
|
-
})
|
|
394
|
-
|
|
395
435
|
// Create token
|
|
396
|
-
if (_self.createToken( datum
|
|
397
|
-
_self.$input.typeahead('
|
|
436
|
+
if (_self.createToken( datum )) {
|
|
437
|
+
_self.$input.typeahead('val', '')
|
|
398
438
|
if (_self.$input.data( 'edit' )) {
|
|
399
439
|
_self.unedit(true)
|
|
400
440
|
}
|
|
@@ -402,7 +442,7 @@
|
|
|
402
442
|
})
|
|
403
443
|
.on('typeahead:autocompleted', function (e, datum, dataset) {
|
|
404
444
|
_self.createToken( _self.$input.val() )
|
|
405
|
-
_self.$input.typeahead('
|
|
445
|
+
_self.$input.typeahead('val', '')
|
|
406
446
|
if (_self.$input.data( 'edit' )) {
|
|
407
447
|
_self.unedit(true)
|
|
408
448
|
}
|
|
@@ -454,8 +494,8 @@
|
|
|
454
494
|
if (this.$input.data('ui-autocomplete') && this.$input.data('ui-autocomplete').menu.element.find("li:has(a.ui-state-focus)").length) break
|
|
455
495
|
|
|
456
496
|
// We will handle creating tokens from typeahead in typeahead events
|
|
457
|
-
if (this.$input.hasClass('tt-
|
|
458
|
-
if (this.$input.hasClass('tt-
|
|
497
|
+
if (this.$input.hasClass('tt-input') && this.$wrapper.find('.tt-cursor').length ) break
|
|
498
|
+
if (this.$input.hasClass('tt-input') && this.$wrapper.find('.tt-hint').val().length) break
|
|
459
499
|
|
|
460
500
|
// Create token
|
|
461
501
|
if (this.$input.is(document.activeElement) && this.$input.val().length || this.$input.data('edit')) {
|
|
@@ -465,6 +505,7 @@
|
|
|
465
505
|
// Edit token
|
|
466
506
|
if (e.keyCode === 13) {
|
|
467
507
|
if (!this.$copyHelper.is(document.activeElement) || this.$wrapper.find('.token.active').length !== 1) break
|
|
508
|
+
if (!_self.options.allowEditing) break
|
|
468
509
|
this.edit( this.$wrapper.find('.token.active') )
|
|
469
510
|
}
|
|
470
511
|
}
|
|
@@ -474,7 +515,7 @@
|
|
|
474
515
|
if (_self.$input.val().length > 0) return
|
|
475
516
|
|
|
476
517
|
direction += 'All'
|
|
477
|
-
var token = _self.$input.hasClass('tt-
|
|
518
|
+
var token = _self.$input.hasClass('tt-input') ? _self.$input.parent()[direction]('.token:first') : _self.$input[direction]('.token:first')
|
|
478
519
|
if (!token.length) return
|
|
479
520
|
|
|
480
521
|
_self.preventInputFocus = true
|
|
@@ -495,7 +536,7 @@
|
|
|
495
536
|
if (_self.$input.is(document.activeElement)) {
|
|
496
537
|
if (_self.$input.val().length > 0) return
|
|
497
538
|
|
|
498
|
-
var token = _self.$input.hasClass('tt-
|
|
539
|
+
var token = _self.$input.hasClass('tt-input') ? _self.$input.parent()[direction + 'All']('.token:first') : _self.$input[direction + 'All']('.token:first')
|
|
499
540
|
if (!token.length) return
|
|
500
541
|
|
|
501
542
|
_self.activate( token )
|
|
@@ -539,7 +580,7 @@
|
|
|
539
580
|
if (this.$input.val().length || this.lastInputValue.length && this.lastKeyDown === 8) break
|
|
540
581
|
|
|
541
582
|
this.preventDeactivation = true
|
|
542
|
-
var prev = this.$input.hasClass('tt-
|
|
583
|
+
var prev = this.$input.hasClass('tt-input') ? this.$input.parent().prevAll('.token:first') : this.$input.prevAll('.token:first')
|
|
543
584
|
|
|
544
585
|
if (!prev.length) break
|
|
545
586
|
|
|
@@ -613,10 +654,10 @@
|
|
|
613
654
|
if (tokensBefore == this.getTokensList() && this.$input.val().length)
|
|
614
655
|
return false // No tokens were added, do nothing (prevent form submit)
|
|
615
656
|
|
|
616
|
-
if (this.$input.hasClass('tt-
|
|
657
|
+
if (this.$input.hasClass('tt-input')) {
|
|
617
658
|
// Typeahead acts weird when simply setting input value to empty,
|
|
618
659
|
// so we set the query to empty instead
|
|
619
|
-
this.$input.typeahead('
|
|
660
|
+
this.$input.typeahead('val', '')
|
|
620
661
|
} else {
|
|
621
662
|
this.$input.val('')
|
|
622
663
|
}
|
|
@@ -737,23 +778,23 @@
|
|
|
737
778
|
, label = token.find('.token-label').text()
|
|
738
779
|
|
|
739
780
|
// Allow changing input value before editing
|
|
740
|
-
var
|
|
741
|
-
|
|
781
|
+
var editEvent = $.Event('tokenfield:edittoken')
|
|
782
|
+
editEvent.token = {
|
|
742
783
|
value: value,
|
|
743
784
|
label: label
|
|
744
785
|
}
|
|
745
|
-
|
|
746
|
-
this.$element.trigger(
|
|
786
|
+
editEvent.relatedTarget = token.get(0)
|
|
787
|
+
this.$element.trigger( editEvent )
|
|
747
788
|
|
|
748
|
-
if (!
|
|
789
|
+
if (!editEvent.token) return
|
|
749
790
|
|
|
750
|
-
value =
|
|
751
|
-
label =
|
|
791
|
+
value = editEvent.token.value
|
|
792
|
+
label = editEvent.token.label
|
|
752
793
|
|
|
753
794
|
token.find('.token-label').text(value)
|
|
754
795
|
var tokenWidth = token.outerWidth()
|
|
755
796
|
|
|
756
|
-
var $_input = this.$input.hasClass('tt-
|
|
797
|
+
var $_input = this.$input.hasClass('tt-input') ? this.$input.parent() : this.$input
|
|
757
798
|
|
|
758
799
|
token.replaceWith( $_input )
|
|
759
800
|
|
|
@@ -763,13 +804,16 @@
|
|
|
763
804
|
.select()
|
|
764
805
|
.data( 'edit', true )
|
|
765
806
|
.width( tokenWidth )
|
|
807
|
+
|
|
808
|
+
this.update();
|
|
766
809
|
}
|
|
767
810
|
|
|
768
811
|
, unedit: function (focus) {
|
|
769
|
-
var $_input = this.$input.hasClass('tt-
|
|
812
|
+
var $_input = this.$input.hasClass('tt-input') ? this.$input.parent() : this.$input
|
|
770
813
|
$_input.appendTo( this.$wrapper )
|
|
771
814
|
|
|
772
815
|
this.$input.data('edit', false)
|
|
816
|
+
this.$mirror.text('')
|
|
773
817
|
|
|
774
818
|
this.update()
|
|
775
819
|
|
|
@@ -799,7 +843,7 @@
|
|
|
799
843
|
|
|
800
844
|
// Prepare events
|
|
801
845
|
|
|
802
|
-
var removeEvent = $.Event('
|
|
846
|
+
var removeEvent = $.Event('tokenfield:removetoken')
|
|
803
847
|
removeEvent.token = this.getTokenData( token )
|
|
804
848
|
|
|
805
849
|
var changeEvent = $.Event('change')
|
|
@@ -826,6 +870,9 @@
|
|
|
826
870
|
|
|
827
871
|
, update: function (e) {
|
|
828
872
|
var value = this.$input.val()
|
|
873
|
+
, inputLeftPadding = parseInt(this.$input.css('padding-left'), 10)
|
|
874
|
+
, inputRightPadding = parseInt(this.$input.css('padding-right'), 10)
|
|
875
|
+
, inputPadding = inputLeftPadding + inputRightPadding
|
|
829
876
|
|
|
830
877
|
if (this.$input.data('edit')) {
|
|
831
878
|
|
|
@@ -846,9 +893,9 @@
|
|
|
846
893
|
else {
|
|
847
894
|
this.$input.css( 'width', this.options.minWidth + 'px' )
|
|
848
895
|
if (this.textDirection === 'rtl') {
|
|
849
|
-
return this.$input.width( this.$input.offset().left + this.$input.outerWidth() - this.$wrapper.offset().left - parseInt(this.$wrapper.css('padding-left'), 10) - 1 )
|
|
896
|
+
return this.$input.width( this.$input.offset().left + this.$input.outerWidth() - this.$wrapper.offset().left - parseInt(this.$wrapper.css('padding-left'), 10) - inputPadding - 1 )
|
|
850
897
|
}
|
|
851
|
-
this.$input.width( this.$wrapper.offset().left + this.$wrapper.width() + parseInt(this.$wrapper.css('padding-left'), 10) - this.$input.offset().left )
|
|
898
|
+
this.$input.width( this.$wrapper.offset().left + this.$wrapper.width() + parseInt(this.$wrapper.css('padding-left'), 10) - this.$input.offset().left - inputPadding )
|
|
852
899
|
}
|
|
853
900
|
}
|
|
854
901
|
|
|
@@ -885,6 +932,36 @@
|
|
|
885
932
|
this.$wrapper.removeClass('disabled');
|
|
886
933
|
}
|
|
887
934
|
|
|
935
|
+
, destroy: function() {
|
|
936
|
+
// Set field value
|
|
937
|
+
this.$element.val( this.getTokensList() );
|
|
938
|
+
// Restore styles and properties
|
|
939
|
+
this.$element.css( this.$element.data('original-styles') );
|
|
940
|
+
this.$element.prop( 'tabindex', this.$element.data('original-tabindex') );
|
|
941
|
+
|
|
942
|
+
// Re-route tokenfield labele to original input
|
|
943
|
+
var $label = $( 'label[for="' + this.$input.prop('id') + '"]' )
|
|
944
|
+
if ( $label.length ) {
|
|
945
|
+
$label.prop( 'for', this.$element.prop('id') )
|
|
946
|
+
}
|
|
947
|
+
|
|
948
|
+
// Move original element outside of tokenfield wrapper
|
|
949
|
+
this.$element.insertBefore( this.$wrapper );
|
|
950
|
+
|
|
951
|
+
// Remove tokenfield-related data
|
|
952
|
+
this.$element.removeData('original-styles');
|
|
953
|
+
this.$element.removeData('original-tabindex');
|
|
954
|
+
this.$element.removeData('bs.tokenfield');
|
|
955
|
+
|
|
956
|
+
// Remove tokenfield from DOM
|
|
957
|
+
this.$wrapper.remove();
|
|
958
|
+
|
|
959
|
+
var $_element = this.$element;
|
|
960
|
+
delete this;
|
|
961
|
+
|
|
962
|
+
return $_element;
|
|
963
|
+
}
|
|
964
|
+
|
|
888
965
|
}
|
|
889
966
|
|
|
890
967
|
|
|
@@ -908,7 +985,7 @@
|
|
|
908
985
|
args.shift()
|
|
909
986
|
value = data[option].apply(data, args)
|
|
910
987
|
} else {
|
|
911
|
-
if (!data) $this.data('bs.tokenfield', (data = new Tokenfield(this, options)))
|
|
988
|
+
if (!data && typeof option !== 'string' && !param) $this.data('bs.tokenfield', (data = new Tokenfield(this, options)))
|
|
912
989
|
}
|
|
913
990
|
})
|
|
914
991
|
|
|
@@ -919,6 +996,7 @@
|
|
|
919
996
|
minWidth: 60,
|
|
920
997
|
minLength: 0,
|
|
921
998
|
allowDuplicates: false,
|
|
999
|
+
allowEditing: true,
|
|
922
1000
|
limit: 0,
|
|
923
1001
|
autocomplete: {},
|
|
924
1002
|
typeahead: {},
|
|
@@ -1,3 +1,32 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* bootstrap-tokenfield
|
|
3
|
+
* https://github.com/sliptree/bootstrap-tokenfield
|
|
4
|
+
* Copyright 2013-2014 Sliptree and other contributors; Licensed MIT
|
|
5
|
+
*/
|
|
6
|
+
@-webkit-keyframes 'blink' {
|
|
7
|
+
0% {
|
|
8
|
+
border-color: #ededed;
|
|
9
|
+
}
|
|
10
|
+
100% {
|
|
11
|
+
border-color: #b94a48;
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
@-moz-keyframes 'blink' {
|
|
15
|
+
0% {
|
|
16
|
+
border-color: #ededed;
|
|
17
|
+
}
|
|
18
|
+
100% {
|
|
19
|
+
border-color: #b94a48;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
@keyframes 'blink' {
|
|
23
|
+
0% {
|
|
24
|
+
border-color: #ededed;
|
|
25
|
+
}
|
|
26
|
+
100% {
|
|
27
|
+
border-color: #b94a48;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
1
30
|
.tokenfield {
|
|
2
31
|
height: auto;
|
|
3
32
|
min-height: 34px;
|
|
@@ -9,30 +38,16 @@
|
|
|
9
38
|
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
|
|
10
39
|
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
|
|
11
40
|
}
|
|
12
|
-
.has-warning .tokenfield.focus {
|
|
13
|
-
border-color: #66512c;
|
|
14
|
-
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
|
|
15
|
-
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
|
|
16
|
-
}
|
|
17
|
-
.has-error .tokenfield.focus {
|
|
18
|
-
border-color: #843534;
|
|
19
|
-
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
|
|
20
|
-
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
|
|
21
|
-
}
|
|
22
|
-
.has-success .tokenfield.focus {
|
|
23
|
-
border-color: #2b542c;
|
|
24
|
-
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
|
|
25
|
-
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
|
|
26
|
-
}
|
|
27
41
|
.tokenfield .token {
|
|
28
|
-
box-sizing: border-box;
|
|
42
|
+
-webkit-box-sizing: border-box;
|
|
29
43
|
-moz-box-sizing: border-box;
|
|
30
|
-
|
|
31
|
-
border: 1px solid #d9d9d9;
|
|
32
|
-
background-color: #ededed;
|
|
44
|
+
box-sizing: border-box;
|
|
33
45
|
-webkit-border-radius: 3px;
|
|
34
46
|
-moz-border-radius: 3px;
|
|
35
47
|
border-radius: 3px;
|
|
48
|
+
display: inline-block;
|
|
49
|
+
border: 1px solid #d9d9d9;
|
|
50
|
+
background-color: #ededed;
|
|
36
51
|
white-space: nowrap;
|
|
37
52
|
margin: -1px 5px 5px 0;
|
|
38
53
|
height: 22px;
|
|
@@ -47,36 +62,32 @@
|
|
|
47
62
|
border-color: rgba(82, 168, 236, 0.8);
|
|
48
63
|
}
|
|
49
64
|
.tokenfield .token.duplicate {
|
|
50
|
-
border-color: #
|
|
51
|
-
-webkit-animation-direction: normal;
|
|
52
|
-
-webkit-animation-duration: 0.1s;
|
|
53
|
-
-webkit-animation-iteration-count: infinite;
|
|
65
|
+
border-color: #ebccd1;
|
|
54
66
|
-webkit-animation-name: blink;
|
|
67
|
+
animation-name: blink;
|
|
68
|
+
-webkit-animation-duration: 0.1s;
|
|
69
|
+
animation-duration: 0.1s;
|
|
70
|
+
-webkit-animation-direction: normal;
|
|
71
|
+
animation-direction: normal;
|
|
55
72
|
-webkit-animation-timing-function: ease;
|
|
73
|
+
animation-timing-function: ease;
|
|
74
|
+
-webkit-animation-iteration-count: infinite;
|
|
75
|
+
animation-iteration-count: infinite;
|
|
56
76
|
}
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
}
|
|
65
|
-
@-moz-keyframes 'blink' {
|
|
66
|
-
0% {
|
|
67
|
-
border-color: #ededed;
|
|
68
|
-
}
|
|
69
|
-
100% {
|
|
70
|
-
border-color: #b94a48;
|
|
71
|
-
}
|
|
77
|
+
.tokenfield .token.invalid {
|
|
78
|
+
background: none;
|
|
79
|
+
border: 1px solid transparent;
|
|
80
|
+
-webkit-border-radius: 0;
|
|
81
|
+
-moz-border-radius: 0;
|
|
82
|
+
border-radius: 0;
|
|
83
|
+
border-bottom: 1px dotted #d9534f;
|
|
72
84
|
}
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
}
|
|
85
|
+
.tokenfield .token.invalid.active {
|
|
86
|
+
background: #ededed;
|
|
87
|
+
border: 1px solid #ededed;
|
|
88
|
+
-webkit-border-radius: 3px;
|
|
89
|
+
-moz-border-radius: 3px;
|
|
90
|
+
border-radius: 3px;
|
|
80
91
|
}
|
|
81
92
|
.tokenfield .token .token-label {
|
|
82
93
|
display: inline-block;
|
|
@@ -102,50 +113,50 @@
|
|
|
102
113
|
width: 60px;
|
|
103
114
|
min-width: 60px;
|
|
104
115
|
border: 0;
|
|
105
|
-
-webkit-box-shadow: none;
|
|
106
|
-
-moz-box-shadow: none;
|
|
107
|
-
box-shadow: none;
|
|
108
116
|
height: 20px;
|
|
109
117
|
padding: 0;
|
|
110
118
|
margin-bottom: 6px;
|
|
119
|
+
-webkit-box-shadow: none;
|
|
120
|
+
box-shadow: none;
|
|
111
121
|
}
|
|
112
122
|
.tokenfield .token-input:focus {
|
|
113
123
|
border-color: transparent;
|
|
114
124
|
outline: 0;
|
|
115
125
|
/* IE6-9 */
|
|
116
126
|
-webkit-box-shadow: none;
|
|
117
|
-
-moz-box-shadow: none;
|
|
118
127
|
box-shadow: none;
|
|
119
128
|
}
|
|
120
|
-
/* Invalid token */
|
|
121
|
-
.tokenfield .token.invalid {
|
|
122
|
-
background: none;
|
|
123
|
-
border: 1px solid transparent;
|
|
124
|
-
-webkit-border-radius: 0;
|
|
125
|
-
-moz-border-radius: 0;
|
|
126
|
-
border-radius: 0;
|
|
127
|
-
border-bottom: 1px dotted #b94a48;
|
|
128
|
-
}
|
|
129
|
-
.tokenfield .token.invalid.active {
|
|
130
|
-
background: #ededed;
|
|
131
|
-
border: 1px solid #ededed;
|
|
132
|
-
-webkit-border-radius: 3px;
|
|
133
|
-
-moz-border-radius: 3px;
|
|
134
|
-
border-radius: 3px;
|
|
135
|
-
}
|
|
136
|
-
/* Disabled tokenfield */
|
|
137
129
|
.tokenfield.disabled {
|
|
138
130
|
cursor: not-allowed;
|
|
139
|
-
background-color: #
|
|
131
|
+
background-color: #eeeeee;
|
|
140
132
|
}
|
|
141
133
|
.tokenfield.disabled .token-input {
|
|
142
134
|
cursor: not-allowed;
|
|
143
135
|
}
|
|
144
|
-
.tokenfield.disabled .
|
|
136
|
+
.tokenfield.disabled .token:hover {
|
|
137
|
+
cursor: not-allowed;
|
|
138
|
+
border-color: #d9d9d9;
|
|
139
|
+
}
|
|
140
|
+
.tokenfield.disabled .token:hover .close {
|
|
145
141
|
cursor: not-allowed;
|
|
146
142
|
opacity: 0.2;
|
|
143
|
+
filter: alpha(opacity=20);
|
|
144
|
+
}
|
|
145
|
+
.has-warning .tokenfield.focus {
|
|
146
|
+
border-color: #66512c;
|
|
147
|
+
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
|
|
148
|
+
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
|
|
149
|
+
}
|
|
150
|
+
.has-error .tokenfield.focus {
|
|
151
|
+
border-color: #843534;
|
|
152
|
+
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
|
|
153
|
+
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
|
|
154
|
+
}
|
|
155
|
+
.has-success .tokenfield.focus {
|
|
156
|
+
border-color: #2b542c;
|
|
157
|
+
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
|
|
158
|
+
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
|
|
147
159
|
}
|
|
148
|
-
/* Different sizes */
|
|
149
160
|
.tokenfield.input-sm,
|
|
150
161
|
.input-group-sm .tokenfield {
|
|
151
162
|
min-height: 30px;
|
|
@@ -185,7 +196,6 @@
|
|
|
185
196
|
margin-bottom: 6px;
|
|
186
197
|
vertical-align: top;
|
|
187
198
|
}
|
|
188
|
-
/* RTL */
|
|
189
199
|
.tokenfield.rtl {
|
|
190
200
|
direction: rtl;
|
|
191
201
|
text-align: right;
|
|
@@ -1,10 +1,15 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* bootstrap-tokenfield
|
|
3
|
+
* https://github.com/sliptree/bootstrap-tokenfield
|
|
4
|
+
* Copyright 2013-2014 Sliptree and other contributors; Licensed MIT
|
|
5
|
+
*/
|
|
1
6
|
/* General Typeahead styling, from http://jsfiddle.net/ragulka/Dy9au/1/ */
|
|
2
7
|
.twitter-typeahead {
|
|
3
8
|
width: 100%;
|
|
4
9
|
position: relative;
|
|
5
10
|
vertical-align: top;
|
|
6
11
|
}
|
|
7
|
-
.twitter-typeahead .tt-
|
|
12
|
+
.twitter-typeahead .tt-input,
|
|
8
13
|
.twitter-typeahead .tt-hint {
|
|
9
14
|
margin: 0;
|
|
10
15
|
width: 100%;
|
|
@@ -16,61 +21,61 @@
|
|
|
16
21
|
z-index: 1;
|
|
17
22
|
border: 1px solid transparent;
|
|
18
23
|
}
|
|
19
|
-
.twitter-typeahead .tt-
|
|
24
|
+
.twitter-typeahead .tt-input {
|
|
20
25
|
color: #555555;
|
|
21
26
|
z-index: 2;
|
|
22
27
|
}
|
|
23
|
-
.twitter-typeahead .tt-
|
|
28
|
+
.twitter-typeahead .tt-input,
|
|
24
29
|
.twitter-typeahead .tt-hint {
|
|
25
30
|
height: 34px;
|
|
26
31
|
padding: 6px 12px;
|
|
27
32
|
font-size: 14px;
|
|
28
33
|
line-height: 1.428571429;
|
|
29
34
|
}
|
|
30
|
-
.twitter-typeahead .input-sm.tt-
|
|
35
|
+
.twitter-typeahead .input-sm.tt-input,
|
|
31
36
|
.twitter-typeahead .hint-sm.tt-hint {
|
|
32
37
|
border-radius: 3px;
|
|
33
38
|
}
|
|
34
|
-
.twitter-typeahead .input-lg.tt-
|
|
39
|
+
.twitter-typeahead .input-lg.tt-input,
|
|
35
40
|
.twitter-typeahead .hint-lg.tt-hint {
|
|
36
41
|
border-radius: 6px;
|
|
37
42
|
}
|
|
38
|
-
.input-group .twitter-typeahead:first-child .tt-
|
|
43
|
+
.input-group .twitter-typeahead:first-child .tt-input,
|
|
39
44
|
.input-group .twitter-typeahead:first-child .tt-hint {
|
|
40
45
|
border-radius: 4px 0 0 4px !important;
|
|
41
46
|
}
|
|
42
|
-
.input-group .twitter-typeahead:last-child .tt-
|
|
47
|
+
.input-group .twitter-typeahead:last-child .tt-input,
|
|
43
48
|
.input-group .twitter-typeahead:last-child .tt-hint {
|
|
44
49
|
border-radius: 0 4px 4px 0 !important;
|
|
45
50
|
}
|
|
46
|
-
.input-group.input-group-sm .twitter-typeahead:first-child .tt-
|
|
51
|
+
.input-group.input-group-sm .twitter-typeahead:first-child .tt-input,
|
|
47
52
|
.input-group.input-group-sm .twitter-typeahead:first-child .tt-hint {
|
|
48
53
|
border-radius: 3px 0 0 3px !important;
|
|
49
54
|
}
|
|
50
|
-
.input-group.input-group-sm .twitter-typeahead:last-child .tt-
|
|
55
|
+
.input-group.input-group-sm .twitter-typeahead:last-child .tt-input,
|
|
51
56
|
.input-group.input-group-sm .twitter-typeahead:last-child .tt-hint {
|
|
52
57
|
border-radius: 0 3px 3px 0 !important;
|
|
53
58
|
}
|
|
54
|
-
.input-sm.tt-
|
|
59
|
+
.input-sm.tt-input,
|
|
55
60
|
.hint-sm.tt-hint,
|
|
56
|
-
.input-group.input-group-sm .tt-
|
|
61
|
+
.input-group.input-group-sm .tt-input,
|
|
57
62
|
.input-group.input-group-sm .tt-hint {
|
|
58
63
|
height: 30px;
|
|
59
64
|
padding: 5px 10px;
|
|
60
65
|
font-size: 12px;
|
|
61
66
|
line-height: 1.5;
|
|
62
67
|
}
|
|
63
|
-
.input-group.input-group-lg .twitter-typeahead:first-child .tt-
|
|
68
|
+
.input-group.input-group-lg .twitter-typeahead:first-child .tt-input,
|
|
64
69
|
.input-group.input-group-lg .twitter-typeahead:first-child .tt-hint {
|
|
65
70
|
border-radius: 6px 0 0 6px !important;
|
|
66
71
|
}
|
|
67
|
-
.input-group.input-group-lg .twitter-typeahead:last-child .tt-
|
|
72
|
+
.input-group.input-group-lg .twitter-typeahead:last-child .tt-input,
|
|
68
73
|
.input-group.input-group-lg .twitter-typeahead:last-child .tt-hint {
|
|
69
74
|
border-radius: 0 6px 6px 0 !important;
|
|
70
75
|
}
|
|
71
|
-
.input-lg.tt-
|
|
76
|
+
.input-lg.tt-input,
|
|
72
77
|
.hint-lg.tt-hint,
|
|
73
|
-
.input-group.input-group-lg .tt-
|
|
78
|
+
.input-group.input-group-lg .tt-input,
|
|
74
79
|
.input-group.input-group-lg .tt-hint {
|
|
75
80
|
height: 45px;
|
|
76
81
|
padding: 10px 16px;
|
|
@@ -98,14 +103,14 @@
|
|
|
98
103
|
display: block;
|
|
99
104
|
padding: 3px 20px;
|
|
100
105
|
}
|
|
101
|
-
.tt-suggestion.tt-
|
|
106
|
+
.tt-suggestion.tt-cursor {
|
|
102
107
|
color: #262626;
|
|
103
108
|
background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
|
|
104
109
|
background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
|
|
105
110
|
background-repeat: repeat-x;
|
|
106
111
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
|
|
107
112
|
}
|
|
108
|
-
.tt-suggestion.tt-
|
|
113
|
+
.tt-suggestion.tt-cursor a {
|
|
109
114
|
color: #ffffff;
|
|
110
115
|
}
|
|
111
116
|
.tt-suggestion p {
|
|
@@ -117,16 +122,15 @@
|
|
|
117
122
|
}
|
|
118
123
|
.tokenfield .twitter-typeahead .tt-hint {
|
|
119
124
|
padding: 0;
|
|
120
|
-
margin-left: -1px;
|
|
121
125
|
height: 20px;
|
|
122
126
|
}
|
|
123
|
-
.tokenfield.input-sm .twitter-typeahead .tt-
|
|
127
|
+
.tokenfield.input-sm .twitter-typeahead .tt-input,
|
|
124
128
|
.tokenfield.input-sm .twitter-typeahead .tt-hint {
|
|
125
129
|
height: 18px;
|
|
126
130
|
font-size: 12px;
|
|
127
131
|
line-height: 1.5;
|
|
128
132
|
}
|
|
129
|
-
.tokenfield.input-lg .twitter-typeahead .tt-
|
|
133
|
+
.tokenfield.input-lg .twitter-typeahead .tt-input,
|
|
130
134
|
.tokenfield.input-lg .twitter-typeahead .tt-hint {
|
|
131
135
|
height: 23px;
|
|
132
136
|
font-size: 18px;
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: bootstrap_tokenfield_rails
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.0.
|
|
4
|
+
version: 0.0.6
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Akash Devaraju
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2014-
|
|
11
|
+
date: 2014-03-16 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: bundler
|
|
@@ -48,9 +48,9 @@ extra_rdoc_files: []
|
|
|
48
48
|
files:
|
|
49
49
|
- lib/bootstrap_tokenfield_rails.rb
|
|
50
50
|
- lib/bootstrap_tokenfield_rails/version.rb
|
|
51
|
+
- vendor/assets/javascripts/bootstrap-tokenfield.js
|
|
51
52
|
- vendor/assets/stylesheets/bootstrap-tokenfield.css
|
|
52
53
|
- vendor/assets/stylesheets/tokenfield-typeahead.css
|
|
53
|
-
- vendor/assets/javascripts/bootstrap-tokenfield.js
|
|
54
54
|
homepage: http://www.icicletech.com/open-source-software/bootstrap-tokenfield-rails
|
|
55
55
|
licenses:
|
|
56
56
|
- MIT
|
|
@@ -71,9 +71,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
|
71
71
|
version: '0'
|
|
72
72
|
requirements: []
|
|
73
73
|
rubyforge_project:
|
|
74
|
-
rubygems_version: 2.1
|
|
74
|
+
rubygems_version: 2.2.1
|
|
75
75
|
signing_key:
|
|
76
76
|
specification_version: 4
|
|
77
77
|
summary: A jQuery tagging / tokenizer input plugin for Twitter's Bootstrap
|
|
78
78
|
test_files: []
|
|
79
|
-
has_rdoc:
|