Merge PR #65

mbenford · Jul 26, 2014 · b673166 · b673166
2 parents c7ae450 + 28c615f
commit b673166
Show file tree

Hide file tree

Showing 4 changed files with 52 additions and 4 deletions.
diff --git a/src/auto-complete.js b/src/auto-complete.js
@@ -21,6 +21,9 @@
  * @param {boolean=} [loadOnDownArrow=false] Flag indicating that the source option will be evaluated when the down arrow
  *                                           key is pressed and the suggestion list is closed. The current input value
  *                                           is available as $query.
+ * @param {boolean=} {showOnEmpty=false} Flag indicating whether the dropdown will show on input focus. When using this
+ *                                       option the source expression should handle a null query to account for focus on
+ *                                       an empty input.
  */
 tagsInput.directive('autoComplete', function($document, $timeout, $sce, tagsInputConfig) {
     function SuggestionList(loadFn, options) {
@@ -109,7 +112,8 @@ tagsInput.directive('autoComplete', function($document, $timeout, $sce, tagsInpu
                 minLength: [Number, 3],
                 highlightMatchedText: [Boolean, true],
                 maxResultsToShow: [Number, 10],
-                loadOnDownArrow: [Boolean, false]
+                loadOnDownArrow: [Boolean, false],
+                showOnEmpty: [Boolean, false]
             });
 
             options = scope.options;
@@ -167,7 +171,10 @@ tagsInput.directive('autoComplete', function($document, $timeout, $sce, tagsInpu
                 .on('input-change', function(value) {
                     if (value && value.length >= options.minLength) {
                         suggestionList.load(value, tagsInput.getTags());
-                    } else {
+                    } else if (scope.options.showOnEmpty) {
+                        suggestionList.load('', tagsInput.getTags());
+                    }
+                    else {
                         suggestionList.reset();
                     }
                 })
@@ -224,6 +231,11 @@ tagsInput.directive('autoComplete', function($document, $timeout, $sce, tagsInpu
                 })
                 .on('input-blur', function() {
                     suggestionList.reset();
+                })
+                .on('input-focus', function () {
+                    if (scope.options.showOnEmpty) {
+                        suggestionList.load('', tagsInput.getTags(), true);
+                    }
                 });
 
             documentClick = function() {
@@ -240,4 +252,4 @@ tagsInput.directive('autoComplete', function($document, $timeout, $sce, tagsInpu
             });
         }
     };
-});
+});
diff --git a/src/tags-input.js b/src/tags-input.js
@@ -295,6 +295,7 @@ tagsInput.directive('tagsInput', function($timeout, $document, tagsInputConfig)
                     if (scope.hasFocus) {
                         return;
                     }
+                    scope.events.trigger('input-focus');
                     scope.hasFocus = true;
                     events.trigger('input-focus');
 

diff --git a/test/auto-complete.spec.js b/test/auto-complete.spec.js
@@ -817,6 +817,40 @@ describe('autoComplete directive', function() {
         });
     });
 
+    describe('show-on-empty option', function(){
+        it('initialize the option to false', function(){
+            //Arrange
+            compile();
+
+            //Assert
+            expect(isolateScope.options.showOnEmpty).toBe(false);
+        });
+
+        it('shows the suggestion box when the input field becomes empty', function(){
+            //Arrange
+            compile('show-on-empty="true"');
+
+            //Act
+            changeInputValue('');
+            $timeout.flush();
+
+            expect($scope.loadItems).toHaveBeenCalledWith('');
+        });
+
+        it('shows the suggestion box when input is focused and input is empty', function(){
+            //Arrange
+            compile('show-on-empty="true"');
+
+            //Act
+            eventHandlers['input-focus']();
+            $timeout.flush();
+
+            //Assert
+            expect($scope.loadItems).toHaveBeenCalledWith('');
+        });
+
+    });
+
     describe('highlight-matched-text option', function() {
         it('initializes the option to true', function() {
             // Arrange/Act

diff --git a/test/test-page.html b/test/test-page.html
@@ -60,7 +60,8 @@
                      debounce-delay="0"
                      min-length="1"
                      max-results-to-show="10"
-                     load-on-down-arrow="true">
+                     load-on-down-arrow="true"
+                     show-on-empty="true">
       </auto-complete>
     </tags-input>