[SDC-29] rebase continue work to align source

Change-Id: I218f1c5ee23fb2c8314f1c70921d3ad8682c10f4
Signed-off-by: Michael Lando <ml636r@att.com>

13 files changed, 78 insertions, 20 deletions

diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.component.ts
index de5965e488..84ac46c4cf 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.component.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.component.ts
@@ -4,6 +4,7 @@ import { UiElementDropDownComponent, DropdownValue } from './elements-ui/dropdow
 import { UiElementInputComponent } from './elements-ui/input/ui-element-input.component';
 import {UiElementPopoverInputComponent} from "./elements-ui/popover-input/ui-element-popover-input.component";
 import {ValidationConfiguration} from "app/models";
+import {UiElementIntegerInputComponent} from "./elements-ui/integer-input/ui-element-integer-input.component";
 
 @Component({
     selector: 'dynamic-element',
@@ -13,7 +14,8 @@ import {ValidationConfiguration} from "app/models";
         UiElementInputComponent,
         UiElementDropDownComponent,
         UiElementCheckBoxComponent,
-        UiElementPopoverInputComponent
+        UiElementPopoverInputComponent,
+        UiElementIntegerInputComponent
     ]
 })
 export class DynamicElementComponent {
@@ -21,6 +23,7 @@ export class DynamicElementComponent {
     @ViewChild('target', { read: ViewContainerRef }) target: any;
     @Input() type: any;
     @Input() name: string;
+    @Input() readonly:boolean;
     value:any;
 
     // Two way binding for value (need to write the "Change" word like this)
@@ -50,17 +53,16 @@ export class DynamicElementComponent {
         // Factory to create component based on type or peroperty name.
         switch(this.type) {
             case 'list':
-            case 'integer': 
-                this.createComponent(UiElementInputComponent);
+            case 'integer':
+                this.createComponent(UiElementIntegerInputComponent);
                 this.cmpRef.instance.pattern = this.validation.validationPatterns.integer;
                 break;
             case 'string':
-                switch(this.name.toUpperCase()) {
-                    case 'SUBNETPOOLID':
-                        this.createComponent(UiElementPopoverInputComponent);
-                        break;
-                    default:
-                        this.createComponent(UiElementInputComponent);
+                if (this.name.toUpperCase().indexOf("SUBNETPOOLID") !== -1) {
+                    this.createComponent(UiElementPopoverInputComponent);
+                }
+                else {
+                    this.createComponent(UiElementInputComponent);
                 }
                 break;
             case 'boolean':
@@ -84,6 +86,7 @@ export class DynamicElementComponent {
             this.cmpRef.instance.name = this.name;
             this.cmpRef.instance.type = this.type;
             this.cmpRef.instance.value = this.value;
+            this.cmpRef.instance.readonly = this.readonly;
         }
 
         // Subscribe to change event of of ui-element-basic and fire event to change the value
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.module.ts b/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.module.ts
index 18b044bc9d..f53b8616ac 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.module.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.module.ts
@@ -8,6 +8,7 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms'
 import { UiElementPopoverInputComponent } from "./elements-ui/popover-input/ui-element-popover-input.component";
 import {PopoverModule} from "../popover/popover.module";
 import {TooltipModule} from "../tooltip/tooltip.module";
+import {UiElementIntegerInputComponent} from "./elements-ui/integer-input/ui-element-integer-input.component";
 
 @NgModule({
     declarations: [
@@ -15,7 +16,8 @@ import {TooltipModule} from "../tooltip/tooltip.module";
         UiElementInputComponent,
         UiElementCheckBoxComponent,
         UiElementDropDownComponent,
-        UiElementPopoverInputComponent
+        UiElementPopoverInputComponent,
+        UiElementIntegerInputComponent
     ],
     imports: [
         BrowserModule,
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/checkbox/ui-element-checkbox.component.html b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/checkbox/ui-element-checkbox.component.html
index 2ad3d8e94a..a3e28c5f0b 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/checkbox/ui-element-checkbox.component.html
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/checkbox/ui-element-checkbox.component.html
@@ -1 +1 @@
-<input #{{name}}  [(ngModel)]="value" type="checkbox" (change)="onSave(value)" />
+<input #{{name}}  [(ngModel)]="value" type="checkbox" (change)="onSave(value)" [ngClass]="{'disabled':readonly}"/>
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.html b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.html
index 589d00e42d..bfb927af71 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.html
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.html
@@ -1,3 +1,3 @@
-<select name='{{name}}' [(ngModel)]="value" #t (change)="onSave()">
+<select name='{{name}}' [(ngModel)]="value" #t (change)="onSave()"  [ngClass]="{'disabled':readonly}">
   <option *ngFor="let ddvalue of values" [value]="ddvalue.value">{{ddvalue.label}}</option>
 </select>
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.ts
index 208bf54983..b1fb37a186 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.ts
@@ -18,7 +18,6 @@ export class DropdownValue {
   styleUrls: ['./ui-element-dropdown.component.less'],
 })
 export class UiElementDropDownComponent extends UiElementBase implements UiElementBaseInterface {
-
   @Input()
   values: DropdownValue[];
 
@@ -27,7 +26,7 @@ export class UiElementDropDownComponent extends UiElementBase implements UiEleme
   }
 
     onSave() {
-        this.baseEmitter.emit(this.value);
+        this.baseEmitter.emit(JSON.parse(this.value));
     }
 
 }
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.html b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.html
index 00fea65b72..814ebfd28b 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.html
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.html
@@ -10,4 +10,6 @@
     [pattern]="pattern"
     [formControl]="control"
     tooltip="{{value}}"
+    [readonly]="readonly"
+    [ngClass]="{'disabled':readonly}"
     />
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.ts
index 5a14d8f206..2d64d9b713 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.ts
@@ -1,4 +1,4 @@
-import { Component, ViewChild, ElementRef, ContentChildren } from '@angular/core';
+import {Component, ViewChild, ElementRef, ContentChildren, Input} from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser'
 import { UiElementBase, UiElementBaseInterface } from './../ui-element-base.component';
 
@@ -8,7 +8,6 @@ import { UiElementBase, UiElementBaseInterface } from './../ui-element-base.comp
     styleUrls: ['./ui-element-input.component.less'],
 })
 export class UiElementInputComponent extends UiElementBase implements UiElementBaseInterface {
-
     constructor() {
         super();
         this.pattern = this.validation.validationPatterns.comment;
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.html b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.html
new file mode 100644
index 0000000000..e5518d453f
--- /dev/null
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.html
@@ -0,0 +1,15 @@
+<input
+    class="value-input"
+    [ngClass]="{'error': control.invalid}"
+    type="text"
+    [name]="name"
+    [(ngModel)]="value"
+    (change)="onSave()"
+    [attr.maxlength]="validation.propertyValue.max"
+    [attr.minlength]="validation.propertyValue.min"
+    [pattern]="pattern"
+    [formControl]="control"
+    tooltip="{{value}}"
+    [readonly]="readonly"
+    [ngClass]="{'disabled':readonly}"
+/>
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.less b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.less
new file mode 100644
index 0000000000..8073c3858e
--- /dev/null
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.less
@@ -0,0 +1,17 @@
+@import '../../../../../../assets/styles/variables';
+
+/deep/ ui-element-integer-input {
+
+    input {
+        text-indent: 6px;
+        border: solid 1px @main_color_o;
+    }
+
+    .error {
+        border: solid 1px @func_color_q;
+        color: @func_color_q;
+        outline: none;
+        box-sizing: border-box;
+    }
+
+}
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.ts
new file mode 100644
index 0000000000..d42c80a89e
--- /dev/null
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.ts
@@ -0,0 +1,21 @@
+import {Component, ViewChild, ElementRef, ContentChildren, Input} from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser'
+import { UiElementBase, UiElementBaseInterface } from './../ui-element-base.component';
+
+@Component({
+    selector: 'ui-element-integer-input',
+    templateUrl: './ui-element-integer-input.component.html',
+    styleUrls: ['./ui-element-integer-input.component.less'],
+})
+export class UiElementIntegerInputComponent extends UiElementBase implements UiElementBaseInterface {
+    constructor() {
+        super();
+        this.pattern = this.validation.validationPatterns.comment;
+    }
+
+    onSave() {
+        if (!this.control.invalid){
+            this.baseEmitter.emit(JSON.parse(this.value));
+        }
+    }
+}
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.html b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.html
index 5adceb49a0..3bd51b4e36 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.html
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.html
@@ -4,10 +4,10 @@
         type="text"
         [ngClass]="{'error': control.invalid}"
         [name]="name"
-        [value]="value"
+        [value]="value!=undefined?value:''"
         disabled
         />
-    <button [popover]="popoverForm">Edit</button>
+    <button [popover]="popoverForm"  [ngClass]="{'disabled':readonly}">Edit</button>
 </div>
 
 <popover-content #popoverForm [title]="name" [buttons]="buttonsArray" [placement]="'top'" [closeOnClickOutside]="true">
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.ts
index 7300417686..84dd884d1f 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.ts
@@ -1,4 +1,4 @@
-import {Component, ViewChild, ElementRef} from '@angular/core';
+import {Component, ViewChild, ElementRef, Input} from '@angular/core';
 import {UiElementBase, UiElementBaseInterface} from "../ui-element-base.component";
 import {ButtonsModelMap, ButtonModel} from "app/models";
 import { PopoverContentComponent } from "app/ng2/components/popover/popover-content.component"
@@ -10,7 +10,6 @@ import { PopoverComponent } from "app/ng2/components/popover/popover.component"
     styleUrls: ['./ui-element-popover-input.component.less']
 })
 export class UiElementPopoverInputComponent extends UiElementBase implements UiElementBaseInterface {
-
     @ViewChild('textArea') textArea: ElementRef;
     @ViewChild('popoverForm') popoverContentComponent: PopoverContentComponent;
 
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/ui-element-base.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/ui-element-base.component.ts
index b60271f6f0..fa2be1048c 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/ui-element-base.component.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/ui-element-base.component.ts
@@ -25,6 +25,7 @@ export class UiElementBase {
     protected type: string;
     protected value: any;
     protected pattern: any;
+    protected readonly:boolean;
 
     constructor() {
         //this.control = new FormControl('', [Validators.required]);