You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@brooklyn.apache.org by he...@apache.org on 2018/08/20 15:06:25 UTC
[2/6] brooklyn-ui git commit: expose more plugin points in composer
expose more plugin points in composer
Project: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/repo
Commit: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/commit/efefc3f1
Tree: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/tree/efefc3f1
Diff: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/diff/efefc3f1
Branch: refs/heads/master
Commit: efefc3f12f2369ee75e93376252600b82be20f91
Parents: 0f1c870
Author: Alex Heneveld <al...@cloudsoftcorp.com>
Authored: Fri Aug 10 16:00:06 2018 +0100
Committer: Alex Heneveld <al...@cloudsoftcorp.com>
Committed: Fri Aug 10 16:00:06 2018 +0100
----------------------------------------------------------------------
.../catalog-saver/catalog-saver.directive.js | 2 +-
.../catalog-selector.directive.js | 21 ++++++--
.../catalog-selector/catalog-selector.less | 4 ++
.../catalog-selector.template.html | 9 ++--
ui-modules/blueprint-composer/app/index.js | 57 ++++++++++++--------
.../app/views/main/graphical/graphical.state.js | 6 ++-
.../app/views/main/main.controller.js | 11 ++--
7 files changed, 73 insertions(+), 37 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/efefc3f1/ui-modules/blueprint-composer/app/components/catalog-saver/catalog-saver.directive.js
----------------------------------------------------------------------
diff --git a/ui-modules/blueprint-composer/app/components/catalog-saver/catalog-saver.directive.js b/ui-modules/blueprint-composer/app/components/catalog-saver/catalog-saver.directive.js
index 33bda2e..5da6f77 100644
--- a/ui-modules/blueprint-composer/app/components/catalog-saver/catalog-saver.directive.js
+++ b/ui-modules/blueprint-composer/app/components/catalog-saver/catalog-saver.directive.js
@@ -55,7 +55,7 @@ export function saveToCatalogModalDirective($rootScope, $uibModal) {
};
function link($scope) {
- $scope.buttonText = Object.keys($scope.config).length > 0 ? `Update ${$scope.config.name || $scope.config.symbolicName}` : 'Add to catalog';
+ $scope.buttonText = $scope.config.label || ($scope.config.itemType ? `Update ${$scope.config.name || $scope.config.symbolicName}` : 'Add to catalog');
$scope.activateModal = () => {
let modalInstance = $uibModal.open({
template: modalTemplate,
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/efefc3f1/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 e19b1a2..a160635 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
@@ -31,10 +31,11 @@ export function catalogSelectorDirective() {
family: '<',
onSelect: '&',
itemsPerPage: '<',
- reservedKeys: '<?'
+ reservedKeys: '<?',
+ mode: '@?', // for use by downstream projects to pass in special modes
},
template: template,
- controller: ['$scope', '$q', '$uibModal', '$log', 'paletteApi', 'paletteDragAndDropService', 'iconGenerator', controller]
+ controller: ['$scope', '$element', '$q', '$uibModal', '$log', '$templateCache', 'paletteApi', 'paletteDragAndDropService', 'iconGenerator', 'composerOverrides', controller]
};
}
@@ -107,7 +108,7 @@ export function catalogSelectorSortFilter($filter) {
}
}
-function controller($scope, $q, $uibModal, $log, paletteApi, paletteDragAndDropService, iconGenerator) {
+function controller($scope, $element, $q, $uibModal, $log, $templateCache, paletteApi, paletteDragAndDropService, iconGenerator, composerOverrides) {
$scope.pagination = {
page: 1,
itemsPerPage: $scope.itemsPerPage || ITEMS_PER_PAGE
@@ -116,6 +117,12 @@ function controller($scope, $q, $uibModal, $log, paletteApi, paletteDragAndDropS
orders: ['name', 'type', 'id'],
currentOrder: 'name'
};
+ $scope.getEntityNameForPalette = function(item, entityName) {
+ return (composerOverrides.getEntityNameForPalette ||
+ // above can be overridden with function of signature below to customize display name in palette
+ function(item, entityName, scope) { return entityName; }
+ )(item, entityName, $scope);
+ }
$scope.getPlaceHolder = function () {
return 'Search';
@@ -223,4 +230,12 @@ function controller($scope, $q, $uibModal, $log, paletteApi, paletteDragAndDropS
});
$scope.items = items;
});
+ $scope.filterPaletteItems = (items) => items;
+
+ // downstream can override this to insert lines below the header
+ $scope.customSubHeadTemplateName = 'composer-palette-empty-sub-head';
+ $templateCache.put($scope.customSubHeadTemplateName, 'xxx');
+
+ // 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/efefc3f1/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 e0bdb73..5829dc2 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
@@ -122,6 +122,10 @@ catalog-selector {
margin-top: 3px;
margin-bottom: 3px;
}
+ .no-match {
+ margin-top: 12px;
+ font-style: italic;
+ }
.spinner-area {
height: 300px;
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/efefc3f1/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 92a7de9..40c9bd6 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
@@ -51,8 +51,9 @@
{{(searchedItems.length === 0 && search && allowFreeForm() ? 1 : searchedItems.length) == 1 ? 'item' : 'items'}}
</span>
</div>
+ <ng-include src="customSubHeadTemplateName"/>
</div>
- <small class="help-block text-sm" ng-if="search && searchedItems.length === 0">
+ <small class="help-block text-sm no-match" ng-if="search && searchedItems.length === 0">
No {{family.displayName.toLowerCase()}} matching the current search
</small>
@@ -60,14 +61,14 @@
<!-- here and below, col-xs-3 or -4 or -2 all work giving different densities;
this could be configurable ("compressed"=xs-2 w no labels, "normal"=xs-3, "big"=xs-4) -->
<div class="col-xs-3 catalog-palette-item"
- ng-repeat="item in searchedItems = (items | catalogSelectorSearch:search | catalogSelectorSort:family) | orderBy:state.currentOrder | limitTo:pagination.itemsPerPage:(pagination.page-1)*pagination.itemsPerPage track by (item.containingBundle + ':' + item.symbolicName + ':' + item.version)"
+ ng-repeat="item in searchedItems = (filterPaletteItems(items) | catalogSelectorSearch:search | catalogSelectorSort:family) | orderBy:state.currentOrder | limitTo:pagination.itemsPerPage:(pagination.page-1)*pagination.itemsPerPage track by (item.containingBundle + ':' + item.symbolicName + ':' + item.version)"
ng-click="onSelectItem(item)">
<div class="item" draggable="true" ng-dragstart="onDragItem(item, $event)" ng-dragend="onDragEnd(item, $event)">
<div class="item-logo">
<img ng-src="{{item | iconGeneratorPipe:'symbolicName'}}" alt="{{item.displayName}} logo" on-error="onImageError" item-id="{{item.symbolicName}}"/>
</div>
<div class="item-content" ng-class="{ deprecated: item.deprecated }">
- <h3>{{item | entityName}}</h3>
+ <h3>{{ getEntityNameForPalette(item, item | entityName) }}</h3>
</div>
<i class="fa fa-info-circle"
uib-popover-template="'QuickInfoTemplate.html'"
@@ -113,4 +114,4 @@
</div>
</div>
</script>
-<!-- QUICK INFO TEMPLATE :: END-->
\ No newline at end of file
+<!-- QUICK INFO TEMPLATE :: END-->
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/efefc3f1/ui-modules/blueprint-composer/app/index.js
----------------------------------------------------------------------
diff --git a/ui-modules/blueprint-composer/app/index.js b/ui-modules/blueprint-composer/app/index.js
index f7a55b2..6dfbe5b 100755
--- a/ui-modules/blueprint-composer/app/index.js
+++ b/ui-modules/blueprint-composer/app/index.js
@@ -36,38 +36,38 @@ import brooklynUserManagement from 'brooklyn-ui-utils/user-management/user-manag
import brYamlEditor from 'brooklyn-ui-utils/yaml-editor/yaml-editor';
import brUtils from 'brooklyn-ui-utils/utils/general';
-import brSpecEditor from 'components/spec-editor/spec-editor.directive';
-import brooklynCatalogSaver from 'components/catalog-saver/catalog-saver.directive';
+import brSpecEditor from './components/spec-editor/spec-editor.directive';
+import brooklynCatalogSaver from './components/catalog-saver/catalog-saver.directive';
import paletteApiProvider from "./components/providers/palette-api.provider"
import brooklynApi from "brooklyn-ui-utils/brooklyn.api/brooklyn.api";
-import {designerDirective} from "components/designer/designer.directive";
+import {designerDirective} from "./components/designer/designer.directive";
import {
catalogSelectorDirective,
catalogSelectorSearchFilter,
catalogSelectorSortFilter
-} from "components/catalog-selector/catalog-selector.directive";
+} from "./components/catalog-selector/catalog-selector.directive";
import customActionDirective from "./components/custom-action/custom-action.directive";
-import {onErrorDirective} from "components/catalog-selector/on-error.directive";
-import {breadcrumbsDirective} from "components/breacrumbs/breadcrumbs.directive";
-import {recursionHelperFactory} from "components/factories/recursion-helper.factory";
-import {objectCacheFactory} from 'components/factories/object-cache.factory';
-import {entityNameFilter, entityVersionFilter, entityTypesFilter} from "components/filters/entity.filter";
-import {locationsFilter} from "components/filters/locations.filter";
-import {blueprintServiceProvider} from "components/providers/blueprint-service.provider";
-import {dslServiceProvider} from "components/providers/dsl-service.provider";
-import {paletteDragAndDropServiceProvider} from "components/providers/palette-dragndrop.provider";
+import {onErrorDirective} from "./components/catalog-selector/on-error.directive";
+import {breadcrumbsDirective} from "./components/breacrumbs/breadcrumbs.directive";
+import {recursionHelperFactory} from "./components/factories/recursion-helper.factory";
+import {objectCacheFactory} from './components/factories/object-cache.factory';
+import {entityNameFilter, entityVersionFilter, entityTypesFilter} from "./components/filters/entity.filter";
+import {locationsFilter} from "./components/filters/locations.filter";
+import {blueprintServiceProvider} from "./components/providers/blueprint-service.provider";
+import {dslServiceProvider} from "./components/providers/dsl-service.provider";
+import {paletteDragAndDropServiceProvider} from "./components/providers/palette-dragndrop.provider";
import {actionServiceProvider} from "./components/providers/action-service.provider";
-import {mainState} from "views/main/main.controller";
-import {yamlState} from "views/main/yaml/yaml.state";
-import {graphicalState} from "views/main/graphical/graphical.state";
-import {graphicalEditState} from "views/main/graphical/edit/edit.controller";
-import {graphicalEditAddState} from "views/main/graphical/edit/add/add";
-import {graphicalEditEntityState} from "views/main/graphical/edit/entity/edit.entity.controller";
-import {graphicalEditPolicyState} from "views/main/graphical/edit/policy/edit.policy.controller";
-import {graphicalEditEnricherState} from "views/main/graphical/edit/enricher/edit.enricher.controller";
-import {graphicalEditSpecState} from "views/main/graphical/edit/spec/edit.spec.controller";
-import {graphicalEditDslState, dslParamLabelFilter} from "views/main/graphical/edit/dsl/edit.dsl.controller";
+import {mainState} from "./views/main/main.controller";
+import {yamlState} from "./views/main/yaml/yaml.state";
+import {graphicalState} from "./views/main/graphical/graphical.state";
+import {graphicalEditState} from "./views/main/graphical/edit/edit.controller";
+import {graphicalEditAddState} from "./views/main/graphical/edit/add/add";
+import {graphicalEditEntityState} from "./views/main/graphical/edit/entity/edit.entity.controller";
+import {graphicalEditPolicyState} from "./views/main/graphical/edit/policy/edit.policy.controller";
+import {graphicalEditEnricherState} from "./views/main/graphical/edit/enricher/edit.enricher.controller";
+import {graphicalEditSpecState} from "./views/main/graphical/edit/spec/edit.spec.controller";
+import {graphicalEditDslState, dslParamLabelFilter} from "./views/main/graphical/edit/dsl/edit.dsl.controller";
import bottomSheet from "brooklyn-ui-utils/bottom-sheet/bottom-sheet";
import stackViewer from 'angular-java-stack-viewer';
@@ -80,6 +80,7 @@ angular.module('app', [ngAnimate, ngResource, ngCookies, ngClipboard, uiRouter,
.provider('dslService', dslServiceProvider)
.provider('paletteDragAndDropService', paletteDragAndDropServiceProvider)
.provider('actionService', actionServiceProvider)
+ .provider('composerOverrides', composerOverridesProvider)
.factory('recursionHelper', ['$compile', recursionHelperFactory])
.factory('objectCache', ['$cacheFactory', objectCacheFactory])
.filter('entityName', entityNameFilter)
@@ -111,6 +112,16 @@ function applicationConfig($urlRouterProvider, $stateProvider, $logProvider) {
.state(graphicalEditDslState);
}
+function composerOverridesProvider() {
+ // callers can do angular.config(['composerOverridesProvider', function (provider) { provider.add({ ... }) })
+ // to set various configuration. to see what configuration is supported, grep for composerOverrides in this project.
+ var result = {};
+ return {
+ $get: () => result,
+ add: (props) => angular.extend(result, props),
+ };
+}
+
function actionConfig(actionServiceProvider) {
actionServiceProvider.addAction("deploy", {html: '<button class="btn btn-success" ng-click="vm.deployApplication()" ng-disabled="vm.deploying">Deploy</button>'});
actionServiceProvider.addAction("add", {html: '<catalog-saver config="vm.saveToCatalogConfig"></catalog-saver>'});
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/efefc3f1/ui-modules/blueprint-composer/app/views/main/graphical/graphical.state.js
----------------------------------------------------------------------
diff --git a/ui-modules/blueprint-composer/app/views/main/graphical/graphical.state.js b/ui-modules/blueprint-composer/app/views/main/graphical/graphical.state.js
index 00e8180..470d59e 100644
--- a/ui-modules/blueprint-composer/app/views/main/graphical/graphical.state.js
+++ b/ui-modules/blueprint-composer/app/views/main/graphical/graphical.state.js
@@ -25,7 +25,9 @@ import template from './graphical.state.html';
export const graphicalState = {
name: 'main.graphical',
url: 'graphical',
- template: template,
+ templateProvider: function(composerOverrides) {
+ return composerOverrides.paletteGraphicalStateTemplate || template;
+ },
controller: ['$scope', '$state', 'blueprintService', graphicalController],
data: {
label: 'Graphical Designer'
@@ -65,4 +67,4 @@ function graphicalController($scope, $state, blueprintService) {
$state.go(graphicalEditEntityState, {entityId: rootEntity._id});
}
};
-}
\ No newline at end of file
+}
http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/efefc3f1/ui-modules/blueprint-composer/app/views/main/main.controller.js
----------------------------------------------------------------------
diff --git a/ui-modules/blueprint-composer/app/views/main/main.controller.js b/ui-modules/blueprint-composer/app/views/main/main.controller.js
index 401b8f6..da932ff 100644
--- a/ui-modules/blueprint-composer/app/views/main/main.controller.js
+++ b/ui-modules/blueprint-composer/app/views/main/main.controller.js
@@ -56,7 +56,7 @@ const layers = [
];
const layerCacheKey = 'blueprint-composer.layers';
-export function MainController($scope, $log, $state, $stateParams, brBrandInfo, blueprintService, actionService, catalogApi, applicationApi, brSnackbar, brBottomSheet, edit, yaml) {
+export function MainController($scope, $element, $log, $state, $stateParams, brBrandInfo, blueprintService, actionService, catalogApi, applicationApi, brSnackbar, brBottomSheet, edit, yaml, composerOverrides) {
$scope.$emit(HIDE_INTERSTITIAL_SPINNER_EVENT);
let vm = this;
@@ -126,7 +126,7 @@ export function MainController($scope, $log, $state, $stateParams, brBrandInfo,
vm.deployApplication = function () {
if (blueprintService.hasIssues()) {
- displayIssues();
+ vm.displayIssues();
return;
}
@@ -141,7 +141,7 @@ export function MainController($scope, $log, $state, $stateParams, brBrandInfo,
return actionService.getActions();
}
- function displayIssues() {
+ vm.displayIssues = () => {
let isOnlyWarnings = blueprintService.getIssues().length === blueprintService.getIssues().filter(issue => issue.level === ISSUE_LEVEL.WARN).length;
let message = '';
let options = {};
@@ -238,6 +238,9 @@ export function MainController($scope, $log, $state, $stateParams, brBrandInfo,
});
}
}
+
+ // allow downstream to configure controller and scope here
+ (composerOverrides.configureMainController || function() {})(vm, $scope, $element);
}
export const mainState = {
@@ -245,7 +248,7 @@ export const mainState = {
url: '/?bundleSymbolicName&bundleVersion&typeSymbolicName&typeVersion&yaml',
abstract: true,
template: template,
- controller: ['$scope', '$log', '$state', '$stateParams', 'brBrandInfo', 'blueprintService', 'actionService', 'catalogApi', 'applicationApi', 'brSnackbar', 'brBottomSheet', 'edit', 'yaml', MainController],
+ controller: ['$scope', '$element', '$log', '$state', '$stateParams', 'brBrandInfo', 'blueprintService', 'actionService', 'catalogApi', 'applicationApi', 'brSnackbar', 'brBottomSheet', 'edit', 'yaml', 'composerOverrides', MainController],
controllerAs: 'vm',
resolve: {
edit: ['$stateParams', '$q', 'paletteApi', ($stateParams, $q, paletteApi) => {