autocomplete, radio box fields, bugs fixes

dmp-admin/src/app/app.module.ts

@@ -70,6 +70,7 @@ import { CompositeFieldFormComponent } from './compositefield-form/compositefiel
 import { ComboboxComponent } from './combobox/combobox-component';
 import { AutocompleteComponent } from './autocomplete/autocomplete-component';
 import { WordlistComponent } from './wordlist/wordlist-component';
+import { RadioBoxComponent } from './radiobox/radiobox-component';
 
 
 
@@ -97,6 +98,7 @@ import { WordlistComponent } from './wordlist/wordlist-component';
     ComboboxComponent,
     AutocompleteComponent,
     WordlistComponent,
+    RadioBoxComponent,
     DatasetsViewerComponent,
     ProfileEditorComponent,
     PropertiesEditorComponent,

dmp-admin/src/app/autocomplete/autocomplete-component.ts

@@ -15,6 +15,7 @@ export class AutocompleteComponent implements OnInit{
     private data:AutocompleteData = new AutocompleteData(); 
     
     ngOnInit(){
+        this.data.type= "autocomplete";
         let autocomplete: AutocompleteData = new AutocompleteData();
         this.dataModel.data =  new JsonSerializer<AutocompleteData>().fromJSONObject(this.data,AutocompleteData);
         //(<FormArray>this.form.get("data")).push(autocomplete.buildForm());

dmp-admin/src/app/compositefield-form/compositefield-form.component.html

@@ -18,11 +18,11 @@
                 </div>
                 <div class="form-group col-md-4">
                     <label>Ordinal</label>
-                    <input type="nymber" class="form-control" formControlName="ordinal">
+                    <input type="number" class="form-control" formControlName="ordinal">
                 </div>
                 <div class="form-group col-md-4">
                     <label>Id</label>
-                    <input type="nymber" class="form-control" formControlName="id">
+                    <input type="string" class="form-control" formControlName="id">
                 </div>
             </div>
 

dmp-admin/src/app/compositefield-form/compositefield-form.component.ts

@@ -26,7 +26,7 @@ addNewField(){
   (<FormArray>this.form.get("fields")).push(field.buildForm());
 }
 DeleteField(index){
-  this.dataModel.fields.splice(index);
+  this.dataModel.fields.splice(index, 1);
     (<FormArray>this.form.get("fields")).removeAt(index);
 }
 }

dmp-admin/src/app/field-form/field-form.component.html

@@ -19,6 +19,7 @@
                             <option value='combobox'>combobox</option>
                             <option value="checkBox">checkBox</option>
                             <option value="freetext">freetext</option>
+                            <option value="radiobox">radiobox</option>
                         </select>
                     </div>
                 </div>
@@ -28,6 +29,9 @@
             <div *ngSwitchCase="'combobox'">
                 <combobox-component [form]="form" [dataModel]= "dataModel"></combobox-component>
             </div>
+            <div *ngSwitchCase="'radiobox'">
+                    <radiobox-component [form]="form" [dataModel]= "dataModel"></radiobox-component>
+                </div>
         </div>
         <div class="form-row">
             <div class="form-group col-md-6">
@@ -77,7 +81,7 @@
         </div>
 
     </div>
-    <!-- <div *ngFor="let rule of dataModel.visible.rules let i=index;">
+    <div *ngFor="let rule of dataModel.visible.rules let i=index;">
         <h4 style="text-decoration: underline;">Rules <button type="button" class="btn btn-sm" style="margin-left:5px;" (click)="DeleteRule(i);"><span class="glyphicon glyphicon-erase"></span></button></h4>            
         <rule-form [form]="form.get('visible').get('rules').get(''+i)" [dataModel]="rule"></rule-form>
         <div>
@@ -90,6 +94,6 @@
         <a (click)="addNewRule(form)" style="cursor: pointer">
             Add another rule +
         </a>
-    </div> -->
+    </div>
 
 </div>

dmp-admin/src/app/field-form/field-form.component.ts

@@ -30,7 +30,7 @@ addNewRule(){
 }
 
 DeleteRule(index){
-  this.dataModel.visible.rules.splice(index);
+  this.dataModel.visible.rules.splice(index, 1);
   (<FormArray>this.form.get("visible").get("rules")).removeAt(index);
 }
     

dmp-admin/src/app/form/form.component.html

@@ -1,6 +1,12 @@
 <div class="container">
     <div style="background-color: #f5f5f5;border: 1px solid #e3e3e3;padding: 24px;">
         <form novalidate [formGroup]="form" (ngSubmit)="onSubmit()">
+            <div class="form-row">
+                <div class="form-group col-md-12">
+                    <label>Label</label>
+                    <input type="text" class="form-control" formControlName="label">
+                </div>
+            </div>
             <div *ngFor="let section of dataModel.sections; let i=index;">
                 <h4 style="text-decoration: underline;">Section
                     <button type="button" class="btn btn-sm" style="margin-left:5px;" (click)="DeleteSection(i);">
@@ -13,7 +19,11 @@
                         Add another section +
                     </a>
                 </div>
+
             </div>
+
+
+
             <div *ngIf="dataModel.sections.length == 0;" style="margin-top:20px; padding-left: 15px;">
                 <a (click)="addSection()" style="cursor: pointer">
                     Add another section +

dmp-admin/src/app/form/form.component.ts

@@ -55,7 +55,7 @@ export class FormComponent {
   }
 
   DeleteSection(index) {
-    this.dataModel.sections.splice(index);
+    this.dataModel.sections.splice(index,1);
     (<FormArray>this.form.get("sections")).removeAt(index)
   }
 

dmp-admin/src/app/groupfield-form/groupfield-form.component.ts

@@ -36,7 +36,7 @@ export class GroupFieldFormComponent {
   }
 
   DeleteFieldSet(index){
-    this.dataModel.compositeFields.splice(index);
+    this.dataModel.compositeFields.splice(index, 1);
     (<FormArray>this.form.get("compositeFields")).removeAt(index);
   }
     

dmp-admin/src/app/models/DatasetProfileModel.ts

@@ -1,5 +1,5 @@
 import { BaseModel } from './BaseModel';
-import { FormBuilder, FormGroup } from '@angular/forms';
+import { FormBuilder, FormGroup, FormControl } from '@angular/forms';
 import { FormGenerator } from './interfaces/FormGenerator';
 import { JsonSerializer } from '../utilities/JsonSerializer';
 import { Section } from './Section';
@@ -7,9 +7,11 @@ import { Serializable } from './interfaces/Serializable';
 export class DatasetProfileModel extends BaseModel implements Serializable<DatasetProfileModel>,FormGenerator<FormGroup>{
 
     public sections:Array<Section> = new Array<Section>();
-    
+    public label: string;
+
     fromJSONObject(item:any):DatasetProfileModel{
         this.sections = new JsonSerializer<Section>().fromJSONArray(item.sections,Section);
+        this.label = item.label;
         return this;
     }
 
@@ -21,6 +23,7 @@ export class DatasetProfileModel extends BaseModel implements Serializable<Datas
             sectionsFormArray.push(form)
         })
         formGroup.addControl('sections', this.formBuilder.array(sectionsFormArray));
+        formGroup.addControl('label', new FormControl(this.label));
         return formGroup;
     }
 

dmp-admin/src/app/radiobox/radiobox-component.html

@@ -0,0 +1,24 @@
+    <div [formGroup]="form" class="form-row">
+            <div formGroupName="data">
+                <div formArrayName="options">
+                    <div *ngFor="let option of form.get('data').get('options').controls index as i">
+                        <div [formGroupName]="i">
+                            <div class="form-group col-md-6">
+                                <label>Label</label>
+                                <input type="text" class="form-control" formControlName="label">
+                            </div>
+                            <div class="form-group col-md-6">
+                                <label>Value</label>
+                                <input type="text" class="form-control" formControlName="value">
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div>
+                <a (click)="addNewRow(form)" style="cursor: pointer">
+                    Add +
+                </a>
+            </div>
+        
+        </div>

dmp-admin/src/app/radiobox/radiobox-component.ts

@@ -0,0 +1,32 @@
+import { FormGroup } from '@angular/forms';
+import { Field } from '../models/Field';
+import { Component, Input, OnInit } from '@angular/core';
+import { RadioBoxData } from '../models/DataField/RadioBoxData';
+import { FormArray } from '@angular/forms/src/model';
+import { ListingItem } from '../models/Commons/ListingItem';
+import { JsonSerializer } from '../utilities/JsonSerializer';
+
+@Component({
+    selector: 'radiobox-component',
+    templateUrl: './radiobox-component.html'
+})
+export class RadioBoxComponent implements OnInit{
+    @Input() dataModel: Field;
+    @Input() form: FormGroup;
+    private data: RadioBoxData = new RadioBoxData();
+    private options = new Array<ListingItem>();
+    
+    ngOnInit(){  
+        if (this.form.get("data")) this.form.removeControl("data");
+        this.form.addControl("data", this.data.buildForm()); 
+        this.addNewRow();
+    }
+
+    addNewRow(){
+        let radioListOptions:ListingItem = new ListingItem();           
+         (<FormArray>this.form.get("data").get("options")).push(radioListOptions.buildForm());
+         this.data.options = [];
+         this.data.options.push(radioListOptions);
+         this.dataModel.data = new JsonSerializer<RadioBoxData>().fromJSONObject(this.data,RadioBoxData);
+    }
+}

dmp-admin/src/app/rule-component/rule.component.html

@@ -9,7 +9,7 @@
             </div>
             <div class="form-group col-md-4">
                 <label>Target</label>
-                <input type="text" class="form-control" placeholder="field id" formControlName="target">
+                <input type="text" class="form-control" placeholder="field id" formControlName="target" (change)="TargetValidation()">
             </div>
             <div class="form-group col-md-4">
                 <label>Rule style</label>

dmp-admin/src/app/rule-component/rule.component.ts

@@ -12,4 +12,8 @@ export class RuleFormComponent {
 @Input() form: FormGroup;
 @Input() dataModel: FormGroup;
 
+TargetValidation(){
+  debugger;
+}
+
 }

dmp-admin/src/app/section-form/section-form.component.html

@@ -27,6 +27,11 @@
     </div>
     <div *ngIf="dataModel.sections">
         <div *ngFor="let section of dataModel.sections let i=index;">
+            <h4 style="text-decoration: underline;">Section
+                <button type="button" class="btn btn-sm" style="margin-left:5px;" (click)="DeleteSectionInSection(i);">
+                    <span class="glyphicon glyphicon-erase"></span>
+                </button>
+            </h4>
             <section-form [form]="form.get('sections').get(''+i)" [dataModel]="section"></section-form>
         </div>
     </div>
@@ -48,10 +53,10 @@
     </div>
 
     <div style="margin-top:20px; padding-left: 15px;">
-            <a (click)="addSectioninSection()" style="cursor: pointer">
+        <a (click)="addSectioninSection()" style="cursor: pointer">
-                Add section +
+            Add section +
-            </a>
+        </a>
-        </div>
+    </div>
 
     <div *ngIf="dataModel.fieldGroups.length == 0;">
         <a (click)="addGroupField()" style="cursor: pointer">

dmp-admin/src/app/section-form/section-form.component.ts

@@ -30,7 +30,7 @@ export class SectionFormComponent {
   }
 
   DeleteFieldGroup(index){
-    this.dataModel.fieldGroups.splice(index);
+    this.dataModel.fieldGroups.splice(index, 1);
     (<FormArray>this.form.get("fieldGroups")).removeAt(index)
   }
 
@@ -39,5 +39,10 @@ export class SectionFormComponent {
     this.dataModel.sections.push(section);
     (<FormArray>this.form.get("sections")).push(section.buildForm());
   }
+
+  DeleteSectionInSection(index){
+    this.dataModel.sections.splice(index);
+    (<FormArray>this.form.get("sections")).removeAt(index);
+  }
     
 }

dmp-admin/src/app/wordlist/wordlist-component.html

@@ -4,11 +4,11 @@
             <div *ngFor="let option of form.get('data').get('options').controls index as i">
                 <div [formGroupName]="i">
                     <div class="form-group col-md-6">
-                        <label>Value</label>
+                        <label>Label</label>
                         <input type="text" class="form-control" formControlName="label">
                     </div>
                     <div class="form-group col-md-6">
-                        <label>Id</label>
+                        <label>Value</label>
                         <input type="text" class="form-control" formControlName="value">
                     </div>
                 </div>

dmp-admin/src/app/wordlist/wordlist-component.ts

@@ -17,6 +17,7 @@ export class WordlistComponent implements OnInit{
     private options = new Array<ListingItem>();
     
     ngOnInit(){  
+        this.data.type = "wordlist";
         if (this.form.get("data")) this.form.removeControl("data");
         this.form.addControl("data", this.data.buildForm()); 
         this.addNewRow();