[Policy-52, Policy-92, Policy-93] Policy Enhancements and bugfixes

Change-Id: I5675cf4527e17963b3142cf7184c0df31a766197
Signed-off-by: Tarun Tej Velaga <tt3868@att.com>

7 files changed, 246 insertions, 61 deletions

diff --git a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplateController/DCAEMicroServicePolicyController.js b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplateController/DCAEMicroServicePolicyController.js
index fb966430c..94c1bc998 100644
--- a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplateController/DCAEMicroServicePolicyController.js
+++ b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplateController/DCAEMicroServicePolicyController.js
@@ -163,10 +163,14 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
 				var addElement = parentElement.childElementCount + 1;
 				clone.id = ''+value+'@'+addElement;
 				clone.value = '';
+				clone.className += ' child_single'; //here cloned is single element
 				document.getElementById("div."+value).appendChild(clone);
 				plainAttributeKeys.push(''+value+'@'+addElement);
 			}else{
 				div = document.getElementById("div."+value+"@0");
+				
+				div.className += ' children_group'; //here is div with a group of children.
+				
 				var childElement = parentElement.firstElementChild;
 				var countParent = parentElement.childElementCount;
 				var childElementString = childElement.innerHTML;
@@ -295,9 +299,12 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
                     	var plainAttributeKeys = [];
                     	$scope.dcaeModelData = data[0].dcaeModelData;
                     	$scope.dcaeJsonDate = data[0].jsonValue;
+                    	console.log("$scope.dcaeJsonDate: " + $scope.dcaeJsonDate);	
                     	var attributes = $scope.dcaeModelData.attributes;
                     	var refAttributes = $scope.dcaeModelData.ref_attributes;
-                    	var subAttributes = 	$scope.dcaeModelData.sub_attributes;
+                    	var subAttributes = 	$scope.dcaeModelData.sub_attributes;                    	
+                    	console.log("subAttributes: " + subAttributes);	
+                    	
                        	var enumAttributes = $scope.dcaeModelData.enumValues;
                        	var annotation = $scope.dcaeModelData.annotation;
                        	var dictionary = $scope.microServiceAttributeDictionaryDatas;
@@ -442,11 +449,11 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
 	        return Object.prototype.toString.call(arrayTest) === '[object Array]';
 	    }
 	    var lableList = [];
-	    
 		function deconstructJSON(dataTest, level , name) {
 			var array = false;
 			var label = level;
 			 var stringValue = "java.lang.String";
+			 var string = "string";
 			 var intValue = "int";
 			 var double = "double";
 			 var boolean = "boolean";
@@ -459,6 +466,7 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
 		    for (key in dataTest) {
 		    	array = isArray(dataTest[key]);
 		    	console.log(key , dataTest[key]);
+	    	
 		    	if (!!dataTest[key] && typeof(dataTest[key])=="object") {
 		    		if (array==false && key!=="0"){
 		    			$scope.labelLayout(label, key, array ); 			
@@ -500,11 +508,35 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
 		        	if (dataTest[key].includes('required-true')){
 		        		isRequired = true;
 		        	}
-		        	console.log("attirbuteLabel = " + attirbuteLabel);
+		    		
+		    		var subAttributes = $scope.dcaeModelData.sub_attributes;
+		    		
+		    		if(subAttributes){		    			
+		    			var jsonObject = JSON.parse(subAttributes);		    			
+		    			var allkeys = Object.keys(jsonObject);
+		    			if(allkeys){
+		    				for (var k = 0; k < allkeys.length; k++) {
+		    					var keyValue = allkeys[k];
+		    					console.log(" keyValue:jsonObject["+keyValue+ "]: " + jsonObject[keyValue]);
+		    					if(jsonObject[keyValue]){
+		    						var tempObject = jsonObject[keyValue];
+		    						if(tempObject && tempObject[key]){
+		    				        	if (tempObject[key].includes('required-true')){
+		    				        		isRequired = true;
+		    				        	}	
+		    						}
+		    					}
+		    				}		    				
+		    			}		    			
+		    		}
+		    		
 		        	switch (dataTest[key].split(splitcolon)[0]){
 		        		case stringValue:
 			        		$scope.attributeBox(attributekey, array, attirbuteLabel, defaultValue, isRequired);
 		        			break;
+		        		case string:
+			        		$scope.attributeBox(attributekey, array, attirbuteLabel, defaultValue, isRequired);
+		        			break;		        			
 		        		case intValue: 
 		        			$scope.attributeBox(attributekey, array, attirbuteLabel, defaultValue, isRequired);
 		        			break;
@@ -582,13 +614,13 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
 			var buttonaddLabel = document.createTextNode("+");       
 			addButton.appendChild(buttonaddLabel); 
 			addButton.setAttribute("id", labelValue + attibuteKey);
-			addButton.setAttribute("class", "btn btn-default");
+			addButton.setAttribute("class", "btn btn-add-remove");
 			addButton.setAttribute("ng-click" ,  'addNewChoice("'+labelValue + attibuteKey+'");');
 			addButton.setAttribute("ng-disabled" , "temp.policy.readOnly");
 			var removeButton = document.createElement("BUTTON");
 			var buttonremoveLabel = document.createTextNode("-");       
 			removeButton.appendChild(buttonremoveLabel); 
-			removeButton.setAttribute("class", "btn btn-default");
+			removeButton.setAttribute("class", "btn btn-add-remove");
 			removeButton.setAttribute("ng-click" ,  'removeChoice("'+labelValue + attibuteKey+'");');
 			removeButton.setAttribute("ng-disabled" , "temp.policy.readOnly");
 			document.getElementById(divID).appendChild(addButton); 
@@ -597,6 +629,7 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
 			document.getElementById(divID).appendChild(textField); 
 			document.getElementById(divID).appendChild(br); 
 			document.getElementById(divID).appendChild(divTag); 
+			
 		}else{
 			checkKey = labelValue + attibuteKey;
 			textField.setAttribute("id" , ''+labelValue +attibuteKey+'');
@@ -609,6 +642,16 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
 
 		}
 		
+		if(divID.includes("@0") && divID.includes("div.")){
+			var firstChild_Id = divID.split("@0")[0];
+			var firstChild_element = document.getElementById(firstChild_Id);
+			if(firstChild_element){
+				firstChild_element.className += ' children_group';  //here is a div with a group of children.
+			}
+		}
+		console.log('firstChild_Id: ' + firstChild_Id);
+		console.log('divID: ' + divID);
+		
 		if (defaultValue.length > 0){	
 			if(defaultValue.includes(":")){
 				defaultValue = defaultValue.split(":")[0];
@@ -661,18 +704,20 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
 		var labeltext = document.createTextNode(lableName);
 	
 		label.appendChild(labeltext);
+		
+		var subAttributes = $scope.dcaeModelData.sub_attributes;
 
 		if(labelManyKey){
 			var addButton = document.createElement("BUTTON");
 			var buttonLabel = document.createTextNode("+");       
 			addButton.appendChild(buttonLabel); 
-			addButton.setAttribute("class", "btn btn-default");
+			addButton.setAttribute("class", "btn btn-add-remove");
 			addButton.setAttribute("ng-click" ,  'addNewChoice("'+labelValue + lableName+'");');
 			addButton.setAttribute("ng-disabled" , "temp.policy.readOnly");
 			var removeButton = document.createElement("BUTTON");
 			var buttonremoveLabel = document.createTextNode("-");       
 			removeButton.appendChild(buttonremoveLabel); 
-			removeButton.setAttribute("class", "btn btn-default");
+			removeButton.setAttribute("class", "btn btn-add-remove");
 			removeButton.setAttribute("ng-click" ,  'removeChoice("'+labelValue +lableName+'");');
 			removeButton.setAttribute("ng-disabled" , "temp.policy.readOnly"); 
 			document.getElementById(divID).appendChild(addButton); 
@@ -685,12 +730,16 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
 			
 			var divTag = document.createElement("div");
 			divTag.setAttribute("id", id +'@0');
+			
+			divTag.className += ' children_group'; //here is div with a group of children.
+			
 			document.getElementById(id).appendChild(divTag);
 		}else{
 			var divTag = document.createElement("div");
 			divTag.setAttribute("id", "div."+labelValue+lableName);
+			divTag.className += ' children_group'; //here is div with a group of children.
 			document.getElementById(divID).appendChild(label);  
-			document.getElementById(divID).appendChild(divTag);
+			document.getElementById(divID).appendChild(divTag);			
 		}
     };
 
@@ -801,7 +850,6 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
     				if (elumentLocation > 1){
     					enumKey = keySplit[keySplit.length - 1];
     				}
-    				var aWhiteSpace = " ";
     				if (enumKeyList.indexOf(enumKey) != -1){
 						if (splitPlainAttributeKey[1].indexOf("true") !== -1){
 							var multiSlect = [];
@@ -810,19 +858,11 @@ angular.module('abs').controller('dcaeMicroServiceController', ['$scope', '$wind
 								}
 							jsonPolicy[key]= multiSlect;
 						}else{
-							//set a space due to empty value caused JSON format error in PolicyRestAdapter and remove it in back-end.
-							if(searchElement.value == ""){
-								searchElement.value = aWhiteSpace;
-							}
 							console.log(" searchElement.value = > " + searchElement.value);
 							jsonPolicy[key]= searchElement.value;
 						}
     				} else {
         				if(searchElement.value != null){
-							//set a default value due to empty value caused JSON format error in PolicyRestAdapter
-							if(searchElement.value == ""){
-								searchElement.value = aWhiteSpace;
-							}
 							console.log(" searchElement.value = > " + searchElement.value);
         					jsonPolicy[key]= searchElement.value;
         				}
diff --git a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplateController/DecisionPolicyController.js b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplateController/DecisionPolicyController.js
index 4b5a990ef..72b6f06ca 100644
--- a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplateController/DecisionPolicyController.js
+++ b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplateController/DecisionPolicyController.js
@@ -80,6 +80,26 @@ angular.module('abs').controller('decisionPolicyController', ['$scope', 'PolicyA
 		console.log("failed");
 	});
 
+	PolicyAppService.getData('getDictionary/get_RainyDayDictionaryDataByName').then(function (data) {
+		var j = data;
+		$scope.data = JSON.parse(j.data);
+		console.log($scope.data);
+    	$scope.rainyDayDictionaryDatas = JSON.parse($scope.data.rainyDayDictionaryDatas);
+		console.log($scope.rainyDayDictionaryDatas);
+	}, function (error) {
+		console.log("failed");
+	});
+	
+    PolicyAppService.getData('getDictionary/get_RainyDayDictionaryData').then(function (data) {
+    	var j = data;
+    	$scope.data = JSON.parse(j.data);
+    	console.log($scope.data);
+    	$scope.rainyDayDictionaryDataEntity = JSON.parse($scope.data.rainyDayDictionaryDatas);
+    	console.log($scope.rainyDayDictionaryDatasEntity);
+    }, function (error) {
+    	console.log("failed");
+    });
+
     function extend(obj, src) {
         for (var key in src) {
             if (src.hasOwnProperty(key)) obj[key] = src[key];
@@ -166,6 +186,9 @@ angular.module('abs').controller('decisionPolicyController', ['$scope', 'PolicyA
     	if(!$scope.temp.policy.yamlparams){
     		$scope.temp.policy.yamlparams = {};
     	}
+    	if(!$scope.temp.policy.yamlparams.targets){
+    		$scope.temp.policy.yamlparams.targets = [];
+    	}
     	if(!$scope.temp.policy.yamlparams.blackList){
     		$scope.temp.policy.yamlparams.blackList = [];
     	}
@@ -178,7 +201,7 @@ angular.module('abs').controller('decisionPolicyController', ['$scope', 'PolicyA
     
     }else if($scope.temp.policy.ruleProvider=="Custom"){
 	   if($scope.temp.policy.attributes.length == 0){
-		   $scope.temp.policy.attributes = [];
+		   $scope.temp.policy.attributes = [];    
 	   }
 	   if($scope.temp.policy.settings.length == 0){
 		   $scope.temp.policy.settings = [];
@@ -190,6 +213,10 @@ angular.module('abs').controller('decisionPolicyController', ['$scope', 'PolicyA
 	   if($scope.temp.policy.yamlparams.blackList.length==0){
 		   $scope.temp.policy.yamlparams.blackList = [];
 	   }
+    }else if($scope.temp.policy.ruleProvider=="GUARD_YAML"){
+    	if($scope.temp.policy.yamlparams.targets.length==0){
+ 		   $scope.temp.policy.yamlparams.targets = [];
+ 	   	}
     }else if($scope.temp.policy.ruleProvider=="Rainy_Day"){
     	if($scope.temp.policy.rainyday.treatmentTableChoices == null || $scope.temp.policy.rainyday.treatmentTableChoices.length == 0){
     		$scope.temp.policy.rainyday.treatmentTableChoices = [];
@@ -215,6 +242,14 @@ angular.module('abs').controller('decisionPolicyController', ['$scope', 'PolicyA
       $scope.temp.policy.settings.splice(lastItem);
     };
     
+    $scope.addNewTarget = function(){
+    	$scope.temp.policy.yamlparams.targets.push('');
+    };
+    $scope.removeTarget = function(){
+    	var lastItem = $scope.temp.policy.yamlparams.targets.length-1;
+    	$scope.temp.policy.yamlparams.targets.splice(lastItem);
+    };
+    
     $scope.addNewBL = function() {
     	$scope.temp.policy.yamlparams.blackList.push('');
     };
@@ -232,6 +267,29 @@ angular.module('abs').controller('decisionPolicyController', ['$scope', 'PolicyA
     	$scope.temp.policy.rainyday.treatmentTableChoices.splice(lastItem);
     };
     
+	$scope.workstepDictionaryDatas = [];
+	$scope.getWorkstepValues = function(bbidValue){
+		for (var i = 0; i < $scope.rainyDayDictionaryDataEntity.length; ++i) {
+    	    var obj = $scope.rainyDayDictionaryDataEntity[i];
+    	    if (obj.bbid == bbidValue){
+    	    	$scope.workstepDictionaryDatas.push(obj.workstep);
+    	    }
+    	}
+	};
+	
+	$scope.allowedTreatmentsDatas = [];
+	$scope.getTreatmentValues = function(bbidValue, workstepValue){
+		for (var i = 0; i < $scope.rainyDayDictionaryDataEntity.length; ++i) {
+    	    var obj = $scope.rainyDayDictionaryDataEntity[i];
+    	    if (obj.bbid == bbidValue && obj.workstep == workstepValue){
+    	    	var splitAlarm = obj.treatments.split(',');
+    	    	for (var j = 0; j < splitAlarm.length; ++j) {
+    	    		$scope.allowedTreatmentsDatas.push(splitAlarm[j]);
+    	    	}
+    	    }
+    	}	
+	};
+    
     $scope.ItemNo = 0;
     $scope.ruleAlgorithmDatas = [{"ruleAlgorithms" : $scope.temp.policy.ruleAlgorithmschoices }];
     
diff --git a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplates/DCAEMicroServicePolicyTemplate.html b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplates/DCAEMicroServicePolicyTemplate.html
index a12300b97..f621f2cba 100644
--- a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplates/DCAEMicroServicePolicyTemplate.html
+++ b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplates/DCAEMicroServicePolicyTemplate.html
@@ -83,7 +83,7 @@
 			</div>
 		</div>
 		<div class="well">
-			<div class="form-group col-sm-3" id="DynamicTemplate">
+			<div class="form-group col-sm-12" id="DynamicTemplate">
 				<label>Micro Service Attributes:<sup><b>*</b></sup></label><br>
 			</div>
 			</br>
diff --git a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplates/DecisionPolicyTemplate.html b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplates/DecisionPolicyTemplate.html
index 49fc70df4..973a7afc2 100644
--- a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplates/DecisionPolicyTemplate.html
+++ b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/PolicyTemplates/DecisionPolicyTemplate.html
@@ -62,17 +62,25 @@
 							<label>Building Block ID:<sup><b>*</b></sup></label>
 						</div>
 						<div class="form-group col-sm-2">
-							<input type="text" class="form-control"
-								ng-disabled="temp.policy.readOnly" ng-model="temp.policy.rainyday.bbid"
-								placeholder="Building Block ID" />
+								<select
+									class="form-control" ng-disabled="temp.policy.readOnly"
+									ng-model="temp.policy.rainyday.bbid"
+									ng-options="option for option in rainyDayDictionaryDatas track by option"
+									ng-change="getWorkstepValues(temp.policy.rainyday.bbid)">
+									<option value="">{{temp.policy.rainyday.bbid}}</option>
+								</select>
 						</div>
 						<div class="form-group col-sm-1">
 							<label>Work Step:<sup><b>*</b></sup></label>
 						</div>
 						<div class="form-group col-sm-2">
-							<input type="text" class="form-control"
-								ng-disabled="temp.policy.readOnly" ng-model="temp.policy.rainyday.workstep"
-								placeholder="Work Step" />
+							<select
+									class="form-control" ng-disabled="temp.policy.readOnly"
+									ng-model="temp.policy.rainyday.workstep"
+									ng-options="option for option in workstepDictionaryDatas track by option"
+									ng-change="getTreatmentValues(temp.policy.rainyday.bbid, temp.policy.rainyday.workstep)">
+									<option value="">{{temp.policy.rainyday.workstep}}</option>
+							</select>
 						</div>
 					</div>
 					<div class="form-group row">
@@ -100,19 +108,14 @@
 							<div class="form-group col-sm-1">
 								<label>Desired Treatment:<sup><b>*</b></sup></label>
 							</div>		
-							<div class="form-group col-sm-3">						
-								<select class="form-control" id="mySelect"
+							<div class="form-group col-sm-3">
+								<select
+									class="form-control" 
 									ng-disabled="temp.policy.readOnly"
 									ng-model="treatmentTableChoice.treatment"
-									placeholder="Desired Treatment">
-<!-- 								<option value="">{{tableChoice.desiredtreatment}}</option> -->
-									<option>Rollback</option>
-									<option>Manual Handling</option>
-									<option>Abort</option>
-									<option>Auto Rollback</option>
-									<option>Retry</option>
-									<option>Skip</option>
-								</select>
+									ng-options="option for option in allowedTreatmentsDatas track by option">
+									<option value="">{{treatmentTableChoice.treatment}}</option>
+								</select>						
 							</div>
 							<div class="form-group col-sm-1">
 								<button type="button" class="btn btn-default"
@@ -131,7 +134,7 @@
 			<div class="well">
 				<div class="form-group row">
 					<div class="form-group col-sm-1">
-						<label>Guard YAML Attributes:</label><br>
+						<label>Guard BlackList YAML Attributes:</label><br>
 					</div>
 				</div>
 				<div class="form-group row">
@@ -157,6 +160,16 @@
 						</div>
 						<div class="form-group row" style="margin-left: 2%">
 							<div class="form-group col-sm-3">
+								<label> CLName: </label>
+							</div>
+							<div class="form-group col-sm-3">
+								<input type="text" class="form-control"
+									ng-disabled="temp.policy.readOnly" ng-model="temp.policy.yamlparams.clname"
+									placeholder="CLName" />
+							</div>
+						</div>
+						<div class="form-group row" style="margin-left: 2%">
+							<div class="form-group col-sm-3">
 								<label> guardActiveStart: </label>
 							</div>
 							<div class="form-group col-sm-3">
@@ -235,6 +248,42 @@
 						</div>
 						<div class="form-group row" style="margin-left: 2%">
 							<div class="form-group col-sm-3">
+								<label> CLName: </label>
+							</div>
+							<div class="form-group col-sm-3">
+								<input type="text" class="form-control"
+									ng-disabled="temp.policy.readOnly" ng-model="temp.policy.yamlparams.clname"
+									placeholder="CLName" />
+							</div>
+						</div>
+						<div class="form-group row" style="margin-left: 2%">
+							<div class="form-group col-sm-3">
+								<label> Targets: </label>
+								<button type="button" class="btn btn-default"
+									ng-disabled="temp.policy.readOnly" ng-click="addNewTarget()">
+									<i class="fa fa-plus"></i>
+								</button>
+							</div>
+							<div class="form-group col-sm-4">
+								<div data-ng-repeat="choice in temp.policy.yamlparams.targets track by $index">
+									<div class="form-group row">
+									<div class="form-group col-sm-9">
+										<input type="text" class="form-control"
+										ng-disabled="temp.policy.readOnly"
+										ng-model="temp.policy.yamlparams.targets[$index]" placeholder="Target" />
+									</div>
+									<div class="form-group col-sm-1">
+										<button type="button" class="btn btn-default" ng-show="$last"
+										ng-disabled="temp.policy.readOnly" ng-click="removeTarget()">
+										<i class="fa fa-minus"></i>
+										</button>
+									</div>
+									</div>
+								</div>
+							</div>
+						</div>
+						<div class="form-group row" style="margin-left: 2%">
+							<div class="form-group col-sm-3">
 								<label> limit: </label>
 							</div>
 							<div class="form-group col-sm-3">
@@ -247,18 +296,20 @@
 							<div class="form-group col-sm-3">
 								<label> timeWindow: </label>
 							</div>
-							<div class="form-group col-sm-3">
+							<div class="form-group col-sm-2">
+								<input type="text" class="form-control"
+									ng-disabled="temp.policy.readOnly" ng-model="temp.policy.yamlparams.timeWindow"
+									placeholder="Time Window" />
+							</div>
+							<div class="form-group col-sm-1">
 								<select class="form-control" ng-disabled="temp.policy.readOnly" 
-								ng-model="temp.policy.yamlparams.timeWindow">
-								<option>tw5min</option>
-								<option>tw10min</option>
-								<option>tw30min</option>
-								<option>tw1h</option>
-								<option>tw12h</option>
-								<option>tw1d</option>
-								<option>tw5d</option>
-								<option>tw1w</option>
-								<option>tw1mon</option>
+								ng-model="temp.policy.yamlparams.timeUnits">
+								<option>minute</option>
+								<option>hour</option>
+								<option>day</option>
+								<option>week</option>
+								<option>month</option>
+								<option>year</option>
 								</select>
 							</div>
 						</div>
diff --git a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/css/main.css b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/css/main.css
index 78001f400..1122b6f1b 100644
--- a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/css/main.css
+++ b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/css/main.css
@@ -58,11 +58,47 @@ body {
   margin-top: -5px;
 }
 
+.btn.btn-pedefault {
+	color: #444;
+	background-color: #FAFAFA;
+}
+	
 .btn.btn-default {
   color: #444;
   background-color: #FAFAFA;
 }
 
+.btn-add-remove {
+  color: #444;
+  background-color: #FAFAFA;
+  margin-right: 12px;
+  margin-bottom: 10px;
+}
+
+.child_single {
+  color: #444;
+  background-color: #FAFAFA;
+  margin-left: 0px;
+  margin-bottom: 10px;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+}
+
+.children_group {
+    color: #444;
+    background-color: white;
+    margin-left: 20px;
+    margin-bottom: 20px;
+    margin-top: 20px;
+    margin-right: 20px;
+    padding-top: 10px;
+    padding-left: 10px;
+    padding-right: 20px;
+    padding-bottom: 10px;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+}
+
 .btn {
   box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
   font-weight: 500;
diff --git a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/templates/modals.html b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/templates/modals.html
index 754f95bb5..f7a6d2442 100644
--- a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/templates/modals.html
+++ b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/templates/modals.html
@@ -13,7 +13,7 @@
         <div ng-include data-src="'error-bar'" class="clearfix"></div>
       </div>
       <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal" ng-click="refresh();" ng-disabled="temp.inprocess">Cancel</button>
+        <button type="button" class="btn btn-pedefault" data-dismiss="modal" ng-click="refresh();" ng-disabled="temp.inprocess">Cancel</button>
         <button type="submit" class="btn btn-primary" ng-disabled="temp.inprocess" autofocus="autofocus">Delete</button>
       </div>
       </form>
@@ -42,7 +42,7 @@
         <div ng-include data-src="'error-bar'" class="clearfix"></div>
       </div>
       <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal" ng-click="refresh();" ng-disabled="temp.inprocess">Cancel</button>
+        <button type="button" class="btn btn-pedefault" data-dismiss="modal" ng-click="refresh();" ng-disabled="temp.inprocess">Cancel</button>
         <button type="submit" class="btn btn-primary" ng-disabled="temp.inprocess" autofocus="autofocus">Delete</button>
       </div>
       </form>
@@ -67,7 +67,7 @@
               <div ng-include data-src="'error-bar'" class="clearfix"></div>
             </div>
             <div class="modal-footer">
-              <button type="button" class="btn btn-default" data-dismiss="modal" ng-click="refresh();" ng-disabled="temp.inprocess">Cancel</button>
+              <button type="button" class="btn btn-pedefault" data-dismiss="modal" ng-click="refresh();" ng-disabled="temp.inprocess">Cancel</button>
               <button type="submit" class="btn btn-primary" ng-disabled="temp.inprocess">Rename</button>
             </div>
         </form>
@@ -89,7 +89,7 @@
               <div ng-include data-src="'error-bar'" class="clearfix"></div>
             </div>
             <div class="modal-footer">
-              <button type="button" class="btn btn-default" data-dismiss="modal" ng-disabled="temp.inprocess">Cancel</button>
+              <button type="button" class="btn btn-pedefault" data-dismiss="modal" ng-disabled="temp.inprocess">Cancel</button>
             </div>
         </form>
     </div>
@@ -111,7 +111,7 @@
               <div ng-include data-src="'error-bar'" class="clearfix"></div>
             </div>
             <div class="modal-footer">
-              <button type="button" class="btn btn-default" data-dismiss="modal" ng-click="refresh();" ng-disabled="temp.inprocess">Cancel</button>
+              <button type="button" class="btn btn-pedefault" data-dismiss="modal" ng-click="refresh();" ng-disabled="temp.inprocess">Cancel</button>
               <button type="submit" class="btn btn-primary" ng-disabled="temp.inprocess">Move</button>
             </div>
         </form>
@@ -139,7 +139,7 @@
               <div ng-include data-src="'error-bar'" class="clearfix"></div>
             </div>
             <div class="modal-footer">
-              <button type="button" class="btn btn-default" data-dismiss="modal" ng-disabled="temp.inprocess">Cancel</button>
+              <button type="button" class="btn btn-pedefault" data-dismiss="modal" ng-disabled="temp.inprocess">Cancel</button>
               <button type="submit" class="btn btn-primary" ng-disabled="temp.inprocess">Save</button>
             </div>
         </form>
@@ -165,7 +165,7 @@
               <div ng-include data-src="'error-bar'" class="clearfix"></div>
             </div>
             <div class="modal-footer">
-              <button type="button" class="btn btn-default" data-dismiss="modal" ng-disabled="temp.inprocess">Cancel</button>
+              <button type="button" class="btn btn-pedefault" data-dismiss="modal" ng-disabled="temp.inprocess">Cancel</button>
               <button type="submit" class="btn btn-primary" ng-disabled="temp.inprocess">Clone</button>
             </div>
         </form>
@@ -189,7 +189,7 @@
               <div ng-include data-src="'error-bar'" class="clearfix"></div>
             </div>
             <div class="modal-footer">
-              <button id = "cancel" type="button" class="btn btn-default" data-dismiss="modal" ng-disabled="temp.inprocess">Cancel</button>
+              <button id = "cancel" type="button" class="btn btn-pedefault" data-dismiss="modal" ng-disabled="temp.inprocess">Cancel</button>
               <button type="submit" class="btn btn-primary" ng-disabled="temp.inprocess">Create</button>
             </div>
         </form>
@@ -213,7 +213,7 @@
               <div ng-include data-src="'error-bar'" class="clearfix"></div>
             </div>
             <div class="modal-footer">
-              <button type="button" class="btn btn-default" data-dismiss="modal" ng-disabled="temp.inprocess">Cancel</button>
+              <button type="button" class="btn btn-pedefault" data-dismiss="modal" ng-disabled="temp.inprocess">Cancel</button>
               <button type="submit" class="btn btn-primary" ng-disabled="temp.inprocess">Create</button>
             </div>
         </form>
@@ -238,7 +238,7 @@
             </div>
             <div class="modal-footer">
               <div ng-show="!fileUploader.requesting">
-                  <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+                  <button type="button" class="btn btn-pedefault" data-dismiss="modal">Cancel</button>
                   <button type="submit" class="btn btn-primary" ng-disabled="!uploadFileList.length || fileUploader.requesting">{{'upload' | translate}}</button>
               </div>
               <div ng-show="fileUploader.requesting">
@@ -266,7 +266,7 @@
         </div>
       </div>
       <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal" ng-disabled="temp.inprocess">Close</button>
+        <button type="button" class="btn btn-pedefault" data-dismiss="modal" ng-disabled="temp.inprocess">Close</button>
       </div>
     </div>
   </div>
diff --git a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/templates/searchNavbar.html b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/templates/searchNavbar.html
index 72985a190..768fe5e19 100644
--- a/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/templates/searchNavbar.html
+++ b/POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/templates/searchNavbar.html
@@ -62,7 +62,7 @@ body {
 							<div class="input-group-btn">
 								<div class="btn-group" role="group">
 									<div class="dropdown dropdown-lg">
-										<button type="button" class="btn btn-default dropdown-toggle"
+										<button type="button" class="btn btn-pedefault dropdown-toggle"
 											data-toggle="dropdown" aria-expanded="false">
 											<span class="caret"></span>
 										</button>
@@ -166,7 +166,7 @@ body {
 											</form>
 										</div>
 									</div>
-									<button type="button" class="btn btn-default"
+									<button type="button" class="btn btn-pedefault"
 										ng-click="refresh(search = null);">
 										<span aria-hidden="true">Clear</span>
 									</button>