Skip to content
This repository was archived by the owner on Oct 2, 2019. It is now read-only.

Commit 1cb314b

Browse files
committed
Refactor/Clean code
1 parent 5d30901 commit 1cb314b

File tree

5 files changed

+78
-113
lines changed

5 files changed

+78
-113
lines changed

src/bootstrap/match-multiple.tpl.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,12 @@
22
<span ng-repeat="$item in $select.selected">
33
<button
44
style="margin-right: 3px;"
5-
class="btn btn-default btn-xs"
5+
class="ui-select-match-item btn btn-default btn-xs"
66
tabindex="-1"
77
ng-disabled="$select.disabled"
88
ng-click="$select.activeMatchIndex = $index;"
99
ng-class="{'btn-primary':$select.activeMatchIndex === $index}">
10-
<span class="close" ng-hide="$select.disabled" ng-click="$select.removeChoice($index)">&nbsp;&times;</span>
10+
<span class="close ui-select-match-close" ng-hide="$select.disabled" ng-click="$select.removeChoice($index)">&nbsp;&times;</span>
1111
<span uis-transclude-append></span>
1212
</button>
1313
</span>
Lines changed: 12 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,17 @@
11
<div class="ui-select-multiple ui-select-bootstrap dropdown form-control" ng-class="{open: $select.open}">
22
<div>
3-
<div>
4-
<div class="ui-select-match"></div>
5-
<input type="text"
6-
autocomplete="off"
7-
autocorrect="off"
8-
autocapitalize="off"
9-
spellcheck="false"
10-
class="ui-select-search input-xs"
11-
placeholder="{{$select.getPlaceholder()}}"
12-
ng-disabled="$select.disabled"
13-
ng-hide="$select.disabled"
14-
ng-click="$select.activate()"
15-
ng-model="$select.search">
16-
</div>
3+
<div class="ui-select-match"></div>
4+
<input type="text"
5+
autocomplete="off"
6+
autocorrect="off"
7+
autocapitalize="off"
8+
spellcheck="false"
9+
class="ui-select-search input-xs"
10+
placeholder="{{$select.getPlaceholder()}}"
11+
ng-disabled="$select.disabled"
12+
ng-hide="$select.disabled"
13+
ng-click="$select.activate()"
14+
ng-model="$select.search">
1715
</div>
1816
<div class="ui-select-choices"></div>
1917
</div>

src/select.js

Lines changed: 61 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,49 @@
11
(function () {
22
"use strict";
33

4+
var KEY = {
5+
TAB: 9,
6+
ENTER: 13,
7+
ESC: 27,
8+
SPACE: 32,
9+
LEFT: 37,
10+
UP: 38,
11+
RIGHT: 39,
12+
DOWN: 40,
13+
SHIFT: 16,
14+
CTRL: 17,
15+
ALT: 18,
16+
PAGE_UP: 33,
17+
PAGE_DOWN: 34,
18+
HOME: 36,
19+
END: 35,
20+
BACKSPACE: 8,
21+
DELETE: 46,
22+
isControl: function (e) {
23+
var k = e.which;
24+
switch (k) {
25+
case KEY.SHIFT:
26+
case KEY.CTRL:
27+
case KEY.ALT:
28+
return true;
29+
}
30+
31+
if (e.metaKey) return true;
32+
33+
return false;
34+
},
35+
isFunctionKey: function (k) {
36+
k = k.which ? k.which : k;
37+
return k >= 112 && k <= 123;
38+
},
39+
isVerticalMovement: function (k){
40+
return ~[KEY.UP, KEY.DOWN].indexOf(k);
41+
},
42+
isHorizontalMovement: function (k){
43+
return ~[KEY.LEFT,KEY.RIGHT,KEY.BACKSPACE,KEY.DELETE].indexOf(k);
44+
}
45+
};
46+
447
/**
548
* Add querySelectorAll() to jqLite.
649
*
@@ -261,10 +304,8 @@
261304
});
262305

263306
if(ctrl.multiple){
264-
if(!_itemInSelected(item)){
265-
ctrl.selected.push(item);
266-
ctrl.sizeSearchInput();
267-
}
307+
ctrl.selected.push(item);
308+
ctrl.sizeSearchInput();
268309
} else {
269310
ctrl.selected = item;
270311
}
@@ -306,44 +347,29 @@
306347
}, 0, false);
307348
};
308349

309-
var Key = {
310-
Enter: 13,
311-
Tab: 9,
312-
Up: 38,
313-
Down: 40,
314-
Left: 37,
315-
Right: 39,
316-
Backspace: 8,
317-
Delete: 46,
318-
Escape: 27
319-
};
320-
321-
Key.verticalMovement = [Key.Up,Key.Down];
322-
Key.horizontalMovement = [Key.Left,Key.Right,Key.Backspace,Key.Delete];
323-
324350
function _handleDropDownSelection(key) {
325351
var processed = true;
326352
switch (key) {
327-
case Key.Down:
353+
case KEY.DOWN:
328354
if (!ctrl.open && ctrl.multiple) ctrl.activate(false, true); //In case its the search input in 'multiple' mode
329355
else if (ctrl.activeIndex < ctrl.items.length - 1) { ctrl.activeIndex++; }
330356
break;
331-
case Key.Up:
357+
case KEY.UP:
332358
if (!ctrl.open && ctrl.multiple) ctrl.activate(false, true); //In case its the search input in 'multiple' mode
333359
else if (ctrl.activeIndex > 0) { ctrl.activeIndex--; }
334360
break;
335-
case Key.Tab:
361+
case KEY.TAB:
336362
//TODO: Que hacemos en modo multiple?
337363
if (!ctrl.multiple) ctrl.select(ctrl.items[ctrl.activeIndex]);
338364
break;
339-
case Key.Enter:
365+
case KEY.ENTER:
340366
if(ctrl.open){
341367
ctrl.select(ctrl.items[ctrl.activeIndex]);
342368
} else {
343369
ctrl.activate(false, true); //In case its the search input in 'multiple' mode
344370
}
345371
break;
346-
case Key.Escape:
372+
case KEY.ESC:
347373
ctrl.close();
348374
break;
349375
default:
@@ -364,19 +390,19 @@
364390
prev = ctrl.activeMatchIndex-1,
365391
newIndex = curr;
366392

367-
if(caretPosition > 0 || (ctrl.search.length && key == Key.Right)) return false;
393+
if(caretPosition > 0 || (ctrl.search.length && key == KEY.RIGHT)) return false;
368394

369395
ctrl.close();
370396

371-
function __getNewIndex(){
397+
function getNewActiveMatchIndex(){
372398
switch(key){
373-
case Key.Left:
399+
case KEY.LEFT:
374400
// Select previous/first item
375401
if(~ctrl.activeMatchIndex) return prev;
376402
// Select last item
377403
else return last;
378404
break;
379-
case Key.Right:
405+
case KEY.RIGHT:
380406
// Open drop-down
381407
if(!~ctrl.activeMatchIndex || curr === last){
382408
ctrl.activate();
@@ -385,7 +411,7 @@
385411
// Select next/last item
386412
else return next;
387413
break;
388-
case Key.Backspace:
414+
case KEY.BACKSPACE:
389415
// Remove selected item and select previous/first
390416
if(~ctrl.activeMatchIndex){
391417
ctrl.removeChoice(curr);
@@ -394,7 +420,7 @@
394420
// Select last item
395421
else return last;
396422
break;
397-
case Key.Delete:
423+
case KEY.DELETE:
398424
// Remove selected item and select next item
399425
if(~ctrl.activeMatchIndex){
400426
ctrl.removeChoice(ctrl.activeMatchIndex);
@@ -404,7 +430,7 @@
404430
}
405431
}
406432

407-
newIndex = __getNewIndex();
433+
newIndex = getNewActiveMatchIndex();
408434

409435
if(!ctrl.selected.length || newIndex === false) ctrl.activeMatchIndex = -1;
410436
else ctrl.activeMatchIndex = Math.min(last,Math.max(first,newIndex));
@@ -417,31 +443,31 @@
417443

418444
var key = e.which;
419445

420-
// if(~[Key.Escape,Key.Tab].indexOf(key)){
446+
// if(~[KEY.ESC,KEY.TAB].indexOf(key)){
421447
// //TODO: SEGURO?
422448
// ctrl.close();
423449
// }
424450

425451
$scope.$apply(function() {
426452
var processed = false;
427453

428-
if(ctrl.multiple && ~Key.horizontalMovement.indexOf(key)){
454+
if(ctrl.multiple && KEY.isHorizontalMovement(key)){
429455
processed = _handleMatchSelection(key);
430456
}
431457

432458
if (!processed && ctrl.items.length > 0) {
433459
processed = _handleDropDownSelection(key);
434460
}
435461

436-
if (processed && key != Key.Tab) {
462+
if (processed && key != KEY.TAB) {
437463
//TODO Check si el tab selecciona aun correctamente
438464
//Crear test
439465
e.preventDefault();
440466
e.stopPropagation();
441467
}
442468
});
443469

444-
if(~Key.verticalMovement.indexOf(key) && ctrl.items.length > 0){
470+
if(KEY.isVerticalMovement(key) && ctrl.items.length > 0){
445471
_ensureHighlightVisible();
446472
}
447473

@@ -454,16 +480,6 @@
454480
});
455481
});
456482

457-
function _itemInSelected(item){
458-
var match = false;
459-
angular.forEach(ctrl.selected,function(value){
460-
// We need to use angular.equals for when an initially selected item lacks $$hashKey and stuff.
461-
if(angular.equals(item,value)) match = true;
462-
});
463-
464-
return match;
465-
}
466-
467483
function _getCaretPosition(el) {
468484
if(angular.isNumber(el.selectionStart)) return el.selectionStart;
469485
// selectionStart is not supported in IE8 and we don't want hacky workarounds so we compromise
@@ -634,55 +650,6 @@
634650

635651
});
636652

637-
//TODO Refactor to reuse the KEY object from uiSelectCtrl
638-
var KEY = {
639-
TAB: 9,
640-
ENTER: 13,
641-
ESC: 27,
642-
SPACE: 32,
643-
LEFT: 37,
644-
UP: 38,
645-
RIGHT: 39,
646-
DOWN: 40,
647-
SHIFT: 16,
648-
CTRL: 17,
649-
ALT: 18,
650-
PAGE_UP: 33,
651-
PAGE_DOWN: 34,
652-
HOME: 36,
653-
END: 35,
654-
BACKSPACE: 8,
655-
DELETE: 46,
656-
isArrow: function (k) {
657-
k = k.which ? k.which : k;
658-
switch (k) {
659-
case KEY.LEFT:
660-
case KEY.RIGHT:
661-
case KEY.UP:
662-
case KEY.DOWN:
663-
return true;
664-
}
665-
return false;
666-
},
667-
isControl: function (e) {
668-
var k = e.which;
669-
switch (k) {
670-
case KEY.SHIFT:
671-
case KEY.CTRL:
672-
case KEY.ALT:
673-
return true;
674-
}
675-
676-
if (e.metaKey) return true;
677-
678-
return false;
679-
},
680-
isFunctionKey: function (k) {
681-
k = k.which ? k.which : k;
682-
return k >= 112 && k <= 123;
683-
}
684-
};
685-
686653
}
687654

688655

src/select2/match-multiple.tpl.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,9 @@
44
do not work: [class^="select2-choice"]
55
-->
66
<span class="ui-select-match">
7-
<li class="select2-search-choice" ng-repeat="$item in $select.selected"
7+
<li class="ui-select-match-item select2-search-choice" ng-repeat="$item in $select.selected"
88
ng-class="{'select2-search-choice-focus':$select.activeMatchIndex === $index}">
99
<span uis-transclude-append></span>
10-
<a href="#" class="select2-search-choice-close" ng-click="$select.removeChoice($index)" tabindex="-1"></a>
10+
<a href="#" class="ui-select-match-close select2-search-choice-close" ng-click="$select.removeChoice($index)" tabindex="-1"></a>
1111
</li>
1212
</span>

src/select2/select-multiple.tpl.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div class="select2 select2-container select2-container-multi"
1+
<div class="ui-select-multiple select2 select2-container select2-container-multi"
22
ng-class="{'select2-container-active select2-dropdown-open': $select.open,
33
'select2-container-disabled': $select.disabled}">
44
<ul class="select2-choices">

0 commit comments

Comments
 (0)