alihan/openmct
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Search] Update load-more, add check-all

Browse Source 
Make the 'Load more' button work with the
new filtered results. Added 'ALL' to the top
of the search menu which allows the user to
toggle all of the filtering options easily.
This commit is contained in:
slhale
2015-08-13 13:19:25 -07:00
parent b26aa3cab7
commit 2e767c94c4
4 changed files with 112 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
platform/search/res/templates/search.html
View File

@@ -46,23 +46,42 @@
</a>
<!-- Menu icon/button 'v' -->
<!-- Look at context menu for opening and dismissing -->
<a class="ui-symbol menu-icon"
ng-click="controller.menu()">
<a class="ui-symbol menu-icon">
v
</a>
<!-- Later make the menu into different files -->
<!-- Menu -->
<div class="menu-element search-menu-holder">
<div class="menu dropdown search-menu">
<ul>
<!-- First element is special - it's a reset option -->
<li class="search-menu-item special">
<label class="checkbox custom search-menu-checkbox">
<input type="checkbox"
class="checkbox"
ng-model="ngModel.checkAll"
ng-change="controller.checkAll()" />
<em></em>
</label>
<span class="search-menu-label">
ALL
</span>
</li>
<!-- The filter options, by type -->
<li class="search-menu-item"
ng-repeat="type in types">
<label class="checkbox custom search-menu-checkbox">
<input type="checkbox"
class="checkbox"
ng-model="ngModel.checked[type.key]" />
ng-model="ngModel.checked[type.key]"
ng-change="controller.updateOptions()" />
<em></em>
</label>
@@ -70,11 +89,15 @@
{{ type.glyph }}
</span>
{{ type.name }}
<span class="search-menu-label">
{{ type.name }}
</span>
</li>
</ul>
</div>
</div>
</div>

49
platform/search/src/controllers/SearchController.js
View File

@@ -95,13 +95,13 @@ define(function () {
// On initialization, fill the scope's types with type keys
types.forEach(function (type) {
// We only want some types: the ones that have keys and
// descriptions are probably human user usable types
if (type.key && type.description) {
// We only want some types, the ones that are probably human readable
if (type.key && type.name) {
$scope.types.push(type);
$scope.ngModel.checked[type.key] = true;
}
});
$scope.ngModel.checkAll = true;
// Re-filter the results when the checked type options change
$scope.$watch("$scope.ngModel.checked", function () {
@@ -128,9 +128,21 @@ define(function () {
},
/**
* Checks to see if there are more search results to display.
* Checks to see if there are more search results to display. If the answer
* is unclear, this function will err on there being more results.
*/
areMore: function () {
var i;
// Check to see if any of the not displayed results are of an allowed type
for (i = numResults; i < fullResults.hits.length; i += 1) {
if ($scope.ngModel.checked[fullResults.hits[i].object.getModel().type.key]) {
return true;
}
}
// If none of the ones at hand are correct, there still may be more if we
// re-search with a larger maxResults
return numResults < fullResults.total;
},
@@ -145,7 +157,7 @@ define(function () {
// Resend the query if we are out of items to display, but there are more to get
search(numResults);
} else {
$scope.results = fullResults.hits.slice(0, numResults);
$scope.results = filter(fullResults.hits);//fullResults.hits.slice(0, numResults);
}
},
@@ -168,10 +180,31 @@ define(function () {
},
/**
* Opens a menu for more search options.
* Re-filters the search restuls. Called when ngModel.checked changes.
*/
menu: function () {
console.log('open menu');
updateOptions: function () {
var type;
// Update all-checked status
$scope.ngModel.checkAll = true;
for (type in $scope.ngModel.checked) {
if (!$scope.ngModel.checked[type]) {
$scope.ngModel.checkAll = false;
}
}
// Re-filter results
$scope.results = filter(fullResults.hits);
},
/**
* Resets options.
*/
checkAll: function () {
var type;
for (type in $scope.ngModel.checked) {
$scope.ngModel.checked[type] = $scope.ngModel.checkAll;
}
}
};
}