mirror of
https://github.com/nasa/openmct.git
synced 2025-03-28 14:48:42 +00:00
[Search] Result paging
The search view now can page the results when there are many.
This commit is contained in:
parent
442a1979e7
commit
c1ebd50e4c
@ -38,11 +38,27 @@
|
|||||||
|
|
||||||
<!-- Results list -->
|
<!-- Results list -->
|
||||||
<div ng-if="controller.areResults()"
|
<div ng-if="controller.areResults()"
|
||||||
style="height: 30px">
|
style="height: 60px">
|
||||||
|
<p>
|
||||||
Results:
|
Results:
|
||||||
|
</p>
|
||||||
|
<div ng-if="controller.arePaging()">
|
||||||
|
<button ng-if="controller.canGoBack()"
|
||||||
|
ng-click="controller.previousPage()">
|
||||||
|
Previous Page
|
||||||
|
</button>
|
||||||
|
showing results {{ index+1 }} - {{ index + pageLength }}
|
||||||
|
of {{ results.length }}
|
||||||
|
<button ng-if="controller.canGoForward()"
|
||||||
|
ng-click="controller.nextPage()">
|
||||||
|
Next Page
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<mct-representation key="'grid-item'"
|
||||||
|
ng-repeat="result in page"
|
||||||
|
mct-object="result.object">
|
||||||
|
</mct-representation>
|
||||||
</div>
|
</div>
|
||||||
<mct-representation key="'grid-item'"
|
|
||||||
ng-repeat="result in results"
|
|
||||||
mct-object="result.object">
|
|
||||||
</mct-representation>
|
|
||||||
</div>
|
</div>
|
@ -25,6 +25,7 @@
|
|||||||
<input type="text"
|
<input type="text"
|
||||||
id="searchbarinput"
|
id="searchbarinput"
|
||||||
value=""
|
value=""
|
||||||
|
style="width: 100%"
|
||||||
ng-keyup="controller.search('searchbarinput')" />
|
ng-keyup="controller.search('searchbarinput')" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -32,7 +33,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<mct-representation key="'searchbar-item'"
|
<mct-representation key="'searchbar-item'"
|
||||||
ng-repeat="result in results"
|
ng-repeat="result in results"
|
||||||
mct-object="result">
|
mct-object="result.object">
|
||||||
</mct-representation>
|
</mct-representation>
|
||||||
</div>
|
</div>
|
||||||
</span>
|
</span>
|
@ -55,7 +55,6 @@ define(
|
|||||||
var ids = [];
|
var ids = [];
|
||||||
|
|
||||||
for (var i = 0; i < results.length; i += 1) {
|
for (var i = 0; i < results.length; i += 1) {
|
||||||
//if (ids.includes(results[i].id)) {
|
|
||||||
if (ids.indexOf(results[i].id) !== -1) {
|
if (ids.indexOf(results[i].id) !== -1) {
|
||||||
// If this result's ID is already there, remove the object
|
// If this result's ID is already there, remove the object
|
||||||
results.splice(i, 1);
|
results.splice(i, 1);
|
||||||
|
@ -27,7 +27,18 @@
|
|||||||
define(function () {
|
define(function () {
|
||||||
"use strict";
|
"use strict";
|
||||||
|
|
||||||
|
|
||||||
function SearchController($scope, searchService, objectService) {
|
function SearchController($scope, searchService, objectService) {
|
||||||
|
$scope.pageLength = 4;
|
||||||
|
|
||||||
|
function page(start, howMany) {
|
||||||
|
if (!howMany) {
|
||||||
|
howMany = $scope.pageLength;
|
||||||
|
}
|
||||||
|
|
||||||
|
$scope.index = start;
|
||||||
|
$scope.page = $scope.results.slice(start, start + howMany);
|
||||||
|
}
|
||||||
|
|
||||||
function getResults(inputID) {
|
function getResults(inputID) {
|
||||||
|
|
||||||
@ -37,6 +48,8 @@ define(function () {
|
|||||||
|
|
||||||
searchService.query(inputID).then(function (c) {
|
searchService.query(inputID).then(function (c) {
|
||||||
$scope.results = c;
|
$scope.results = c;
|
||||||
|
$scope.index = 0;
|
||||||
|
page($scope.index, $scope.pageLength);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -51,16 +64,38 @@ define(function () {
|
|||||||
} else {
|
} else {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
}/*,
|
},
|
||||||
|
|
||||||
// Get a domain object from its ID
|
// Check to see if there are enough results to be paging them
|
||||||
getObjectByID: function (id) {
|
arePaging: function () {
|
||||||
return objectService.getObjects([id]).then(function (objects) {
|
return $scope.results.length > $scope.page.length;
|
||||||
var obj = objects[id];
|
},
|
||||||
console.log('get object', obj);
|
|
||||||
return obj;
|
canGoBack: function () {
|
||||||
});
|
return $scope.index > 0;
|
||||||
}*/
|
},
|
||||||
|
|
||||||
|
canGoForward: function () {
|
||||||
|
return ($scope.index + $scope.pageLength) < $scope.results.length;
|
||||||
|
},
|
||||||
|
|
||||||
|
nextPage: function(howMany) {
|
||||||
|
if (!howMany) {
|
||||||
|
howMany = $scope.pageLength;
|
||||||
|
}
|
||||||
|
|
||||||
|
$scope.index = $scope.index + howMany;
|
||||||
|
$scope.page = $scope.results.slice($scope.index, $scope.index + howMany);
|
||||||
|
},
|
||||||
|
|
||||||
|
previousPage: function(howMany) {
|
||||||
|
if (!howMany) {
|
||||||
|
howMany = $scope.pageLength;
|
||||||
|
}
|
||||||
|
|
||||||
|
$scope.index = $scope.index - howMany;
|
||||||
|
$scope.page = $scope.results.slice($scope.index, $scope.index + howMany);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
return SearchController;
|
return SearchController;
|
||||||
|
@ -89,10 +89,10 @@ define(
|
|||||||
// Very rudimentary
|
// Very rudimentary
|
||||||
function score(item, term) {
|
function score(item, term) {
|
||||||
var name = item.object.getModel().name,
|
var name = item.object.getModel().name,
|
||||||
numWordsinName = name.split(' ').length,
|
//numWordsinName = name.split(' ').length,
|
||||||
numWordsinTerm = term.split(' ').length,
|
//numWordsinTerm = term.split(' ').length,
|
||||||
weight = 1.5,
|
weight = 1.5,
|
||||||
score = (term.length / name.length)/*(numWordsinTerm / numWordsinName)*/ * weight;
|
score = (term.length / name.length) * weight;
|
||||||
|
|
||||||
return score;
|
return score;
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user