import { ChangeDetectorRef, Component, Inject, Input, OnInit } from '@angular/core';
import { ToastService } from '../../../../core/services/toast.service';
import { FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms';
import { UuidService } from '../../../../core/services/uuid.service';
import { PollService } from '../../../../core/services/poll.service';
import { ApiService } from '../../../../core/services/api.service';
import { Router } from '@angular/router';
import { DOCUMENT } from '@angular/common';
import { Poll } from '../../../../core/models/poll.model';

@Component({
	selector: 'app-base-config',
	templateUrl: './base-config.component.html',
	styleUrls: ['./base-config.component.scss'],
})
export class BaseConfigComponent implements OnInit {
	@Input()
	public poll?: Poll;
	public form: FormGroup;

	constructor(
		private fb: FormBuilder,
		private cd: ChangeDetectorRef,
		private uuidService: UuidService,
		private toastService: ToastService,
		private pollService: PollService,
		private apiService: ApiService,
		private router: Router,
		@Inject(DOCUMENT) private document: Document
	) {}

	ngOnInit(): void {
		this.initFormDefault(false);
	}

	askInitFormDefault(): void {
		this.initFormDefault(false);
		this.toastService.display('formulaire réinitialisé');
	}

	public createPoll(): void {
		console.log('this.form', this.form);
		const newpoll = this.pollService.newPollFromForm(this.form);
		console.log('newpoll', newpoll);
		const router = this.router;

		this.apiService.createPoll(newpoll).then((resp) => {
			console.log('resp', resp);
			router.navigate(['success']);
		});
		// this.router
		// if (this.form.valid) {
		// 	console.log('Le sondage est correctement rempli, prêt à enregistrer.');
		// 	const newpoll = this.pollService.newPollFromForm(this.form);
		// 	// TODO : save the poll
		// 	this.apiService.createPoll(newpoll);
		// } else {
		// 	this.toastService.display('invalid form');
		// }
	}

	initFormDefault(showDemoValues = true): void {
		this.form = this.fb.group({
			title: ['', [Validators.required, Validators.minLength(12)]],
			creatorPseudo: ['', [Validators.required]],
			creatorEmail: ['', [Validators.required]],
			slug: [this.uuidService.getUUID(), [Validators.required]],
			description: ['', [Validators.required]],
			choices: new FormArray([]),
			whoModifiesAnswers: ['', [Validators.required]],
			whoCanChangeAnswers: ['', [Validators.required]],
			isAboutDate: [true, [Validators.required]],
			startDateInterval: ['', [Validators.required]],
			endDateInterval: ['', [Validators.required]],
			isProtectedByPassword: [false, [Validators.required]],
			isOwnerNotifiedByEmailOnNewVote: [false, [Validators.required]],
			isOwnerNotifiedByEmailOnNewComment: [false, [Validators.required]],
			isMaybeAnswerAvailable: [false, [Validators.required]],
			areResultsPublic: [true, [Validators.required]],
			expiracyNumberOfDays: [60, [Validators.required, Validators.min(0)]],
		});
		console.log('this.form ', this.form);
	}

	public updateSlug(): void {
		const newValueFormatted = 'TODO';
		this.form.patchValue({ slug: newValueFormatted });
	}

	/**
	 * set the poll slug from other data of the poll
	 */
	automaticSlug() {
		this.form.patchValue({ slug: this.pollService.makeSlug(this.poll) });
	}
}