angular-ui-select-rails 0.9.6 → 0.12.0
Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 384b766116a568686a6b6a657535a1e483a23f82
|
4
|
+
data.tar.gz: 5d7e87f3cf819ad228c5552656d092f136bcea0f
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 9f97468262bffa049c377db920f972a232952cf3d8bea9117431fb6d02aaedbf00cd3db40e5ea19430d649284eff20961f5dc0cc07883e9430629abc58a7e6e7
|
7
|
+
data.tar.gz: 31a1ad4ad4061afcc3efe963799e0ca25322117687f94d525d88711abd09553b24b37e20f76f8b410036734b045040eba8595e6c994a63e643f865318588850b
|
@@ -1,15 +1,15 @@
|
|
1
1
|
/*!
|
2
2
|
* ui-select
|
3
3
|
* http://github.com/angular-ui/ui-select
|
4
|
-
* Version: 0.
|
4
|
+
* Version: 0.12.0 - 2015-05-28T07:44:11.360Z
|
5
5
|
* License: MIT
|
6
6
|
*/
|
7
7
|
|
8
8
|
|
9
|
-
(function () {
|
10
|
-
|
9
|
+
(function () {
|
10
|
+
"use strict";
|
11
11
|
|
12
|
-
|
12
|
+
var KEY = {
|
13
13
|
TAB: 9,
|
14
14
|
ENTER: 13,
|
15
15
|
ESC: 27,
|
@@ -58,847 +58,739 @@
|
|
58
58
|
}
|
59
59
|
};
|
60
60
|
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
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
75
|
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
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
|
+
});
|
90
129
|
}
|
91
|
-
return false;
|
92
130
|
};
|
93
|
-
|
131
|
+
})
|
94
132
|
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
// See Rename minErr and make it accessible from outside https://github.com/angular/angular.js/issues/6913
|
106
|
-
.service('uiSelectMinErr', function() {
|
107
|
-
var minErr = angular.$$minErr('ui.select');
|
108
|
-
return function() {
|
109
|
-
var error = minErr.apply(this, arguments);
|
110
|
-
var message = error.message.replace(new RegExp('\nhttp://errors.angularjs.org/.*'), '');
|
111
|
-
return new Error(message);
|
112
|
-
};
|
113
|
-
})
|
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
|
+
}
|
114
143
|
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
* See https://github.com/angular/angular.js/blob/v1.2.15/src/ng/directive/ngRepeat.js#L211
|
120
|
-
*
|
121
|
-
* Original discussion about parsing "repeat" attribute instead of fully relying on ng-repeat:
|
122
|
-
* https://github.com/angular-ui/ui-select/commit/5dd63ad#commitcomment-5504697
|
123
|
-
*/
|
124
|
-
.service('RepeatParser', ['uiSelectMinErr','$parse', function(uiSelectMinErr, $parse) {
|
125
|
-
var self = this;
|
126
|
-
|
127
|
-
/**
|
128
|
-
* Example:
|
129
|
-
* expression = "address in addresses | filter: {street: $select.search} track by $index"
|
130
|
-
* itemName = "address",
|
131
|
-
* source = "addresses | filter: {street: $select.search}",
|
132
|
-
* trackByExp = "$index",
|
133
|
-
*/
|
134
|
-
self.parse = function(expression) {
|
135
|
-
|
136
|
-
var match = expression.match(/^\s*(?:([\s\S]+?)\s+as\s+)?([\S]+?)\s+in\s+([\s\S]+?)(?:\s+track\s+by\s+([\s\S]+?))?\s*$/);
|
137
|
-
|
138
|
-
if (!match) {
|
139
|
-
throw uiSelectMinErr('iexp', "Expected expression in form of '_item_ in _collection_[ track by _id_]' but got '{0}'.",
|
140
|
-
expression);
|
141
|
-
}
|
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
|
+
})
|
142
148
|
|
143
|
-
|
144
|
-
|
145
|
-
|
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) {
|
149
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)
|
150
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
|
+
},
|
151
184
|
|
152
|
-
|
153
|
-
return '$group in $select.groups';
|
154
|
-
};
|
185
|
+
compile: function(tElement, tAttrs) {
|
155
186
|
|
156
|
-
|
157
|
-
var expression = itemName + ' in ' + (grouped ? '$group.items' : source);
|
158
|
-
if (trackByExp) {
|
159
|
-
expression += ' track by ' + trackByExp;
|
160
|
-
}
|
161
|
-
return expression;
|
162
|
-
};
|
163
|
-
}])
|
187
|
+
if (!tAttrs.repeat) throw uiSelectMinErr('repeat', "Expected 'repeat' expression.");
|
164
188
|
|
165
|
-
|
166
|
-
* Contains ui-select "intelligence".
|
167
|
-
*
|
168
|
-
* The goal is to limit dependency on the DOM whenever possible and
|
169
|
-
* put as much logic in the controller (instead of the link functions) as possible so it can be easily tested.
|
170
|
-
*/
|
171
|
-
.controller('uiSelectCtrl',
|
172
|
-
['$scope', '$element', '$timeout', '$filter', 'RepeatParser', 'uiSelectMinErr', 'uiSelectConfig',
|
173
|
-
function($scope, $element, $timeout, $filter, RepeatParser, uiSelectMinErr, uiSelectConfig) {
|
189
|
+
return function link(scope, element, attrs, $select, transcludeFn) {
|
174
190
|
|
175
|
-
|
191
|
+
// var repeat = RepeatParser.parse(attrs.repeat);
|
192
|
+
var groupByExp = attrs.groupBy;
|
193
|
+
var groupFilterExp = attrs.groupFilter;
|
176
194
|
|
177
|
-
|
195
|
+
$select.parseRepeatAttr(attrs.repeat, groupByExp, groupFilterExp); //Result ready at $select.parserResult
|
178
196
|
|
179
|
-
|
180
|
-
|
181
|
-
ctrl.activeIndex = 0;
|
182
|
-
ctrl.activeMatchIndex = -1;
|
183
|
-
ctrl.items = [];
|
184
|
-
ctrl.selected = undefined;
|
185
|
-
ctrl.open = false;
|
186
|
-
ctrl.focus = false;
|
187
|
-
ctrl.focusser = undefined; //Reference to input element used to handle focus events
|
188
|
-
ctrl.disabled = undefined; // Initialized inside uiSelect directive link function
|
189
|
-
ctrl.searchEnabled = undefined; // Initialized inside uiSelect directive link function
|
190
|
-
ctrl.resetSearchInput = undefined; // Initialized inside uiSelect directive link function
|
191
|
-
ctrl.refreshDelay = undefined; // Initialized inside uiSelectChoices directive link function
|
192
|
-
ctrl.multiple = false; // Initialized inside uiSelect directive link function
|
193
|
-
ctrl.disableChoiceExpression = undefined; // Initialized inside uiSelect directive link function
|
194
|
-
ctrl.tagging = {isActivated: false, fct: undefined};
|
195
|
-
ctrl.taggingTokens = {isActivated: false, tokens: undefined};
|
196
|
-
ctrl.lockChoiceExpression = undefined; // Initialized inside uiSelect directive link function
|
197
|
-
ctrl.closeOnSelect = true; // Initialized inside uiSelect directive link function
|
198
|
-
ctrl.clickTriggeredSelect = false;
|
199
|
-
ctrl.$filter = $filter;
|
200
|
-
|
201
|
-
ctrl.isEmpty = function() {
|
202
|
-
return angular.isUndefined(ctrl.selected) || ctrl.selected === null || ctrl.selected === '';
|
203
|
-
};
|
197
|
+
$select.disableChoiceExpression = attrs.uiDisableChoice;
|
198
|
+
$select.onHighlightCallback = attrs.onHighlight;
|
204
199
|
|
205
|
-
|
206
|
-
|
207
|
-
|
208
|
-
|
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
|
+
}
|
209
205
|
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
ctrl.search = EMPTY_SEARCH;
|
214
|
-
//reset activeIndex
|
215
|
-
if (ctrl.selected && ctrl.items.length && !ctrl.multiple) {
|
216
|
-
ctrl.activeIndex = ctrl.items.indexOf(ctrl.selected);
|
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);
|
217
209
|
}
|
218
|
-
}
|
219
|
-
}
|
220
210
|
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
ctrl.focusser.prop('disabled', true); //Will reactivate it on .close()
|
226
|
-
ctrl.open = true;
|
227
|
-
ctrl.activeMatchIndex = -1;
|
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)');
|
228
215
|
|
229
|
-
|
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
|
230
219
|
|
231
|
-
//
|
232
|
-
// that where first option is auto-selected
|
233
|
-
if ( ctrl.activeIndex === -1 && ctrl.taggingLabel !== false ) {
|
234
|
-
ctrl.activeIndex = 0;
|
235
|
-
}
|
220
|
+
$compile(element, transcludeFn)(scope); //Passing current transcludeFn to be able to append elements correctly from uisTranscludeAppend
|
236
221
|
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
|
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);
|
241
226
|
});
|
242
|
-
}
|
243
|
-
};
|
244
227
|
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
};
|
250
|
-
|
251
|
-
ctrl.parseRepeatAttr = function(repeatAttr, groupByExp) {
|
252
|
-
function updateGroups(items) {
|
253
|
-
ctrl.groups = [];
|
254
|
-
angular.forEach(items, function(item) {
|
255
|
-
var groupFn = $scope.$eval(groupByExp);
|
256
|
-
var groupName = angular.isFunction(groupFn) ? groupFn(item) : item[groupFn];
|
257
|
-
var group = ctrl.findGroupByName(groupName);
|
258
|
-
if(group) {
|
259
|
-
group.items.push(item);
|
260
|
-
}
|
261
|
-
else {
|
262
|
-
ctrl.groups.push({name: groupName, items: [item]});
|
263
|
-
}
|
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;
|
264
232
|
});
|
265
|
-
|
266
|
-
|
267
|
-
|
268
|
-
|
269
|
-
|
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
|
+
};
|
270
287
|
|
271
|
-
|
272
|
-
|
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);
|
273
295
|
}
|
296
|
+
}
|
297
|
+
}
|
274
298
|
|
275
|
-
|
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
|
+
}
|
276
310
|
|
277
|
-
|
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();
|
278
315
|
|
279
|
-
|
280
|
-
ctrl.itemProperty = ctrl.parserResult.itemName;
|
316
|
+
$scope.$broadcast('uis:activate');
|
281
317
|
|
282
|
-
|
283
|
-
$scope.$watchCollection(ctrl.parserResult.source, function(items) {
|
318
|
+
ctrl.open = true;
|
284
319
|
|
285
|
-
|
286
|
-
// If the user specifies undefined or null => reset the collection
|
287
|
-
// Special case: items can be undefined if the user did not initialized the collection on the scope
|
288
|
-
// i.e $scope.addresses = [] is missing
|
289
|
-
ctrl.items = [];
|
290
|
-
} else {
|
291
|
-
if (!angular.isArray(items)) {
|
292
|
-
throw uiSelectMinErr('items', "Expected an array but got '{0}'.", items);
|
293
|
-
} else {
|
294
|
-
if (ctrl.multiple){
|
295
|
-
//Remove already selected items (ex: while searching)
|
296
|
-
var filteredItems = items.filter(function(i) {return ctrl.selected.indexOf(i) < 0;});
|
297
|
-
setItemsFn(filteredItems);
|
298
|
-
}else{
|
299
|
-
setItemsFn(items);
|
300
|
-
}
|
301
|
-
ctrl.ngModel.$modelValue = null; //Force scope model value and ngModel value to be out of sync to re-run formatters
|
320
|
+
ctrl.activeIndex = ctrl.activeIndex >= ctrl.items.length ? 0 : ctrl.activeIndex;
|
302
321
|
|
303
|
-
|
304
|
-
|
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
|
+
}
|
305
327
|
|
328
|
+
// Give it time to appear before focus
|
329
|
+
$timeout(function() {
|
330
|
+
ctrl.search = initSearchValue || ctrl.search;
|
331
|
+
ctrl.searchInput[0].focus();
|
306
332
|
});
|
333
|
+
}
|
334
|
+
};
|
307
335
|
|
308
|
-
|
309
|
-
|
310
|
-
|
311
|
-
|
312
|
-
|
313
|
-
|
314
|
-
|
315
|
-
|
316
|
-
|
317
|
-
|
318
|
-
|
319
|
-
|
320
|
-
|
321
|
-
|
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
|
+
}
|
322
363
|
}
|
364
|
+
ctrl.items = [];
|
365
|
+
ctrl.groups.forEach(function(group) {
|
366
|
+
ctrl.items = ctrl.items.concat(group.items);
|
367
|
+
});
|
368
|
+
}
|
323
369
|
|
324
|
-
|
370
|
+
function setPlainItems(items) {
|
371
|
+
ctrl.items = items;
|
372
|
+
}
|
373
|
+
|
374
|
+
ctrl.setItemsFn = groupByExp ? updateGroups : setPlainItems;
|
325
375
|
|
326
|
-
|
327
|
-
|
328
|
-
|
329
|
-
|
330
|
-
|
331
|
-
|
332
|
-
|
333
|
-
|
334
|
-
|
335
|
-
|
336
|
-
|
337
|
-
|
338
|
-
|
339
|
-
|
340
|
-
|
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);
|
341
391
|
}
|
342
|
-
_refreshDelayPromise = $timeout(function() {
|
343
|
-
$scope.$eval(refreshAttr);
|
344
|
-
}, ctrl.refreshDelay);
|
345
392
|
}
|
346
393
|
};
|
347
394
|
|
348
|
-
|
349
|
-
|
350
|
-
|
351
|
-
|
352
|
-
|
353
|
-
|
354
|
-
|
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
|
+
}
|
355
411
|
}
|
356
|
-
|
357
|
-
var isActive = itemIndex === ctrl.activeIndex;
|
412
|
+
});
|
358
413
|
|
359
|
-
|
360
|
-
|
361
|
-
|
414
|
+
};
|
415
|
+
|
416
|
+
var _refreshDelayPromise;
|
362
417
|
|
363
|
-
|
364
|
-
|
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);
|
365
431
|
}
|
432
|
+
_refreshDelayPromise = $timeout(function() {
|
433
|
+
$scope.$eval(refreshAttr);
|
434
|
+
}, ctrl.refreshDelay);
|
435
|
+
}
|
436
|
+
};
|
366
437
|
|
367
|
-
|
368
|
-
|
438
|
+
ctrl.setActiveItem = function(item) {
|
439
|
+
ctrl.activeIndex = ctrl.items.indexOf(item);
|
440
|
+
};
|
369
441
|
|
370
|
-
|
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;
|
371
448
|
|
372
|
-
|
449
|
+
if ( !isActive || ( itemIndex < 0 && ctrl.taggingLabel !== false ) ||( itemIndex < 0 && ctrl.taggingLabel === false) ) {
|
450
|
+
return false;
|
451
|
+
}
|
373
452
|
|
374
|
-
|
375
|
-
|
376
|
-
|
453
|
+
if (isActive && !angular.isUndefined(ctrl.onHighlightCallback)) {
|
454
|
+
itemScope.$eval(ctrl.onHighlightCallback);
|
455
|
+
}
|
377
456
|
|
378
|
-
|
379
|
-
|
380
|
-
isDisabled = !!(itemScope.$eval(ctrl.disableChoiceExpression)); // force the boolean value
|
381
|
-
item._uiSelectChoiceDisabled = isDisabled; // store this for later reference
|
382
|
-
}
|
457
|
+
return isActive;
|
458
|
+
};
|
383
459
|
|
384
|
-
|
385
|
-
};
|
460
|
+
ctrl.isDisabled = function(itemScope) {
|
386
461
|
|
462
|
+
if (!ctrl.open) return;
|
387
463
|
|
388
|
-
|
389
|
-
|
390
|
-
|
464
|
+
var itemIndex = ctrl.items.indexOf(itemScope[ctrl.itemProperty]);
|
465
|
+
var isDisabled = false;
|
466
|
+
var item;
|
391
467
|
|
392
|
-
|
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
|
+
}
|
393
473
|
|
394
|
-
|
395
|
-
|
396
|
-
|
397
|
-
|
398
|
-
|
399
|
-
|
400
|
-
|
401
|
-
|
402
|
-
|
403
|
-
|
404
|
-
|
405
|
-
|
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;
|
406
492
|
}
|
407
493
|
} else {
|
408
|
-
//
|
409
|
-
|
410
|
-
if ( ctrl.activeIndex === 0 ) {
|
411
|
-
// ctrl.tagging pushes items to ctrl.items, so we only have empty val
|
412
|
-
// for `item` if it is a detected duplicate
|
413
|
-
if ( item === undefined ) return;
|
414
|
-
|
415
|
-
// create new item on the fly if we don't already have one;
|
416
|
-
// use tagging function if we have one
|
417
|
-
if ( ctrl.tagging.fct !== undefined && typeof item === 'string' ) {
|
418
|
-
item = ctrl.tagging.fct(ctrl.search);
|
419
|
-
// if item type is 'string', apply the tagging label
|
420
|
-
} else if ( typeof item === 'string' ) {
|
421
|
-
item = item.replace(ctrl.taggingLabel,'');
|
422
|
-
}
|
423
|
-
}
|
494
|
+
// keyboard nav happened first, user selected from dropdown
|
495
|
+
item = ctrl.items[ctrl.activeIndex];
|
424
496
|
}
|
425
|
-
|
426
|
-
|
427
|
-
|
428
|
-
|
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
|
+
}
|
429
515
|
}
|
430
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
|
+
}
|
431
523
|
|
432
|
-
|
433
|
-
locals[ctrl.parserResult.itemName] = item;
|
524
|
+
$scope.$broadcast('uis:select', item);
|
434
525
|
|
435
|
-
|
436
|
-
|
437
|
-
ctrl.sizeSearchInput();
|
438
|
-
} else {
|
439
|
-
ctrl.selected = item;
|
440
|
-
}
|
526
|
+
var locals = {};
|
527
|
+
locals[ctrl.parserResult.itemName] = item;
|
441
528
|
|
529
|
+
$timeout(function(){
|
442
530
|
ctrl.onSelectCallback($scope, {
|
443
|
-
|
444
|
-
|
531
|
+
$item: item,
|
532
|
+
$model: ctrl.parserResult.modelMapper($scope, locals)
|
445
533
|
});
|
534
|
+
});
|
446
535
|
|
447
|
-
|
448
|
-
|
449
|
-
|
450
|
-
|
451
|
-
|
452
|
-
}
|
536
|
+
if (ctrl.closeOnSelect) {
|
537
|
+
ctrl.close(skipFocusser);
|
538
|
+
}
|
539
|
+
if ($event && $event.type === 'click') {
|
540
|
+
ctrl.clickTriggeredSelect = true;
|
453
541
|
}
|
454
542
|
}
|
455
|
-
}
|
456
|
-
|
457
|
-
// Closes the dropdown
|
458
|
-
ctrl.close = function(skipFocusser) {
|
459
|
-
if (!ctrl.open) return;
|
460
|
-
_resetSearchInput();
|
461
|
-
ctrl.open = false;
|
462
|
-
if (!ctrl.multiple){
|
463
|
-
$timeout(function(){
|
464
|
-
ctrl.focusser.prop('disabled', false);
|
465
|
-
if (!skipFocusser) ctrl.focusser[0].focus();
|
466
|
-
},0,false);
|
467
|
-
}
|
468
|
-
};
|
469
|
-
|
470
|
-
// Toggle dropdown
|
471
|
-
ctrl.toggle = function(e) {
|
472
|
-
if (ctrl.open) {
|
473
|
-
ctrl.close();
|
474
|
-
e.preventDefault();
|
475
|
-
e.stopPropagation();
|
476
|
-
} else {
|
477
|
-
ctrl.activate();
|
478
|
-
}
|
479
|
-
};
|
543
|
+
}
|
544
|
+
};
|
480
545
|
|
481
|
-
|
482
|
-
|
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;
|
483
552
|
|
484
|
-
|
485
|
-
isLocked = !!(itemScope.$eval(ctrl.lockChoiceExpression)); // force the boolean value
|
486
|
-
item._uiSelectChoiceLocked = isLocked; // store this for later reference
|
487
|
-
}
|
553
|
+
$scope.$broadcast('uis:close', skipFocusser);
|
488
554
|
|
489
|
-
|
490
|
-
};
|
555
|
+
};
|
491
556
|
|
492
|
-
|
493
|
-
ctrl.
|
494
|
-
|
557
|
+
ctrl.setFocus = function(){
|
558
|
+
if (!ctrl.focus) ctrl.focusInput[0].focus();
|
559
|
+
};
|
495
560
|
|
496
|
-
|
497
|
-
|
561
|
+
ctrl.clear = function($event) {
|
562
|
+
ctrl.select(undefined);
|
563
|
+
$event.stopPropagation();
|
564
|
+
$timeout(function() {
|
565
|
+
ctrl.focusser[0].focus();
|
566
|
+
}, 0, false);
|
567
|
+
};
|
498
568
|
|
499
|
-
|
500
|
-
|
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
|
+
};
|
501
579
|
|
502
|
-
|
503
|
-
|
504
|
-
ctrl.sizeSearchInput();
|
580
|
+
ctrl.isLocked = function(itemScope, itemIndex) {
|
581
|
+
var isLocked, item = ctrl.selected[itemIndex];
|
505
582
|
|
506
|
-
ctrl.
|
507
|
-
|
508
|
-
|
509
|
-
}
|
510
|
-
};
|
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
|
+
}
|
511
587
|
|
512
|
-
|
513
|
-
|
514
|
-
if(ctrl.multiple && ctrl.selected.length) return;
|
515
|
-
return ctrl.placeholder;
|
516
|
-
};
|
588
|
+
return isLocked;
|
589
|
+
};
|
517
590
|
|
518
|
-
|
519
|
-
|
520
|
-
|
521
|
-
|
522
|
-
|
523
|
-
|
524
|
-
|
525
|
-
|
526
|
-
|
527
|
-
|
528
|
-
|
529
|
-
|
530
|
-
|
531
|
-
|
532
|
-
|
533
|
-
|
534
|
-
|
535
|
-
|
536
|
-
});
|
537
|
-
}else if (!containerSizeWatch) {
|
538
|
-
calculate();
|
539
|
-
}
|
540
|
-
}, 0, false);
|
541
|
-
};
|
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
|
+
};
|
542
609
|
|
543
|
-
|
544
|
-
|
545
|
-
|
546
|
-
|
547
|
-
if (
|
548
|
-
|
549
|
-
|
550
|
-
case KEY.UP:
|
551
|
-
if (!ctrl.open && ctrl.multiple) ctrl.activate(false, true); //In case its the search input in 'multiple' mode
|
552
|
-
else if (ctrl.activeIndex > 0 || (ctrl.search.length === 0 && ctrl.tagging.isActivated)) { ctrl.activeIndex--; }
|
553
|
-
break;
|
554
|
-
case KEY.TAB:
|
555
|
-
if (!ctrl.multiple || ctrl.open) ctrl.select(ctrl.items[ctrl.activeIndex], true);
|
556
|
-
break;
|
557
|
-
case KEY.ENTER:
|
558
|
-
if(ctrl.open){
|
559
|
-
ctrl.select(ctrl.items[ctrl.activeIndex]);
|
560
|
-
} else {
|
561
|
-
ctrl.activate(false, true); //In case its the search input in 'multiple' mode
|
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;
|
562
617
|
}
|
563
|
-
|
564
|
-
case KEY.ESC:
|
565
|
-
ctrl.close();
|
566
|
-
break;
|
567
|
-
default:
|
568
|
-
processed = false;
|
618
|
+
});
|
569
619
|
}
|
570
|
-
|
571
|
-
|
572
|
-
|
573
|
-
// Handles selected options in "multiple" mode
|
574
|
-
function _handleMatchSelection(key){
|
575
|
-
var caretPosition = _getCaretPosition(_searchInput[0]),
|
576
|
-
length = ctrl.selected.length,
|
577
|
-
// none = -1,
|
578
|
-
first = 0,
|
579
|
-
last = length-1,
|
580
|
-
curr = ctrl.activeMatchIndex,
|
581
|
-
next = ctrl.activeMatchIndex+1,
|
582
|
-
prev = ctrl.activeMatchIndex-1,
|
583
|
-
newIndex = curr;
|
584
|
-
|
585
|
-
if(caretPosition > 0 || (ctrl.search.length && key == KEY.RIGHT)) return false;
|
586
|
-
|
587
|
-
ctrl.close();
|
620
|
+
});
|
621
|
+
};
|
588
622
|
|
589
|
-
|
590
|
-
|
591
|
-
|
592
|
-
|
593
|
-
|
594
|
-
|
595
|
-
|
596
|
-
|
597
|
-
|
598
|
-
|
599
|
-
|
600
|
-
|
601
|
-
|
602
|
-
|
603
|
-
|
604
|
-
|
605
|
-
|
606
|
-
|
607
|
-
|
608
|
-
if(~ctrl.activeMatchIndex){
|
609
|
-
ctrl.removeChoice(curr);
|
610
|
-
return prev;
|
611
|
-
}
|
612
|
-
// Select last item
|
613
|
-
else return last;
|
614
|
-
break;
|
615
|
-
case KEY.DELETE:
|
616
|
-
// Remove selected item and select next item
|
617
|
-
if(~ctrl.activeMatchIndex){
|
618
|
-
ctrl.removeChoice(ctrl.activeMatchIndex);
|
619
|
-
return curr;
|
620
|
-
}
|
621
|
-
else return false;
|
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
|
622
642
|
}
|
623
|
-
|
624
|
-
|
625
|
-
|
626
|
-
|
627
|
-
|
628
|
-
|
629
|
-
|
630
|
-
return true;
|
643
|
+
break;
|
644
|
+
case KEY.ESC:
|
645
|
+
ctrl.close();
|
646
|
+
break;
|
647
|
+
default:
|
648
|
+
processed = false;
|
631
649
|
}
|
650
|
+
return processed;
|
651
|
+
}
|
632
652
|
|
633
|
-
|
634
|
-
|
653
|
+
// Bind to keyboard shortcuts
|
654
|
+
ctrl.searchInput.on('keydown', function(e) {
|
635
655
|
|
636
|
-
|
656
|
+
var key = e.which;
|
637
657
|
|
638
|
-
|
639
|
-
|
640
|
-
|
641
|
-
|
658
|
+
// if(~[KEY.ESC,KEY.TAB].indexOf(key)){
|
659
|
+
// //TODO: SEGURO?
|
660
|
+
// ctrl.close();
|
661
|
+
// }
|
642
662
|
|
643
|
-
|
644
|
-
var processed = false;
|
645
|
-
var tagged = false;
|
663
|
+
$scope.$apply(function() {
|
646
664
|
|
647
|
-
|
648
|
-
processed = _handleMatchSelection(key);
|
649
|
-
}
|
665
|
+
var tagged = false;
|
650
666
|
|
651
|
-
|
652
|
-
|
653
|
-
|
654
|
-
|
655
|
-
|
656
|
-
|
657
|
-
|
658
|
-
|
659
|
-
}
|
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;
|
660
675
|
}
|
661
676
|
}
|
662
|
-
|
663
|
-
|
664
|
-
|
665
|
-
|
666
|
-
|
667
|
-
|
668
|
-
|
669
|
-
|
670
|
-
|
671
|
-
}
|
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
|
+
});
|
672
687
|
}
|
673
688
|
}
|
674
|
-
|
675
|
-
if (processed && key != KEY.TAB) {
|
676
|
-
//TODO Check si el tab selecciona aun correctamente
|
677
|
-
//Crear test
|
678
|
-
e.preventDefault();
|
679
|
-
e.stopPropagation();
|
680
|
-
}
|
681
|
-
});
|
682
|
-
|
683
|
-
if(KEY.isVerticalMovement(key) && ctrl.items.length > 0){
|
684
|
-
_ensureHighlightVisible();
|
685
689
|
}
|
686
690
|
|
687
691
|
});
|
688
692
|
|
689
|
-
|
690
|
-
|
691
|
-
|
692
|
-
ctrl.activeIndex = ctrl.taggingLabel === false ? -1 : 0;
|
693
|
-
});
|
694
|
-
}
|
695
|
-
// Push a "create new" item into array if there is a search string
|
696
|
-
if ( ctrl.tagging.isActivated && ctrl.search.length > 0 ) {
|
693
|
+
if(KEY.isVerticalMovement(key) && ctrl.items.length > 0){
|
694
|
+
_ensureHighlightVisible();
|
695
|
+
}
|
697
696
|
|
698
|
-
|
699
|
-
|
700
|
-
|
701
|
-
|
702
|
-
|
703
|
-
|
704
|
-
|
705
|
-
|
706
|
-
|
707
|
-
|
708
|
-
|
709
|
-
|
710
|
-
|
711
|
-
|
712
|
-
|
713
|
-
|
714
|
-
|
715
|
-
|
716
|
-
// case for object tagging via transform `ctrl.tagging.fct` function
|
717
|
-
if ( ctrl.tagging.fct !== undefined) {
|
718
|
-
tagItems = ctrl.$filter('filter')(items,{'isTag': true});
|
719
|
-
if ( tagItems.length > 0 ) {
|
720
|
-
tagItem = tagItems[0];
|
721
|
-
}
|
722
|
-
// remove the first element, if it has the `isTag` prop we generate a new one with each keyup, shaving the previous
|
723
|
-
if ( items.length > 0 && tagItem ) {
|
724
|
-
hasTag = true;
|
725
|
-
items = items.slice(1,items.length);
|
726
|
-
stashArr = stashArr.slice(1,stashArr.length);
|
727
|
-
}
|
728
|
-
newItem = ctrl.tagging.fct(ctrl.search);
|
729
|
-
newItem.isTag = true;
|
730
|
-
// verify the the tag doesn't match the value of an existing item
|
731
|
-
if ( stashArr.filter( function (origItem) { return angular.equals( origItem, ctrl.tagging.fct(ctrl.search) ); } ).length > 0 ) {
|
732
|
-
return;
|
733
|
-
}
|
734
|
-
// handle newItem string and stripping dupes in tagging string context
|
735
|
-
} else {
|
736
|
-
// find any tagging items already in the ctrl.items array and store them
|
737
|
-
tagItems = ctrl.$filter('filter')(items,function (item) {
|
738
|
-
return item.match(ctrl.taggingLabel);
|
739
|
-
});
|
740
|
-
if ( tagItems.length > 0 ) {
|
741
|
-
tagItem = tagItems[0];
|
742
|
-
}
|
743
|
-
item = items[0];
|
744
|
-
// remove existing tag item if found (should only ever be one tag item)
|
745
|
-
if ( item !== undefined && items.length > 0 && tagItem ) {
|
746
|
-
hasTag = true;
|
747
|
-
items = items.slice(1,items.length);
|
748
|
-
stashArr = stashArr.slice(1,stashArr.length);
|
749
|
-
}
|
750
|
-
newItem = ctrl.search+' '+ctrl.taggingLabel;
|
751
|
-
if ( _findApproxDupe(ctrl.selected, ctrl.search) > -1 ) {
|
752
|
-
return;
|
753
|
-
}
|
754
|
-
// verify the the tag doesn't match the value of an existing item from
|
755
|
-
// the searched data set or the items already selected
|
756
|
-
if ( _findCaseInsensitiveDupe(stashArr.concat(ctrl.selected)) ) {
|
757
|
-
// if there is a tag from prev iteration, strip it / queue the change
|
758
|
-
// and return early
|
759
|
-
if ( hasTag ) {
|
760
|
-
items = stashArr;
|
761
|
-
$scope.$evalAsync( function () {
|
762
|
-
ctrl.activeIndex = 0;
|
763
|
-
ctrl.items = items;
|
764
|
-
});
|
765
|
-
}
|
766
|
-
return;
|
767
|
-
}
|
768
|
-
if ( _findCaseInsensitiveDupe(stashArr) ) {
|
769
|
-
// if there is a tag from prev iteration, strip it
|
770
|
-
if ( hasTag ) {
|
771
|
-
ctrl.items = stashArr.slice(1,stashArr.length);
|
772
|
-
}
|
773
|
-
return;
|
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);
|
774
714
|
}
|
775
|
-
}
|
776
|
-
if ( hasTag ) dupeIndex = _findApproxDupe(ctrl.selected, newItem);
|
777
|
-
// dupe found, shave the first item
|
778
|
-
if ( dupeIndex > -1 ) {
|
779
|
-
items = items.slice(dupeIndex+1,items.length-1);
|
780
|
-
} else {
|
781
|
-
items = [];
|
782
|
-
items.push(newItem);
|
783
|
-
items = items.concat(stashArr);
|
784
|
-
}
|
785
|
-
$scope.$evalAsync( function () {
|
786
|
-
ctrl.activeIndex = 0;
|
787
|
-
ctrl.items = items;
|
788
715
|
});
|
716
|
+
e.preventDefault();
|
717
|
+
e.stopPropagation();
|
789
718
|
}
|
719
|
+
}
|
720
|
+
});
|
721
|
+
|
722
|
+
ctrl.searchInput.on('tagged', function() {
|
723
|
+
$timeout(function() {
|
724
|
+
_resetSearchInput();
|
790
725
|
});
|
726
|
+
});
|
791
727
|
|
792
|
-
|
793
|
-
|
794
|
-
|
795
|
-
|
796
|
-
|
797
|
-
|
798
|
-
_searchInput.on('blur', function() {
|
799
|
-
$timeout(function() {
|
800
|
-
ctrl.activeMatchIndex = -1;
|
801
|
-
});
|
802
|
-
});
|
803
|
-
|
804
|
-
function _findCaseInsensitiveDupe(arr) {
|
805
|
-
if ( arr === undefined || ctrl.search === undefined ) {
|
806
|
-
return false;
|
807
|
-
}
|
808
|
-
var hasDupe = arr.filter( function (origItem) {
|
809
|
-
if ( ctrl.search.toUpperCase() === undefined ) {
|
810
|
-
return false;
|
811
|
-
}
|
812
|
-
return origItem.toUpperCase() === ctrl.search.toUpperCase();
|
813
|
-
}).length > 0;
|
814
|
-
|
815
|
-
return hasDupe;
|
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);
|
816
734
|
}
|
817
735
|
|
818
|
-
|
819
|
-
|
820
|
-
var dupeIndex = -1;
|
821
|
-
for (var i = 0; i <tempArr.length; i++) {
|
822
|
-
// handle the simple string version of tagging
|
823
|
-
if ( ctrl.tagging.fct === undefined ) {
|
824
|
-
// search the array for the match
|
825
|
-
if ( tempArr[i]+' '+ctrl.taggingLabel === needle ) {
|
826
|
-
dupeIndex = i;
|
827
|
-
}
|
828
|
-
// handle the object tagging implementation
|
829
|
-
} else {
|
830
|
-
var mockObj = tempArr[i];
|
831
|
-
mockObj.isTag = true;
|
832
|
-
if ( angular.equals(mockObj, needle) ) {
|
833
|
-
dupeIndex = i;
|
834
|
-
}
|
835
|
-
}
|
836
|
-
}
|
837
|
-
return dupeIndex;
|
736
|
+
if (ctrl.activeIndex < 0) {
|
737
|
+
return;
|
838
738
|
}
|
839
739
|
|
840
|
-
|
841
|
-
|
842
|
-
|
843
|
-
|
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;
|
844
751
|
}
|
752
|
+
}
|
845
753
|
|
846
|
-
|
847
|
-
|
848
|
-
|
849
|
-
var choices = container.querySelectorAll('.ui-select-choices-row');
|
850
|
-
if (choices.length < 1) {
|
851
|
-
throw uiSelectMinErr('choices', "Expected multiple .ui-select-choices-row but got '{0}'.", choices.length);
|
852
|
-
}
|
754
|
+
$scope.$on('$destroy', function() {
|
755
|
+
ctrl.searchInput.off('keyup keydown tagged blur paste');
|
756
|
+
});
|
853
757
|
|
854
|
-
|
855
|
-
var posY = highlighted.offsetTop + highlighted.clientHeight - container[0].scrollTop;
|
856
|
-
var height = container[0].offsetHeight;
|
857
|
-
|
858
|
-
if (posY > height) {
|
859
|
-
container[0].scrollTop += posY - height;
|
860
|
-
} else if (posY < highlighted.clientHeight) {
|
861
|
-
if (ctrl.isGrouped && ctrl.activeIndex === 0)
|
862
|
-
container[0].scrollTop = 0; //To make group header visible when going all the way up
|
863
|
-
else
|
864
|
-
container[0].scrollTop -= highlighted.clientHeight - posY;
|
865
|
-
}
|
866
|
-
}
|
758
|
+
}]);
|
867
759
|
|
868
|
-
|
869
|
-
|
870
|
-
|
871
|
-
}])
|
760
|
+
uis.directive('uiSelect',
|
761
|
+
['$document', 'uiSelectConfig', 'uiSelectMinErr', 'uisOffset', '$compile', '$parse', '$timeout',
|
762
|
+
function($document, uiSelectConfig, uiSelectMinErr, uisOffset, $compile, $parse, $timeout) {
|
872
763
|
|
873
|
-
|
874
|
-
|
875
|
-
function(
|
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) {
|
876
786
|
|
877
|
-
return {
|
878
|
-
restrict: 'EA',
|
879
|
-
templateUrl: function(tElement, tAttrs) {
|
880
|
-
var theme = tAttrs.theme || uiSelectConfig.theme;
|
881
|
-
return theme + (angular.isDefined(tAttrs.multiple) ? '/select-multiple.tpl.html' : '/select.tpl.html');
|
882
|
-
},
|
883
|
-
replace: true,
|
884
|
-
transclude: true,
|
885
|
-
require: ['uiSelect', 'ngModel'],
|
886
|
-
scope: true,
|
887
|
-
|
888
|
-
controller: 'uiSelectCtrl',
|
889
|
-
controllerAs: '$select',
|
890
|
-
|
891
|
-
link: function(scope, element, attrs, ctrls, transcludeFn) {
|
892
787
|
var $select = ctrls[0];
|
893
788
|
var ngModel = ctrls[1];
|
894
789
|
|
895
|
-
|
896
|
-
|
897
|
-
$select.
|
898
|
-
|
899
|
-
attrs.multiple.toLowerCase() === 'multiple' ||
|
900
|
-
attrs.multiple.toLowerCase() === 'true'
|
901
|
-
);
|
790
|
+
$select.generatedId = uiSelectConfig.generateId();
|
791
|
+
$select.baseTitle = attrs.title || 'Select box';
|
792
|
+
$select.focusserTitle = $select.baseTitle + ' focus';
|
793
|
+
$select.focusserId = 'focusser-' + $select.generatedId;
|
902
794
|
|
903
795
|
$select.closeOnSelect = function() {
|
904
796
|
if (angular.isDefined(attrs.closeOnSelect)) {
|
@@ -910,73 +802,7 @@
|
|
910
802
|
|
911
803
|
$select.onSelectCallback = $parse(attrs.onSelect);
|
912
804
|
$select.onRemoveCallback = $parse(attrs.onRemove);
|
913
|
-
|
914
|
-
//From view --> model
|
915
|
-
ngModel.$parsers.unshift(function (inputValue) {
|
916
|
-
var locals = {},
|
917
|
-
result;
|
918
|
-
if ($select.multiple){
|
919
|
-
var resultMultiple = [];
|
920
|
-
for (var j = $select.selected.length - 1; j >= 0; j--) {
|
921
|
-
locals = {};
|
922
|
-
locals[$select.parserResult.itemName] = $select.selected[j];
|
923
|
-
result = $select.parserResult.modelMapper(scope, locals);
|
924
|
-
resultMultiple.unshift(result);
|
925
|
-
}
|
926
|
-
return resultMultiple;
|
927
|
-
}else{
|
928
|
-
locals = {};
|
929
|
-
locals[$select.parserResult.itemName] = inputValue;
|
930
|
-
result = $select.parserResult.modelMapper(scope, locals);
|
931
|
-
return result;
|
932
|
-
}
|
933
|
-
});
|
934
|
-
|
935
|
-
//From model --> view
|
936
|
-
ngModel.$formatters.unshift(function (inputValue) {
|
937
|
-
var data = $select.parserResult.source (scope, { $select : {search:''}}), //Overwrite $search
|
938
|
-
locals = {},
|
939
|
-
result;
|
940
|
-
if (data){
|
941
|
-
if ($select.multiple){
|
942
|
-
var resultMultiple = [];
|
943
|
-
var checkFnMultiple = function(list, value){
|
944
|
-
if (!list || !list.length) return;
|
945
|
-
for (var p = list.length - 1; p >= 0; p--) {
|
946
|
-
locals[$select.parserResult.itemName] = list[p];
|
947
|
-
result = $select.parserResult.modelMapper(scope, locals);
|
948
|
-
if (result == value){
|
949
|
-
resultMultiple.unshift(list[p]);
|
950
|
-
return true;
|
951
|
-
}
|
952
|
-
}
|
953
|
-
return false;
|
954
|
-
};
|
955
|
-
if (!inputValue) return resultMultiple; //If ngModel was undefined
|
956
|
-
for (var k = inputValue.length - 1; k >= 0; k--) {
|
957
|
-
if (!checkFnMultiple($select.selected, inputValue[k])){
|
958
|
-
checkFnMultiple(data, inputValue[k]);
|
959
|
-
}
|
960
|
-
}
|
961
|
-
return resultMultiple;
|
962
|
-
}else{
|
963
|
-
var checkFnSingle = function(d){
|
964
|
-
locals[$select.parserResult.itemName] = d;
|
965
|
-
result = $select.parserResult.modelMapper(scope, locals);
|
966
|
-
return result == inputValue;
|
967
|
-
};
|
968
|
-
//If possible pass same object stored in $select.selected
|
969
|
-
if ($select.selected && checkFnSingle($select.selected)) {
|
970
|
-
return $select.selected;
|
971
|
-
}
|
972
|
-
for (var i = data.length - 1; i >= 0; i--) {
|
973
|
-
if (checkFnSingle(data[i])) return data[i];
|
974
|
-
}
|
975
|
-
}
|
976
|
-
}
|
977
|
-
return inputValue;
|
978
|
-
});
|
979
|
-
|
805
|
+
|
980
806
|
//Set reference to ngModel from uiSelectCtrl
|
981
807
|
$select.ngModel = ngModel;
|
982
808
|
|
@@ -984,82 +810,23 @@
|
|
984
810
|
return $select.isGrouped && group && group.name;
|
985
811
|
};
|
986
812
|
|
987
|
-
//Idea from: https://github.com/ivaynberg/select2/blob/79b5bf6db918d7560bdd959109b7bcfb47edaf43/select2.js#L1954
|
988
|
-
var focusser = angular.element("<input ng-disabled='$select.disabled' class='ui-select-focusser ui-select-offscreen' type='text' aria-haspopup='true' role='button' />");
|
989
|
-
|
990
813
|
if(attrs.tabindex){
|
991
|
-
//tabindex might be an expression, wait until it contains the actual value before we set the focusser tabindex
|
992
814
|
attrs.$observe('tabindex', function(value) {
|
993
|
-
|
994
|
-
if($select.multiple){
|
995
|
-
searchInput.attr("tabindex", value);
|
996
|
-
} else {
|
997
|
-
focusser.attr("tabindex", value);
|
998
|
-
}
|
999
|
-
//Remove the tabindex on the parent so that it is not focusable
|
815
|
+
$select.focusInput.attr("tabindex", value);
|
1000
816
|
element.removeAttr("tabindex");
|
1001
817
|
});
|
1002
818
|
}
|
1003
819
|
|
1004
|
-
$compile(focusser)(scope);
|
1005
|
-
$select.focusser = focusser;
|
1006
|
-
|
1007
|
-
if (!$select.multiple){
|
1008
|
-
|
1009
|
-
element.append(focusser);
|
1010
|
-
focusser.bind("focus", function(){
|
1011
|
-
scope.$evalAsync(function(){
|
1012
|
-
$select.focus = true;
|
1013
|
-
});
|
1014
|
-
});
|
1015
|
-
focusser.bind("blur", function(){
|
1016
|
-
scope.$evalAsync(function(){
|
1017
|
-
$select.focus = false;
|
1018
|
-
});
|
1019
|
-
});
|
1020
|
-
focusser.bind("keydown", function(e){
|
1021
|
-
|
1022
|
-
if (e.which === KEY.BACKSPACE) {
|
1023
|
-
e.preventDefault();
|
1024
|
-
e.stopPropagation();
|
1025
|
-
$select.select(undefined);
|
1026
|
-
scope.$apply();
|
1027
|
-
return;
|
1028
|
-
}
|
1029
|
-
|
1030
|
-
if (e.which === KEY.TAB || KEY.isControl(e) || KEY.isFunctionKey(e) || e.which === KEY.ESC) {
|
1031
|
-
return;
|
1032
|
-
}
|
1033
|
-
|
1034
|
-
if (e.which == KEY.DOWN || e.which == KEY.UP || e.which == KEY.ENTER || e.which == KEY.SPACE){
|
1035
|
-
e.preventDefault();
|
1036
|
-
e.stopPropagation();
|
1037
|
-
$select.activate();
|
1038
|
-
}
|
1039
|
-
|
1040
|
-
scope.$digest();
|
1041
|
-
});
|
1042
|
-
|
1043
|
-
focusser.bind("keyup input", function(e){
|
1044
|
-
|
1045
|
-
if (e.which === KEY.TAB || KEY.isControl(e) || KEY.isFunctionKey(e) || e.which === KEY.ESC || e.which == KEY.ENTER || e.which === KEY.BACKSPACE) {
|
1046
|
-
return;
|
1047
|
-
}
|
1048
|
-
|
1049
|
-
$select.activate(focusser.val()); //User pressed some regular key, so we pass it to the search input
|
1050
|
-
focusser.val('');
|
1051
|
-
scope.$digest();
|
1052
|
-
|
1053
|
-
});
|
1054
|
-
|
1055
|
-
}
|
1056
|
-
|
1057
|
-
|
1058
820
|
scope.$watch('searchEnabled', function() {
|
1059
821
|
var searchEnabled = scope.$eval(attrs.searchEnabled);
|
1060
822
|
$select.searchEnabled = searchEnabled !== undefined ? searchEnabled : uiSelectConfig.searchEnabled;
|
1061
823
|
});
|
1062
824
|
|
825
|
+
scope.$watch('sortable', function() {
|
826
|
+
var sortable = scope.$eval(attrs.sortable);
|
827
|
+
$select.sortable = sortable !== undefined ? sortable : uiSelectConfig.sortable;
|
828
|
+
});
|
829
|
+
|
1063
830
|
attrs.$observe('disabled', function() {
|
1064
831
|
// No need to use $eval() (thanks to ng-disabled) since we already get a boolean instead of a string
|
1065
832
|
$select.disabled = attrs.disabled !== undefined ? attrs.disabled : false;
|
@@ -1106,39 +873,25 @@
|
|
1106
873
|
}
|
1107
874
|
});
|
1108
875
|
|
1109
|
-
|
1110
|
-
|
1111
|
-
|
1112
|
-
|
1113
|
-
});
|
1114
|
-
scope.$watchCollection('$select.selected', function() {
|
1115
|
-
ngModel.$setViewValue(Date.now()); //Set timestamp as a unique string to force changes
|
1116
|
-
});
|
1117
|
-
focusser.prop('disabled', true); //Focusser isn't needed if multiple
|
1118
|
-
}else{
|
1119
|
-
scope.$watch('$select.selected', function(newValue) {
|
1120
|
-
if (ngModel.$viewValue !== newValue) {
|
1121
|
-
ngModel.$setViewValue(newValue);
|
1122
|
-
}
|
876
|
+
//Automatically gets focus when loaded
|
877
|
+
if (angular.isDefined(attrs.autofocus)){
|
878
|
+
$timeout(function(){
|
879
|
+
$select.setFocus();
|
1123
880
|
});
|
1124
881
|
}
|
1125
882
|
|
1126
|
-
|
1127
|
-
|
1128
|
-
|
1129
|
-
|
1130
|
-
|
1131
|
-
|
1132
|
-
|
1133
|
-
|
1134
|
-
throw uiSelectMinErr('multiarr', "Expected model value to be array but got '{0}'", ngModel.$viewValue);
|
1135
|
-
}
|
1136
|
-
}
|
1137
|
-
}
|
1138
|
-
$select.selected = ngModel.$viewValue;
|
1139
|
-
};
|
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
|
+
}
|
1140
891
|
|
1141
892
|
function onDocumentClick(e) {
|
893
|
+
if (!$select.open) return; //Skip it if dropdown is close
|
894
|
+
|
1142
895
|
var contains = false;
|
1143
896
|
|
1144
897
|
if (window.jQuery) {
|
@@ -1150,7 +903,12 @@
|
|
1150
903
|
}
|
1151
904
|
|
1152
905
|
if (!contains && !$select.clickTriggeredSelect) {
|
1153
|
-
|
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);
|
1154
912
|
scope.$digest();
|
1155
913
|
}
|
1156
914
|
$select.clickTriggeredSelect = false;
|
@@ -1174,6 +932,7 @@
|
|
1174
932
|
|
1175
933
|
var transcludedMatch = transcluded.querySelectorAll('.ui-select-match');
|
1176
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
|
1177
936
|
if (transcludedMatch.length !== 1) {
|
1178
937
|
throw uiSelectMinErr('transcluded', "Expected 1 .ui-select-match but got '{0}'.", transcludedMatch.length);
|
1179
938
|
}
|
@@ -1181,147 +940,877 @@
|
|
1181
940
|
|
1182
941
|
var transcludedChoices = transcluded.querySelectorAll('.ui-select-choices');
|
1183
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
|
1184
944
|
if (transcludedChoices.length !== 1) {
|
1185
945
|
throw uiSelectMinErr('transcluded', "Expected 1 .ui-select-choices but got '{0}'.", transcludedChoices.length);
|
1186
946
|
}
|
1187
947
|
element.querySelectorAll('.ui-select-choices').replaceWith(transcludedChoices);
|
1188
948
|
});
|
1189
|
-
}
|
1190
|
-
};
|
1191
|
-
}])
|
1192
949
|
|
1193
|
-
|
1194
|
-
|
1195
|
-
|
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
|
+
});
|
1196
960
|
|
1197
|
-
|
1198
|
-
|
1199
|
-
|
1200
|
-
|
1201
|
-
|
1202
|
-
|
1203
|
-
// Gets theme attribute from parent (ui-select)
|
1204
|
-
var theme = tElement.parent().attr('theme') || uiSelectConfig.theme;
|
1205
|
-
return theme + '/choices.tpl.html';
|
1206
|
-
},
|
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
|
+
}
|
1207
967
|
|
1208
|
-
|
968
|
+
// Hold on to a reference to the .ui-select-container element for appendToBody support
|
969
|
+
var placeholder = null,
|
970
|
+
originalWidth = '';
|
1209
971
|
|
1210
|
-
|
972
|
+
function positionDropdown() {
|
973
|
+
// Remember the absolute position of the element
|
974
|
+
var offset = uisOffset(element);
|
1211
975
|
|
1212
|
-
|
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);
|
1213
981
|
|
1214
|
-
//
|
1215
|
-
|
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;
|
1216
985
|
|
1217
|
-
|
986
|
+
// Now move the actual dropdown element to the end of the body
|
987
|
+
$document.find('body').append(element);
|
1218
988
|
|
1219
|
-
|
1220
|
-
|
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
|
+
}
|
1221
994
|
|
1222
|
-
|
1223
|
-
|
1224
|
-
|
1225
|
-
|
995
|
+
function resetDropdown() {
|
996
|
+
if (placeholder === null) {
|
997
|
+
// The dropdown has not actually been display yet, so there's nothing to reset
|
998
|
+
return;
|
1226
999
|
}
|
1227
1000
|
|
1228
|
-
|
1229
|
-
|
1230
|
-
|
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.visibility = 'hidden';
|
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.visibility = '';
|
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);
|
1231
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
|
+
});
|
1232
1074
|
|
1233
|
-
|
1234
|
-
|
1235
|
-
|
1236
|
-
.attr('ng-click', '$select.select(' + $select.parserResult.itemName + ',false,$event)');
|
1075
|
+
function setAllowClear(allow) {
|
1076
|
+
$select.allowClear = (angular.isDefined(allow)) ? (allow === '') ? true : (allow.toLowerCase() === 'true') : false;
|
1077
|
+
}
|
1237
1078
|
|
1238
|
-
|
1239
|
-
|
1240
|
-
rowsInner.attr('uis-transclude-append', ''); //Adding uisTranscludeAppend directive to row element after choices element has ngRepeat
|
1079
|
+
attrs.$observe('allowClear', setAllowClear);
|
1080
|
+
setAllowClear(attrs.allowClear);
|
1241
1081
|
|
1242
|
-
|
1082
|
+
if($select.multiple){
|
1083
|
+
$select.sizeSearchInput();
|
1084
|
+
}
|
1243
1085
|
|
1244
|
-
|
1245
|
-
|
1246
|
-
|
1247
|
-
|
1248
|
-
|
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;
|
1249
1129
|
|
1250
|
-
|
1251
|
-
|
1252
|
-
|
1253
|
-
|
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)
|
1254
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;
|
1255
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;
|
1256
1280
|
}
|
1257
|
-
|
1258
|
-
|
1259
|
-
|
1260
|
-
|
1261
|
-
|
1262
|
-
|
1263
|
-
|
1264
|
-
|
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;
|
1265
1346
|
});
|
1266
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;
|
1267
1540
|
};
|
1268
|
-
|
1269
|
-
|
1270
|
-
|
1271
|
-
|
1272
|
-
|
1273
|
-
|
1274
|
-
|
1275
|
-
|
1276
|
-
|
1277
|
-
|
1278
|
-
|
1279
|
-
|
1280
|
-
|
1281
|
-
|
1282
|
-
|
1283
|
-
|
1284
|
-
|
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;
|
1285
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
|
+
}
|
1286
1585
|
|
1287
|
-
|
1586
|
+
if (e.which === KEY.TAB || KEY.isControl(e) || KEY.isFunctionKey(e) || e.which === KEY.ESC) {
|
1587
|
+
return;
|
1588
|
+
}
|
1288
1589
|
|
1289
|
-
if(
|
1290
|
-
|
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();
|
1291
1594
|
}
|
1292
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");
|
1293
1622
|
}
|
1294
|
-
|
1295
|
-
|
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;
|
1296
1764
|
|
1297
1765
|
/**
|
1298
|
-
*
|
1299
|
-
*
|
1300
|
-
*
|
1301
|
-
*
|
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",
|
1302
1771
|
*/
|
1303
|
-
.
|
1304
|
-
|
1305
|
-
|
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);
|
1306
1779
|
}
|
1307
1780
|
|
1308
|
-
return
|
1309
|
-
|
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])
|
1310
1786
|
};
|
1311
|
-
});
|
1312
|
-
}());
|
1313
1787
|
|
1788
|
+
};
|
1314
1789
|
|
1315
|
-
|
1316
|
-
|
1317
|
-
|
1318
|
-
|
1319
|
-
|
1320
|
-
|
1321
|
-
|
1322
|
-
|
1323
|
-
|
1324
|
-
|
1325
|
-
|
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>");
|
1326
1815
|
$templateCache.put("selectize/match.tpl.html","<div ng-hide=\"($select.open || $select.isEmpty())\" class=\"ui-select-match\" ng-transclude=\"\"></div>");
|
1327
|
-
$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\"></div><div class=\"ui-select-choices\"></div></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>");}]);
|