custom-angular-ui-select-rails 1.0
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 +7 -0
- data/LICENSE.txt +22 -0
- data/README.md +45 -0
- data/lib/angular-ui-select-rails.rb +13 -0
- data/lib/angular-ui-select-rails/version.rb +11 -0
- data/vendor/assets/images/select2-spinner.gif +0 -0
- data/vendor/assets/images/select2.png +0 -0
- data/vendor/assets/images/select2x2.png +0 -0
- data/vendor/assets/javascripts/angular-ui-select.js +1816 -0
- data/vendor/assets/stylesheets/angular-ui-select.css +262 -0
- data/vendor/assets/stylesheets/angular-ui-select2.css +704 -0
- metadata +81 -0
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA1:
|
3
|
+
metadata.gz: 150d83fd5de7f456c1c3be33369b96fac395b38e
|
4
|
+
data.tar.gz: a1ea7b6e6a081788878bd24763d716d073ee1ff9
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: f9899429917df9ea1d6c34384bb8f49d7359932db636ba7a2b082390bce99df91e7ee88cad2ca8ab76822380267b06bf1e2655ea8f8c51036ef418d28c63c2e3
|
7
|
+
data.tar.gz: 3cc713bd350c9cf4b836f43181b1b049f1f8349183666b61dc52248a53b8583858951685850e8242eb14d3d2a644f0bfd88c5ff5547c21df2f6b251c269d89c8
|
data/LICENSE.txt
ADDED
@@ -0,0 +1,22 @@
|
|
1
|
+
Copyright (c) 2015 Steve Ellis
|
2
|
+
|
3
|
+
MIT License
|
4
|
+
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
6
|
+
a copy of this software and associated documentation files (the
|
7
|
+
"Software"), to deal in the Software without restriction, including
|
8
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
9
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
10
|
+
permit persons to whom the Software is furnished to do so, subject to
|
11
|
+
the following conditions:
|
12
|
+
|
13
|
+
The above copyright notice and this permission notice shall be
|
14
|
+
included in all copies or substantial portions of the Software.
|
15
|
+
|
16
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
17
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
18
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
19
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
20
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
21
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
22
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.md
ADDED
@@ -0,0 +1,45 @@
|
|
1
|
+
# Angular::Ui::Select::Rails
|
2
|
+
|
3
|
+
angular-ui-select-rails is a asset pipeline friendly version of [AngularJS ui-select](https://github.com/angular-ui/ui-select).
|
4
|
+
|
5
|
+
## Installation
|
6
|
+
|
7
|
+
Add the gem in your Gemfile:
|
8
|
+
|
9
|
+
gem 'custom-angular-ui-select-rails'
|
10
|
+
|
11
|
+
After bundling, add the directives to your manifest files.
|
12
|
+
|
13
|
+
JavaScripts (application.js):
|
14
|
+
|
15
|
+
//= require angular-ui-select
|
16
|
+
|
17
|
+
Stylesheets (application.css):
|
18
|
+
|
19
|
+
//= require angular-ui-select
|
20
|
+
|
21
|
+
Add 'ui.select' into your app declaration:
|
22
|
+
|
23
|
+
app = angular.module('MyApp', ["ui.select"])
|
24
|
+
|
25
|
+
|
26
|
+
## Usage
|
27
|
+
|
28
|
+
For instructions on setting up the Angular directives see https://github.com/angular-ui/ui-select.
|
29
|
+
|
30
|
+
### Extra styling
|
31
|
+
|
32
|
+
To include styles beyond the default, you can include Select2 CSS(v3.5):
|
33
|
+
|
34
|
+
//= require angular-ui-select2
|
35
|
+
|
36
|
+
Or, include your choice of vendored Selectize stylesheets.
|
37
|
+
|
38
|
+
|
39
|
+
## Contributing
|
40
|
+
|
41
|
+
1. Fork it ( http://github.com/<my-github-username>/angular-ui-select-rails/fork )
|
42
|
+
2. Create your feature branch (`git checkout -b my-new-feature`)
|
43
|
+
3. Commit your changes (`git commit -am 'Add some feature'`)
|
44
|
+
4. Push to the branch (`git push origin my-new-feature`)
|
45
|
+
5. Create new Pull Request
|
Binary file
|
Binary file
|
Binary file
|
@@ -0,0 +1,1816 @@
|
|
1
|
+
/*!
|
2
|
+
* ui-select
|
3
|
+
* https://github.com/Neithar/angular-ui-select-rails
|
4
|
+
* Version: 1.0 - 2015-07-28T03:50:59.076Z
|
5
|
+
* License: MIT
|
6
|
+
*/
|
7
|
+
|
8
|
+
|
9
|
+
(function () {
|
10
|
+
"use strict";
|
11
|
+
|
12
|
+
var KEY = {
|
13
|
+
TAB: 9,
|
14
|
+
ENTER: 13,
|
15
|
+
ESC: 27,
|
16
|
+
SPACE: 32,
|
17
|
+
LEFT: 37,
|
18
|
+
UP: 38,
|
19
|
+
RIGHT: 39,
|
20
|
+
DOWN: 40,
|
21
|
+
SHIFT: 16,
|
22
|
+
CTRL: 17,
|
23
|
+
ALT: 18,
|
24
|
+
PAGE_UP: 33,
|
25
|
+
PAGE_DOWN: 34,
|
26
|
+
HOME: 36,
|
27
|
+
END: 35,
|
28
|
+
BACKSPACE: 8,
|
29
|
+
DELETE: 46,
|
30
|
+
COMMAND: 91,
|
31
|
+
|
32
|
+
MAP: { 91 : "COMMAND", 8 : "BACKSPACE" , 9 : "TAB" , 13 : "ENTER" , 16 : "SHIFT" , 17 : "CTRL" , 18 : "ALT" , 19 : "PAUSEBREAK" , 20 : "CAPSLOCK" , 27 : "ESC" , 32 : "SPACE" , 33 : "PAGE_UP", 34 : "PAGE_DOWN" , 35 : "END" , 36 : "HOME" , 37 : "LEFT" , 38 : "UP" , 39 : "RIGHT" , 40 : "DOWN" , 43 : "+" , 44 : "PRINTSCREEN" , 45 : "INSERT" , 46 : "DELETE", 48 : "0" , 49 : "1" , 50 : "2" , 51 : "3" , 52 : "4" , 53 : "5" , 54 : "6" , 55 : "7" , 56 : "8" , 57 : "9" , 59 : ";", 61 : "=" , 65 : "A" , 66 : "B" , 67 : "C" , 68 : "D" , 69 : "E" , 70 : "F" , 71 : "G" , 72 : "H" , 73 : "I" , 74 : "J" , 75 : "K" , 76 : "L", 77 : "M" , 78 : "N" , 79 : "O" , 80 : "P" , 81 : "Q" , 82 : "R" , 83 : "S" , 84 : "T" , 85 : "U" , 86 : "V" , 87 : "W" , 88 : "X" , 89 : "Y" , 90 : "Z", 96 : "0" , 97 : "1" , 98 : "2" , 99 : "3" , 100 : "4" , 101 : "5" , 102 : "6" , 103 : "7" , 104 : "8" , 105 : "9", 106 : "*" , 107 : "+" , 109 : "-" , 110 : "." , 111 : "/", 112 : "F1" , 113 : "F2" , 114 : "F3" , 115 : "F4" , 116 : "F5" , 117 : "F6" , 118 : "F7" , 119 : "F8" , 120 : "F9" , 121 : "F10" , 122 : "F11" , 123 : "F12", 144 : "NUMLOCK" , 145 : "SCROLLLOCK" , 186 : ";" , 187 : "=" , 188 : "," , 189 : "-" , 190 : "." , 191 : "/" , 192 : "`" , 219 : "[" , 220 : "\\" , 221 : "]" , 222 : "'"
|
33
|
+
},
|
34
|
+
|
35
|
+
isControl: function (e) {
|
36
|
+
var k = e.which;
|
37
|
+
switch (k) {
|
38
|
+
case KEY.COMMAND:
|
39
|
+
case KEY.SHIFT:
|
40
|
+
case KEY.CTRL:
|
41
|
+
case KEY.ALT:
|
42
|
+
return true;
|
43
|
+
}
|
44
|
+
|
45
|
+
if (e.metaKey) return true;
|
46
|
+
|
47
|
+
return false;
|
48
|
+
},
|
49
|
+
isFunctionKey: function (k) {
|
50
|
+
k = k.which ? k.which : k;
|
51
|
+
return k >= 112 && k <= 123;
|
52
|
+
},
|
53
|
+
isVerticalMovement: function (k){
|
54
|
+
return ~[KEY.UP, KEY.DOWN].indexOf(k);
|
55
|
+
},
|
56
|
+
isHorizontalMovement: function (k){
|
57
|
+
return ~[KEY.LEFT,KEY.RIGHT,KEY.BACKSPACE,KEY.DELETE].indexOf(k);
|
58
|
+
}
|
59
|
+
};
|
60
|
+
|
61
|
+
/**
|
62
|
+
* Add querySelectorAll() to jqLite.
|
63
|
+
*
|
64
|
+
* jqLite find() is limited to lookups by tag name.
|
65
|
+
* TODO This will change with future versions of AngularJS, to be removed when this happens
|
66
|
+
*
|
67
|
+
* See jqLite.find - why not use querySelectorAll? https://github.com/angular/angular.js/issues/3586
|
68
|
+
* See feat(jqLite): use querySelectorAll instead of getElementsByTagName in jqLite.find https://github.com/angular/angular.js/pull/3598
|
69
|
+
*/
|
70
|
+
if (angular.element.prototype.querySelectorAll === undefined) {
|
71
|
+
angular.element.prototype.querySelectorAll = function(selector) {
|
72
|
+
return angular.element(this[0].querySelectorAll(selector));
|
73
|
+
};
|
74
|
+
}
|
75
|
+
|
76
|
+
/**
|
77
|
+
* Add closest() to jqLite.
|
78
|
+
*/
|
79
|
+
if (angular.element.prototype.closest === undefined) {
|
80
|
+
angular.element.prototype.closest = function( selector) {
|
81
|
+
var elem = this[0];
|
82
|
+
var matchesSelector = elem.matches || elem.webkitMatchesSelector || elem.mozMatchesSelector || elem.msMatchesSelector;
|
83
|
+
|
84
|
+
while (elem) {
|
85
|
+
if (matchesSelector.bind(elem)(selector)) {
|
86
|
+
return elem;
|
87
|
+
} else {
|
88
|
+
elem = elem.parentElement;
|
89
|
+
}
|
90
|
+
}
|
91
|
+
return false;
|
92
|
+
};
|
93
|
+
}
|
94
|
+
|
95
|
+
var latestId = 0;
|
96
|
+
|
97
|
+
var uis = angular.module('ui.select', [])
|
98
|
+
|
99
|
+
.constant('uiSelectConfig', {
|
100
|
+
theme: 'bootstrap',
|
101
|
+
searchEnabled: true,
|
102
|
+
sortable: false,
|
103
|
+
placeholder: '', // Empty by default, like HTML tag <select>
|
104
|
+
refreshDelay: 1000, // In milliseconds
|
105
|
+
closeOnSelect: true,
|
106
|
+
generateId: function() {
|
107
|
+
return latestId++;
|
108
|
+
},
|
109
|
+
appendToBody: false
|
110
|
+
})
|
111
|
+
|
112
|
+
// See Rename minErr and make it accessible from outside https://github.com/angular/angular.js/issues/6913
|
113
|
+
.service('uiSelectMinErr', function() {
|
114
|
+
var minErr = angular.$$minErr('ui.select');
|
115
|
+
return function() {
|
116
|
+
var error = minErr.apply(this, arguments);
|
117
|
+
var message = error.message.replace(new RegExp('\nhttp://errors.angularjs.org/.*'), '');
|
118
|
+
return new Error(message);
|
119
|
+
};
|
120
|
+
})
|
121
|
+
|
122
|
+
// Recreates old behavior of ng-transclude. Used internally.
|
123
|
+
.directive('uisTranscludeAppend', function () {
|
124
|
+
return {
|
125
|
+
link: function (scope, element, attrs, ctrl, transclude) {
|
126
|
+
transclude(scope, function (clone) {
|
127
|
+
element.append(clone);
|
128
|
+
});
|
129
|
+
}
|
130
|
+
};
|
131
|
+
})
|
132
|
+
|
133
|
+
/**
|
134
|
+
* Highlights text that matches $select.search.
|
135
|
+
*
|
136
|
+
* Taken from AngularUI Bootstrap Typeahead
|
137
|
+
* See https://github.com/angular-ui/bootstrap/blob/0.10.0/src/typeahead/typeahead.js#L340
|
138
|
+
*/
|
139
|
+
.filter('highlight', function() {
|
140
|
+
function escapeRegexp(queryToEscape) {
|
141
|
+
return queryToEscape.replace(/([.?*+^$[\]\\(){}|-])/g, '\\$1');
|
142
|
+
}
|
143
|
+
|
144
|
+
return function(matchItem, query) {
|
145
|
+
return query && matchItem ? matchItem.replace(new RegExp(escapeRegexp(query), 'gi'), '<span class="ui-select-highlight">$&</span>') : matchItem;
|
146
|
+
};
|
147
|
+
})
|
148
|
+
|
149
|
+
/**
|
150
|
+
* A read-only equivalent of jQuery's offset function: http://api.jquery.com/offset/
|
151
|
+
*
|
152
|
+
* Taken from AngularUI Bootstrap Position:
|
153
|
+
* See https://github.com/angular-ui/bootstrap/blob/master/src/position/position.js#L70
|
154
|
+
*/
|
155
|
+
.factory('uisOffset',
|
156
|
+
['$document', '$window',
|
157
|
+
function ($document, $window) {
|
158
|
+
|
159
|
+
return function(element) {
|
160
|
+
var boundingClientRect = element[0].getBoundingClientRect();
|
161
|
+
return {
|
162
|
+
width: boundingClientRect.width || element.prop('offsetWidth'),
|
163
|
+
height: boundingClientRect.height || element.prop('offsetHeight'),
|
164
|
+
top: boundingClientRect.top + ($window.pageYOffset || $document[0].documentElement.scrollTop),
|
165
|
+
left: boundingClientRect.left + ($window.pageXOffset || $document[0].documentElement.scrollLeft)
|
166
|
+
};
|
167
|
+
};
|
168
|
+
}]);
|
169
|
+
|
170
|
+
uis.directive('uiSelectChoices',
|
171
|
+
['uiSelectConfig', 'uisRepeatParser', 'uiSelectMinErr', '$compile',
|
172
|
+
function(uiSelectConfig, RepeatParser, uiSelectMinErr, $compile) {
|
173
|
+
|
174
|
+
return {
|
175
|
+
restrict: 'EA',
|
176
|
+
require: '^uiSelect',
|
177
|
+
replace: true,
|
178
|
+
transclude: true,
|
179
|
+
templateUrl: function(tElement) {
|
180
|
+
// Gets theme attribute from parent (ui-select)
|
181
|
+
var theme = tElement.parent().attr('theme') || uiSelectConfig.theme;
|
182
|
+
return theme + '/choices.tpl.html';
|
183
|
+
},
|
184
|
+
|
185
|
+
compile: function(tElement, tAttrs) {
|
186
|
+
|
187
|
+
if (!tAttrs.repeat) throw uiSelectMinErr('repeat', "Expected 'repeat' expression.");
|
188
|
+
|
189
|
+
return function link(scope, element, attrs, $select, transcludeFn) {
|
190
|
+
|
191
|
+
// var repeat = RepeatParser.parse(attrs.repeat);
|
192
|
+
var groupByExp = attrs.groupBy;
|
193
|
+
var groupFilterExp = attrs.groupFilter;
|
194
|
+
|
195
|
+
$select.parseRepeatAttr(attrs.repeat, groupByExp, groupFilterExp); //Result ready at $select.parserResult
|
196
|
+
|
197
|
+
$select.disableChoiceExpression = attrs.uiDisableChoice;
|
198
|
+
$select.onHighlightCallback = attrs.onHighlight;
|
199
|
+
|
200
|
+
if(groupByExp) {
|
201
|
+
var groups = element.querySelectorAll('.ui-select-choices-group');
|
202
|
+
if (groups.length !== 1) throw uiSelectMinErr('rows', "Expected 1 .ui-select-choices-group but got '{0}'.", groups.length);
|
203
|
+
groups.attr('ng-repeat', RepeatParser.getGroupNgRepeatExpression());
|
204
|
+
}
|
205
|
+
|
206
|
+
var choices = element.querySelectorAll('.ui-select-choices-row');
|
207
|
+
if (choices.length !== 1) {
|
208
|
+
throw uiSelectMinErr('rows', "Expected 1 .ui-select-choices-row but got '{0}'.", choices.length);
|
209
|
+
}
|
210
|
+
|
211
|
+
choices.attr('ng-repeat', RepeatParser.getNgRepeatExpression($select.parserResult.itemName, '$select.items', $select.parserResult.trackByExp, groupByExp))
|
212
|
+
.attr('ng-if', '$select.open') //Prevent unnecessary watches when dropdown is closed
|
213
|
+
.attr('ng-mouseenter', '$select.setActiveItem('+$select.parserResult.itemName +')')
|
214
|
+
.attr('ng-click', '$select.select(' + $select.parserResult.itemName + ',false,$event)');
|
215
|
+
|
216
|
+
var rowsInner = element.querySelectorAll('.ui-select-choices-row-inner');
|
217
|
+
if (rowsInner.length !== 1) throw uiSelectMinErr('rows', "Expected 1 .ui-select-choices-row-inner but got '{0}'.", rowsInner.length);
|
218
|
+
rowsInner.attr('uis-transclude-append', ''); //Adding uisTranscludeAppend directive to row element after choices element has ngRepeat
|
219
|
+
|
220
|
+
$compile(element, transcludeFn)(scope); //Passing current transcludeFn to be able to append elements correctly from uisTranscludeAppend
|
221
|
+
|
222
|
+
scope.$watch('$select.search', function(newValue) {
|
223
|
+
if(newValue && !$select.open && $select.multiple) $select.activate(false, true);
|
224
|
+
$select.activeIndex = $select.tagging.isActivated ? -1 : 0;
|
225
|
+
$select.refresh(attrs.refresh);
|
226
|
+
});
|
227
|
+
|
228
|
+
attrs.$observe('refreshDelay', function() {
|
229
|
+
// $eval() is needed otherwise we get a string instead of a number
|
230
|
+
var refreshDelay = scope.$eval(attrs.refreshDelay);
|
231
|
+
$select.refreshDelay = refreshDelay !== undefined ? refreshDelay : uiSelectConfig.refreshDelay;
|
232
|
+
});
|
233
|
+
};
|
234
|
+
}
|
235
|
+
};
|
236
|
+
}]);
|
237
|
+
|
238
|
+
/**
|
239
|
+
* Contains ui-select "intelligence".
|
240
|
+
*
|
241
|
+
* The goal is to limit dependency on the DOM whenever possible and
|
242
|
+
* put as much logic in the controller (instead of the link functions) as possible so it can be easily tested.
|
243
|
+
*/
|
244
|
+
uis.controller('uiSelectCtrl',
|
245
|
+
['$scope', '$element', '$timeout', '$filter', 'uisRepeatParser', 'uiSelectMinErr', 'uiSelectConfig',
|
246
|
+
function($scope, $element, $timeout, $filter, RepeatParser, uiSelectMinErr, uiSelectConfig) {
|
247
|
+
|
248
|
+
var ctrl = this;
|
249
|
+
|
250
|
+
var EMPTY_SEARCH = '';
|
251
|
+
|
252
|
+
ctrl.placeholder = uiSelectConfig.placeholder;
|
253
|
+
ctrl.searchEnabled = uiSelectConfig.searchEnabled;
|
254
|
+
ctrl.sortable = uiSelectConfig.sortable;
|
255
|
+
ctrl.refreshDelay = uiSelectConfig.refreshDelay;
|
256
|
+
|
257
|
+
ctrl.removeSelected = false; //If selected item(s) should be removed from dropdown list
|
258
|
+
ctrl.closeOnSelect = true; //Initialized inside uiSelect directive link function
|
259
|
+
ctrl.search = EMPTY_SEARCH;
|
260
|
+
|
261
|
+
ctrl.activeIndex = 0; //Dropdown of choices
|
262
|
+
ctrl.items = []; //All available choices
|
263
|
+
|
264
|
+
ctrl.open = false;
|
265
|
+
ctrl.focus = false;
|
266
|
+
ctrl.disabled = false;
|
267
|
+
ctrl.selected = undefined;
|
268
|
+
|
269
|
+
ctrl.focusser = undefined; //Reference to input element used to handle focus events
|
270
|
+
ctrl.resetSearchInput = true;
|
271
|
+
ctrl.multiple = undefined; // Initialized inside uiSelect directive link function
|
272
|
+
ctrl.disableChoiceExpression = undefined; // Initialized inside uiSelectChoices directive link function
|
273
|
+
ctrl.tagging = {isActivated: false, fct: undefined};
|
274
|
+
ctrl.taggingTokens = {isActivated: false, tokens: undefined};
|
275
|
+
ctrl.lockChoiceExpression = undefined; // Initialized inside uiSelectMatch directive link function
|
276
|
+
ctrl.clickTriggeredSelect = false;
|
277
|
+
ctrl.$filter = $filter;
|
278
|
+
|
279
|
+
ctrl.searchInput = $element.querySelectorAll('input.ui-select-search');
|
280
|
+
if (ctrl.searchInput.length !== 1) {
|
281
|
+
throw uiSelectMinErr('searchInput', "Expected 1 input.ui-select-search but got '{0}'.", ctrl.searchInput.length);
|
282
|
+
}
|
283
|
+
|
284
|
+
ctrl.isEmpty = function() {
|
285
|
+
return angular.isUndefined(ctrl.selected) || ctrl.selected === null || ctrl.selected === '';
|
286
|
+
};
|
287
|
+
|
288
|
+
// Most of the time the user does not want to empty the search input when in typeahead mode
|
289
|
+
function _resetSearchInput() {
|
290
|
+
if (ctrl.resetSearchInput || (ctrl.resetSearchInput === undefined && uiSelectConfig.resetSearchInput)) {
|
291
|
+
ctrl.search = EMPTY_SEARCH;
|
292
|
+
//reset activeIndex
|
293
|
+
if (ctrl.selected && ctrl.items.length && !ctrl.multiple) {
|
294
|
+
ctrl.activeIndex = ctrl.items.indexOf(ctrl.selected);
|
295
|
+
}
|
296
|
+
}
|
297
|
+
}
|
298
|
+
|
299
|
+
function _groupsFilter(groups, groupNames) {
|
300
|
+
var i, j, result = [];
|
301
|
+
for(i = 0; i < groupNames.length ;i++){
|
302
|
+
for(j = 0; j < groups.length ;j++){
|
303
|
+
if(groups[j].name == [groupNames[i]]){
|
304
|
+
result.push(groups[j]);
|
305
|
+
}
|
306
|
+
}
|
307
|
+
}
|
308
|
+
return result;
|
309
|
+
}
|
310
|
+
|
311
|
+
// When the user clicks on ui-select, displays the dropdown list
|
312
|
+
ctrl.activate = function(initSearchValue, avoidReset) {
|
313
|
+
if (!ctrl.disabled && !ctrl.open) {
|
314
|
+
if(!avoidReset) _resetSearchInput();
|
315
|
+
|
316
|
+
$scope.$broadcast('uis:activate');
|
317
|
+
|
318
|
+
ctrl.open = true;
|
319
|
+
|
320
|
+
ctrl.activeIndex = ctrl.activeIndex >= ctrl.items.length ? 0 : ctrl.activeIndex;
|
321
|
+
|
322
|
+
// ensure that the index is set to zero for tagging variants
|
323
|
+
// that where first option is auto-selected
|
324
|
+
if ( ctrl.activeIndex === -1 && ctrl.taggingLabel !== false ) {
|
325
|
+
ctrl.activeIndex = 0;
|
326
|
+
}
|
327
|
+
|
328
|
+
// Give it time to appear before focus
|
329
|
+
$timeout(function() {
|
330
|
+
ctrl.search = initSearchValue || ctrl.search;
|
331
|
+
ctrl.searchInput[0].focus();
|
332
|
+
});
|
333
|
+
}
|
334
|
+
};
|
335
|
+
|
336
|
+
ctrl.findGroupByName = function(name) {
|
337
|
+
return ctrl.groups && ctrl.groups.filter(function(group) {
|
338
|
+
return group.name === name;
|
339
|
+
})[0];
|
340
|
+
};
|
341
|
+
|
342
|
+
ctrl.parseRepeatAttr = function(repeatAttr, groupByExp, groupFilterExp) {
|
343
|
+
function updateGroups(items) {
|
344
|
+
var groupFn = $scope.$eval(groupByExp);
|
345
|
+
ctrl.groups = [];
|
346
|
+
angular.forEach(items, function(item) {
|
347
|
+
var groupName = angular.isFunction(groupFn) ? groupFn(item) : item[groupFn];
|
348
|
+
var group = ctrl.findGroupByName(groupName);
|
349
|
+
if(group) {
|
350
|
+
group.items.push(item);
|
351
|
+
}
|
352
|
+
else {
|
353
|
+
ctrl.groups.push({name: groupName, items: [item]});
|
354
|
+
}
|
355
|
+
});
|
356
|
+
if(groupFilterExp){
|
357
|
+
var groupFilterFn = $scope.$eval(groupFilterExp);
|
358
|
+
if( angular.isFunction(groupFilterFn)){
|
359
|
+
ctrl.groups = groupFilterFn(ctrl.groups);
|
360
|
+
} else if(angular.isArray(groupFilterFn)){
|
361
|
+
ctrl.groups = _groupsFilter(ctrl.groups, groupFilterFn);
|
362
|
+
}
|
363
|
+
}
|
364
|
+
ctrl.items = [];
|
365
|
+
ctrl.groups.forEach(function(group) {
|
366
|
+
ctrl.items = ctrl.items.concat(group.items);
|
367
|
+
});
|
368
|
+
}
|
369
|
+
|
370
|
+
function setPlainItems(items) {
|
371
|
+
ctrl.items = items;
|
372
|
+
}
|
373
|
+
|
374
|
+
ctrl.setItemsFn = groupByExp ? updateGroups : setPlainItems;
|
375
|
+
|
376
|
+
ctrl.parserResult = RepeatParser.parse(repeatAttr);
|
377
|
+
|
378
|
+
ctrl.isGrouped = !!groupByExp;
|
379
|
+
ctrl.itemProperty = ctrl.parserResult.itemName;
|
380
|
+
|
381
|
+
ctrl.refreshItems = function (data){
|
382
|
+
data = data || ctrl.parserResult.source($scope);
|
383
|
+
var selectedItems = ctrl.selected;
|
384
|
+
//TODO should implement for single mode removeSelected
|
385
|
+
if ((angular.isArray(selectedItems) && !selectedItems.length) || !ctrl.removeSelected) {
|
386
|
+
ctrl.setItemsFn(data);
|
387
|
+
}else{
|
388
|
+
if ( data !== undefined ) {
|
389
|
+
var filteredItems = data.filter(function(i) {return selectedItems.indexOf(i) < 0;});
|
390
|
+
ctrl.setItemsFn(filteredItems);
|
391
|
+
}
|
392
|
+
}
|
393
|
+
};
|
394
|
+
|
395
|
+
// See https://github.com/angular/angular.js/blob/v1.2.15/src/ng/directive/ngRepeat.js#L259
|
396
|
+
$scope.$watchCollection(ctrl.parserResult.source, function(items) {
|
397
|
+
if (items === undefined || items === null) {
|
398
|
+
// If the user specifies undefined or null => reset the collection
|
399
|
+
// Special case: items can be undefined if the user did not initialized the collection on the scope
|
400
|
+
// i.e $scope.addresses = [] is missing
|
401
|
+
ctrl.items = [];
|
402
|
+
} else {
|
403
|
+
if (!angular.isArray(items)) {
|
404
|
+
throw uiSelectMinErr('items', "Expected an array but got '{0}'.", items);
|
405
|
+
} else {
|
406
|
+
//Remove already selected items (ex: while searching)
|
407
|
+
//TODO Should add a test
|
408
|
+
ctrl.refreshItems(items);
|
409
|
+
ctrl.ngModel.$modelValue = null; //Force scope model value and ngModel value to be out of sync to re-run formatters
|
410
|
+
}
|
411
|
+
}
|
412
|
+
});
|
413
|
+
|
414
|
+
};
|
415
|
+
|
416
|
+
var _refreshDelayPromise;
|
417
|
+
|
418
|
+
/**
|
419
|
+
* Typeahead mode: lets the user refresh the collection using his own function.
|
420
|
+
*
|
421
|
+
* See Expose $select.search for external / remote filtering https://github.com/angular-ui/ui-select/pull/31
|
422
|
+
*/
|
423
|
+
ctrl.refresh = function(refreshAttr) {
|
424
|
+
if (refreshAttr !== undefined) {
|
425
|
+
|
426
|
+
// Debounce
|
427
|
+
// See https://github.com/angular-ui/bootstrap/blob/0.10.0/src/typeahead/typeahead.js#L155
|
428
|
+
// FYI AngularStrap typeahead does not have debouncing: https://github.com/mgcrea/angular-strap/blob/v2.0.0-rc.4/src/typeahead/typeahead.js#L177
|
429
|
+
if (_refreshDelayPromise) {
|
430
|
+
$timeout.cancel(_refreshDelayPromise);
|
431
|
+
}
|
432
|
+
_refreshDelayPromise = $timeout(function() {
|
433
|
+
$scope.$eval(refreshAttr);
|
434
|
+
}, ctrl.refreshDelay);
|
435
|
+
}
|
436
|
+
};
|
437
|
+
|
438
|
+
ctrl.setActiveItem = function(item) {
|
439
|
+
ctrl.activeIndex = ctrl.items.indexOf(item);
|
440
|
+
};
|
441
|
+
|
442
|
+
ctrl.isActive = function(itemScope) {
|
443
|
+
if ( !ctrl.open ) {
|
444
|
+
return false;
|
445
|
+
}
|
446
|
+
var itemIndex = ctrl.items.indexOf(itemScope[ctrl.itemProperty]);
|
447
|
+
var isActive = itemIndex === ctrl.activeIndex;
|
448
|
+
|
449
|
+
if ( !isActive || ( itemIndex < 0 && ctrl.taggingLabel !== false ) ||( itemIndex < 0 && ctrl.taggingLabel === false) ) {
|
450
|
+
return false;
|
451
|
+
}
|
452
|
+
|
453
|
+
if (isActive && !angular.isUndefined(ctrl.onHighlightCallback)) {
|
454
|
+
itemScope.$eval(ctrl.onHighlightCallback);
|
455
|
+
}
|
456
|
+
|
457
|
+
return isActive;
|
458
|
+
};
|
459
|
+
|
460
|
+
ctrl.isDisabled = function(itemScope) {
|
461
|
+
|
462
|
+
if (!ctrl.open) return;
|
463
|
+
|
464
|
+
var itemIndex = ctrl.items.indexOf(itemScope[ctrl.itemProperty]);
|
465
|
+
var isDisabled = false;
|
466
|
+
var item;
|
467
|
+
|
468
|
+
if (itemIndex >= 0 && !angular.isUndefined(ctrl.disableChoiceExpression)) {
|
469
|
+
item = ctrl.items[itemIndex];
|
470
|
+
isDisabled = !!(itemScope.$eval(ctrl.disableChoiceExpression)); // force the boolean value
|
471
|
+
item._uiSelectChoiceDisabled = isDisabled; // store this for later reference
|
472
|
+
}
|
473
|
+
|
474
|
+
return isDisabled;
|
475
|
+
};
|
476
|
+
|
477
|
+
|
478
|
+
// When the user selects an item with ENTER or clicks the dropdown
|
479
|
+
ctrl.select = function(item, skipFocusser, $event) {
|
480
|
+
if (item === undefined || !item._uiSelectChoiceDisabled) {
|
481
|
+
|
482
|
+
if ( ! ctrl.items && ! ctrl.search ) return;
|
483
|
+
|
484
|
+
if (!item || !item._uiSelectChoiceDisabled) {
|
485
|
+
if(ctrl.tagging.isActivated) {
|
486
|
+
// if taggingLabel is disabled, we pull from ctrl.search val
|
487
|
+
if ( ctrl.taggingLabel === false ) {
|
488
|
+
if ( ctrl.activeIndex < 0 ) {
|
489
|
+
item = ctrl.tagging.fct !== undefined ? ctrl.tagging.fct(ctrl.search) : ctrl.search;
|
490
|
+
if (!item || angular.equals( ctrl.items[0], item ) ) {
|
491
|
+
return;
|
492
|
+
}
|
493
|
+
} else {
|
494
|
+
// keyboard nav happened first, user selected from dropdown
|
495
|
+
item = ctrl.items[ctrl.activeIndex];
|
496
|
+
}
|
497
|
+
} else {
|
498
|
+
// tagging always operates at index zero, taggingLabel === false pushes
|
499
|
+
// the ctrl.search value without having it injected
|
500
|
+
if ( ctrl.activeIndex === 0 ) {
|
501
|
+
// ctrl.tagging pushes items to ctrl.items, so we only have empty val
|
502
|
+
// for `item` if it is a detected duplicate
|
503
|
+
if ( item === undefined ) return;
|
504
|
+
|
505
|
+
// create new item on the fly if we don't already have one;
|
506
|
+
// use tagging function if we have one
|
507
|
+
if ( ctrl.tagging.fct !== undefined && typeof item === 'string' ) {
|
508
|
+
item = ctrl.tagging.fct(ctrl.search);
|
509
|
+
if (!item) return;
|
510
|
+
// if item type is 'string', apply the tagging label
|
511
|
+
} else if ( typeof item === 'string' ) {
|
512
|
+
// trim the trailing space
|
513
|
+
item = item.replace(ctrl.taggingLabel,'').trim();
|
514
|
+
}
|
515
|
+
}
|
516
|
+
}
|
517
|
+
// search ctrl.selected for dupes potentially caused by tagging and return early if found
|
518
|
+
if ( ctrl.selected && angular.isArray(ctrl.selected) && ctrl.selected.filter( function (selection) { return angular.equals(selection, item); }).length > 0 ) {
|
519
|
+
ctrl.close(skipFocusser);
|
520
|
+
return;
|
521
|
+
}
|
522
|
+
}
|
523
|
+
|
524
|
+
$scope.$broadcast('uis:select', item);
|
525
|
+
|
526
|
+
var locals = {};
|
527
|
+
locals[ctrl.parserResult.itemName] = item;
|
528
|
+
|
529
|
+
$timeout(function(){
|
530
|
+
ctrl.onSelectCallback($scope, {
|
531
|
+
$item: item,
|
532
|
+
$model: ctrl.parserResult.modelMapper($scope, locals)
|
533
|
+
});
|
534
|
+
});
|
535
|
+
|
536
|
+
if (ctrl.closeOnSelect) {
|
537
|
+
ctrl.close(skipFocusser);
|
538
|
+
}
|
539
|
+
if ($event && $event.type === 'click') {
|
540
|
+
ctrl.clickTriggeredSelect = true;
|
541
|
+
}
|
542
|
+
}
|
543
|
+
}
|
544
|
+
};
|
545
|
+
|
546
|
+
// Closes the dropdown
|
547
|
+
ctrl.close = function(skipFocusser) {
|
548
|
+
if (!ctrl.open) return;
|
549
|
+
if (ctrl.ngModel && ctrl.ngModel.$setTouched) ctrl.ngModel.$setTouched();
|
550
|
+
_resetSearchInput();
|
551
|
+
ctrl.open = false;
|
552
|
+
|
553
|
+
$scope.$broadcast('uis:close', skipFocusser);
|
554
|
+
|
555
|
+
};
|
556
|
+
|
557
|
+
ctrl.setFocus = function(){
|
558
|
+
if (!ctrl.focus) ctrl.focusInput[0].focus();
|
559
|
+
};
|
560
|
+
|
561
|
+
ctrl.clear = function($event) {
|
562
|
+
ctrl.select(undefined);
|
563
|
+
$event.stopPropagation();
|
564
|
+
$timeout(function() {
|
565
|
+
ctrl.focusser[0].focus();
|
566
|
+
}, 0, false);
|
567
|
+
};
|
568
|
+
|
569
|
+
// Toggle dropdown
|
570
|
+
ctrl.toggle = function(e) {
|
571
|
+
if (ctrl.open) {
|
572
|
+
ctrl.close();
|
573
|
+
e.preventDefault();
|
574
|
+
e.stopPropagation();
|
575
|
+
} else {
|
576
|
+
ctrl.activate();
|
577
|
+
}
|
578
|
+
};
|
579
|
+
|
580
|
+
ctrl.isLocked = function(itemScope, itemIndex) {
|
581
|
+
var isLocked, item = ctrl.selected[itemIndex];
|
582
|
+
|
583
|
+
if (item && !angular.isUndefined(ctrl.lockChoiceExpression)) {
|
584
|
+
isLocked = !!(itemScope.$eval(ctrl.lockChoiceExpression)); // force the boolean value
|
585
|
+
item._uiSelectChoiceLocked = isLocked; // store this for later reference
|
586
|
+
}
|
587
|
+
|
588
|
+
return isLocked;
|
589
|
+
};
|
590
|
+
|
591
|
+
var sizeWatch = null;
|
592
|
+
ctrl.sizeSearchInput = function() {
|
593
|
+
|
594
|
+
var input = ctrl.searchInput[0],
|
595
|
+
container = ctrl.searchInput.parent().parent()[0],
|
596
|
+
calculateContainerWidth = function() {
|
597
|
+
// Return the container width only if the search input is visible
|
598
|
+
return container.clientWidth * !!input.offsetParent;
|
599
|
+
},
|
600
|
+
updateIfVisible = function(containerWidth) {
|
601
|
+
if (containerWidth === 0) {
|
602
|
+
return false;
|
603
|
+
}
|
604
|
+
var inputWidth = containerWidth - input.offsetLeft - 10;
|
605
|
+
if (inputWidth < 50) inputWidth = containerWidth;
|
606
|
+
ctrl.searchInput.css('width', inputWidth+'px');
|
607
|
+
return true;
|
608
|
+
};
|
609
|
+
|
610
|
+
ctrl.searchInput.css('width', '10px');
|
611
|
+
$timeout(function() { //Give tags time to render correctly
|
612
|
+
if (sizeWatch === null && !updateIfVisible(calculateContainerWidth())) {
|
613
|
+
sizeWatch = $scope.$watch(calculateContainerWidth, function(containerWidth) {
|
614
|
+
if (updateIfVisible(containerWidth)) {
|
615
|
+
sizeWatch();
|
616
|
+
sizeWatch = null;
|
617
|
+
}
|
618
|
+
});
|
619
|
+
}
|
620
|
+
});
|
621
|
+
};
|
622
|
+
|
623
|
+
function _handleDropDownSelection(key) {
|
624
|
+
var processed = true;
|
625
|
+
switch (key) {
|
626
|
+
case KEY.DOWN:
|
627
|
+
if (!ctrl.open && ctrl.multiple) ctrl.activate(false, true); //In case its the search input in 'multiple' mode
|
628
|
+
else if (ctrl.activeIndex < ctrl.items.length - 1) { ctrl.activeIndex++; }
|
629
|
+
break;
|
630
|
+
case KEY.UP:
|
631
|
+
if (!ctrl.open && ctrl.multiple) ctrl.activate(false, true); //In case its the search input in 'multiple' mode
|
632
|
+
else if (ctrl.activeIndex > 0 || (ctrl.search.length === 0 && ctrl.tagging.isActivated && ctrl.activeIndex > -1)) { ctrl.activeIndex--; }
|
633
|
+
break;
|
634
|
+
case KEY.TAB:
|
635
|
+
if (!ctrl.multiple || ctrl.open) ctrl.select(ctrl.items[ctrl.activeIndex], true);
|
636
|
+
break;
|
637
|
+
case KEY.ENTER:
|
638
|
+
if(ctrl.open && (ctrl.tagging.isActivated || ctrl.activeIndex >= 0)){
|
639
|
+
ctrl.select(ctrl.items[ctrl.activeIndex]); // Make sure at least one dropdown item is highlighted before adding if not in tagging mode
|
640
|
+
} else {
|
641
|
+
ctrl.activate(false, true); //In case its the search input in 'multiple' mode
|
642
|
+
}
|
643
|
+
break;
|
644
|
+
case KEY.ESC:
|
645
|
+
ctrl.close();
|
646
|
+
break;
|
647
|
+
default:
|
648
|
+
processed = false;
|
649
|
+
}
|
650
|
+
return processed;
|
651
|
+
}
|
652
|
+
|
653
|
+
// Bind to keyboard shortcuts
|
654
|
+
ctrl.searchInput.on('keydown', function(e) {
|
655
|
+
|
656
|
+
var key = e.which;
|
657
|
+
|
658
|
+
// if(~[KEY.ESC,KEY.TAB].indexOf(key)){
|
659
|
+
// //TODO: SEGURO?
|
660
|
+
// ctrl.close();
|
661
|
+
// }
|
662
|
+
|
663
|
+
$scope.$apply(function() {
|
664
|
+
|
665
|
+
var tagged = false;
|
666
|
+
|
667
|
+
if (ctrl.items.length > 0 || ctrl.tagging.isActivated) {
|
668
|
+
_handleDropDownSelection(key);
|
669
|
+
if ( ctrl.taggingTokens.isActivated ) {
|
670
|
+
for (var i = 0; i < ctrl.taggingTokens.tokens.length; i++) {
|
671
|
+
if ( ctrl.taggingTokens.tokens[i] === KEY.MAP[e.keyCode] ) {
|
672
|
+
// make sure there is a new value to push via tagging
|
673
|
+
if ( ctrl.search.length > 0 ) {
|
674
|
+
tagged = true;
|
675
|
+
}
|
676
|
+
}
|
677
|
+
}
|
678
|
+
if ( tagged ) {
|
679
|
+
$timeout(function() {
|
680
|
+
ctrl.searchInput.triggerHandler('tagged');
|
681
|
+
var newItem = ctrl.search.replace(KEY.MAP[e.keyCode],'').trim();
|
682
|
+
if ( ctrl.tagging.fct ) {
|
683
|
+
newItem = ctrl.tagging.fct( newItem );
|
684
|
+
}
|
685
|
+
if (newItem) ctrl.select(newItem, true);
|
686
|
+
});
|
687
|
+
}
|
688
|
+
}
|
689
|
+
}
|
690
|
+
|
691
|
+
});
|
692
|
+
|
693
|
+
if(KEY.isVerticalMovement(key) && ctrl.items.length > 0){
|
694
|
+
_ensureHighlightVisible();
|
695
|
+
}
|
696
|
+
|
697
|
+
if (key === KEY.ENTER || key === KEY.ESC) {
|
698
|
+
e.preventDefault();
|
699
|
+
e.stopPropagation();
|
700
|
+
}
|
701
|
+
|
702
|
+
});
|
703
|
+
|
704
|
+
// If tagging try to split by tokens and add items
|
705
|
+
ctrl.searchInput.on('paste', function (e) {
|
706
|
+
var data = e.originalEvent.clipboardData.getData('text/plain');
|
707
|
+
if (data && data.length > 0 && ctrl.taggingTokens.isActivated && ctrl.tagging.fct) {
|
708
|
+
var items = data.split(ctrl.taggingTokens.tokens[0]); // split by first token only
|
709
|
+
if (items && items.length > 0) {
|
710
|
+
angular.forEach(items, function (item) {
|
711
|
+
var newItem = ctrl.tagging.fct(item);
|
712
|
+
if (newItem) {
|
713
|
+
ctrl.select(newItem, true);
|
714
|
+
}
|
715
|
+
});
|
716
|
+
e.preventDefault();
|
717
|
+
e.stopPropagation();
|
718
|
+
}
|
719
|
+
}
|
720
|
+
});
|
721
|
+
|
722
|
+
ctrl.searchInput.on('tagged', function() {
|
723
|
+
$timeout(function() {
|
724
|
+
_resetSearchInput();
|
725
|
+
});
|
726
|
+
});
|
727
|
+
|
728
|
+
// See https://github.com/ivaynberg/select2/blob/3.4.6/select2.js#L1431
|
729
|
+
function _ensureHighlightVisible() {
|
730
|
+
var container = $element.querySelectorAll('.ui-select-choices-content');
|
731
|
+
var choices = container.querySelectorAll('.ui-select-choices-row');
|
732
|
+
if (choices.length < 1) {
|
733
|
+
throw uiSelectMinErr('choices', "Expected multiple .ui-select-choices-row but got '{0}'.", choices.length);
|
734
|
+
}
|
735
|
+
|
736
|
+
if (ctrl.activeIndex < 0) {
|
737
|
+
return;
|
738
|
+
}
|
739
|
+
|
740
|
+
var highlighted = choices[ctrl.activeIndex];
|
741
|
+
var posY = highlighted.offsetTop + highlighted.clientHeight - container[0].scrollTop;
|
742
|
+
var height = container[0].offsetHeight;
|
743
|
+
|
744
|
+
if (posY > height) {
|
745
|
+
container[0].scrollTop += posY - height;
|
746
|
+
} else if (posY < highlighted.clientHeight) {
|
747
|
+
if (ctrl.isGrouped && ctrl.activeIndex === 0)
|
748
|
+
container[0].scrollTop = 0; //To make group header visible when going all the way up
|
749
|
+
else
|
750
|
+
container[0].scrollTop -= highlighted.clientHeight - posY;
|
751
|
+
}
|
752
|
+
}
|
753
|
+
|
754
|
+
$scope.$on('$destroy', function() {
|
755
|
+
ctrl.searchInput.off('keyup keydown tagged blur paste');
|
756
|
+
});
|
757
|
+
|
758
|
+
}]);
|
759
|
+
|
760
|
+
uis.directive('uiSelect',
|
761
|
+
['$document', 'uiSelectConfig', 'uiSelectMinErr', 'uisOffset', '$compile', '$parse', '$timeout',
|
762
|
+
function($document, uiSelectConfig, uiSelectMinErr, uisOffset, $compile, $parse, $timeout) {
|
763
|
+
|
764
|
+
return {
|
765
|
+
restrict: 'EA',
|
766
|
+
templateUrl: function(tElement, tAttrs) {
|
767
|
+
var theme = tAttrs.theme || uiSelectConfig.theme;
|
768
|
+
return theme + (angular.isDefined(tAttrs.multiple) ? '/select-multiple.tpl.html' : '/select.tpl.html');
|
769
|
+
},
|
770
|
+
replace: true,
|
771
|
+
transclude: true,
|
772
|
+
require: ['uiSelect', '^ngModel'],
|
773
|
+
scope: true,
|
774
|
+
|
775
|
+
controller: 'uiSelectCtrl',
|
776
|
+
controllerAs: '$select',
|
777
|
+
compile: function(tElement, tAttrs) {
|
778
|
+
|
779
|
+
//Multiple or Single depending if multiple attribute presence
|
780
|
+
if (angular.isDefined(tAttrs.multiple))
|
781
|
+
tElement.append("<ui-select-multiple/>").removeAttr('multiple');
|
782
|
+
else
|
783
|
+
tElement.append("<ui-select-single/>");
|
784
|
+
|
785
|
+
return function(scope, element, attrs, ctrls, transcludeFn) {
|
786
|
+
|
787
|
+
var $select = ctrls[0];
|
788
|
+
var ngModel = ctrls[1];
|
789
|
+
|
790
|
+
$select.generatedId = uiSelectConfig.generateId();
|
791
|
+
$select.baseTitle = attrs.title || 'Select box';
|
792
|
+
$select.focusserTitle = $select.baseTitle + ' focus';
|
793
|
+
$select.focusserId = 'focusser-' + $select.generatedId;
|
794
|
+
|
795
|
+
$select.closeOnSelect = function() {
|
796
|
+
if (angular.isDefined(attrs.closeOnSelect)) {
|
797
|
+
return $parse(attrs.closeOnSelect)();
|
798
|
+
} else {
|
799
|
+
return uiSelectConfig.closeOnSelect;
|
800
|
+
}
|
801
|
+
}();
|
802
|
+
|
803
|
+
$select.onSelectCallback = $parse(attrs.onSelect);
|
804
|
+
$select.onRemoveCallback = $parse(attrs.onRemove);
|
805
|
+
|
806
|
+
//Set reference to ngModel from uiSelectCtrl
|
807
|
+
$select.ngModel = ngModel;
|
808
|
+
|
809
|
+
$select.choiceGrouped = function(group){
|
810
|
+
return $select.isGrouped && group && group.name;
|
811
|
+
};
|
812
|
+
|
813
|
+
if(attrs.tabindex){
|
814
|
+
attrs.$observe('tabindex', function(value) {
|
815
|
+
$select.focusInput.attr("tabindex", value);
|
816
|
+
element.removeAttr("tabindex");
|
817
|
+
});
|
818
|
+
}
|
819
|
+
|
820
|
+
scope.$watch('searchEnabled', function() {
|
821
|
+
var searchEnabled = scope.$eval(attrs.searchEnabled);
|
822
|
+
$select.searchEnabled = searchEnabled !== undefined ? searchEnabled : uiSelectConfig.searchEnabled;
|
823
|
+
});
|
824
|
+
|
825
|
+
scope.$watch('sortable', function() {
|
826
|
+
var sortable = scope.$eval(attrs.sortable);
|
827
|
+
$select.sortable = sortable !== undefined ? sortable : uiSelectConfig.sortable;
|
828
|
+
});
|
829
|
+
|
830
|
+
attrs.$observe('disabled', function() {
|
831
|
+
// No need to use $eval() (thanks to ng-disabled) since we already get a boolean instead of a string
|
832
|
+
$select.disabled = attrs.disabled !== undefined ? attrs.disabled : false;
|
833
|
+
});
|
834
|
+
|
835
|
+
attrs.$observe('resetSearchInput', function() {
|
836
|
+
// $eval() is needed otherwise we get a string instead of a boolean
|
837
|
+
var resetSearchInput = scope.$eval(attrs.resetSearchInput);
|
838
|
+
$select.resetSearchInput = resetSearchInput !== undefined ? resetSearchInput : true;
|
839
|
+
});
|
840
|
+
|
841
|
+
attrs.$observe('tagging', function() {
|
842
|
+
if(attrs.tagging !== undefined)
|
843
|
+
{
|
844
|
+
// $eval() is needed otherwise we get a string instead of a boolean
|
845
|
+
var taggingEval = scope.$eval(attrs.tagging);
|
846
|
+
$select.tagging = {isActivated: true, fct: taggingEval !== true ? taggingEval : undefined};
|
847
|
+
}
|
848
|
+
else
|
849
|
+
{
|
850
|
+
$select.tagging = {isActivated: false, fct: undefined};
|
851
|
+
}
|
852
|
+
});
|
853
|
+
|
854
|
+
attrs.$observe('taggingLabel', function() {
|
855
|
+
if(attrs.tagging !== undefined )
|
856
|
+
{
|
857
|
+
// check eval for FALSE, in this case, we disable the labels
|
858
|
+
// associated with tagging
|
859
|
+
if ( attrs.taggingLabel === 'false' ) {
|
860
|
+
$select.taggingLabel = false;
|
861
|
+
}
|
862
|
+
else
|
863
|
+
{
|
864
|
+
$select.taggingLabel = attrs.taggingLabel !== undefined ? attrs.taggingLabel : '(new)';
|
865
|
+
}
|
866
|
+
}
|
867
|
+
});
|
868
|
+
|
869
|
+
attrs.$observe('taggingTokens', function() {
|
870
|
+
if (attrs.tagging !== undefined) {
|
871
|
+
var tokens = attrs.taggingTokens !== undefined ? attrs.taggingTokens.split('|') : [',','ENTER'];
|
872
|
+
$select.taggingTokens = {isActivated: true, tokens: tokens };
|
873
|
+
}
|
874
|
+
});
|
875
|
+
|
876
|
+
//Automatically gets focus when loaded
|
877
|
+
if (angular.isDefined(attrs.autofocus)){
|
878
|
+
$timeout(function(){
|
879
|
+
$select.setFocus();
|
880
|
+
});
|
881
|
+
}
|
882
|
+
|
883
|
+
//Gets focus based on scope event name (e.g. focus-on='SomeEventName')
|
884
|
+
if (angular.isDefined(attrs.focusOn)){
|
885
|
+
scope.$on(attrs.focusOn, function() {
|
886
|
+
$timeout(function(){
|
887
|
+
$select.setFocus();
|
888
|
+
});
|
889
|
+
});
|
890
|
+
}
|
891
|
+
|
892
|
+
function onDocumentClick(e) {
|
893
|
+
if (!$select.open) return; //Skip it if dropdown is close
|
894
|
+
|
895
|
+
var contains = false;
|
896
|
+
|
897
|
+
if (window.jQuery) {
|
898
|
+
// Firefox 3.6 does not support element.contains()
|
899
|
+
// See Node.contains https://developer.mozilla.org/en-US/docs/Web/API/Node.contains
|
900
|
+
contains = window.jQuery.contains(element[0], e.target);
|
901
|
+
} else {
|
902
|
+
contains = element[0].contains(e.target);
|
903
|
+
}
|
904
|
+
|
905
|
+
if (!contains && !$select.clickTriggeredSelect) {
|
906
|
+
//Will lose focus only with certain targets
|
907
|
+
var focusableControls = ['input','button','textarea'];
|
908
|
+
var targetScope = angular.element(e.target).scope(); //To check if target is other ui-select
|
909
|
+
var skipFocusser = targetScope && targetScope.$select && targetScope.$select !== $select; //To check if target is other ui-select
|
910
|
+
if (!skipFocusser) skipFocusser = ~focusableControls.indexOf(e.target.tagName.toLowerCase()); //Check if target is input, button or textarea
|
911
|
+
$select.close(skipFocusser);
|
912
|
+
scope.$digest();
|
913
|
+
}
|
914
|
+
$select.clickTriggeredSelect = false;
|
915
|
+
}
|
916
|
+
|
917
|
+
// See Click everywhere but here event http://stackoverflow.com/questions/12931369
|
918
|
+
$document.on('click', onDocumentClick);
|
919
|
+
|
920
|
+
scope.$on('$destroy', function() {
|
921
|
+
$document.off('click', onDocumentClick);
|
922
|
+
});
|
923
|
+
|
924
|
+
// Move transcluded elements to their correct position in main template
|
925
|
+
transcludeFn(scope, function(clone) {
|
926
|
+
// See Transclude in AngularJS http://blog.omkarpatil.com/2012/11/transclude-in-angularjs.html
|
927
|
+
|
928
|
+
// One day jqLite will be replaced by jQuery and we will be able to write:
|
929
|
+
// var transcludedElement = clone.filter('.my-class')
|
930
|
+
// instead of creating a hackish DOM element:
|
931
|
+
var transcluded = angular.element('<div>').append(clone);
|
932
|
+
|
933
|
+
var transcludedMatch = transcluded.querySelectorAll('.ui-select-match');
|
934
|
+
transcludedMatch.removeAttr('ui-select-match'); //To avoid loop in case directive as attr
|
935
|
+
transcludedMatch.removeAttr('data-ui-select-match'); // Properly handle HTML5 data-attributes
|
936
|
+
if (transcludedMatch.length !== 1) {
|
937
|
+
throw uiSelectMinErr('transcluded', "Expected 1 .ui-select-match but got '{0}'.", transcludedMatch.length);
|
938
|
+
}
|
939
|
+
element.querySelectorAll('.ui-select-match').replaceWith(transcludedMatch);
|
940
|
+
|
941
|
+
var transcludedChoices = transcluded.querySelectorAll('.ui-select-choices');
|
942
|
+
transcludedChoices.removeAttr('ui-select-choices'); //To avoid loop in case directive as attr
|
943
|
+
transcludedChoices.removeAttr('data-ui-select-choices'); // Properly handle HTML5 data-attributes
|
944
|
+
if (transcludedChoices.length !== 1) {
|
945
|
+
throw uiSelectMinErr('transcluded', "Expected 1 .ui-select-choices but got '{0}'.", transcludedChoices.length);
|
946
|
+
}
|
947
|
+
element.querySelectorAll('.ui-select-choices').replaceWith(transcludedChoices);
|
948
|
+
});
|
949
|
+
|
950
|
+
// Support for appending the select field to the body when its open
|
951
|
+
var appendToBody = scope.$eval(attrs.appendToBody);
|
952
|
+
if (appendToBody !== undefined ? appendToBody : uiSelectConfig.appendToBody) {
|
953
|
+
scope.$watch('$select.open', function(isOpen) {
|
954
|
+
if (isOpen) {
|
955
|
+
positionDropdown();
|
956
|
+
} else {
|
957
|
+
resetDropdown();
|
958
|
+
}
|
959
|
+
});
|
960
|
+
|
961
|
+
// Move the dropdown back to its original location when the scope is destroyed. Otherwise
|
962
|
+
// it might stick around when the user routes away or the select field is otherwise removed
|
963
|
+
scope.$on('$destroy', function() {
|
964
|
+
resetDropdown();
|
965
|
+
});
|
966
|
+
}
|
967
|
+
|
968
|
+
// Hold on to a reference to the .ui-select-container element for appendToBody support
|
969
|
+
var placeholder = null,
|
970
|
+
originalWidth = '';
|
971
|
+
|
972
|
+
function positionDropdown() {
|
973
|
+
// Remember the absolute position of the element
|
974
|
+
var offset = uisOffset(element);
|
975
|
+
|
976
|
+
// Clone the element into a placeholder element to take its original place in the DOM
|
977
|
+
placeholder = angular.element('<div class="ui-select-placeholder"></div>');
|
978
|
+
placeholder[0].style.width = offset.width + 'px';
|
979
|
+
placeholder[0].style.height = offset.height + 'px';
|
980
|
+
element.after(placeholder);
|
981
|
+
|
982
|
+
// Remember the original value of the element width inline style, so it can be restored
|
983
|
+
// when the dropdown is closed
|
984
|
+
originalWidth = element[0].style.width;
|
985
|
+
|
986
|
+
// Now move the actual dropdown element to the end of the body
|
987
|
+
$document.find('body').append(element);
|
988
|
+
|
989
|
+
element[0].style.position = 'absolute';
|
990
|
+
element[0].style.left = offset.left + 'px';
|
991
|
+
element[0].style.top = offset.top + 'px';
|
992
|
+
element[0].style.width = offset.width + 'px';
|
993
|
+
}
|
994
|
+
|
995
|
+
function resetDropdown() {
|
996
|
+
if (placeholder === null) {
|
997
|
+
// The dropdown has not actually been display yet, so there's nothing to reset
|
998
|
+
return;
|
999
|
+
}
|
1000
|
+
|
1001
|
+
// Move the dropdown element back to its original location in the DOM
|
1002
|
+
placeholder.replaceWith(element);
|
1003
|
+
placeholder = null;
|
1004
|
+
|
1005
|
+
element[0].style.position = '';
|
1006
|
+
element[0].style.left = '';
|
1007
|
+
element[0].style.top = '';
|
1008
|
+
element[0].style.width = originalWidth;
|
1009
|
+
}
|
1010
|
+
|
1011
|
+
// Hold on to a reference to the .ui-select-dropdown element for direction support.
|
1012
|
+
var dropdown = null,
|
1013
|
+
directionUpClassName = 'direction-up';
|
1014
|
+
|
1015
|
+
// Support changing the direction of the dropdown if there isn't enough space to render it.
|
1016
|
+
scope.$watch('$select.open', function(isOpen) {
|
1017
|
+
if (isOpen) {
|
1018
|
+
dropdown = angular.element(element).querySelectorAll('.ui-select-dropdown');
|
1019
|
+
if (dropdown === null) {
|
1020
|
+
return;
|
1021
|
+
}
|
1022
|
+
|
1023
|
+
// Hide the dropdown so there is no flicker until $timeout is done executing.
|
1024
|
+
dropdown[0].style.opacity = 0;
|
1025
|
+
|
1026
|
+
// Delay positioning the dropdown until all choices have been added so its height is correct.
|
1027
|
+
$timeout(function(){
|
1028
|
+
var offset = uisOffset(element);
|
1029
|
+
var offsetDropdown = uisOffset(dropdown);
|
1030
|
+
|
1031
|
+
// Determine if the direction of the dropdown needs to be changed.
|
1032
|
+
if (offset.top + offset.height + offsetDropdown.height > $document[0].documentElement.scrollTop + $document[0].documentElement.clientHeight) {
|
1033
|
+
dropdown[0].style.position = 'absolute';
|
1034
|
+
dropdown[0].style.top = (offsetDropdown.height * -1) + 'px';
|
1035
|
+
element.addClass(directionUpClassName);
|
1036
|
+
}
|
1037
|
+
|
1038
|
+
// Display the dropdown once it has been positioned.
|
1039
|
+
dropdown[0].style.opacity = 1;
|
1040
|
+
});
|
1041
|
+
} else {
|
1042
|
+
if (dropdown === null) {
|
1043
|
+
return;
|
1044
|
+
}
|
1045
|
+
|
1046
|
+
// Reset the position of the dropdown.
|
1047
|
+
dropdown[0].style.position = '';
|
1048
|
+
dropdown[0].style.top = '';
|
1049
|
+
element.removeClass(directionUpClassName);
|
1050
|
+
}
|
1051
|
+
});
|
1052
|
+
};
|
1053
|
+
}
|
1054
|
+
};
|
1055
|
+
}]);
|
1056
|
+
|
1057
|
+
uis.directive('uiSelectMatch', ['uiSelectConfig', function(uiSelectConfig) {
|
1058
|
+
return {
|
1059
|
+
restrict: 'EA',
|
1060
|
+
require: '^uiSelect',
|
1061
|
+
replace: true,
|
1062
|
+
transclude: true,
|
1063
|
+
templateUrl: function(tElement) {
|
1064
|
+
// Gets theme attribute from parent (ui-select)
|
1065
|
+
var theme = tElement.parent().attr('theme') || uiSelectConfig.theme;
|
1066
|
+
var multi = tElement.parent().attr('multiple');
|
1067
|
+
return theme + (multi ? '/match-multiple.tpl.html' : '/match.tpl.html');
|
1068
|
+
},
|
1069
|
+
link: function(scope, element, attrs, $select) {
|
1070
|
+
$select.lockChoiceExpression = attrs.uiLockChoice;
|
1071
|
+
attrs.$observe('placeholder', function(placeholder) {
|
1072
|
+
$select.placeholder = placeholder !== undefined ? placeholder : uiSelectConfig.placeholder;
|
1073
|
+
});
|
1074
|
+
|
1075
|
+
function setAllowClear(allow) {
|
1076
|
+
$select.allowClear = (angular.isDefined(allow)) ? (allow === '') ? true : (allow.toLowerCase() === 'true') : false;
|
1077
|
+
}
|
1078
|
+
|
1079
|
+
attrs.$observe('allowClear', setAllowClear);
|
1080
|
+
setAllowClear(attrs.allowClear);
|
1081
|
+
|
1082
|
+
if($select.multiple){
|
1083
|
+
$select.sizeSearchInput();
|
1084
|
+
}
|
1085
|
+
|
1086
|
+
}
|
1087
|
+
};
|
1088
|
+
}]);
|
1089
|
+
|
1090
|
+
uis.directive('uiSelectMultiple', ['uiSelectMinErr','$timeout', function(uiSelectMinErr, $timeout) {
|
1091
|
+
return {
|
1092
|
+
restrict: 'EA',
|
1093
|
+
require: ['^uiSelect', '^ngModel'],
|
1094
|
+
|
1095
|
+
controller: ['$scope','$timeout', function($scope, $timeout){
|
1096
|
+
|
1097
|
+
var ctrl = this,
|
1098
|
+
$select = $scope.$select,
|
1099
|
+
ngModel;
|
1100
|
+
|
1101
|
+
//Wait for link fn to inject it
|
1102
|
+
$scope.$evalAsync(function(){ ngModel = $scope.ngModel; });
|
1103
|
+
|
1104
|
+
ctrl.activeMatchIndex = -1;
|
1105
|
+
|
1106
|
+
ctrl.updateModel = function(){
|
1107
|
+
ngModel.$setViewValue(Date.now()); //Set timestamp as a unique string to force changes
|
1108
|
+
ctrl.refreshComponent();
|
1109
|
+
};
|
1110
|
+
|
1111
|
+
ctrl.refreshComponent = function(){
|
1112
|
+
//Remove already selected items
|
1113
|
+
//e.g. When user clicks on a selection, the selected array changes and
|
1114
|
+
//the dropdown should remove that item
|
1115
|
+
$select.refreshItems();
|
1116
|
+
$select.sizeSearchInput();
|
1117
|
+
};
|
1118
|
+
|
1119
|
+
// Remove item from multiple select
|
1120
|
+
ctrl.removeChoice = function(index){
|
1121
|
+
|
1122
|
+
var removedChoice = $select.selected[index];
|
1123
|
+
|
1124
|
+
// if the choice is locked, can't remove it
|
1125
|
+
if(removedChoice._uiSelectChoiceLocked) return;
|
1126
|
+
|
1127
|
+
var locals = {};
|
1128
|
+
locals[$select.parserResult.itemName] = removedChoice;
|
1129
|
+
|
1130
|
+
$select.selected.splice(index, 1);
|
1131
|
+
ctrl.activeMatchIndex = -1;
|
1132
|
+
$select.sizeSearchInput();
|
1133
|
+
|
1134
|
+
// Give some time for scope propagation.
|
1135
|
+
$timeout(function(){
|
1136
|
+
$select.onRemoveCallback($scope, {
|
1137
|
+
$item: removedChoice,
|
1138
|
+
$model: $select.parserResult.modelMapper($scope, locals)
|
1139
|
+
});
|
1140
|
+
});
|
1141
|
+
|
1142
|
+
ctrl.updateModel();
|
1143
|
+
|
1144
|
+
};
|
1145
|
+
|
1146
|
+
ctrl.getPlaceholder = function(){
|
1147
|
+
//Refactor single?
|
1148
|
+
if($select.selected.length) return;
|
1149
|
+
return $select.placeholder;
|
1150
|
+
};
|
1151
|
+
|
1152
|
+
|
1153
|
+
}],
|
1154
|
+
controllerAs: '$selectMultiple',
|
1155
|
+
|
1156
|
+
link: function(scope, element, attrs, ctrls) {
|
1157
|
+
|
1158
|
+
var $select = ctrls[0];
|
1159
|
+
var ngModel = scope.ngModel = ctrls[1];
|
1160
|
+
var $selectMultiple = scope.$selectMultiple;
|
1161
|
+
|
1162
|
+
//$select.selected = raw selected objects (ignoring any property binding)
|
1163
|
+
|
1164
|
+
$select.multiple = true;
|
1165
|
+
$select.removeSelected = true;
|
1166
|
+
|
1167
|
+
//Input that will handle focus
|
1168
|
+
$select.focusInput = $select.searchInput;
|
1169
|
+
|
1170
|
+
//From view --> model
|
1171
|
+
ngModel.$parsers.unshift(function () {
|
1172
|
+
var locals = {},
|
1173
|
+
result,
|
1174
|
+
resultMultiple = [];
|
1175
|
+
for (var j = $select.selected.length - 1; j >= 0; j--) {
|
1176
|
+
locals = {};
|
1177
|
+
locals[$select.parserResult.itemName] = $select.selected[j];
|
1178
|
+
result = $select.parserResult.modelMapper(scope, locals);
|
1179
|
+
resultMultiple.unshift(result);
|
1180
|
+
}
|
1181
|
+
return resultMultiple;
|
1182
|
+
});
|
1183
|
+
|
1184
|
+
// From model --> view
|
1185
|
+
ngModel.$formatters.unshift(function (inputValue) {
|
1186
|
+
var data = $select.parserResult.source (scope, { $select : {search:''}}), //Overwrite $search
|
1187
|
+
locals = {},
|
1188
|
+
result;
|
1189
|
+
if (!data) return inputValue;
|
1190
|
+
var resultMultiple = [];
|
1191
|
+
var checkFnMultiple = function(list, value){
|
1192
|
+
if (!list || !list.length) return;
|
1193
|
+
for (var p = list.length - 1; p >= 0; p--) {
|
1194
|
+
locals[$select.parserResult.itemName] = list[p];
|
1195
|
+
result = $select.parserResult.modelMapper(scope, locals);
|
1196
|
+
if($select.parserResult.trackByExp){
|
1197
|
+
var matches = /\.(.+)/.exec($select.parserResult.trackByExp);
|
1198
|
+
if(matches.length>0 && result[matches[1]] == value[matches[1]]){
|
1199
|
+
resultMultiple.unshift(list[p]);
|
1200
|
+
return true;
|
1201
|
+
}
|
1202
|
+
}
|
1203
|
+
if (angular.equals(result,value)){
|
1204
|
+
resultMultiple.unshift(list[p]);
|
1205
|
+
return true;
|
1206
|
+
}
|
1207
|
+
}
|
1208
|
+
return false;
|
1209
|
+
};
|
1210
|
+
if (!inputValue) return resultMultiple; //If ngModel was undefined
|
1211
|
+
for (var k = inputValue.length - 1; k >= 0; k--) {
|
1212
|
+
//Check model array of currently selected items
|
1213
|
+
if (!checkFnMultiple($select.selected, inputValue[k])){
|
1214
|
+
//Check model array of all items available
|
1215
|
+
if (!checkFnMultiple(data, inputValue[k])){
|
1216
|
+
//If not found on previous lists, just add it directly to resultMultiple
|
1217
|
+
resultMultiple.unshift(inputValue[k]);
|
1218
|
+
}
|
1219
|
+
}
|
1220
|
+
}
|
1221
|
+
return resultMultiple;
|
1222
|
+
});
|
1223
|
+
|
1224
|
+
//Watch for external model changes
|
1225
|
+
scope.$watchCollection(function(){ return ngModel.$modelValue; }, function(newValue, oldValue) {
|
1226
|
+
if (oldValue != newValue){
|
1227
|
+
ngModel.$modelValue = null; //Force scope model value and ngModel value to be out of sync to re-run formatters
|
1228
|
+
$selectMultiple.refreshComponent();
|
1229
|
+
}
|
1230
|
+
});
|
1231
|
+
|
1232
|
+
ngModel.$render = function() {
|
1233
|
+
// Make sure that model value is array
|
1234
|
+
if(!angular.isArray(ngModel.$viewValue)){
|
1235
|
+
// Have tolerance for null or undefined values
|
1236
|
+
if(angular.isUndefined(ngModel.$viewValue) || ngModel.$viewValue === null){
|
1237
|
+
$select.selected = [];
|
1238
|
+
} else {
|
1239
|
+
throw uiSelectMinErr('multiarr', "Expected model value to be array but got '{0}'", ngModel.$viewValue);
|
1240
|
+
}
|
1241
|
+
}
|
1242
|
+
$select.selected = ngModel.$viewValue;
|
1243
|
+
scope.$evalAsync(); //To force $digest
|
1244
|
+
};
|
1245
|
+
|
1246
|
+
scope.$on('uis:select', function (event, item) {
|
1247
|
+
$select.selected.push(item);
|
1248
|
+
$selectMultiple.updateModel();
|
1249
|
+
});
|
1250
|
+
|
1251
|
+
scope.$on('uis:activate', function () {
|
1252
|
+
$selectMultiple.activeMatchIndex = -1;
|
1253
|
+
});
|
1254
|
+
|
1255
|
+
scope.$watch('$select.disabled', function(newValue, oldValue) {
|
1256
|
+
// As the search input field may now become visible, it may be necessary to recompute its size
|
1257
|
+
if (oldValue && !newValue) $select.sizeSearchInput();
|
1258
|
+
});
|
1259
|
+
|
1260
|
+
$select.searchInput.on('keydown', function(e) {
|
1261
|
+
var key = e.which;
|
1262
|
+
scope.$apply(function() {
|
1263
|
+
var processed = false;
|
1264
|
+
// var tagged = false; //Checkme
|
1265
|
+
if(KEY.isHorizontalMovement(key)){
|
1266
|
+
processed = _handleMatchSelection(key);
|
1267
|
+
}
|
1268
|
+
if (processed && key != KEY.TAB) {
|
1269
|
+
//TODO Check si el tab selecciona aun correctamente
|
1270
|
+
//Crear test
|
1271
|
+
e.preventDefault();
|
1272
|
+
e.stopPropagation();
|
1273
|
+
}
|
1274
|
+
});
|
1275
|
+
});
|
1276
|
+
function _getCaretPosition(el) {
|
1277
|
+
if(angular.isNumber(el.selectionStart)) return el.selectionStart;
|
1278
|
+
// selectionStart is not supported in IE8 and we don't want hacky workarounds so we compromise
|
1279
|
+
else return el.value.length;
|
1280
|
+
}
|
1281
|
+
// Handles selected options in "multiple" mode
|
1282
|
+
function _handleMatchSelection(key){
|
1283
|
+
var caretPosition = _getCaretPosition($select.searchInput[0]),
|
1284
|
+
length = $select.selected.length,
|
1285
|
+
// none = -1,
|
1286
|
+
first = 0,
|
1287
|
+
last = length-1,
|
1288
|
+
curr = $selectMultiple.activeMatchIndex,
|
1289
|
+
next = $selectMultiple.activeMatchIndex+1,
|
1290
|
+
prev = $selectMultiple.activeMatchIndex-1,
|
1291
|
+
newIndex = curr;
|
1292
|
+
|
1293
|
+
if(caretPosition > 0 || ($select.search.length && key == KEY.RIGHT)) return false;
|
1294
|
+
|
1295
|
+
$select.close();
|
1296
|
+
|
1297
|
+
function getNewActiveMatchIndex(){
|
1298
|
+
switch(key){
|
1299
|
+
case KEY.LEFT:
|
1300
|
+
// Select previous/first item
|
1301
|
+
if(~$selectMultiple.activeMatchIndex) return prev;
|
1302
|
+
// Select last item
|
1303
|
+
else return last;
|
1304
|
+
break;
|
1305
|
+
case KEY.RIGHT:
|
1306
|
+
// Open drop-down
|
1307
|
+
if(!~$selectMultiple.activeMatchIndex || curr === last){
|
1308
|
+
$select.activate();
|
1309
|
+
return false;
|
1310
|
+
}
|
1311
|
+
// Select next/last item
|
1312
|
+
else return next;
|
1313
|
+
break;
|
1314
|
+
case KEY.BACKSPACE:
|
1315
|
+
// Remove selected item and select previous/first
|
1316
|
+
if(~$selectMultiple.activeMatchIndex){
|
1317
|
+
$selectMultiple.removeChoice(curr);
|
1318
|
+
return prev;
|
1319
|
+
}
|
1320
|
+
// Select last item
|
1321
|
+
else return last;
|
1322
|
+
break;
|
1323
|
+
case KEY.DELETE:
|
1324
|
+
// Remove selected item and select next item
|
1325
|
+
if(~$selectMultiple.activeMatchIndex){
|
1326
|
+
$selectMultiple.removeChoice($selectMultiple.activeMatchIndex);
|
1327
|
+
return curr;
|
1328
|
+
}
|
1329
|
+
else return false;
|
1330
|
+
}
|
1331
|
+
}
|
1332
|
+
|
1333
|
+
newIndex = getNewActiveMatchIndex();
|
1334
|
+
|
1335
|
+
if(!$select.selected.length || newIndex === false) $selectMultiple.activeMatchIndex = -1;
|
1336
|
+
else $selectMultiple.activeMatchIndex = Math.min(last,Math.max(first,newIndex));
|
1337
|
+
|
1338
|
+
return true;
|
1339
|
+
}
|
1340
|
+
|
1341
|
+
$select.searchInput.on('keyup', function(e) {
|
1342
|
+
|
1343
|
+
if ( ! KEY.isVerticalMovement(e.which) ) {
|
1344
|
+
scope.$evalAsync( function () {
|
1345
|
+
$select.activeIndex = $select.taggingLabel === false ? -1 : 0;
|
1346
|
+
});
|
1347
|
+
}
|
1348
|
+
// Push a "create new" item into array if there is a search string
|
1349
|
+
if ( $select.tagging.isActivated && $select.search.length > 0 ) {
|
1350
|
+
|
1351
|
+
// return early with these keys
|
1352
|
+
if (e.which === KEY.TAB || KEY.isControl(e) || KEY.isFunctionKey(e) || e.which === KEY.ESC || KEY.isVerticalMovement(e.which) ) {
|
1353
|
+
return;
|
1354
|
+
}
|
1355
|
+
// always reset the activeIndex to the first item when tagging
|
1356
|
+
$select.activeIndex = $select.taggingLabel === false ? -1 : 0;
|
1357
|
+
// taggingLabel === false bypasses all of this
|
1358
|
+
if ($select.taggingLabel === false) return;
|
1359
|
+
|
1360
|
+
var items = angular.copy( $select.items );
|
1361
|
+
var stashArr = angular.copy( $select.items );
|
1362
|
+
var newItem;
|
1363
|
+
var item;
|
1364
|
+
var hasTag = false;
|
1365
|
+
var dupeIndex = -1;
|
1366
|
+
var tagItems;
|
1367
|
+
var tagItem;
|
1368
|
+
|
1369
|
+
// case for object tagging via transform `$select.tagging.fct` function
|
1370
|
+
if ( $select.tagging.fct !== undefined) {
|
1371
|
+
tagItems = $select.$filter('filter')(items,{'isTag': true});
|
1372
|
+
if ( tagItems.length > 0 ) {
|
1373
|
+
tagItem = tagItems[0];
|
1374
|
+
}
|
1375
|
+
// remove the first element, if it has the `isTag` prop we generate a new one with each keyup, shaving the previous
|
1376
|
+
if ( items.length > 0 && tagItem ) {
|
1377
|
+
hasTag = true;
|
1378
|
+
items = items.slice(1,items.length);
|
1379
|
+
stashArr = stashArr.slice(1,stashArr.length);
|
1380
|
+
}
|
1381
|
+
newItem = $select.tagging.fct($select.search);
|
1382
|
+
newItem.isTag = true;
|
1383
|
+
// verify the the tag doesn't match the value of an existing item
|
1384
|
+
if ( stashArr.filter( function (origItem) { return angular.equals( origItem, $select.tagging.fct($select.search) ); } ).length > 0 ) {
|
1385
|
+
return;
|
1386
|
+
}
|
1387
|
+
newItem.isTag = true;
|
1388
|
+
// handle newItem string and stripping dupes in tagging string context
|
1389
|
+
} else {
|
1390
|
+
// find any tagging items already in the $select.items array and store them
|
1391
|
+
tagItems = $select.$filter('filter')(items,function (item) {
|
1392
|
+
return item.match($select.taggingLabel);
|
1393
|
+
});
|
1394
|
+
if ( tagItems.length > 0 ) {
|
1395
|
+
tagItem = tagItems[0];
|
1396
|
+
}
|
1397
|
+
item = items[0];
|
1398
|
+
// remove existing tag item if found (should only ever be one tag item)
|
1399
|
+
if ( item !== undefined && items.length > 0 && tagItem ) {
|
1400
|
+
hasTag = true;
|
1401
|
+
items = items.slice(1,items.length);
|
1402
|
+
stashArr = stashArr.slice(1,stashArr.length);
|
1403
|
+
}
|
1404
|
+
newItem = $select.search+' '+$select.taggingLabel;
|
1405
|
+
if ( _findApproxDupe($select.selected, $select.search) > -1 ) {
|
1406
|
+
return;
|
1407
|
+
}
|
1408
|
+
// verify the the tag doesn't match the value of an existing item from
|
1409
|
+
// the searched data set or the items already selected
|
1410
|
+
if ( _findCaseInsensitiveDupe(stashArr.concat($select.selected)) ) {
|
1411
|
+
// if there is a tag from prev iteration, strip it / queue the change
|
1412
|
+
// and return early
|
1413
|
+
if ( hasTag ) {
|
1414
|
+
items = stashArr;
|
1415
|
+
scope.$evalAsync( function () {
|
1416
|
+
$select.activeIndex = 0;
|
1417
|
+
$select.items = items;
|
1418
|
+
});
|
1419
|
+
}
|
1420
|
+
return;
|
1421
|
+
}
|
1422
|
+
if ( _findCaseInsensitiveDupe(stashArr) ) {
|
1423
|
+
// if there is a tag from prev iteration, strip it
|
1424
|
+
if ( hasTag ) {
|
1425
|
+
$select.items = stashArr.slice(1,stashArr.length);
|
1426
|
+
}
|
1427
|
+
return;
|
1428
|
+
}
|
1429
|
+
}
|
1430
|
+
if ( hasTag ) dupeIndex = _findApproxDupe($select.selected, newItem);
|
1431
|
+
// dupe found, shave the first item
|
1432
|
+
if ( dupeIndex > -1 ) {
|
1433
|
+
items = items.slice(dupeIndex+1,items.length-1);
|
1434
|
+
} else {
|
1435
|
+
items = [];
|
1436
|
+
items.push(newItem);
|
1437
|
+
items = items.concat(stashArr);
|
1438
|
+
}
|
1439
|
+
scope.$evalAsync( function () {
|
1440
|
+
$select.activeIndex = 0;
|
1441
|
+
$select.items = items;
|
1442
|
+
});
|
1443
|
+
}
|
1444
|
+
});
|
1445
|
+
function _findCaseInsensitiveDupe(arr) {
|
1446
|
+
if ( arr === undefined || $select.search === undefined ) {
|
1447
|
+
return false;
|
1448
|
+
}
|
1449
|
+
var hasDupe = arr.filter( function (origItem) {
|
1450
|
+
if ( $select.search.toUpperCase() === undefined || origItem === undefined ) {
|
1451
|
+
return false;
|
1452
|
+
}
|
1453
|
+
return origItem.toUpperCase() === $select.search.toUpperCase();
|
1454
|
+
}).length > 0;
|
1455
|
+
|
1456
|
+
return hasDupe;
|
1457
|
+
}
|
1458
|
+
function _findApproxDupe(haystack, needle) {
|
1459
|
+
var dupeIndex = -1;
|
1460
|
+
if(angular.isArray(haystack)) {
|
1461
|
+
var tempArr = angular.copy(haystack);
|
1462
|
+
for (var i = 0; i <tempArr.length; i++) {
|
1463
|
+
// handle the simple string version of tagging
|
1464
|
+
if ( $select.tagging.fct === undefined ) {
|
1465
|
+
// search the array for the match
|
1466
|
+
if ( tempArr[i]+' '+$select.taggingLabel === needle ) {
|
1467
|
+
dupeIndex = i;
|
1468
|
+
}
|
1469
|
+
// handle the object tagging implementation
|
1470
|
+
} else {
|
1471
|
+
var mockObj = tempArr[i];
|
1472
|
+
mockObj.isTag = true;
|
1473
|
+
if ( angular.equals(mockObj, needle) ) {
|
1474
|
+
dupeIndex = i;
|
1475
|
+
}
|
1476
|
+
}
|
1477
|
+
}
|
1478
|
+
}
|
1479
|
+
return dupeIndex;
|
1480
|
+
}
|
1481
|
+
|
1482
|
+
$select.searchInput.on('blur', function() {
|
1483
|
+
$timeout(function() {
|
1484
|
+
$selectMultiple.activeMatchIndex = -1;
|
1485
|
+
});
|
1486
|
+
});
|
1487
|
+
|
1488
|
+
}
|
1489
|
+
};
|
1490
|
+
}]);
|
1491
|
+
uis.directive('uiSelectSingle', ['$timeout','$compile', function($timeout, $compile) {
|
1492
|
+
return {
|
1493
|
+
restrict: 'EA',
|
1494
|
+
require: ['^uiSelect', '^ngModel'],
|
1495
|
+
link: function(scope, element, attrs, ctrls) {
|
1496
|
+
|
1497
|
+
var $select = ctrls[0];
|
1498
|
+
var ngModel = ctrls[1];
|
1499
|
+
|
1500
|
+
//From view --> model
|
1501
|
+
ngModel.$parsers.unshift(function (inputValue) {
|
1502
|
+
var locals = {},
|
1503
|
+
result;
|
1504
|
+
locals[$select.parserResult.itemName] = inputValue;
|
1505
|
+
result = $select.parserResult.modelMapper(scope, locals);
|
1506
|
+
return result;
|
1507
|
+
});
|
1508
|
+
|
1509
|
+
//From model --> view
|
1510
|
+
ngModel.$formatters.unshift(function (inputValue) {
|
1511
|
+
var data = $select.parserResult.source (scope, { $select : {search:''}}), //Overwrite $search
|
1512
|
+
locals = {},
|
1513
|
+
result;
|
1514
|
+
if (data){
|
1515
|
+
var checkFnSingle = function(d){
|
1516
|
+
locals[$select.parserResult.itemName] = d;
|
1517
|
+
result = $select.parserResult.modelMapper(scope, locals);
|
1518
|
+
return result == inputValue;
|
1519
|
+
};
|
1520
|
+
//If possible pass same object stored in $select.selected
|
1521
|
+
if ($select.selected && checkFnSingle($select.selected)) {
|
1522
|
+
return $select.selected;
|
1523
|
+
}
|
1524
|
+
for (var i = data.length - 1; i >= 0; i--) {
|
1525
|
+
if (checkFnSingle(data[i])) return data[i];
|
1526
|
+
}
|
1527
|
+
}
|
1528
|
+
return inputValue;
|
1529
|
+
});
|
1530
|
+
|
1531
|
+
//Update viewValue if model change
|
1532
|
+
scope.$watch('$select.selected', function(newValue) {
|
1533
|
+
if (ngModel.$viewValue !== newValue) {
|
1534
|
+
ngModel.$setViewValue(newValue);
|
1535
|
+
}
|
1536
|
+
});
|
1537
|
+
|
1538
|
+
ngModel.$render = function() {
|
1539
|
+
$select.selected = ngModel.$viewValue;
|
1540
|
+
};
|
1541
|
+
|
1542
|
+
scope.$on('uis:select', function (event, item) {
|
1543
|
+
$select.selected = item;
|
1544
|
+
});
|
1545
|
+
|
1546
|
+
scope.$on('uis:close', function (event, skipFocusser) {
|
1547
|
+
$timeout(function(){
|
1548
|
+
$select.focusser.prop('disabled', false);
|
1549
|
+
if (!skipFocusser) $select.focusser[0].focus();
|
1550
|
+
},0,false);
|
1551
|
+
});
|
1552
|
+
|
1553
|
+
scope.$on('uis:activate', function () {
|
1554
|
+
focusser.prop('disabled', true); //Will reactivate it on .close()
|
1555
|
+
});
|
1556
|
+
|
1557
|
+
//Idea from: https://github.com/ivaynberg/select2/blob/79b5bf6db918d7560bdd959109b7bcfb47edaf43/select2.js#L1954
|
1558
|
+
var focusser = angular.element("<input ng-disabled='$select.disabled' class='ui-select-focusser ui-select-offscreen' type='text' id='{{ $select.focusserId }}' aria-label='{{ $select.focusserTitle }}' aria-haspopup='true' role='button' />");
|
1559
|
+
$compile(focusser)(scope);
|
1560
|
+
$select.focusser = focusser;
|
1561
|
+
|
1562
|
+
//Input that will handle focus
|
1563
|
+
$select.focusInput = focusser;
|
1564
|
+
|
1565
|
+
element.parent().append(focusser);
|
1566
|
+
focusser.bind("focus", function(){
|
1567
|
+
scope.$evalAsync(function(){
|
1568
|
+
$select.focus = true;
|
1569
|
+
});
|
1570
|
+
});
|
1571
|
+
focusser.bind("blur", function(){
|
1572
|
+
scope.$evalAsync(function(){
|
1573
|
+
$select.focus = false;
|
1574
|
+
});
|
1575
|
+
});
|
1576
|
+
focusser.bind("keydown", function(e){
|
1577
|
+
|
1578
|
+
if (e.which === KEY.BACKSPACE) {
|
1579
|
+
e.preventDefault();
|
1580
|
+
e.stopPropagation();
|
1581
|
+
$select.select(undefined);
|
1582
|
+
scope.$apply();
|
1583
|
+
return;
|
1584
|
+
}
|
1585
|
+
|
1586
|
+
if (e.which === KEY.TAB || KEY.isControl(e) || KEY.isFunctionKey(e) || e.which === KEY.ESC) {
|
1587
|
+
return;
|
1588
|
+
}
|
1589
|
+
|
1590
|
+
if (e.which == KEY.DOWN || e.which == KEY.UP || e.which == KEY.ENTER || e.which == KEY.SPACE){
|
1591
|
+
e.preventDefault();
|
1592
|
+
e.stopPropagation();
|
1593
|
+
$select.activate();
|
1594
|
+
}
|
1595
|
+
|
1596
|
+
scope.$digest();
|
1597
|
+
});
|
1598
|
+
|
1599
|
+
focusser.bind("keyup input", function(e){
|
1600
|
+
|
1601
|
+
if (e.which === KEY.TAB || KEY.isControl(e) || KEY.isFunctionKey(e) || e.which === KEY.ESC || e.which == KEY.ENTER || e.which === KEY.BACKSPACE) {
|
1602
|
+
return;
|
1603
|
+
}
|
1604
|
+
|
1605
|
+
$select.activate(focusser.val()); //User pressed some regular key, so we pass it to the search input
|
1606
|
+
focusser.val('');
|
1607
|
+
scope.$digest();
|
1608
|
+
|
1609
|
+
});
|
1610
|
+
|
1611
|
+
|
1612
|
+
}
|
1613
|
+
};
|
1614
|
+
}]);
|
1615
|
+
// Make multiple matches sortable
|
1616
|
+
uis.directive('uiSelectSort', ['$timeout', 'uiSelectConfig', 'uiSelectMinErr', function($timeout, uiSelectConfig, uiSelectMinErr) {
|
1617
|
+
return {
|
1618
|
+
require: '^uiSelect',
|
1619
|
+
link: function(scope, element, attrs, $select) {
|
1620
|
+
if (scope[attrs.uiSelectSort] === null) {
|
1621
|
+
throw uiSelectMinErr('sort', "Expected a list to sort");
|
1622
|
+
}
|
1623
|
+
|
1624
|
+
var options = angular.extend({
|
1625
|
+
axis: 'horizontal'
|
1626
|
+
},
|
1627
|
+
scope.$eval(attrs.uiSelectSortOptions));
|
1628
|
+
|
1629
|
+
var axis = options.axis,
|
1630
|
+
draggingClassName = 'dragging',
|
1631
|
+
droppingClassName = 'dropping',
|
1632
|
+
droppingBeforeClassName = 'dropping-before',
|
1633
|
+
droppingAfterClassName = 'dropping-after';
|
1634
|
+
|
1635
|
+
scope.$watch(function(){
|
1636
|
+
return $select.sortable;
|
1637
|
+
}, function(n){
|
1638
|
+
if (n) {
|
1639
|
+
element.attr('draggable', true);
|
1640
|
+
} else {
|
1641
|
+
element.removeAttr('draggable');
|
1642
|
+
}
|
1643
|
+
});
|
1644
|
+
|
1645
|
+
element.on('dragstart', function(e) {
|
1646
|
+
element.addClass(draggingClassName);
|
1647
|
+
|
1648
|
+
(e.dataTransfer || e.originalEvent.dataTransfer).setData('text/plain', scope.$index);
|
1649
|
+
});
|
1650
|
+
|
1651
|
+
element.on('dragend', function() {
|
1652
|
+
element.removeClass(draggingClassName);
|
1653
|
+
});
|
1654
|
+
|
1655
|
+
var move = function(from, to) {
|
1656
|
+
/*jshint validthis: true */
|
1657
|
+
this.splice(to, 0, this.splice(from, 1)[0]);
|
1658
|
+
};
|
1659
|
+
|
1660
|
+
var dragOverHandler = function(e) {
|
1661
|
+
e.preventDefault();
|
1662
|
+
|
1663
|
+
var offset = axis === 'vertical' ? e.offsetY || e.layerY || (e.originalEvent ? e.originalEvent.offsetY : 0) : e.offsetX || e.layerX || (e.originalEvent ? e.originalEvent.offsetX : 0);
|
1664
|
+
|
1665
|
+
if (offset < (this[axis === 'vertical' ? 'offsetHeight' : 'offsetWidth'] / 2)) {
|
1666
|
+
element.removeClass(droppingAfterClassName);
|
1667
|
+
element.addClass(droppingBeforeClassName);
|
1668
|
+
|
1669
|
+
} else {
|
1670
|
+
element.removeClass(droppingBeforeClassName);
|
1671
|
+
element.addClass(droppingAfterClassName);
|
1672
|
+
}
|
1673
|
+
};
|
1674
|
+
|
1675
|
+
var dropTimeout;
|
1676
|
+
|
1677
|
+
var dropHandler = function(e) {
|
1678
|
+
e.preventDefault();
|
1679
|
+
|
1680
|
+
var droppedItemIndex = parseInt((e.dataTransfer || e.originalEvent.dataTransfer).getData('text/plain'), 10);
|
1681
|
+
|
1682
|
+
// prevent event firing multiple times in firefox
|
1683
|
+
$timeout.cancel(dropTimeout);
|
1684
|
+
dropTimeout = $timeout(function() {
|
1685
|
+
_dropHandler(droppedItemIndex);
|
1686
|
+
}, 20);
|
1687
|
+
};
|
1688
|
+
|
1689
|
+
var _dropHandler = function(droppedItemIndex) {
|
1690
|
+
var theList = scope.$eval(attrs.uiSelectSort),
|
1691
|
+
itemToMove = theList[droppedItemIndex],
|
1692
|
+
newIndex = null;
|
1693
|
+
|
1694
|
+
if (element.hasClass(droppingBeforeClassName)) {
|
1695
|
+
if (droppedItemIndex < scope.$index) {
|
1696
|
+
newIndex = scope.$index - 1;
|
1697
|
+
} else {
|
1698
|
+
newIndex = scope.$index;
|
1699
|
+
}
|
1700
|
+
} else {
|
1701
|
+
if (droppedItemIndex < scope.$index) {
|
1702
|
+
newIndex = scope.$index;
|
1703
|
+
} else {
|
1704
|
+
newIndex = scope.$index + 1;
|
1705
|
+
}
|
1706
|
+
}
|
1707
|
+
|
1708
|
+
move.apply(theList, [droppedItemIndex, newIndex]);
|
1709
|
+
|
1710
|
+
scope.$apply(function() {
|
1711
|
+
scope.$emit('uiSelectSort:change', {
|
1712
|
+
array: theList,
|
1713
|
+
item: itemToMove,
|
1714
|
+
from: droppedItemIndex,
|
1715
|
+
to: newIndex
|
1716
|
+
});
|
1717
|
+
});
|
1718
|
+
|
1719
|
+
element.removeClass(droppingClassName);
|
1720
|
+
element.removeClass(droppingBeforeClassName);
|
1721
|
+
element.removeClass(droppingAfterClassName);
|
1722
|
+
|
1723
|
+
element.off('drop', dropHandler);
|
1724
|
+
};
|
1725
|
+
|
1726
|
+
element.on('dragenter', function() {
|
1727
|
+
if (element.hasClass(draggingClassName)) {
|
1728
|
+
return;
|
1729
|
+
}
|
1730
|
+
|
1731
|
+
element.addClass(droppingClassName);
|
1732
|
+
|
1733
|
+
element.on('dragover', dragOverHandler);
|
1734
|
+
element.on('drop', dropHandler);
|
1735
|
+
});
|
1736
|
+
|
1737
|
+
element.on('dragleave', function(e) {
|
1738
|
+
if (e.target != element) {
|
1739
|
+
return;
|
1740
|
+
}
|
1741
|
+
element.removeClass(droppingClassName);
|
1742
|
+
element.removeClass(droppingBeforeClassName);
|
1743
|
+
element.removeClass(droppingAfterClassName);
|
1744
|
+
|
1745
|
+
element.off('dragover', dragOverHandler);
|
1746
|
+
element.off('drop', dropHandler);
|
1747
|
+
});
|
1748
|
+
}
|
1749
|
+
};
|
1750
|
+
}]);
|
1751
|
+
|
1752
|
+
/**
|
1753
|
+
* Parses "repeat" attribute.
|
1754
|
+
*
|
1755
|
+
* Taken from AngularJS ngRepeat source code
|
1756
|
+
* See https://github.com/angular/angular.js/blob/v1.2.15/src/ng/directive/ngRepeat.js#L211
|
1757
|
+
*
|
1758
|
+
* Original discussion about parsing "repeat" attribute instead of fully relying on ng-repeat:
|
1759
|
+
* https://github.com/angular-ui/ui-select/commit/5dd63ad#commitcomment-5504697
|
1760
|
+
*/
|
1761
|
+
|
1762
|
+
uis.service('uisRepeatParser', ['uiSelectMinErr','$parse', function(uiSelectMinErr, $parse) {
|
1763
|
+
var self = this;
|
1764
|
+
|
1765
|
+
/**
|
1766
|
+
* Example:
|
1767
|
+
* expression = "address in addresses | filter: {street: $select.search} track by $index"
|
1768
|
+
* itemName = "address",
|
1769
|
+
* source = "addresses | filter: {street: $select.search}",
|
1770
|
+
* trackByExp = "$index",
|
1771
|
+
*/
|
1772
|
+
self.parse = function(expression) {
|
1773
|
+
|
1774
|
+
var match = expression.match(/^\s*(?:([\s\S]+?)\s+as\s+)?([\S]+?)\s+in\s+([\s\S]+?)(?:\s+track\s+by\s+([\s\S]+?))?\s*$/);
|
1775
|
+
|
1776
|
+
if (!match) {
|
1777
|
+
throw uiSelectMinErr('iexp', "Expected expression in form of '_item_ in _collection_[ track by _id_]' but got '{0}'.",
|
1778
|
+
expression);
|
1779
|
+
}
|
1780
|
+
|
1781
|
+
return {
|
1782
|
+
itemName: match[2], // (lhs) Left-hand side,
|
1783
|
+
source: $parse(match[3]),
|
1784
|
+
trackByExp: match[4],
|
1785
|
+
modelMapper: $parse(match[1] || match[2])
|
1786
|
+
};
|
1787
|
+
|
1788
|
+
};
|
1789
|
+
|
1790
|
+
self.getGroupNgRepeatExpression = function() {
|
1791
|
+
return '$group in $select.groups';
|
1792
|
+
};
|
1793
|
+
|
1794
|
+
self.getNgRepeatExpression = function(itemName, source, trackByExp, grouped) {
|
1795
|
+
var expression = itemName + ' in ' + (grouped ? '$group.items' : source);
|
1796
|
+
if (trackByExp) {
|
1797
|
+
expression += ' track by ' + trackByExp;
|
1798
|
+
}
|
1799
|
+
return expression;
|
1800
|
+
};
|
1801
|
+
}]);
|
1802
|
+
|
1803
|
+
}());
|
1804
|
+
angular.module("ui.select").run(["$templateCache", function($templateCache) {$templateCache.put("bootstrap/choices.tpl.html","<ul class=\"ui-select-choices ui-select-choices-content ui-select-dropdown dropdown-menu\" role=\"listbox\" ng-show=\"$select.items.length > 0\"><li class=\"ui-select-choices-group\" id=\"ui-select-choices-{{ $select.generatedId }}\"><div class=\"divider\" ng-show=\"$select.isGrouped && $index > 0\"></div><div ng-show=\"$select.isGrouped\" class=\"ui-select-choices-group-label dropdown-header\" ng-bind=\"$group.name\"></div><div id=\"ui-select-choices-row-{{ $select.generatedId }}-{{$index}}\" class=\"ui-select-choices-row\" ng-class=\"{active: $select.isActive(this), disabled: $select.isDisabled(this)}\" role=\"option\"><a href=\"javascript:void(0)\" class=\"ui-select-choices-row-inner\"></a></div></li></ul>");
|
1805
|
+
$templateCache.put("bootstrap/match-multiple.tpl.html","<span class=\"ui-select-match\"><span ng-repeat=\"$item in $select.selected\"><span class=\"ui-select-match-item btn btn-default btn-xs\" tabindex=\"-1\" type=\"button\" ng-disabled=\"$select.disabled\" ng-click=\"$selectMultiple.activeMatchIndex = $index;\" ng-class=\"{\'btn-primary\':$selectMultiple.activeMatchIndex === $index, \'select-locked\':$select.isLocked(this, $index)}\" ui-select-sort=\"$select.selected\"><span class=\"close ui-select-match-close\" ng-hide=\"$select.disabled\" ng-click=\"$selectMultiple.removeChoice($index)\"> ×</span> <span uis-transclude-append=\"\"></span></span></span></span>");
|
1806
|
+
$templateCache.put("bootstrap/match.tpl.html","<div class=\"ui-select-match\" ng-hide=\"$select.open\" ng-disabled=\"$select.disabled\" ng-class=\"{\'btn-default-focus\':$select.focus}\"><span tabindex=\"-1\" class=\"btn btn-default form-control ui-select-toggle\" aria-label=\"{{ $select.baseTitle }} activate\" ng-disabled=\"$select.disabled\" ng-click=\"$select.activate()\" style=\"outline: 0;\"><span ng-show=\"$select.isEmpty()\" class=\"ui-select-placeholder text-muted\">{{$select.placeholder}}</span> <span ng-hide=\"$select.isEmpty()\" class=\"ui-select-match-text pull-left\" ng-class=\"{\'ui-select-allow-clear\': $select.allowClear && !$select.isEmpty()}\" ng-transclude=\"\"></span> <i class=\"caret pull-right\" ng-click=\"$select.toggle($event)\"></i> <a ng-show=\"$select.allowClear && !$select.isEmpty()\" aria-label=\"{{ $select.baseTitle }} clear\" style=\"margin-right: 10px\" ng-click=\"$select.clear($event)\" class=\"btn btn-xs btn-link pull-right\"><i class=\"glyphicon glyphicon-remove\" aria-hidden=\"true\"></i></a></span></div>");
|
1807
|
+
$templateCache.put("bootstrap/select-multiple.tpl.html","<div class=\"ui-select-container ui-select-multiple ui-select-bootstrap dropdown form-control\" ng-class=\"{open: $select.open}\"><div><div class=\"ui-select-match\"></div><input type=\"text\" autocomplete=\"off\" autocorrect=\"off\" autocapitalize=\"off\" spellcheck=\"false\" class=\"ui-select-search input-xs\" placeholder=\"{{$selectMultiple.getPlaceholder()}}\" ng-disabled=\"$select.disabled\" ng-hide=\"$select.disabled\" ng-click=\"$select.activate()\" ng-model=\"$select.search\" role=\"combobox\" aria-label=\"{{ $select.baseTitle }}\" ondrop=\"return false;\"></div><div class=\"ui-select-choices\"></div></div>");
|
1808
|
+
$templateCache.put("bootstrap/select.tpl.html","<div class=\"ui-select-container ui-select-bootstrap dropdown\" ng-class=\"{open: $select.open}\"><div class=\"ui-select-match\"></div><input type=\"text\" autocomplete=\"off\" tabindex=\"-1\" aria-expanded=\"true\" aria-label=\"{{ $select.baseTitle }}\" aria-owns=\"ui-select-choices-{{ $select.generatedId }}\" aria-activedescendant=\"ui-select-choices-row-{{ $select.generatedId }}-{{ $select.activeIndex }}\" class=\"form-control ui-select-search\" placeholder=\"{{$select.placeholder}}\" ng-model=\"$select.search\" ng-show=\"$select.searchEnabled && $select.open\"><div class=\"ui-select-choices\"></div></div>");
|
1809
|
+
$templateCache.put("select2/choices.tpl.html","<ul class=\"ui-select-choices ui-select-choices-content select2-results\"><li class=\"ui-select-choices-group\" ng-class=\"{\'select2-result-with-children\': $select.choiceGrouped($group) }\"><div ng-show=\"$select.choiceGrouped($group)\" class=\"ui-select-choices-group-label select2-result-label\" ng-bind=\"$group.name\"></div><ul role=\"listbox\" id=\"ui-select-choices-{{ $select.generatedId }}\" ng-class=\"{\'select2-result-sub\': $select.choiceGrouped($group), \'select2-result-single\': !$select.choiceGrouped($group) }\"><li role=\"option\" id=\"ui-select-choices-row-{{ $select.generatedId }}-{{$index}}\" class=\"ui-select-choices-row\" ng-class=\"{\'select2-highlighted\': $select.isActive(this), \'select2-disabled\': $select.isDisabled(this)}\"><div class=\"select2-result-label ui-select-choices-row-inner\"></div></li></ul></li></ul>");
|
1810
|
+
$templateCache.put("select2/match-multiple.tpl.html","<span class=\"ui-select-match\"><li class=\"ui-select-match-item select2-search-choice\" ng-repeat=\"$item in $select.selected\" ng-class=\"{\'select2-search-choice-focus\':$selectMultiple.activeMatchIndex === $index, \'select2-locked\':$select.isLocked(this, $index)}\" ui-select-sort=\"$select.selected\"><span uis-transclude-append=\"\"></span> <a href=\"javascript:;\" class=\"ui-select-match-close select2-search-choice-close\" ng-click=\"$selectMultiple.removeChoice($index)\" tabindex=\"-1\"></a></li></span>");
|
1811
|
+
$templateCache.put("select2/match.tpl.html","<a class=\"select2-choice ui-select-match\" ng-class=\"{\'select2-default\': $select.isEmpty()}\" ng-click=\"$select.toggle($event)\" aria-label=\"{{ $select.baseTitle }} select\"><span ng-show=\"$select.isEmpty()\" class=\"select2-chosen\">{{$select.placeholder}}</span> <span ng-hide=\"$select.isEmpty()\" class=\"select2-chosen\" ng-transclude=\"\"></span> <abbr ng-if=\"$select.allowClear && !$select.isEmpty()\" class=\"select2-search-choice-close\" ng-click=\"$select.clear($event)\"></abbr> <span class=\"select2-arrow ui-select-toggle\"><b></b></span></a>");
|
1812
|
+
$templateCache.put("select2/select-multiple.tpl.html","<div class=\"ui-select-container ui-select-multiple select2 select2-container select2-container-multi\" ng-class=\"{\'select2-container-active select2-dropdown-open open\': $select.open, \'select2-container-disabled\': $select.disabled}\"><ul class=\"select2-choices\"><span class=\"ui-select-match\"></span><li class=\"select2-search-field\"><input type=\"text\" autocomplete=\"off\" autocorrect=\"off\" autocapitalize=\"off\" spellcheck=\"false\" role=\"combobox\" aria-expanded=\"true\" aria-owns=\"ui-select-choices-{{ $select.generatedId }}\" aria-label=\"{{ $select.baseTitle }}\" aria-activedescendant=\"ui-select-choices-row-{{ $select.generatedId }}-{{ $select.activeIndex }}\" class=\"select2-input ui-select-search\" placeholder=\"{{$selectMultiple.getPlaceholder()}}\" ng-disabled=\"$select.disabled\" ng-hide=\"$select.disabled\" ng-model=\"$select.search\" ng-click=\"$select.activate()\" style=\"width: 34px;\" ondrop=\"return false;\"></li></ul><div class=\"ui-select-dropdown select2-drop select2-with-searchbox select2-drop-active\" ng-class=\"{\'select2-display-none\': !$select.open}\"><div class=\"ui-select-choices\"></div></div></div>");
|
1813
|
+
$templateCache.put("select2/select.tpl.html","<div class=\"ui-select-container select2 select2-container\" ng-class=\"{\'select2-container-active select2-dropdown-open open\': $select.open, \'select2-container-disabled\': $select.disabled, \'select2-container-active\': $select.focus, \'select2-allowclear\': $select.allowClear && !$select.isEmpty()}\"><div class=\"ui-select-match\"></div><div class=\"ui-select-dropdown select2-drop select2-with-searchbox select2-drop-active\" ng-class=\"{\'select2-display-none\': !$select.open}\"><div class=\"select2-search\" ng-show=\"$select.searchEnabled\"><input type=\"text\" autocomplete=\"off\" autocorrect=\"off\" autocapitalize=\"off\" spellcheck=\"false\" role=\"combobox\" aria-expanded=\"true\" aria-owns=\"ui-select-choices-{{ $select.generatedId }}\" aria-label=\"{{ $select.baseTitle }}\" aria-activedescendant=\"ui-select-choices-row-{{ $select.generatedId }}-{{ $select.activeIndex }}\" class=\"ui-select-search select2-input\" ng-model=\"$select.search\"></div><div class=\"ui-select-choices\"></div></div></div>");
|
1814
|
+
$templateCache.put("selectize/choices.tpl.html","<div ng-show=\"$select.open\" class=\"ui-select-choices ui-select-dropdown selectize-dropdown single\"><div class=\"ui-select-choices-content selectize-dropdown-content\"><div class=\"ui-select-choices-group optgroup\" role=\"listbox\"><div ng-show=\"$select.isGrouped\" class=\"ui-select-choices-group-label optgroup-header\" ng-bind=\"$group.name\"></div><div role=\"option\" class=\"ui-select-choices-row\" ng-class=\"{active: $select.isActive(this), disabled: $select.isDisabled(this)}\"><div class=\"option ui-select-choices-row-inner\" data-selectable=\"\"></div></div></div></div></div>");
|
1815
|
+
$templateCache.put("selectize/match.tpl.html","<div ng-hide=\"($select.open || $select.isEmpty())\" class=\"ui-select-match\" ng-transclude=\"\"></div>");
|
1816
|
+
$templateCache.put("selectize/select.tpl.html","<div class=\"ui-select-container selectize-control single\" ng-class=\"{\'open\': $select.open}\"><div class=\"selectize-input\" ng-class=\"{\'focus\': $select.open, \'disabled\': $select.disabled, \'selectize-focus\' : $select.focus}\" ng-click=\"$select.activate()\"><div class=\"ui-select-match\"></div><input type=\"text\" autocomplete=\"off\" tabindex=\"-1\" class=\"ui-select-search ui-select-toggle\" ng-click=\"$select.toggle($event)\" placeholder=\"{{$select.placeholder}}\" ng-model=\"$select.search\" ng-hide=\"!$select.searchEnabled || ($select.selected && !$select.open)\" ng-disabled=\"$select.disabled\" aria-label=\"{{ $select.baseTitle }}\"></div><div class=\"ui-select-choices\"></div></div>");}]);
|