import { AfterViewInit, Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
import { UntypedFormGroup } from '@angular/forms';
import { MatExpansionPanel } from '@angular/material/expansion';
import { DescriptionTemplate, DescriptionTemplateSection } from '@app/core/model/description-template/description-template';
import { BaseComponent } from '@common/base/base.component';
import { LinkToScroll } from '../table-of-contents/table-of-contents.component';
import { VisibilityRulesService } from './visibility-rules/visibility-rules.service';
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
import { Guid } from '@common/types/guid';
import { RuleWithTarget } from './visibility-rules/models/rule';

@Component({
	selector: 'app-description-form',
	templateUrl: './description-form.component.html',
	styleUrls: ['./description-form.component.scss']
})
export class DescriptionFormComponent extends BaseComponent implements OnInit, AfterViewInit, OnChanges {

	@Input() propertiesFormGroup: UntypedFormGroup;
	@Input() descriptionTemplate: DescriptionTemplate;
	@Input() visibilityRulesService: VisibilityRulesService;
	@Input() descriptionId: Guid;


	// @ViewChild('stepper', { static: false }) stepper: MatStepper;
	@Input() path: string;
	@Input() datasetDescription: String;
	@Input() linkToScroll: LinkToScroll;
	@Output() formChanged: EventEmitter<any> = new EventEmitter();
	@Output() fieldsetFocusChange: EventEmitter<string> = new EventEmitter<string>();

	// tocentries: ToCEntry[];


	@Input() TOCENTRY_ID_PREFIX = "";
	@Input() validationErrorModel: ValidationErrorModel;

	// public hiddenEntriesIds: string[] = [];

	constructor(
	) {
		super();

	}

	ngOnInit() {
		this.init();
	}

	ngOnChanges(changes: SimpleChanges) {
		this.init();
		// When the form is changed set stepper index to 0.
		// if (this.stepper && changes['form'] && !changes['form'].isFirstChange()) {
		// 	this.stepper.selectedIndex = 0;
		// } else if (this.stepper && changes['linkToScroll'] && changes['linkToScroll'].currentValue) {
		// 	if (changes['linkToScroll'].currentValue.page >= 0) {
		// 		this.stepper.selectedIndex = changes['linkToScroll'].currentValue.page;
		// 	}
		// }
	}

	ngAfterViewInit() {

	}

	init() {

		// this.tocentries = this.getTocEntries();
		// const rules_to_append = this._enrichWithMultiplicityRules(this.tocentries);

		// this.visibilityRulesService.buildVisibilityRules([...this.visibilityRules, ...rules_to_append], this.form);

		// if (this.form) {
		// 	this.form.valueChanges
		// 		.pipe(takeUntil(this._destroyed))
		// 		.subscribe(val => {
		// 			this.formChanged.emit(val);
		// 		});
		// }
		// this.visibilityRulesInstance.emit(this.visibilityRulesService);




		// this.hiddenEntriesIds = this._findHiddenEntries(this.tocentries);

		// this.visibilityRulesService.visibilityChange
		// 	.pipe(
		// 		takeUntil(this._destroyed),
		// 		debounceTime(100)
		// 	)
		// 	.subscribe(_ => {
		// 		this.hiddenEntriesIds = this._findHiddenEntries(this.tocentries);
		// 	})
	}

	onAskedToScroll(panel: MatExpansionPanel, id?: string) {
		// panel.open();
		// this.fieldsetFocusChange.emit(id);
	}



	// private _enrichWithMultiplicityRules(tocentries: ToCEntry[]): Rule[] {
	// 	if (tocentries) {
	// 		return tocentries.map(entry => {
	// 			if (entry.type === ToCEntryType.Field) return []; // * TODO Me to tora implementation den tha ftasei pote edo


	// 			if (entry.type === ToCEntryType.FieldSet) {
	// 				// if(multiplicity: )
	// 				try {
	// 					// TODO OTAN KANW HIDE MULTIPLE PEDIO TOTE STO ON SHOW HANO TA VALUES (AUTO MPOREI NA EINAI KAI LEGIT) ('NA DOUME AN ONTOS DIAGRAFONTAI I APLA DEN TA DEIXNOUME')
	// 					// * UPDATE KANEI DESTROY TO COMPONENT H NGIF . PITHANOTATA NA XREIASTEI NA TO KANOUME HIDDEN AN THELOUME KATI ALLO
	// 					const multiplicity = entry.form.get('multiplicity').value;
	// 					if ((multiplicity.max > 1) && (multiplicity.min > 0) && (multiplicity.max >= multiplicity.min)) { // has valid multiplicity
	// 						return this._createAndAppendVisibilityRule(entry);
	// 					}
	// 				} catch {

	// 				}
	// 				return [];
	// 			}

	// 			if (entry.subEntries) {
	// 				return this._enrichWithMultiplicityRules(entry.subEntries);
	// 			}
	// 		})
	// 			.reduce((r, c) => { return [...c, ...r] }, []);
	// 	}
	// 	return [];
	// }

	// private _createAndAppendVisibilityRule(entry: ToCEntry): Rule[] {


	// 	const rules_to_append = [];

	// 	if (entry && (entry.type === ToCEntryType.FieldSet)) {

	// 		//childs that are either target or source
	// 		const childIdsWithVisRules = (entry.form.get('fields') as UntypedFormArray).controls.reduce((all, s) => {
	// 			const sval = s.value as Field;
	// 			return this.visibilityRules.find(x => (x.targetField === sval.id) || (x.sourceField === sval.id)) ? [...all, sval] : all;
	// 		}, []) as Field[];


	// 		const innerCompositeFieldOriginalIds = (entry.form.get('fields') as UntypedFormArray).controls.map(x => x.get('id').value) as string[];

	// 		//multiplicity items
	// 		const multiplicityItemsValue = entry.form.get('multiplicityItems').value as CompositeField[];


	// 		// *********      FIELDS OF FIELDSET ARE EITHER TARGETS OR SOURCES *****


	// 		if (childIdsWithVisRules.length && multiplicityItemsValue && multiplicityItemsValue.length) {
	// 			//check each multiplicity item composite field
	// 			multiplicityItemsValue.forEach(mi => {

	// 				const multiplicityCompositeFieldIds = mi.fields.map(x => x.id);
	// 				const idMappings = multiplicityCompositeFieldIds.map(x => {
	// 					return {
	// 						original: innerCompositeFieldOriginalIds.find(l => x.includes(l)),
	// 						multiplicityIdValue: x
	// 					}
	// 				}) as { original: string, multiplicityIdValue: string }[];

	// 				//each field of mutliplicity item
	// 				mi.fields.forEach(field => {


	// 					//get original visibility rules (original field)

	// 					//original id
	// 					const original_id = childIdsWithVisRules.find(x => field.id.includes(x.id)).id;


	// 					//get vis rules

	// 					//as source
	// 					const original_as_source = this.visibilityRules.filter(x => x.sourceField === original_id);
	// 					const original_as_target = this.visibilityRules.filter(x => x.targetField === original_id);



	// 					if (original_as_source.length) {

	// 						//inner dependencies
	// 						const innerDep = original_as_source.filter(x => innerCompositeFieldOriginalIds.includes(x.targetField));
	// 						innerDep.forEach(x => {
	// 							const newRule = { ...x, sourceField: field.id, targetField: idMappings.find(l => l.original === x.targetField).multiplicityIdValue } as Rule;
	// 							rules_to_append.push(newRule);
	// 						})


	// 						//outer dependencies
	// 						const outerDep = original_as_source.filter(x => !innerCompositeFieldOriginalIds.includes(x.targetField));
	// 						outerDep.forEach(x => {
	// 							const newRule = { ...x, sourceField: field.id };
	// 							rules_to_append.push(newRule);
	// 						})
	// 					}



	// 					if (original_as_target.length) {

	// 						//inner dependencies
	// 						const innerDep = original_as_target.filter(x => innerCompositeFieldOriginalIds.includes(x.sourceField));
	// 						innerDep.forEach(x => {
	// 							const newRule = { ...x, targetField: field.id, sourceField: idMappings.find(l => l.original === x.sourceField).multiplicityIdValue } as Rule;
	// 							rules_to_append.push(newRule);
	// 						})

	// 						//outer dependencies
	// 						const outerDep = original_as_target.filter(x => !innerCompositeFieldOriginalIds.includes(x.sourceField));
	// 						outerDep.forEach(x => {
	// 							const newRule = { ...x, targetField: field.id } as Rule;
	// 							rules_to_append.push(newRule);
	// 						})
	// 					}

	// 				})
	// 			});
	// 		}




	// 		// ** FIELDSET ITSELF IS TARGET
	// 		// ** source it can never be

	// 		const compositeFieldAsTargetRules = this.visibilityRules.filter(x => x.targetField === entry.id);
	// 		const idCompositeFieldMappings = multiplicityItemsValue.map(x => {
	// 			return {
	// 				originalValue: entry.id,
	// 				newValue: x.id
	// 			}
	// 		}) as { originalValue: string, newValue: string }[];


	// 		if (compositeFieldAsTargetRules.length) {

	// 			compositeFieldAsTargetRules.forEach(x => {
	// 				idCompositeFieldMappings.forEach(l => {
	// 					const newRule = { ...x, targetField: l.newValue };
	// 					rules_to_append.push(newRule);
	// 				});
	// 			});
	// 		}


	// 	}

	// 	return rules_to_append;
	// }

	// private _buildRecursively(form: UntypedFormGroup, whatAmI: ToCEntryType): ToCEntry {
	// 	if (!form) return null;

	// 	switch (whatAmI) {
	// 		case ToCEntryType.Section:
	// 			const sections = form.get('sections') as UntypedFormArray;
	// 			const fieldsets = form.get('compositeFields') as UntypedFormArray;


	// 			const tempResult: ToCEntry[] = [];

	// 			if (sections && sections.length) {
	// 				sections.controls.forEach(section => {
	// 					tempResult.push(this._buildRecursively(section as UntypedFormGroup, ToCEntryType.Section));
	// 				});

	// 			} else if (fieldsets && fieldsets.length) {
	// 				fieldsets.controls.forEach(fieldset => {
	// 					tempResult.push(this._buildRecursively(fieldset as UntypedFormGroup, ToCEntryType.FieldSet));
	// 				});
	// 			}
	// 			return {
	// 				// form: form,
	// 				id: form.get('id').value,
	// 				label: form.get('title').value,
	// 				numbering: '',
	// 				subEntries: tempResult,
	// 				subEntriesType: sections && sections.length ? ToCEntryType.Section : ToCEntryType.FieldSet,
	// 				type: ToCEntryType.Section,
	// 				ordinal: form.get('ordinal').value
	// 			}
	// 		case ToCEntryType.FieldSet:
	// 			return {
	// 				// form: form,
	// 				label: form.get('title').value,
	// 				id: form.get('id').value,
	// 				numbering: 's',
	// 				subEntries: [],
	// 				subEntriesType: ToCEntryType.Field,
	// 				type: ToCEntryType.FieldSet,
	// 				ordinal: form.get('ordinal').value
	// 			}
	// 	}
	// }

	// private _sortByOrdinal(tocentries: ToCEntry[]) {

	// 	if (!tocentries || !tocentries.length) return;

	// 	tocentries.sort(this._customCompare);
	// 	tocentries.forEach(entry => {
	// 		this._sortByOrdinal(entry.subEntries);
	// 	});
	// }

	// private _customCompare(a, b) {
	// 	return a.ordinal - b.ordinal;
	// }

	// private _calculateNumbering(tocentries: ToCEntry[], depth: number[] = []) {
	// 	if (!tocentries || !tocentries.length) {
	// 		return;
	// 	}

	// 	let prefixNumbering = depth.length ? depth.join('.') : '';

	// 	if (depth.length) prefixNumbering = prefixNumbering + ".";
	// 	tocentries.forEach((entry, i) => {
	// 		entry.numbering = prefixNumbering + (i + 1);
	// 		this._calculateNumbering(entry.subEntries, [...depth, i + 1])
	// 	});
	// }

	// getTocEntries(): ToCEntry[] {
	// 	if (!this.form) { return []; }
	// 	const result: ToCEntry[] = [];

	// 	//build parent pages
	// 	(this.form.get('pages') as UntypedFormArray).controls.forEach((pageElement, i) => {
	// 		result.push({
	// 			id: i + 'id',
	// 			label: pageElement.get('title').value,
	// 			type: ToCEntryType.Page,
	// 			// form: pageElement,
	// 			numbering: (i + 1).toString(),
	// 			subEntriesType: ToCEntryType.Section,
	// 			subEntries: [],
	// 			ordinal: pageElement.get('ordinal').value
	// 		} as ToCEntry)
	// 	});



	// 	result.forEach((entry, i) => {

	// 		const sections = entry.form.get('sections') as UntypedFormArray;

	// 		sections.controls.forEach(section => {
	// 			const tempResults = this._buildRecursively(section as UntypedFormGroup, ToCEntryType.Section);
	// 			entry.subEntries.push(tempResults);
	// 		});

	// 	});

	// 	this._sortByOrdinal(result);
	// 	//calculate numbering
	// 	this._calculateNumbering(result);
	// 	return result;

	// }


}