Catalog alignment

Issue-ID: SDC-2724
Signed-off-by: ys9693 <ys9693@att.com>
Change-Id: I52b4aacb58cbd432ca0e1ff7ff1f7dd52099c6fe

6 files changed, 137 insertions, 65 deletions

diff --git a/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.html b/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.html
index 25e1891790..792919172e 100644
--- a/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.html
+++ b/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.html
@@ -13,8 +13,8 @@
   ~ See the License for the specific language governing permissions and
   ~ limitations under the License.
   -->
- 
- 
+
+
 <div class="data-type-fields-structure">
     <div class="open-close">
         <div class="open-close-button" data-ng-class="{'expand':expand,'collapse':!expand}" data-ng-click="expandAndCollapse()"></div>
@@ -30,71 +30,89 @@
             </div>
         </div>
         <!--<div class="property-value">-->
-            <div data-ng-if="dataTypesService.isDataTypeForDataTypePropertyType(property)" class="inner-structure">
-                <fields-structure value-obj-ref="(valueObjRef[property.name])"
-                                  type-name="property.type"
-                                  parent-form-obj="parentFormObj"
-                                  fields-prefix-name="fieldsPrefixName+property.name"
-                                  read-only="readOnly"
-                                  default-value="{{currentTypeDefaultValue[property.name]}}">
+        <div data-ng-if="dataTypesService.isDataTypeForDataTypePropertyType(property)" class="inner-structure">
+            <fields-structure value-obj-ref="(valueObjRef[property.name])"
+                              type-name="property.type"
+                              parent-form-obj="parentFormObj"
+                              fields-prefix-name="fieldsPrefixName+property.name"
+                              read-only="readOnly"
+                              default-value="{{currentTypeDefaultValue[property.name]}}">
 
-                </fields-structure>
-            </div>
-            <div data-ng-if="!dataTypesService.isDataTypeForDataTypePropertyType(property)" ng-switch="property.type">
-                <div ng-switch-when="map">
-                    <type-map value-obj-ref="valueObjRef[property.name]"
-                         schema-property="property.schema.property"
-                         parent-form-obj="parentFormObj"
-                         fields-prefix-name="fieldsPrefixName+property.name"
-                         read-only="readOnly"
-                         default-value="{{currentTypeDefaultValue[property.name]}}"
-                         types="types"></type-map>
-                </div>
-                <div ng-switch-when="list">
-                    <type-list value-obj-ref="valueObjRef[property.name]"
+            </fields-structure>
+        </div>
+        <div data-ng-if="!dataTypesService.isDataTypeForDataTypePropertyType(property)" ng-switch="property.type">
+            <div ng-switch-when="map">
+                <type-map value-obj-ref="valueObjRef[property.name]"
                           schema-property="property.schema.property"
                           parent-form-obj="parentFormObj"
                           fields-prefix-name="fieldsPrefixName+property.name"
                           read-only="readOnly"
                           default-value="{{currentTypeDefaultValue[property.name]}}"
-                          types="types"></type-list>
-                </div>
-                <div ng-switch-default class="primitive-value-field">
-                    <div class="i-sdc-form-item" data-ng-class="{error:(parentFormObj[fieldsPrefixName+property.name].$dirty && parentFormObj[fieldsPrefixName+property.name].$invalid)}">
-                        <input class="i-sdc-form-input"
-                               data-tests-id="{{fieldsPrefixName+property.name}}"
-                               ng-if="!((property.simpleType||property.type) == 'boolean')"
-                               data-ng-maxlength="100"
-                               data-ng-readonly="readOnly"
-                               maxlength="{{(property.simpleType||property.type) == 'integer'? 10 : 100}}"
-                               data-ng-model="valueObjRef[property.name]"
-                               type="text"
-                               name="{{fieldsPrefixName+property.name}}"
-                               data-ng-pattern="getValidationPattern((property.simpleType||property.type))"
-                               data-ng-model-options="{ debounce: 200 }"
-                               data-ng-change="inputOnValueChange(property)"
-                               autofocus />
-                        <select class="i-sdc-form-select"
-                                data-tests-id="{{fieldsPrefixName+property.name}}"
-                                ng-if="(property.simpleType||property.type) == 'boolean'"
-                                data-ng-disabled="readOnly"
-                                name="{{fieldsPrefixName+property.name}}"
-                                data-ng-change="onValueChange(property.name,'boolean')"
-                                data-ng-model="valueObjRef[property.name]"
-                                data-ng-options="option.v as option.n for option in [{ n: '', v: undefined }, { n: 'false', v: false }, { n: 'true', v: true }]">
-                        </select>
+                          types="types"></type-map>
+            </div>
+            <div ng-switch-when="list">
+                <type-list value-obj-ref="valueObjRef[property.name]"
+                           schema-property="property.schema.property"
+                           parent-form-obj="parentFormObj"
+                           fields-prefix-name="fieldsPrefixName+property.name"
+                           read-only="readOnly"
+                           default-value="{{currentTypeDefaultValue[property.name]}}"
+                           types="types"></type-list>
+            </div>
+            <div ng-switch-default class="primitive-value-field">
+                <div class="i-sdc-form-item" data-ng-class="{error:(parentFormObj[fieldsPrefixName+property.name].$dirty && parentFormObj[fieldsPrefixName+property.name].$invalid)}">
+                    <!-- Has Constraints -->
+
+                    <!--<select class="i-sdc-form-select"-->
+                    <!--ng-if="(property.constraints)"-->
+                    <!--data-ng-disabled="readOnly"-->
+                    <!--name="{{fieldsPrefixName+property.name}}"-->
+                    <!--data-ng-change="onValueChange(property.name,'constraintsChange')"-->
+                    <!--data-ng-model="valueObjRef[property.name]"-->
+                    <!--&gt;-->
+                    <!--&lt;!&ndash; Get the default value in case exist &ndash;&gt;-->
+                    <!--<option value = "{{valueObjRef[property.name]}}" name = "{{valueObjRef[property.name]}}" hidden selected>-->
+                    <!--{{valueObjRef[property.name]}}-->
+                    <!--</option> -->
+                    <!--&lt;!&ndash; add all constratint to Select list &ndash;&gt;-->
+                    <!--<option ng-repeat='value in property.constraints[0].validValues' value="{{value}}" >-->
+                    <!--{{value}}-->
+                    <!--</option> -->
+                    <!--</select>-->
+                    <!-- Input without constraints -->
+                    <input class="i-sdc-form-input"
+                           data-tests-id="{{fieldsPrefixName+property.name}}"
+                           ng-if="!((property.simpleType||property.type) == 'boolean')"
+                           data-ng-maxlength="100"
+                           data-ng-readonly="readOnly"
+                           maxlength="{{(property.simpleType||property.type) == 'integer'? 10 : 100}}"
+                           data-ng-model="valueObjRef[property.name]"
+                           type="text"
+                           name="{{fieldsPrefixName+property.name}}"
+                           data-ng-pattern="getValidationPattern((property.simpleType||property.type))"
+                           data-ng-model-options="{ debounce: 200 }"
+                           data-ng-change="inputOnValueChange(property)"
+                           autofocus
+                    />
+                    <select class="i-sdc-form-select"
+                            data-tests-id="{{fieldsPrefixName+property.name}}"
+                            ng-if="(property.simpleType||property.type) == 'boolean'"
+                            data-ng-disabled="readOnly"
+                            name="{{fieldsPrefixName+property.name}}"
+                            data-ng-change="onValueChange(property.name,'boolean')"
+                            data-ng-model="valueObjRef[property.name]"
+                            data-ng-options="option.v as option.n for option in [{ n: '', v: undefined }, { n: 'false', v: false }, { n: 'true', v: true }]">
+                    </select>
 
-                        <div class="input-error" data-ng-show="parentFormObj[fieldsPrefixName+property.name].$dirty && parentFormObj[fieldsPrefixName+property.name].$invalid">
-                            <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '100' }"></span>
-                            <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.pattern" translate="PROPERTY_EDIT_PATTERN"></span>
-                            <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.customValidation" translate="PROPERTY_EDIT_MAP_UNIQUE_KEYS"></span>
-                        </div>
+                    <div class="input-error" data-ng-show="parentFormObj[fieldsPrefixName+property.name].$dirty && parentFormObj[fieldsPrefixName+property.name].$invalid">
+                        <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '100' }"></span>
+                        <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.pattern" translate="PROPERTY_EDIT_PATTERN"></span>
+                        <span ng-show="parentFormObj[fieldsPrefixName+property.name].$error.customValidation" translate="PROPERTY_EDIT_MAP_UNIQUE_KEYS"></span>
                     </div>
                 </div>
             </div>
+        </div>
         <!--</div>-->
 
     </div>
 </div>
-
-
diff --git a/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.ts b/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.ts
index eed209d438..ff2344534a 100644
--- a/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.ts
+++ b/catalog-ui/src/app/directives/property-types/data-type-fields-structure/data-type-fields-structure.ts
@@ -42,6 +42,7 @@ export interface IDataTypeFieldsStructureScope extends ng.IScope {
     expand:boolean;
     expanded:boolean;
     dataTypesService:DataTypesService;
+    constraints:string[];
 
     expandAndCollapse():void;
     getValidationPattern(type:string):RegExp;
@@ -53,11 +54,15 @@ export interface IDataTypeFieldsStructureScope extends ng.IScope {
 
 export class DataTypeFieldsStructureDirective implements ng.IDirective {
 
+    
+
     constructor(private DataTypesService:DataTypesService,
                 private PropertyNameValidationPattern:RegExp,
                 private ValidationUtils:ValidationUtils) {
     }
 
+    constraints: string[];
+
     scope = {
         valueObjRef: '=',
         typeName: '=',
@@ -67,6 +72,7 @@ export class DataTypeFieldsStructureDirective implements ng.IDirective {
         defaultValue: '@',
         //     types: '=',
         expandByDefault: '='
+        
     };
 
     restrict = 'E';
@@ -93,6 +99,7 @@ export class DataTypeFieldsStructureDirective implements ng.IDirective {
         return defaultValue;
     };
 
+
     private initDataOnScope = (scope:any, $attr:any):void => {
         scope.dataTypesService = this.DataTypesService;
         scope.dataTypeProperties = this.DataTypesService.getFirsLevelOfDataTypeProperties(scope.typeName);
@@ -149,7 +156,7 @@ export class DataTypeFieldsStructureDirective implements ng.IDirective {
             return !value || this.ValidationUtils.validateIntRange(value);
         };
 
-        scope.onValueChange = (propertyName:string, type:string):void => {
+        scope.onValueChange = (propertyName:string, type:string,):void => {
             scope.valueObjRef[propertyName] = !angular.isUndefined(scope.valueObjRef[propertyName]) ? scope.valueObjRef[propertyName] : scope.currentTypeDefaultValue[propertyName];
             if (scope.valueObjRef[propertyName] && type != 'string') {
                 scope.valueObjRef[propertyName] = JSON.parse(scope.valueObjRef[propertyName]);
@@ -157,7 +164,10 @@ export class DataTypeFieldsStructureDirective implements ng.IDirective {
         };
 
         scope.inputOnValueChange = (property:any) => {
-
+            if (property.constraints){
+                // this.constraints = property.constraints[0].validValues;
+            }
+            
             let value = !scope.parentFormObj[scope.fieldsPrefixName + property.name].$error.pattern
                 && ('integer' == property.type && scope.parentFormObj[scope.fieldsPrefixName + property.name].$setValidity('pattern', scope.validateIntRange(scope.valueObjRef[property.name]))
                 || scope.onValueChange(property.name, (property.simpleType || property.type)));
diff --git a/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.html b/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.html
index 2363f57d80..661514f799 100644
--- a/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.html
+++ b/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.html
@@ -20,7 +20,7 @@
         <div class="i-sdc-form-item list-new-item" data-ng-class="{error:(parentFormObj['listNewItem'+fieldsPrefixName].$dirty && parentFormObj['listNewItem'+fieldsPrefixName].$invalid)}">
             <input class="i-sdc-form-input"
                    data-tests-id="listNewItem{{fieldsPrefixName}}"
-                   ng-if="!((schemaProperty.simpleType||schemaProperty.type) == 'boolean')"
+                   ng-if="!constraints && !((schemaProperty.simpleType||schemaProperty.type) == 'boolean')"
                    data-ng-disabled="readOnly"
                    data-ng-model="listNewItem.value"
                    type="text"
@@ -34,13 +34,32 @@
                    autofocus />
             <select class="i-sdc-form-select"
                     data-tests-id="listNewItem{{fieldsPrefixName}}"
-                    ng-if="(schemaProperty.simpleType||schemaProperty.type) == 'boolean'"
+                    ng-if="!constraints && (schemaProperty.simpleType||schemaProperty.type) == 'boolean'"
                     data-ng-disabled="readOnly"
                     name="listNewItem{{fieldsPrefixName}}"
                     data-ng-model="listNewItem.value">
                 <option value="true">true</option>
                 <option value="false">false</option>
             </select>
+
+
+            <select class="i-sdc-form-select"
+                data-tests-id="constraints"
+                ng-if="constraints"
+                data-ng-disabled="readOnly"
+                data-ng-model="listNewItem.value">
+                <!-- Get the default value in case exist -->
+                <option value = "{{listNewItem.value}" name = "{{listNewItem.value}}" hidden selected>
+                        {{listNewItem.value}}
+                </option> 
+                <!-- add all constratint to Select list -->
+                <option ng-repeat='value in constraints' value="{{value}}" name="{{value}}">
+                    {{value}}
+                </option>
+                
+                
+            </select>
+
             <div class="input-error" data-ng-show="parentFormObj['listNewItem'+fieldsPrefixName].$dirty && parentFormObj['listNewItem'+fieldsPrefixName].$invalid">
                 <span ng-show="parentFormObj['listNewItem'+fieldsPrefixName].$error.pattern" translate="PROPERTY_EDIT_PATTERN"></span>
                 <span ng-show="parentFormObj['listNewItem'+fieldsPrefixName].$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '{{maxLength}}' }"></span>
diff --git a/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.ts b/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.ts
index f2288cfd07..997e28dabc 100644
--- a/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.ts
+++ b/catalog-ui/src/app/directives/property-types/type-list/type-list-directive.ts
@@ -37,6 +37,8 @@ export interface ITypeListScope extends ng.IScope {
     listDefaultValue:any;
     listNewItem:any;
     maxLength:number;
+    
+    constraints:string[];
 
     getValidationPattern(type:string):RegExp;
     validateIntRange(value:string):boolean;
@@ -49,7 +51,7 @@ export class TypeListDirective implements ng.IDirective {
 
     constructor(private DataTypesService:DataTypesService,
                 private PropertyNameValidationPattern:RegExp,
-                private ValidationUtils:ValidationUtils) {
+                private ValidationUtils:ValidationUtils) {  
     }
 
     scope = {
@@ -59,7 +61,8 @@ export class TypeListDirective implements ng.IDirective {
         fieldsPrefixName: '=',//prefix for form fields names
         readOnly: '=',//is form read only
         defaultValue: '@',//this list default value
-        maxLength: '='
+        maxLength: '=',
+        constraints: '='
     };
 
     restrict = 'E';
diff --git a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html
index aa03cecb17..55a414e729 100644
--- a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html
+++ b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html
@@ -41,8 +41,9 @@
         </div>
         <div data-ng-if="!isSchemaTypeDataType" class="i-sdc-form-item map-item-field" data-ng-class="{error:(parentFormObj['mapValue'+fieldsPrefixName+$index].$dirty && parentFormObj['mapValue'+fieldsPrefixName+$index].$invalid)}">
             <label class="i-sdc-form-label required">Value</label>
+        
             <input class="i-sdc-form-input"
-                   ng-if="!((schemaProperty.simpleType||schemaProperty.type) == 'boolean')"
+                   ng-if="!constraints && !((schemaProperty.simpleType||schemaProperty.type) == 'boolean')"
                    data-ng-readonly="readOnly"
                    data-ng-model="valueObjRef[mapKeys[$index]]"
                    type="text"
@@ -57,7 +58,7 @@
                    autofocus />
             <select class="i-sdc-form-select"
                     data-tests-id="mapValue{{fieldsPrefixName}}{{$index}}"
-                    ng-if="(schemaProperty.simpleType||schemaProperty.type) == 'boolean'"
+                    ng-if="!constraints && (schemaProperty.simpleType||schemaProperty.type) == 'boolean'"
                     data-ng-disabled="readOnly"
                     name="mapValue{{fieldsPrefixName}}{{$index}}"
                     data-ng-model="valueObjRef[mapKeys[$index]]"
@@ -65,6 +66,24 @@
                 <option value="true">true</option>
                 <option value="false">false</option>
             </select>
+
+
+            <select class="i-sdc-form-select"
+                data-tests-id="constraints"
+                ng-if="constraints"
+                data-ng-disabled="readOnly"
+                data-ng-model="valueObjRef[mapKeys[$index]]">
+
+                <!-- Get the saved value for the relevant key -->
+                <option ng-if = "valueObjRef[mapKeys[$index]]" value = "{{valueObjRef[mapKeys[$index]]}}" name = "{{valueObjRef[mapKeys[$index]]}}" hidden selected>
+                        {{valueObjRef[mapKeys[$index]]}}
+                </option> 
+                <!-- add all constratint to Select list -->
+                <option ng-repeat='value in constraints' value="{{value}}" name="{{value}}">
+                    {{value}}
+                </option> 
+            </select>
+
             <div class="input-error" data-ng-show="parentFormObj['mapValue'+fieldsPrefixName+$index].$dirty && parentFormObj['mapValue'+fieldsPrefixName+$index].$invalid">
                 <span ng-show="parentFormObj['mapValue'+fieldsPrefixName+$index].$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Value' }"></span>
                 <span ng-show="parentFormObj['mapValue'+fieldsPrefixName+$index].$error.pattern" translate="PROPERTY_EDIT_PATTERN"></span>
diff --git a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts
index 5718cdd9b5..080c13b87f 100644
--- a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts
+++ b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts
@@ -39,6 +39,7 @@ export interface ITypeMapScope extends ng.IScope {
     readOnly:boolean;
     mapDefaultValue:any;
     maxLength:number;
+    constraints:string[];
 
     getValidationPattern(type:string):RegExp;
     validateIntRange(value:string):boolean;
@@ -65,7 +66,9 @@ export class TypeMapDirective implements ng.IDirective {
         fieldsPrefixName: '=',//prefix for form fields names
         readOnly: '=',//is form read only
         defaultValue: '@',//this map default value
-        maxLength: '='
+        maxLength: '=',
+        constraints: '='
+        
     };
 
     restrict = 'E';