Fix deploy window

Add nice textboxes to edit the blueprint parameters

Issue-ID: CLAMP-171
Change-Id: I1675d04c5849b5820e6221dcf5fa28c69cb87f5d
Signed-off-by: Determe, Sebastien (sd378r) <sd378r@intl.att.com>

diff --git a/src/main/resources/META-INF/resources/designer/partials/portfolios/deploy_parameters.html b/src/main/resources/META-INF/resources/designer/partials/portfolios/deploy_parameters.html
index 5693a87..3fc1b03 100644 (file)
--- a/src/main/resources/META-INF/resources/designer/partials/portfolios/deploy_parameters.html
+++ b/src/main/resources/META-INF/resources/designer/partials/portfolios/deploy_parameters.html
@@ -26,11 +26,11 @@
                <button type="button" class="close" ng-click="close()" aria-hidden="true" style="margin-top: -3px">&times;</button>
                <h4>Deployment parameters</h4>
        </div>
-       <div class="modal-body" style="height: 150px">
-                 <div style="height: 30px">
-        Deployment parameters as JSON.
+       <div class="modal-body" style="display:block">
+                 <div style="height: 100%;clear: both;" id="deployPropertiesDiv" name="deployPropertiesDiv" ng-init="load_deploy_parameters()" >
+        Deployment parameters.
       </div>
-      <textarea class="form-control" focus="true" name="deployProperties" id="deployProperties" ng-init="load_deploy_parameters()"/>
+     
        </div>
        <div class="modal-footer">
       <button ng-click="deploy()"  class="btn btn-primary">Deploy</button>

diff --git a/src/main/resources/META-INF/resources/designer/scripts/DeploymentCtrl.js b/src/main/resources/META-INF/resources/designer/scripts/DeploymentCtrl.js
index 950e59c..9350912 100644 (file)
--- a/src/main/resources/META-INF/resources/designer/scripts/DeploymentCtrl.js
+++ b/src/main/resources/META-INF/resources/designer/scripts/DeploymentCtrl.js
@@ -26,10 +26,18 @@ app.controller('DeploymentCtrl',
        function( $scope,  $rootScope,  $modalInstance,  data,  dialogs,   cldsModelService) {
 
            function validate_and_set_deploy_parameters () {
-                  var parameters = $("#deployProperties").val();
+                  var inputList = document.getElementsByClassName("deployFormId");
+                  var jsonParameters="{";
+                  $.each(inputList, function(key) {
+                          if (jsonParameters !== "{") {
+                                  jsonParameters = jsonParameters+",";
+                          }
+                         jsonParameters = jsonParameters+'"'+inputList[key].id+'":'+'"'+inputList[key].value+'"'
+                  });
+                  jsonParameters = jsonParameters+"}";
                try {
-                   parameters = JSON.parse(parameters);
-                   set_deploy_parameters(parameters);
+                   //Try to validate the json
+                   set_deploy_parameters(JSON.parse(jsonParameters));
                } catch (e) {
                    console.error("Couldn't parse deploy parameters json");
                }
@@ -39,7 +47,6 @@ app.controller('DeploymentCtrl',
                if (!'global' in elementMap) {
                    elementMap["global"] = [];
                }
-
                var index = elementMap["global"].findIndex(function (e) { return (typeof e == "object" && !(e instanceof Array)) && "deployParameters" == e["name"]; }); 
                if (index == -1) { 
                    elementMap["global"].push({"name": "deployParameters", "value": parameters}); 
@@ -50,8 +57,14 @@ app.controller('DeploymentCtrl',
 
            $scope.load_deploy_parameters = function () {
                   var index = elementMap["global"].findIndex(function (e) { return (typeof e == "object" && !(e instanceof Array)) && "deployParameters" == e["name"]; }); 
-               if (index != -1) { 
-                  $('#deployProperties').val(JSON.stringify(elementMap["global"][index]["value"]))
+               if (index != -1) {
+                  $('#deployPropertiesDiv').append($('<br/>'));
+                  $.each(elementMap["global"][index].value, function(key) {
+                          var propertyValue=elementMap["global"][index].value[key];
+                          $('#deployPropertiesDiv').append($('<label class="control-label">'+key+'  </label>'));
+                          $('#deployPropertiesDiv').append($('<input style="width: 100%; clear: both;" class="deployFormId" id="'+key+'"></input>').val(propertyValue).html(propertyValue));
+                          $('#deployPropertiesDiv').append($('<br/>'));
+               });
                }
            }