mirror of
https://github.com/nasa/openmct.git
synced 2025-04-29 07:20:13 +00:00
[Search] Updating searchbar
Updating the searchbar to be again more similar to the search view. It now has a 'load more' button, but it is not clickable for some reason. In progress.
This commit is contained in:
parent
739fa423c5
commit
b5f8e6d90c
@ -28,11 +28,11 @@
|
|||||||
>
|
>
|
||||||
<mct-representation key="'create-button'" mct-object="navigatedObject">
|
<mct-representation key="'create-button'" mct-object="navigatedObject">
|
||||||
</mct-representation>
|
</mct-representation>
|
||||||
<!-- div>
|
<div>
|
||||||
<mct-include key="'searchbar'"
|
<mct-include key="'searchbar'"
|
||||||
mct-object="domainObject">
|
mct-object="domainObject">
|
||||||
</mct-include>
|
</mct-include>
|
||||||
</div -->
|
</div>
|
||||||
<div class='holder tree-holder abs'>
|
<div class='holder tree-holder abs'>
|
||||||
<mct-representation key="'tree'"
|
<mct-representation key="'tree'"
|
||||||
mct-object="domainObject"
|
mct-object="domainObject"
|
||||||
|
@ -20,7 +20,7 @@
|
|||||||
{
|
{
|
||||||
"key": "SearchbarController",
|
"key": "SearchbarController",
|
||||||
"implementation": "controllers/SearchbarController.js",
|
"implementation": "controllers/SearchbarController.js",
|
||||||
"depends": [ "$scope", "searchService" ]
|
"depends": [ "$scope", "$timeout", "searchService" ]
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"templates": [
|
"templates": [
|
||||||
|
@ -36,4 +36,11 @@
|
|||||||
mct-object="result.object">
|
mct-object="result.object">
|
||||||
</mct-representation>
|
</mct-representation>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Load more? -->
|
||||||
|
<div ng-if="controller.areMore()">
|
||||||
|
<button ng-click="controller.loadMore()">
|
||||||
|
Load more
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
</span>
|
</span>
|
@ -27,23 +27,81 @@
|
|||||||
define(function () {
|
define(function () {
|
||||||
"use strict";
|
"use strict";
|
||||||
|
|
||||||
function SearchbarController($scope, searchService) {
|
var INITIAL_LOAD_NUMBER = 20,
|
||||||
|
LOAD_INCREMENT = 5;
|
||||||
|
|
||||||
|
function SearchbarController($scope, $timeout, searchService) {
|
||||||
|
// Starting amount of results to load. Will get increased.
|
||||||
|
var numResults = INITIAL_LOAD_NUMBER;
|
||||||
|
|
||||||
|
function update(timestamp) {
|
||||||
|
// Get the results
|
||||||
|
$scope.results = searchService.getLatestResults(0, numResults);
|
||||||
|
|
||||||
|
// Check to make sure that these results are the latest ones
|
||||||
|
function waitForLatest() {
|
||||||
|
var timestamps = searchService.getLatestTimestamps(),
|
||||||
|
areOld = timestamps.some(function(c) {return c < timestamp;});
|
||||||
|
// If any of the timestamps are older than the one we made the query with
|
||||||
|
if (areOld) {
|
||||||
|
// Then wait and try to update again
|
||||||
|
searchService.updateResults();
|
||||||
|
$timeout(waitForLatest, 100);
|
||||||
|
} else {
|
||||||
|
// We got the latest results now
|
||||||
|
$scope.results = searchService.getLatestResults(0, numResults);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
waitForLatest();
|
||||||
|
}
|
||||||
|
|
||||||
|
function search(inputID) {
|
||||||
|
var date = new Date(),
|
||||||
|
timestamp = date.getTime();
|
||||||
|
|
||||||
|
// Reset 'load more'
|
||||||
|
numResults = INITIAL_LOAD_NUMBER;
|
||||||
|
|
||||||
|
// Send the query
|
||||||
|
searchService.sendQuery(inputID, timestamp);
|
||||||
|
|
||||||
|
update(timestamp);
|
||||||
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
// Search the database using the user input of id "searchinput"
|
/**
|
||||||
search: function (inputID) {
|
* Search the filetree.
|
||||||
searchService.query(inputID).then(function (c) {
|
*
|
||||||
$scope.results = c;
|
* @param inputID The name of the ID property of the html text
|
||||||
});
|
* input where this funcion should find the search term.
|
||||||
},
|
*/
|
||||||
|
search: search,
|
||||||
|
|
||||||
// Check to see if there are any search results to display.
|
/**
|
||||||
|
* Checks to see if there are any search results to display.
|
||||||
|
*/
|
||||||
areResults: function () {
|
areResults: function () {
|
||||||
if ($scope.results) {
|
if ($scope.results) {
|
||||||
return $scope.results.length > 0;
|
return $scope.results.length > 0;
|
||||||
} else {
|
} else {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Checks to see if there are more search results to display.
|
||||||
|
*/
|
||||||
|
areMore: function () {
|
||||||
|
return numResults < searchService.getNumResults();
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Increases the number of search results to display, and then
|
||||||
|
* load them.
|
||||||
|
*/
|
||||||
|
loadMore: function () {
|
||||||
|
numResults += LOAD_INCREMENT;
|
||||||
|
update();
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user