import {of as observableOf,  Observable } from 'rxjs';
import { Component, Input, OnInit } from '@angular/core';
import { AbstractControl, FormArray, FormControl, FormGroup } from '@angular/forms';
import { MatSnackBar } from '@angular/material/snack-bar';
import { ActivatedRoute, Router } from '@angular/router';
import { TranslateService } from '@ngx-translate/core';
import { ValidationErrorModel } from '../../../common/forms/validation/error-model/validation-error-model';
import { BaseComponent } from "../../../core/common/base/base.component";
import { GrantCriteria } from '../../../core/query/grant/grant-criteria';
import { RequestItem } from '../../../core/query/request-item';
import { SnackBarNotificationLevel, UiNotificationService } from '../../../core/services/notification/ui-notification-service';
import { GrantService } from '../../../core/services/grant/grant.service';
import { SingleAutoCompleteConfiguration } from '../../../library/auto-complete/single/single-auto-complete-configuration';
import { BreadcrumbItem } from '../../misc/breadcrumb/definition/breadcrumb-item';
import { IBreadCrumbComponent } from '../../misc/breadcrumb/definition/IBreadCrumbComponent';
import { GrantEditorWizardModel } from './grant-editor-wizard-model';

@Component({
	selector: 'app-quick-wizard-grant-editor-component',
	templateUrl: 'grant-editor-wizard.component.html',
	styleUrls: ['./grant-editor-wizard.component.scss']
})
export class GrantEditorWizardComponent extends BaseComponent implements OnInit, IBreadCrumbComponent {
	breadCrumbs: Observable<BreadcrumbItem[]> = observableOf([]);

	isNew = false;
	grant: GrantEditorWizardModel;
	@Input() grantformGroup: FormGroup;
	@Input() funderFormGroup: FormGroup;
	private uiNotificationService: UiNotificationService

	grantAutoCompleteConfiguration: SingleAutoCompleteConfiguration;

	constructor(
		public snackBar: MatSnackBar,
		private route: ActivatedRoute,
		public router: Router,
		public language: TranslateService,
		private grantService: GrantService
	) {
		super();
	}

	ngOnInit() {
		this.breadCrumbs = observableOf([{
			parentComponentName: 'QuickCreate',
			label: this.language.instant('NAV-BAR.GRANT'),
			url: '/quick-wizard/grant'
		}]);

		const grantRequestItem: RequestItem<GrantCriteria> = new RequestItem();
		grantRequestItem.criteria = new GrantCriteria();

		this.grantAutoCompleteConfiguration = {
			filterFn: this.searchGrant.bind(this),
			initialItems: (extraData) => this.searchGrant(''),
			displayFn: (item) => item['label'],
			titleFn: (item) => item['label'],
			subtitleFn: (item) => item ? item['source'] : null
		};

		if (!this.grantformGroup) {
			this.grant = new GrantEditorWizardModel();
			this.grantformGroup = this.grant.buildForm();
		}

		this.grantformGroup.get('existGrant').enable();
		this.grantformGroup.get('label').disable();
		this.grantformGroup.get('description').disable();

		// this.route.params
		//   .pipe(takeUntil(this._destroyed))
		//   .subscribe((params: Params) => {
		//     const itemId = params['id'];

		//     if (itemId != null) {
		//     	this.isNew = false;
		//     	this.grantService.getSingle(itemId).map(data => data as GrantListingModel)
		//     		.pipe(takeUntil(this._destroyed))
		//     		.subscribe(data => {
		//     			this.grant = new GrantEditorModel().fromModel(data);
		//     			this.formGroup = this.grant.buildForm(null, this.grant.type === GrantType.External || !this.editMode);
		//     			this.breadCrumbs = Observable.of([
		//     				{ parentComponentName: 'GrantListingComponent', label: 'Grants', url: '/grants' },
		//     			]);
		//     		});
		//     } else {
		//     this.breadCrumbs = Observable.of([
		//       { parentComponentName: 'QuickWizardComponent', label: 'Grants', url: '/grants' },
		//     ]);
		//     this.grant = new GrantEditorWizardModel();
		//     setTimeout(() => {
		//       this.formGroup = this.grant.buildForm();
		//     });
		//      }
		//   });
	}

	public isFormValid() {
		return this.grantformGroup.valid;
	}

	public touchAllFormFields(formControl: AbstractControl) {
		if (formControl instanceof FormControl) {
			formControl.markAsTouched();
		} else if (formControl instanceof FormGroup) {
			Object.keys(formControl.controls).forEach(item => {
				const control = formControl.get(item);
				this.touchAllFormFields(control);
			});
		} else if (formControl instanceof FormArray) {
			formControl.controls.forEach(item => {
				this.touchAllFormFields(item);
			});
		}
	}

	onCallbackSuccess(): void {
		this.uiNotificationService.snackBarNotification(this.isNew ? this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-CREATION') : this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE'), SnackBarNotificationLevel.Success);
		this.router.navigate(['/grant']);
	}

	onCallbackError(errorResponse: any) {
		this.setErrorModel(errorResponse.error.payload);
		this.validateAllFormFields(this.grantformGroup);
	}

	public setErrorModel(validationErrorModel: ValidationErrorModel) {
		Object.keys(validationErrorModel).forEach(item => {
			(<any>this.grant.validationErrorModel)[item] = (<any>validationErrorModel)[item];
		});
	}

	public validateAllFormFields(formControl: AbstractControl) {
		if (formControl instanceof FormControl) {
			formControl.updateValueAndValidity({ emitEvent: false });
		} else if (formControl instanceof FormGroup) {
			Object.keys(formControl.controls).forEach(item => {
				const control = formControl.get(item);
				this.validateAllFormFields(control);
			});
		} else if (formControl instanceof FormArray) {
			formControl.controls.forEach(item => {
				this.validateAllFormFields(item);
			});
		}
	}

	searchGrant(query: string) {
		const grantRequestItem: RequestItem<GrantCriteria> = new RequestItem();
		grantRequestItem.criteria = new GrantCriteria();
		grantRequestItem.criteria.like = query;
		if (this.funderFormGroup.get('existFunder').value) {
			grantRequestItem.criteria.funderReference = this.funderFormGroup.controls['existFunder'].value.reference;
		}
		return this.grantService.getWithExternal(grantRequestItem);
	}

	create() {
		this.isNew = !this.isNew;
		if (this.isNew) {
			this.grantformGroup.get('existGrant').disable();
			this.grantformGroup.get('existGrant').reset();
			this.grantformGroup.get('label').enable();
			this.grantformGroup.get('description').enable();
		} else {
			this.grantformGroup.get('existGrant').enable();
			this.grantformGroup.get('label').disable();
			this.grantformGroup.get('label').reset();
			this.grantformGroup.get('description').disable();
			this.grantformGroup.get('description').reset();
		}
	}
}