Catch up with upstream master

Conflicts:
	src/select.js
	test/select.spec.js

Author: Brian Feister

src/bootstrap/choices.tpl.html

@@ -3,7 +3,7 @@
     ng-show="$select.items.length > 0">
   <li class="ui-select-choices-group">
     <div class="divider" ng-show="$select.isGrouped && $index > 0"></div>
-    <div ng-show="$select.isGrouped" class="ui-select-choices-group-label dropdown-header">{{$group.name}}</div>
+    <div ng-show="$select.isGrouped" class="ui-select-choices-group-label dropdown-header" ng-bind-html="$group.name"></div>
     <div class="ui-select-choices-row" ng-class="{active: $select.isActive(this), disabled: $select.isDisabled(this)}">
       <a href="javascript:void(0)" class="ui-select-choices-row-inner"></a>
     </div>

src/bootstrap/match.tpl.html

@@ -3,7 +3,7 @@
         ng-disabled="$select.disabled"
         ng-class="{'btn-default-focus':$select.focus}";
         ng-click="$select.activate()">
-  <span ng-show="$select.searchEnabled && $select.isEmpty()" class="text-muted">{{$select.placeholder}}</span>
+  <span ng-show="$select.isEmpty()" class="text-muted">{{$select.placeholder}}</span>
   <span ng-hide="$select.isEmpty()" ng-transclude></span>
   <span class="caret ui-select-toggle" ng-click="$select.toggle($event)"></span>
 </button>

src/select.css

@@ -28,6 +28,10 @@
   padding-left: 0;
 }
 
+.select2-locked > .select2-search-choice-close{
+  display:none;
+}
+
 /* Selectize theme */
 
 /* Helper class to show styles when focus */

src/select.js

@@ -165,6 +165,7 @@
     ctrl.disableChoiceExpression = undefined; // Initialized inside uiSelect directive link function
     ctrl.$filter = $filter;
     ctrl.taggingTokens = {isActivated: false, tokens: undefined};
+    ctrl.lockChoiceExpression = undefined; // Initialized inside uiSelect directive link function
 
     ctrl.isEmpty = function() {
       return angular.isUndefined(ctrl.selected) || ctrl.selected === null || ctrl.selected === '';
@@ -413,9 +414,24 @@
       e.stopPropagation();
     };
 
+    ctrl.isLocked = function(itemScope, itemIndex) {
+        var isLocked, item = ctrl.selected[itemIndex];
+
+        if (item && !angular.isUndefined(ctrl.lockChoiceExpression)) {
+            isLocked = !!(itemScope.$eval(ctrl.lockChoiceExpression)); // force the boolean value
+            item._uiSelectChoiceLocked = isLocked; // store this for later reference
+        }
+
+        return isLocked;
+    };
+
     // Remove item from multiple select
     ctrl.removeChoice = function(index){
       var removedChoice = ctrl.selected[index];
+
+      // if the choice is locked, can't remove it
+      if(removedChoice._uiSelectChoiceLocked) return;
+
       var locals = {};
       locals[ctrl.parserResult.itemName] = removedChoice;
 
@@ -937,7 +953,7 @@
 
         scope.$watch('searchEnabled', function() {
             var searchEnabled = scope.$eval(attrs.searchEnabled);
-            $select.searchEnabled = searchEnabled !== undefined ? searchEnabled : true;
+            $select.searchEnabled = searchEnabled !== undefined ? searchEnabled : uiSelectConfig.searchEnabled;
         });
 
         attrs.$observe('disabled', function() {
@@ -1096,6 +1112,7 @@
           $select.parseRepeatAttr(attrs.repeat, groupByExp); //Result ready at $select.parserResult
 
           $select.disableChoiceExpression = attrs.uiDisableChoice;
+          $select.onHighlightCallback = attrs.onHighlight;
 
           if(groupByExp) {
             var groups = element.querySelectorAll('.ui-select-choices-group');
@@ -1109,6 +1126,7 @@
           }
 
           choices.attr('ng-repeat', RepeatParser.getNgRepeatExpression($select.parserResult.itemName, '$select.items', $select.parserResult.trackByExp, groupByExp))
+              .attr('ng-if', '$select.open') //Prevent unnecessary watches when dropdown is closed
               .attr('ng-mouseenter', '$select.setActiveItem('+$select.parserResult.itemName +')')
               .attr('ng-click', '$select.select(' + $select.parserResult.itemName + ')');
 
@@ -1156,6 +1174,7 @@
         return theme + (multi ? '/match-multiple.tpl.html' : '/match.tpl.html');
       },
       link: function(scope, element, attrs, $select) {
+        $select.lockChoiceExpression = attrs.uiLockChoice;
         attrs.$observe('placeholder', function(placeholder) {
           $select.placeholder = placeholder !== undefined ? placeholder : uiSelectConfig.placeholder;
         });

src/select2/choices.tpl.html

@@ -1,6 +1,6 @@
 <ul class="ui-select-choices ui-select-choices-content select2-results">
   <li class="ui-select-choices-group" ng-class="{'select2-result-with-children': $select.isGrouped}">
-    <div ng-show="$select.isGrouped" class="ui-select-choices-group-label select2-result-label">{{$group.name}}</div>
+    <div ng-show="$select.isGrouped" class="ui-select-choices-group-label select2-result-label" ng-bind-html="$group.name"></div>
     <ul ng-class="{'select2-result-sub': $select.isGrouped, 'select2-result-single': !$select.isGrouped}">
       <li 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>

src/select2/match-multiple.tpl.html

@@ -5,7 +5,7 @@
 -->
 <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':$select.activeMatchIndex === $index}">
+      ng-class="{'select2-search-choice-focus':$select.activeMatchIndex === $index, 'select2-locked':$select.isLocked(this, $index)}">
       <span uis-transclude-append></span>
       <a href="javascript:;" class="ui-select-match-close select2-search-choice-close" ng-click="$select.removeChoice($index)" tabindex="-1"></a>
   </li>

src/select2/match.tpl.html

@@ -6,7 +6,7 @@
 <a class="select2-choice ui-select-match"
    ng-class="{'select2-default': $select.isEmpty()}"
    ng-click="$select.activate()">
-  <span ng-show="$select.searchEnabled && $select.isEmpty()" class="select2-chosen">{{$select.placeholder}}</span>
+  <span ng-show="$select.isEmpty()" class="select2-chosen">{{$select.placeholder}}</span>
   <span ng-hide="$select.isEmpty()" class="select2-chosen" ng-transclude></span>
   <span class="select2-arrow ui-select-toggle" ng-click="$select.toggle($event)"><b></b></span>
 </a>

src/selectize/choices.tpl.html

@@ -1,7 +1,7 @@
 <div ng-show="$select.open" class="ui-select-choices selectize-dropdown single">
   <div class="ui-select-choices-content selectize-dropdown-content">
     <div class="ui-select-choices-group optgroup">
-      <div ng-show="$select.isGrouped" class="ui-select-choices-group-label optgroup-header">{{$group.name}}</div>
+      <div ng-show="$select.isGrouped" class="ui-select-choices-group-label optgroup-header" ng-bind-html="$group.name"></div>
       <div 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>

src/selectize/match.tpl.html

@@ -1 +1 @@
-<div ng-hide="$select.searchEnabled && ($select.open || $select.isEmpty())" class="ui-select-match" ng-transclude></div>
+<div ng-hide="($select.open || $select.isEmpty())" class="ui-select-match" ng-transclude></div>

test/select.spec.js

@@ -1,7 +1,7 @@
 'use strict';
 
 describe('ui-select tests', function() {
-  var scope, $rootScope, $compile, $timeout;
+  var scope, $rootScope, $compile, $timeout, $injector;
 
   var Key = {
     Enter: 13,
@@ -16,11 +16,12 @@ describe('ui-select tests', function() {
   };
 
   beforeEach(module('ngSanitize', 'ui.select'));
-  beforeEach(inject(function(_$rootScope_, _$compile_, _$timeout_) {
+  beforeEach(inject(function(_$rootScope_, _$compile_, _$timeout_, _$injector_) {
     $rootScope = _$rootScope_;
     scope = $rootScope.$new();
     $compile = _$compile_;
     $timeout = _$timeout_;
+    $injector = _$injector_;
     scope.selection = {};
 
     scope.getGroupLabel = function(person) {
@@ -144,6 +145,7 @@ describe('ui-select tests', function() {
     var choicesContainerEl = $(el).find('.ui-select-choices');
     expect(choicesContainerEl.length).toEqual(1);
 
+    openDropdown(el);
     var choicesEls = $(el).find('.ui-select-choices-row');
     expect(choicesEls.length).toEqual(8);
   });
@@ -254,7 +256,7 @@ describe('ui-select tests', function() {
     expect(isDropdownOpened(el2)).toEqual(true);
 
     var el3 = createUiSelect();
-    expect(el3.scope().$select.disabled).toEqual(false);
+    expect(el3.scope().$select.disabled).toEqual(false || undefined);
     clickMatch(el3);
     expect(isDropdownOpened(el3)).toEqual(true);
   });
@@ -401,12 +403,14 @@ describe('ui-select tests', function() {
       });
 
       it('should set a disabled class on the option', function() {
-        var option = $(this.el).find('.ui-select-choices-row div:contains("Wladimir")');
-        var container = option.closest('.ui-select-choices-row');
 
         openDropdown(this.el);
 
+        var option = $(this.el).find('.ui-select-choices-row div:contains("Wladimir")');
+        var container = option.closest('.ui-select-choices-row');
+
         expect(container.hasClass('disabled')).toBeTruthy();
+
       });
     });
 
@@ -432,11 +436,11 @@ describe('ui-select tests', function() {
       });
 
       it('should set a disabled class on the option', function() {
+        openDropdown(this.el);
+
         var option = $(this.el).find('.ui-select-choices-row div:contains("Wladimir")');
         var container = option.closest('.ui-select-choices-row');
 
-        openDropdown(this.el);
-
         expect(container.hasClass('disabled')).toBeTruthy();
       });
     });
@@ -463,11 +467,11 @@ describe('ui-select tests', function() {
       });
 
       it('should set a disabled class on the option', function() {
+        openDropdown(this.el);
+
         var option = $(this.el).find('.ui-select-choices-row div:contains("Wladimir")');
         var container = option.closest('.ui-select-choices-row');
 
-        openDropdown(this.el);
-
         expect(container.hasClass('disabled')).toBeTruthy();
       });
     });
@@ -519,9 +523,8 @@ describe('ui-select tests', function() {
       var el = createUiSelect();
       el.scope().$select.search = 't';
       scope.$digest();
-      var choices = el.find('.ui-select-choices-row');
-
       openDropdown(el);
+      var choices = el.find('.ui-select-choices-row');
 
       expect(choices.eq(0)).toHaveClass('active');
       expect(getGroupLabel(choices.eq(0)).text()).toBe('Foo');
@@ -759,6 +762,35 @@ describe('ui-select tests', function() {
 
   });
 
+  it('should invoke hover callback', function(){
+
+    var highlighted;
+    scope.onHighlightFn = function ($item) {
+      highlighted = $item;
+    };
+
+    var el = compileTemplate(
+      '<ui-select on-select="onSelectFn($item, $model)" ng-model="selection.selected"> \
+        <ui-select-match placeholder="Pick one...">{{$select.selected.name}}</ui-select-match> \
+        <ui-select-choices on-highlight="onHighlightFn(person)" repeat="person.name as person in people | filter: $select.search"> \
+          <div ng-bind-html="person.name | highlight: $select.search"></div> \
+          <div ng-bind-html="person.email | highlight: $select.search"></div> \
+        </ui-select-choices> \
+      </ui-select>'
+    );
+
+    expect(highlighted).toBeFalsy();
+
+    if (!isDropdownOpened(el)){
+      openDropdown(el);
+    }
+
+    $(el).find('.ui-select-choices-row div:contains("Samantha")').trigger('mouseover');
+    scope.$digest();
+
+    expect(highlighted).toBe(scope.people[5]);
+  })
+
   it('should set $item & $model correctly when invoking callback on select and no single prop. binding', function () {
 
     scope.onSelectFn = function ($item, $model, $label) {
@@ -878,6 +910,7 @@ describe('ui-select tests', function() {
       </ui-select>'
     );
 
+    openDropdown(el);
     expect($(el).find('.only-once').length).toEqual(1);
 
 
@@ -993,12 +1026,12 @@ describe('ui-select tests', function() {
     describe('selectize theme', function() {
 
       it('should show search input when true', function() {
-        setupSelectComponent('true', 'selectize');
+        setupSelectComponent(true, 'selectize');
         expect($(el).find('.ui-select-search')).not.toHaveClass('ng-hide');
       });
 
       it('should hide search input when false', function() {
-        setupSelectComponent('false', 'selectize');
+        setupSelectComponent(false, 'selectize');
         expect($(el).find('.ui-select-search')).toHaveClass('ng-hide');
       });
 
@@ -1507,5 +1540,64 @@ describe('ui-select tests', function() {
     });
   });
 
+  describe('default configuration via uiSelectConfig', function() {
+
+    describe('searchEnabled option', function() {
+
+      function setupWithoutAttr(){
+        return compileTemplate(
+          '<ui-select ng-model="selection.selected"> \
+            <ui-select-match placeholder="Pick one...">{{$select.selected.name}}</ui-select-match> \
+            <ui-select-choices repeat="person in people | filter: $select.search"> \
+              <div ng-bind-html="person.name | highlight: $select.search"></div> \
+              <div ng-bind-html="person.email | highlight: $select.search"></div> \
+            </ui-select-choices> \
+          </ui-select>'
+        );
+      }
 
+      function setupWithAttr(searchEnabled){
+        return compileTemplate(
+          '<ui-select ng-model="selection.selected" search-enabled="'+searchEnabled+'"> \
+            <ui-select-match placeholder="Pick one...">{{$select.selected.name}}</ui-select-match> \
+            <ui-select-choices repeat="person in people | filter: $select.search"> \
+              <div ng-bind-html="person.name | highlight: $select.search"></div> \
+              <div ng-bind-html="person.email | highlight: $select.search"></div> \
+            </ui-select-choices> \
+          </ui-select>'
+        );
+      }
+
+      it('should be true by default', function(){
+        var el = setupWithoutAttr();
+        expect(el.scope().$select.searchEnabled).toBe(true);
+      });
+
+      it('should disable search if default set to false', function(){
+        var uiSelectConfig = $injector.get('uiSelectConfig');
+        uiSelectConfig.searchEnabled = false;
+
+        var el = setupWithoutAttr();
+        expect(el.scope().$select.searchEnabled).not.toBe(true);
+      });
+
+      it('should be overridden by inline option search-enabled=true', function(){
+        var uiSelectConfig = $injector.get('uiSelectConfig');
+        uiSelectConfig.searchEnabled = false;
+
+        var el = setupWithAttr(true);
+        expect(el.scope().$select.searchEnabled).toBe(true);
+      });
+
+      it('should be overridden by inline option search-enabled=false', function(){
+        var uiSelectConfig = $injector.get('uiSelectConfig');
+        uiSelectConfig.searchEnabled = true;
+
+        var el = setupWithAttr(false);
+        expect(el.scope().$select.searchEnabled).not.toBe(true);
+      });
+
+    });
+
+  });
 });