import { Component, OnInit, Input, ViewEncapsulation } from '@angular/core';
import { FormGroup } from '@angular/forms'; 
import { Section } from 'app/models/DataSetProfile/Section';
import { FieldGroup } from 'app/models/DataSetProfile/FieldGroup';
import { FormArray } from '@angular/forms/src/model';
import { DatasetProfileModel } from 'app/models/DataSetProfile/DatasetProfileModel';
import { FieldSet } from 'app/models/DataSetProfile/FieldSet';
import { Field } from 'app/models/DataSetProfile/Field';
import { Page } from 'app/models/DataSetProfile/Page';
import { JsonSerializer } from 'app/utilities/JsonSerializer';

@Component({
  selector: 'section-form',
  templateUrl: './section-form.component.html',
  styleUrls: ['./section-form.component.css'],
  encapsulation: ViewEncapsulation.None
})

export class SectionFormComponent {
  @Input() form: FormGroup;
  @Input() dataModel: Section;
  @Input() indexPath: string;

  constructor() { }

  ngOnInit() {
      var self = this;

      this.form.root.get("pages").valueChanges.subscribe(function(value) {
          self.keepPageSelectionValid(value);
      });
  }

  // addGroupField() {
  //   let fieldGroup: FieldGroup = new FieldGroup();
  //   if (this.dataModel.fieldGroups)
  //     this.dataModel.fieldGroups.push(fieldGroup);
  //   (<FormArray>this.form.get("fieldGroups")).push(fieldGroup.buildForm());
  // }

  addField() {
    let fieldSet: FieldSet = new FieldSet();
    let field: Field = new Field();
    //let fieldGroup: FieldGroup = new FieldGroup();
    fieldSet.fields.push(field);
    //fieldGroup.compositeFields.push(fieldSet);
    if (this.dataModel.fieldSets)
      this.dataModel.fieldSets.push(fieldSet);
    (<FormArray>this.form.get("fieldSets")).push(fieldSet.buildForm());
  }

  // DeleteFieldGroup(index) {
  //   this.dataModel.fieldGroups.splice(index, 1);
  //   (<FormArray>this.form.get("fieldGroups")).removeAt(index)
  // }

  addSectioninSection() {
    let section: Section = new Section();
    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);
  }

  DeleteFieldSet(index){
    this.dataModel.fieldSets.splice(index, 1);
    (<FormArray>this.form.get("compositeFields")).removeAt(index);
  }

  keepPageSelectionValid(pagesJson: Array<any>) {
      let selectedPage = this.form.get("page").value as number;
      let pages: Array<Page> = new JsonSerializer<Page>().fromJSONArray(pagesJson, Page);
      if (!isNaN(selectedPage) && pages.find(elem => elem.id === selectedPage) === undefined)
          this.form.get("page").reset();
  }
}