Repository: brooklyn-ui
Updated Branches:
  refs/heads/master ce1240379 -> 4093d1fd0


improve logic and ui for inferring bundle and type name when saving to catalog


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

Branch: refs/heads/master
Commit: b6f0281dafb2be6067cf51307f20eef401d3d7ac
Parents: d403a91
Author: Alex Heneveld <alex.henev...@cloudsoftcorp.com>
Authored: Mon Nov 12 16:09:06 2018 +0000
Committer: Alex Heneveld <alex.henev...@cloudsoftcorp.com>
Committed: Mon Nov 12 16:09:06 2018 +0000

----------------------------------------------------------------------
 .../catalog-saver/catalog-saver.directive.js    | 39 ++++++++++++--------
 .../catalog-saver.modal.template.html           | 13 ++++---
 2 files changed, 31 insertions(+), 21 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/b6f0281d/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 be05fff..0eadfbc 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
@@ -44,6 +44,7 @@ const TYPES = [
 angular.module(MODULE_NAME, [angularAnimate, uibModal, brUtils])
     .directive('catalogSaver', ['$rootScope', '$uibModal', '$injector', 
'composerOverrides', 'blueprintService', saveToCatalogModalDirective])
     .directive('catalogVersion', ['$parse', catalogVersionDirective])
+    .filter('bundlize', bundlizeProvider)
     .run(['$templateCache', templateCache]);
 
 export default MODULE_NAME;
@@ -87,10 +88,9 @@ export function saveToCatalogModalDirective($rootScope, 
$uibModal, $injector, co
                 $scope.config.symbolicName = entity.id || metadata.get('id');
             }
             if (!$scope.config.bundle) {
-                let bundle = $scope.config.symbolicName || $scope.config.name 
|| 'untitled';
-                $scope.config.bundle = 
bundle.split(/[^-a-zA-Z0-9._]+/).join('-').toLowerCase();
-                if (!$scope.config.symbolicName) {
-                    $scope.config.symbolicName = $scope.config.bundle;
+                // NB: when editing a bundle this will already be set
+                if ($scope.config.symbolicName) {
+                    $scope.config.bundle = $scope.config.symbolicName;
                 }
             }
 
@@ -133,9 +133,9 @@ export function CatalogItemModalController($scope, 
blueprintService, paletteApi,
     $scope.getTitle = () => {
         switch ($scope.state.view) {
             case VIEWS.form:
-                return $scope.isUpdate ? `Update ${$scope.config.name || 
$scope.config.symbolicName}` : 'Add to catalog';
+                return $scope.isUpdate ? `Update ${$scope.config.name || 
$scope.config.symbolicName || 'blueprint'}` : 'Add to catalog';
             case VIEWS.saved:
-                return `${$scope.config.name || $scope.config.symbolicName} 
${$scope.isUpdate ? 'updated' : 'saved'}`;
+                return `${$scope.config.name || $scope.config.symbolicName || 
'Blueprint'} ${$scope.isUpdate ? 'updated' : 'saved'}`;
         }
     };
 
@@ -160,11 +160,22 @@ export function CatalogItemModalController($scope, 
blueprintService, paletteApi,
     function createBom() {
         let blueprint = blueprintService.getAsJson();
 
+        let bundleBase = $scope.config.bundle || bundlize($scope.config.name);
+        let bundleId = $scope.config.symbolicName || 
bundlize($scope.config.name);
+        if (!bundleBase || !bundleId) {
+            throw "Either display name must be set of bundle and symbolic name 
explicitly set";  
+        }
+        
         let bomItem = {
-            id: $scope.config.symbolicName,
+            id: bundleId,
             itemType: $scope.config.itemType,
             item: blueprint
         };
+        let bomCatalogYaml = {
+            bundle: `catalog-bom-${bundleBase}`,
+            version: $scope.config.version,
+            items: [ bomItem ]
+        };
         if (brUtilsGeneral.isNonEmpty($scope.config.name)) {
             bomItem.name = $scope.config.name;
         }
@@ -174,14 +185,8 @@ export function CatalogItemModalController($scope, 
blueprintService, paletteApi,
         if (brUtilsGeneral.isNonEmpty($scope.config.iconUrl)) {
             bomItem.iconUrl = $scope.config.iconUrl;
         }
-
-        return jsYaml.dump({
-            'brooklyn.catalog': {
-                bundle: `catalog-bom-${$scope.config.bundle}`,
-                version: $scope.config.version,
-                items: [bomItem]
-            }
-        });
+        
+        return jsYaml.dump({ 'brooklyn.catalog': bomCatalogYaml });
     }
 }
 
@@ -223,3 +228,7 @@ function templateCache($templateCache) {
     $templateCache.put(TEMPLATE_URL, template);
     $templateCache.put(TEMPLATE_MODAL_URL, modalTemplate);
 }
+
+var bundlize = (input) => input && input.split(/[^a-zA-Z0-9]+/).filter(x => 
x).join('-').toLowerCase();
+function bundlizeProvider() { return bundlize; }
+    

http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/b6f0281d/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 97a43ce..ab8dce5 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
@@ -24,9 +24,12 @@
 <div class="modal-body add-to-catalog-modal">
     <form ng-show="state.view === VIEWS.form" name="form" novalidate>
 
-        <div class="form-group">
+        <div class="form-group" ng-class="{'has-error': form.name.$invalid}">
             <label class="control-label">Blueprint display name</label>
-            <input ng-model="config.name" ng-disabled="state.saving" 
class="form-control" name="name" type="text" />
+            <input ng-model="config.name" ng-disabled="state.saving" 
class="form-control" name="name" type="text" required />
+            <p class="help-block" ng-show="form.name.$invalid">
+                <span ng-if="form.name.$error.required">You must specify a 
name for this item</span>
+            </p>
         </div>
 
         <div class="form-group">
@@ -57,19 +60,17 @@
                 <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 />
+                    <input ng-model="config.bundle" ng-disabled="state.saving" 
class="form-control" name="bundle" ng-pattern="state.pattern" autofocus 
placeholder="{{ config.name | bundlize }}"/>
                 </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 />
+                <input ng-model="config.symbolicName" 
ng-disabled="state.saving" class="form-control" name="symbolicName" 
ng-pattern="state.pattern" autofocus placeholder="{{ config.name | bundlize 
}}"/>
                 <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>

Reply via email to