Tidier debouncing of search results, handle ?q=params better

Fixes #1099
This commit is contained in:
Steve Purcell 2013-10-14 17:25:12 +01:00
parent a058c3007e
commit 90814f2e43
2 changed files with 13 additions and 28 deletions

View file

@ -95,9 +95,19 @@
// Controllers
//////////////////////////////////////////////////////////////////////////////
app.controller('PackageListCtrl', function ($scope, $routeParams, packageService) {
app.controller('PackageListCtrl', function ($scope, $timeout, packageService) {
$scope.orderBy = "name";
$scope.searchTerms = $routeParams.q;
$scope.$on('$routeChangeSuccess', function (ev, current) {
$scope.enteredSearchTerms = $scope.searchTerms = current.params.q;
});
var copyValue;
$scope.$watch('enteredSearchTerms', function(value) {
$timeout.cancel(copyValue);
copyValue = $timeout(function() {
$scope.searchTerms = value;
}, 250);
});
packageService.getPackages().then(function(pkgs){
$scope.packages = _.values(pkgs);
$scope.totalDownloads = _.reduce(_.pluck($scope.packages, "downloads"), function (a, b) { return b === undefined ? a : a + b; }, 0);
@ -168,31 +178,6 @@
// Directives
//////////////////////////////////////////////////////////////////////////////
app.directive("debounceModel", ["$timeout", function($timeout) {
return {
restrict: "A",
require: "ngModel",
scope: {
"ngModel": "=",
"debounceModel": "=",
"debounceDelay": "@"
},
link: function (scope, element, attrs, ngModel) {
//jshint unused: false
var delay = parseInt(scope.debounceDelay, 10) || 250;
var copyValue;
scope.$watch(function() {
return ngModel.$modelValue;
}, function (value) {
$timeout.cancel(copyValue);
copyValue = $timeout(function() {
scope.debounceModel = value;
}, delay);
});
}
};
}]);
app.directive("viewOrError", function($rootScope) {
return {
template: '<div>' +

View file

@ -4,7 +4,7 @@
<small ng-show="totalDownloads">(<span ng-bind="totalDownloads | number"></span> downloads to date)</small>
</h2>
<p>
<input type="text" ng-model="enteredSearchTerms" debounce-model="searchTerms" debounce-delay="250" placeholder="Enter filter terms" autofocus>
<input type="text" ng-model="enteredSearchTerms" debounce-delay="250" placeholder="Enter filter terms" autofocus>
<span class="muted">&nbsp;<ng-pluralize when="{1: '1 match', 'other': '{} matches'}" count="(packages | filter:packageMatcher(searchTerms)).length"/></span>
</p>
<table id="package-list" class="table table-bordered table-responsive table-hover">