-
Notifications
You must be signed in to change notification settings - Fork 15
Expand file tree
/
Copy pathjquery.taglist.js
More file actions
executable file
·136 lines (120 loc) · 3.61 KB
/
jquery.taglist.js
File metadata and controls
executable file
·136 lines (120 loc) · 3.61 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
(function($){
$.fn.tagList = function(tags) {
var tagListInput = this;
var tagSeparator = " ";
var getTagList = function() {
return $('#'+$(tagListInput).attr('id')+'-tag-list');
}
var getCurrentTag = function() {
var value = $(tagListInput).val();
if(value == "" || value.match(/\s$/)) {
return ""
} else {
var tags = value.split(tagSeparator)
return tags[tags.length-1]
}
}
var getSelectedTag = function() {
return getTagList().find('li.selected')
}
var getFirstTag = function() {
return getTagList().find('li:first')
}
var positionAndSizeTagList = function() {
getTagList().css('top', $(tagListInput).offset().top+$(tagListInput).outerHeight())
.css('left', $(tagListInput).offset().left)
.css('width', $(tagListInput).outerWidth())
}
var createEmptyTagList = function() {
var id = $(tagListInput).attr('id') + '-tag-list';
$(tagListInput).after('<ul id="'+id+'" class="tag-list" style="display: none"></ul>')
positionAndSizeTagList()
}
var matchesInputValue = function(tag, value) {
return tag && value && (tag.toLowerCase().indexOf(value.toLowerCase()) == 0);
}
var showTagList = function(value) {
var html = []
$.each(tags, function(i, tag){
if(matchesInputValue(tag, value)) {
html.push('<li>'+tag+'</li>');
}
})
getTagList().html(html.join("\n")).show()
getTagList().find('li').click(function(){
selectTag(this);
acceptTag();
return false;
});
}
var updateTagList = function() {
var value = getCurrentTag()
if(value && value != "") {
showTagList(value)
} else {
getTagList().hide();
}
}
var handleNavKeys = function(event) {
switch(event.keyCode) {
case 38: //Up Arrow
selectPrevTag()
break;
case 40: //Down Arrow
selectNextTag()
break;
case 9: //Tab
case 13: //Return
return !getTagList().is(':visible') || acceptTag();
}
}
var handleInput = function(event) {
switch(event.keyCode) {
case 9:
case 13:
case 38:
case 40:
break;
default:
updateTagList();
}
}
var selectTag = function(tag) {
getTagList().find('li').removeClass('selected')
$(tag).addClass('selected')
}
var selectPrevTag = function() {
if(getSelectedTag().length > 0 && getSelectedTag().prev().length > 0) {
selectTag(getSelectedTag().prev())
} else {
selectTag(getFirstTag())
}
}
var selectNextTag = function() {
if(getSelectedTag().length > 0 && getSelectedTag().next().length > 0) {
selectTag(getSelectedTag().next())
} else {
selectTag(getFirstTag())
}
}
var acceptTag = function() {
if(getSelectedTag().length == 0) {
if(getTagList().find('li').length > 0) {
selectTag(getFirstTag())
} else {
return true;
}
}
var tags = $(tagListInput).val().split(tagSeparator)
tags.pop()
tags.push(getSelectedTag().text())
$(tagListInput).val(tags.join(tagSeparator))
getTagList().hide()
return false;
}
createEmptyTagList()
$(this).keydown(handleNavKeys).keyup(handleInput)
$(this).attr('autocomplete', 'off') //Disable autofill on FF
$(this).blur(function(){getTagList().hide()})
}
})(jQuery);