Properly debounce searching and make sure to only show results matching the current query.

static/directives/new-header-bar.html

@@ -140,6 +140,7 @@
     <div class="search-box-wrapper">
       <input id="search-box-input" type="text" placeholder="(Enter Search Terms)"
              ng-model-options="{'debounce': 250}" ng-model="currentSearchQuery"
+             debounce="250"
              ng-keydown="handleSearchKeyDown($event)">
     </div>
   </div>

static/js/app.js

@@ -36,7 +36,7 @@ quayPages.constant('pages', {
 });
 
 quayDependencies = ['ngRoute', 'chieffancypants.loadingBar', 'cfp.hotkeys', 'angular-tour', 'restangular', 'angularMoment',
-                    'mgcrea.ngStrap', 'ngCookies', 'ngSanitize', 'angular-md5', 'pasvaz.bindonce', 'ansiToHtml',
+                    'mgcrea.ngStrap', 'ngCookies', 'ngSanitize', 'angular-md5', 'pasvaz.bindonce', 'ansiToHtml', 'debounce',
                     'core-ui', 'core-config-setup', 'quayPages'];
 
 if (window.__config && window.__config.MIXPANEL_KEY) {

static/js/directives/ui/header-bar.js

@@ -47,7 +47,6 @@ angular.module('quay').directive('headerBar', function () {
       // Monitor any user changes and place the current user into the scope.
       UserService.updateUserIn($scope);
 
-
       $scope.currentPageContext = {};
 
       $rootScope.$watch('currentPage.scope.viewuser', function(u) {
@@ -74,7 +73,7 @@ angular.module('quay').directive('headerBar', function () {
         };
 
         ApiService.conductSearch(null, params).then(function(resp) {
-          if (!$scope.searchVisible) { return; }
+          if (!$scope.searchVisible || query != $scope.currentSearchQuery) { return; }
 
           $scope.searchResultState = {
             'state': resp.results.length ? 'results' : 'no-results',

static/lib/LICENSES

@@ -21,6 +21,7 @@ pagedown - Permissive
 jquery.overscroll - MIT (https://github.com/azoff/overscroll/blob/master/mit.license)
 URI.js - MIT (https://github.com/medialize/URI.js)
 angular-hotkeys - MIT (https://github.com/chieffancypants/angular-hotkeys/blob/master/LICENSE)
+angular-debounce - MIT (https://github.com/shahata/angular-debounce/blob/master/LICENSE)
 
 Issues:
 >>>>> jquery.spotlight - GPLv3 (https://github.com/jameshalsall/jQuery-Spotlight)

static/lib/angular-debounce.js

@@ -0,0 +1,66 @@
+'use strict';
+
+angular.module('debounce', [])
+  .service('debounce', ['$timeout', function ($timeout) {
+    return function (func, wait, immediate) {
+      var timeout, args, context, result;
+      function debounce() {
+        /* jshint validthis:true */
+        context = this;
+        args = arguments;
+        var later = function () {
+          timeout = null;
+          if (!immediate) {
+            result = func.apply(context, args);
+          }
+        };
+        var callNow = immediate && !timeout;
+        if (timeout) {
+          $timeout.cancel(timeout);
+        }
+        timeout = $timeout(later, wait);
+        if (callNow) {
+          result = func.apply(context, args);
+        }
+        return result;
+      }
+      debounce.cancel = function () {
+        $timeout.cancel(timeout);
+        timeout = null;
+      };
+      return debounce;
+    };
+  }])
+  .directive('debounce', ['debounce', '$parse', function (debounce, $parse) {
+    return {
+      require: 'ngModel',
+      priority: 999,
+      link: function ($scope, $element, $attrs, ngModelController) {
+        var debounceDuration = $parse($attrs.debounce)($scope);
+        var immediate = !!$parse($attrs.immediate)($scope);
+        var debouncedValue, pass;
+        var prevRender = ngModelController.$render.bind(ngModelController);
+        var commitSoon = debounce(function (viewValue) {
+          pass = true;
+          ngModelController.$setViewValue(viewValue);
+          pass = false;
+        }, parseInt(debounceDuration, 10), immediate);
+        ngModelController.$render = function () {
+          prevRender();
+          commitSoon.cancel();
+          //we must be first parser for this to work properly,
+          //so we have priority 999 so that we unshift into parsers last
+          debouncedValue = this.$viewValue;
+        };
+        ngModelController.$parsers.unshift(function (value) {
+          if (pass) {
+            debouncedValue = value;
+            return value;
+          } else {
+            commitSoon(ngModelController.$viewValue);
+            return debouncedValue;
+          }
+        });
+      }
+    };
+  }]);