import { VisibilityRulesService } from '../../utilities/visibility-rules/visibility-rules.service';
import { CompositeField } from '../../models/CompositeField';
import { FormGroup, FormArray } from '@angular/forms';
import { Component, Input, OnInit, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core';
import { Field } from '../../models/Field';
import { MarkForConsiderationService } from '../../utilities/mark-for-considerations/mark-for-consideration.service';
import { FormFocusService } from '../../utilities/form-focus-service/form-focus.service';
@Component({
	selector: 'app-df-composite-field',
	templateUrl: './dynamic-form-composite-field.html',
	styleUrls: [
		'./dynamic-form-composite-field.css'
	],
	encapsulation: ViewEncapsulation.None,
})
export class DynamicFormCompositeFieldComponent implements OnInit {

	@Input() compositeField: CompositeField;
	form: FormGroup;
	trackByFn = (index, item) => item ? item['id'] : null;

	constructor(
		private visibilityRulesService: VisibilityRulesService,
		private markForConsiderationService: MarkForConsiderationService,
		private formFocusService: FormFocusService
	) {
	}

	ngOnInit() {
		if (this.compositeField) {
			this.form = this.visibilityRulesService.getFormGroup(this.compositeField.id);
		}
	}

	addMultipleField(fieldIndex: number) {
		const field: Field = this.compositeField.fields[fieldIndex].cloneForMultiplicity(fieldIndex, '');
		this.compositeField.fields[fieldIndex].multiplicityItems.push(field);
		(<FormArray>(this.form.get('fields').get('' + fieldIndex).get('multiplicityItems'))).push(field.buildForm());
	}

	markForConsideration() {
		this.markForConsiderationService.markForConsideration(this.compositeField);
	}
}