You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@brooklyn.apache.org by tb...@apache.org on 2018/10/30 17:35:55 UTC
[04/11] brooklyn-ui git commit: add a footer to make it easier to
navigate palette when filters don't match
add a footer to make it easier to navigate palette when filters don't match
Project: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/repo
Commit: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/commit/ca88021b
Tree: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/tree/ca88021b
Diff: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/diff/ca88021b
Branch: refs/heads/master
Commit: ca88021b9907effa9efc3119bae0d98e7322c376
Parents: 44262c8
Author: Alex Heneveld <al...@cloudsoftcorp.com>
Authored: Fri Oct 26 11:29:47 2018 +0100
Committer: Alex Heneveld <al...@cloudsoftcorp.com>
Committed: Fri Oct 26 12:06:13 2018 +0100
----------------------------------------------------------------------
.../catalog-selector-palette-footer.html | 42 ++++++++++++++++++++
.../catalog-selector.directive.js | 10 +++--
.../catalog-selector/catalog-selector.less | 24 +++++++++++
.../catalog-selector.template.html | 3 --
.../providers/recently-used-service.provider.js | 2 -
5 files changed, 73 insertions(+), 8 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/ca88021b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector-palette-footer.html
----------------------------------------------------------------------
diff --git a/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector-palette-footer.html b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector-palette-footer.html
new file mode 100644
index 0000000..e83b906
--- /dev/null
+++ b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector-palette-footer.html
@@ -0,0 +1,42 @@
+<div class="paletteItemsFooter">
+ <div ng-if="searchedItems.length === 0" class="no-match">
+ <i class="fa fa-lemon-o"></i>
+ </div>
+ <small class="help-block text-sm palette-footer-message">
+ <span ng-if="search">
+ <span ng-if="searchedItems.length === 0">
+ <span ng-if="!skippingFilters && itemsBeforeActiveFilters.length > itemsAfterActiveFilters.length">
+ <b>{{ itemsBeforeActiveFilters.length - itemsAfterActiveFilters.length }} item{{ itemsBeforeActiveFilters.length - itemsAfterActiveFilters.length > 1 ? 's' : ''}}</b>
+ matching search but excluded by filters.
+ <button class="btn btn-outline btn-info" ng-click="disableFilters()">Clear filters</button>
+ </span>
+ <span ng-if="skippingFilters || itemsBeforeActiveFilters.length === 0">
+ No matches for <code>{{ search }}</code>.
+ </span>
+ </span>
+ <span ng-if="searchedItems.length > 0">
+ <span ng-if="skippingFilters">
+ <b>No matches with selected filters.</b><br/>
+ Showing matches ignoring filters.
+ </span>
+ <span ng-if="!skippingFilters && itemsBeforeActiveFilters.length > itemsAfterActiveFilters.length">
+ <b>{{ itemsBeforeActiveFilters.length - itemsAfterActiveFilters.length }} more item{{ itemsBeforeActiveFilters.length - itemsAfterActiveFilters.length > 1 ? 's' : ''}}</b>
+ matching search but excluded by filters.
+ <button class="btn btn-outline btn-info" ng-click="disableFilters()">Clear filters</button>
+ </span>
+ </span>
+ </span>
+ <span ng-if="!search">
+ <span ng-if="skippingFilters && searchedItems.length > 0">
+ <b>Nothing available in selected filters.</b><br/>
+ Ignoring filters.
+ </span>
+ <span ng-if="!skippingFilters && itemsBeforeActiveFilters.length > itemsAfterActiveFilters.length">
+ <b>{{ itemsBeforeActiveFilters.length - itemsAfterActiveFilters.length }} more item{{ itemsBeforeActiveFilters.length - itemsAfterActiveFilters.length > 1 ? 's' : ''}}</b>
+ excluded by filters.
+ <button class="btn btn-outline btn-info" ng-click="disableFilters()">Clear filters</button>
+ </span>
+ </span>
+
+ </small>
+</div>
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/ca88021b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.directive.js
----------------------------------------------------------------------
diff --git a/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.directive.js b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.directive.js
index 61420d5..d06a671 100644
--- a/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.directive.js
+++ b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.directive.js
@@ -19,6 +19,7 @@
import angular from 'angular';
import {EntityFamily} from '../util/model/entity.model';
import template from './catalog-selector.template.html';
+import footerTemplate from './catalog-selector-palette-footer.html';
import moment from "moment";
const MIN_ROWS_PER_PAGE = 4;
@@ -281,7 +282,10 @@ function controller($scope, $element, $timeout, $q, $uibModal, $log, $templateCa
return $scope.recentItems;
}, enabled: false },
];
- $scope.disableFilters = () => $scope.filters.forEach( f => f.enabled = false );
+ $scope.disableFilters = (showFilters) => {
+ $scope.filters.forEach( f => f.enabled = false );
+ if (showFilters !== false) $scope.showPaletteControls = true;
+ }
// this can be overridden for palette sections/modes which show a subset of the types returned by the server;
// this is applied when the data is received from the server.
@@ -321,8 +325,8 @@ function controller($scope, $element, $timeout, $q, $uibModal, $log, $templateCa
$scope.customSubHeadTemplateName = 'composer-palette-empty-sub-head';
$templateCache.put($scope.customSubHeadTemplateName, '');
- $scope.customFooterTemplateName = 'composer-palette-empty-footer';
- $templateCache.put($scope.customFooterTemplateName, '');
+ $scope.customFooterTemplateName = 'composer-palette-default-footer';
+ $templateCache.put($scope.customFooterTemplateName, footerTemplate);
// allow downstream to configure this controller and/or scope
(composerOverrides.configurePaletteController || function() {})(this, $scope, $element);
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/ca88021b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.less
----------------------------------------------------------------------
diff --git a/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.less b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.less
index cb5baef..969ac1f 100644
--- a/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.less
+++ b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.less
@@ -207,6 +207,30 @@ catalog-selector {
}
}
}
+ .catalog-palette-footer {
+ .palette-footer-message {
+ .btn {
+ font-size: inherit;
+ padding: 3px 8px;
+ margin-left: 1em;
+ font-style: normal;
+ }
+ text-align: right;
+ // useful if it wraps, e.g. because pagination buttons show:
+ line-height: 2;
+ margin-top: -2px;
+ }
+ div[uib-pagination] {
+ margin-left: 1em;
+ }
+ .no-match {
+ font-size: 8em;
+ margin-top: 24px;
+ margin-bottom: 36px;
+ text-align: center;
+ color: @gray-lighter;
+ }
+ }
}
.catalog-selector-popover {
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/ca88021b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.template.html
----------------------------------------------------------------------
diff --git a/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.template.html b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.template.html
index ce93cd3..eefd21a 100644
--- a/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.template.html
+++ b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.template.html
@@ -94,9 +94,6 @@
</div>
<ng-include src="customSubHeadTemplateName"/>
</div>
- <small class="help-block text-sm no-match" ng-if="search && searchedItems.length === 0">
- No {{family.displayName.toLowerCase()}} matching the current search
- </small>
</div>
<div class="row grid">
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/ca88021b/ui-modules/blueprint-composer/app/components/providers/recently-used-service.provider.js
----------------------------------------------------------------------
diff --git a/ui-modules/blueprint-composer/app/components/providers/recently-used-service.provider.js b/ui-modules/blueprint-composer/app/components/providers/recently-used-service.provider.js
index f29fb4e..01a9a35 100644
--- a/ui-modules/blueprint-composer/app/components/providers/recently-used-service.provider.js
+++ b/ui-modules/blueprint-composer/app/components/providers/recently-used-service.provider.js
@@ -58,7 +58,5 @@ function RecentlyUsedService($log) {
item.lastUsed = service.getLastUsed(item);
};
- service.markUsed('io.cloudsoft.demo.bank.threetier:0.1.0-SNAPSHOT::db:0.1.0-SNAPSHOT', 100);
-
return service;
}