Adds optional advanced section to catalog save modal

Signed-off-by: Andrew Donald Kennedy <[email protected]>


Project: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/repo
Commit: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/commit/b6692321
Tree: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/tree/b6692321
Diff: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/diff/b6692321

Branch: refs/heads/master
Commit: b66923215180412954333957ddd20eb87c427117
Parents: 474de9e
Author: Andrew Donald Kennedy <[email protected]>
Authored: Wed Nov 7 13:27:53 2018 +0000
Committer: Andrew Donald Kennedy <[email protected]>
Committed: Fri Nov 9 10:23:43 2018 +0000

----------------------------------------------------------------------
 .../catalog-saver/catalog-saver.directive.js    | 30 +++----
 .../catalog-saver.modal.template.html           | 83 +++++++++++---------
 2 files changed, 60 insertions(+), 53 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/b6692321/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 5437065..c1042a9 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
@@ -60,17 +60,19 @@ export function saveToCatalogModalDirective($rootScope, 
$uibModal, $injector, co
         link: link
     };
 
-    function link($scope, $element, $compile, controller) {
+    function link($scope, $element) {
         $scope.buttonText = $scope.config.label || ($scope.config.itemType ? 
`Update ${$scope.config.name || $scope.config.symbolicName}` : 'Add to 
catalog');
 
         $scope.activateModal = () => {
             function injectorGet(reference) { return 
$element.injector().get(reference); }
-            function blueprintService() { return 
injectorGet('blueprintService'); }
+            let blueprintService = injectorGet('blueprintService');
 
-            let entity = blueprintService().get();
-            let config = controller.saveToCatalogConfig;
+            let entity = blueprintService.get();
+            let metadata = blueprintService.entityHasMetadata(entity) ? 
blueprintService.getEntityMetadata(entity) : { };
+            let config = $scope.$parent.$parent.vm.saveToCatalogConfig;
 
             // Reset the config values if this is not an update
+            $scope.isUpdate = Object.keys($scope.config).length > 1;
             if (!$scope.isUpdate) {
                 config = {
                     itemType: 'entity',
@@ -78,29 +80,28 @@ export function saveToCatalogModalDirective($rootScope, 
$uibModal, $injector, co
             }
 
             // Set various properties from the blueprint entity data
-            if (!config.version && entity.hasVersion()) {
-                config.version = entity.version;
+            if (!config.version && (entity.hasVersion() || 
metadata.has('version'))) {
+                config.version = entity.version || metadata.get('version');
             }
-            if (!config.iconUrl && entity.hasIcon()) {
-                config.iconUrl = entity.icon;
+            if (!config.iconUrl && (entity.hasIcon() || 
metadata.has('iconUrl'))) {
+                config.iconUrl = entity.icon || metadata.get('iconUrl');
             }
             if (!config.name && entity.hasName()) {
                 config.name = entity.name;
             }
-            if (!config.symbolicName && entity.hasId()) {
-                config.symbolicName = entity.id;
+            if (!config.symbolicName && (entity.hasId() || 
metadata.has('id'))) {
+                config.symbolicName = entity.id || metadata.get('id');
             }
             if (!config.bundle) {
-                let bundle = config.symbolicName || config.name;
-                bundle = 
bundle.split(/[^-a-zA-Z0-9.,_]+/).join('-').toLowerCase();
-                config.bundle = bundle;
+                let bundle = config.symbolicName || config.name || 'untitled';
+                config.bundle = 
bundle.split(/[^-a-zA-Z0-9.,_]+/).join('-').toLowerCase();
                 if (!config.symbolicName) {
                     config.symbolicName = bundle;
                 }
             }
 
             // Override this callback to update configuration data elsewhere
-            (composerOverrides.updateCatalogConfig || ((config, $element, 
controller) => { }))(config, $element, controller);
+            $scope.config = (composerOverrides.updateCatalogConfig || 
((config, $element) => config))(config, $element);
 
             let modalInstance = $uibModal.open({
                 templateUrl: TEMPLATE_MODAL_URL,
@@ -117,7 +118,6 @@ export function saveToCatalogModalDirective($rootScope, 
$uibModal, $injector, co
                         break;
                     case REASONS.deploy:
                         $rootScope.$broadcast('blueprint.deploy');
-                        $scope.isUpdate = true;
                         break;
                 }
             });

http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/b6692321/ui-modules/blueprint-composer/app/components/catalog-saver/catalog-saver.modal.template.html
----------------------------------------------------------------------
diff --git 
a/ui-modules/blueprint-composer/app/components/catalog-saver/catalog-saver.modal.template.html
 
b/ui-modules/blueprint-composer/app/components/catalog-saver/catalog-saver.modal.template.html
index 39b203a..97a43ce 100644
--- 
a/ui-modules/blueprint-composer/app/components/catalog-saver/catalog-saver.modal.template.html
+++ 
b/ui-modules/blueprint-composer/app/components/catalog-saver/catalog-saver.modal.template.html
@@ -23,17 +23,17 @@
 
 <div class="modal-body add-to-catalog-modal">
     <form ng-show="state.view === VIEWS.form" name="form" novalidate>
-        <div class="form-group" ng-class="{'has-error': form.bundle.$invalid}">
-            <label class="control-label">Bundle ID</label>
-            <div class="input-group">
-                <span class="input-group-addon">catalog-bom-</span>
-                <input ng-model="config.bundle" ng-disabled="state.saving" 
class="form-control" placeholder="E.g my-bundle" name="bundle" required 
ng-pattern="state.pattern" autofocus />
-            </div>
-            <p class="help-block" ng-show="form.bundle.$invalid">
-                <span ng-if="form.bundle.$error.required">You must specify a 
bundle ID</span>
-                <span ng-if="form.bundle.$error.pattern">The bundle ID can 
contains only letters, numbers as well a the following characters: 
<code>.</code>, <code>-</code> and <code>_</code></span>
-            </p>
+
+        <div class="form-group">
+            <label class="control-label">Blueprint display name</label>
+            <input ng-model="config.name" ng-disabled="state.saving" 
class="form-control" name="name" type="text" />
         </div>
+
+        <div class="form-group">
+            <label class="control-label">Blueprint description</label>
+            <textarea ng-model="config.description" ng-disabled="state.saving" 
class="form-control" name="description" rows="3"></textarea>
+        </div>
+
         <div class="form-group" ng-class="{'has-error': 
form.version.$invalid}">
             <label class="control-label">Version</label>
             <div class="input-group">
@@ -51,35 +51,42 @@
                 <span ng-if="form.version.$error.exist">This version has 
already been used</span>
             </p>
         </div>
-        <div class="form-group" ng-class="{'has-error': 
form.symbolicName.$invalid}">
-            <label class="control-label">Blueprint symbolic name</label>
-            <input ng-model="config.symbolicName" ng-disabled="state.saving" 
class="form-control" placeholder="E.g my-catalog-id" name="symbolicName" 
required ng-pattern="state.pattern" autofocus />
-            <p class="help-block" ng-show="form.symbolicName.$invalid">
-                <span ng-if="form.symbolicName.$error.required">You must 
specify a blueprint symbolic name</span>
-                <span ng-if="form.symbolicName.$error.pattern">The blueprint 
symbolic name can contains only letters, numbers as well a the following 
characters: <code>.</code>, <code>-</code> and <code>_</code></span>
-            </p>
-        </div>
 
-        <div class="form-group" ng-class="{'has-error': 
form.itemType.$invalid}">
-            <label class="control-label">Blueprint type</label>
-            <select class="form-control" name="itemType" ng-options="type.id 
as type.label for type in TYPES" ng-model="config.itemType" 
ng-disabled="state.saving" required >
-            </select>
-            <p class="help-block" ng-show="form.itemType.$invalid">
-                <span ng-if="form.itemType.$error.required">You must specify a 
blueprint type</span>
-            </p>
-        </div>
-        <div class="form-group">
-            <label class="control-label">Blueprint display name</label>
-            <input ng-model="config.name" ng-disabled="state.saving" 
class="form-control" name="name" type="text" />
-        </div>
-        <div class="form-group">
-            <label class="control-label">Blueprint description</label>
-            <textarea ng-model="config.description" ng-disabled="state.saving" 
class="form-control" name="description" rows="3"></textarea>
-        </div>
-        <div class="form-group">
-            <label class="control-label">Blueprint icon url</label>
-            <input ng-model="config.iconUrl" ng-disabled="state.saving" 
class="form-control" name="iconUrl" type="text" />
-        </div>
+        <br-collapsible heading="Advanced">
+            <div class="form-group" ng-class="{'has-error': 
form.bundle.$invalid}">
+                <label class="control-label">Bundle ID</label>
+                <div class="input-group">
+                    <span class="input-group-addon">catalog-bom-</span>
+                    <input ng-model="config.bundle" ng-disabled="state.saving" 
class="form-control" placeholder="E.g my-bundle" name="bundle" required 
ng-pattern="state.pattern" autofocus />
+                </div>
+                <p class="help-block" ng-show="form.bundle.$invalid">
+                    <span ng-if="form.bundle.$error.required">You must specify 
a bundle ID</span>
+                    <span ng-if="form.bundle.$error.pattern">The bundle ID can 
contains only letters, numbers as well a the following characters: 
<code>.</code>, <code>-</code> and <code>_</code></span>
+                </p>
+            </div>
+
+            <div class="form-group" ng-class="{'has-error': 
form.symbolicName.$invalid}">
+                <label class="control-label">Blueprint symbolic name</label>
+                <input ng-model="config.symbolicName" 
ng-disabled="state.saving" class="form-control" placeholder="E.g my-catalog-id" 
name="symbolicName" required ng-pattern="state.pattern" autofocus />
+                <p class="help-block" ng-show="form.symbolicName.$invalid">
+                    <span ng-if="form.symbolicName.$error.required">You must 
specify a blueprint symbolic name</span>
+                    <span ng-if="form.symbolicName.$error.pattern">The 
blueprint symbolic name can contains only letters, numbers as well a the 
following characters: <code>.</code>, <code>-</code> and <code>_</code></span>
+                </p>
+            </div>
+
+            <div class="form-group" ng-class="{'has-error': 
form.itemType.$invalid}">
+                <label class="control-label">Blueprint type</label>
+                <select class="form-control" name="itemType" 
ng-options="type.id as type.label for type in TYPES" ng-model="config.itemType" 
ng-disabled="state.saving" required >
+                </select>
+                <p class="help-block" ng-show="form.itemType.$invalid">
+                    <span ng-if="form.itemType.$error.required">You must 
specify a blueprint type</span>
+                </p>
+            </div>
+            <div class="form-group">
+                <label class="control-label">Blueprint icon url</label>
+                <input ng-model="config.iconUrl" ng-disabled="state.saving" 
class="form-control" name="iconUrl" type="text" />
+            </div>
+        </br-collapsible>
     </form>
 
     <div class="text-center" ng-show="state.view === VIEWS.saved">

Reply via email to