import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
import { Meta, Title } from '@angular/platform-browser';
import { ActivatedRoute } from '@angular/router';
import { ToastrService } from 'ngx-toastr';
import { Contact } from '../../entities/contact';
import { GlobalService } from '../../shared/services/common/global.service';
import { LinkService } from '../../shared/services/link.service';

@Component({
  selector: 'app-contact',
  templateUrl: './contact.component.html',
  styleUrls: ['./contact.component.scss']
})
export class ContactComponent implements OnInit {
  //public isShow: boolean = true;
  public contactUsForm: FormGroup;
  public contact = new Contact();
  constructor(
    private formBuilder: FormBuilder,
    private globalService: GlobalService,
    private toastrService: ToastrService,
    private meta: Meta,
    private title: Title,
    private route: ActivatedRoute,
    private linkService: LinkService
  ) {
    this.linkService.createLinkForCanonicalURL();
    this.title.setTitle(this.route.snapshot.data['title']);
    this.meta.addTags([
      {
        name: 'description', content: `Easy to compare and apply for any type of loan at Credit - compare with different banks's interest rate and select the plan with the lowest emi cost , Apply for credit card by just 1 single click, Credit is the right place to sign up as DSA that best fits your needs and helps you make the most of your purchases.`
      },
      {
        name: 'author', content: `Credit`
      },
      {
        name: 'og:title', property: "og:title", content: `Contact Credit`
      },
      {
        name: 'og:description', property: "og:description", content: `Contact to credit - credit.nsserver.in`
      },
      {
        name: 'og:site_name', property: "og:site_name", content: `Credit`
      },
      {
        name: 'og:type', property: "og:type", content: `Website`
      },
      {
        name: 'og:image', property: "og:image", content: `../../../assets/img/logo/logo.webp`
      },
      {
        name: 'tweeter:card', content: `Contact Credit`
      },
      {
        name: 'tweeter:title', content: `Contact Credit`
      },
      {
        name: 'tweeter:description', content: `Contact to credit - credit.nsserver.in`
      },
      {
        name: 'tweeter:site', content: `Credit`
      },
      {
        name: 'tweeter:image', content: `../../../assets/img/logo/logo.webp`
      }
    ]);
    this.contactUsForm = formBuilder.group({
      'contactNo': [null, [Validators.required, Validators.minLength(10)]],
      'name': [null, [Validators.required]],
      'email': [null, [Validators.required, Validators.pattern("[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$")]],
      'subject': [null, [Validators.required]],
      'message': [null, [Validators.required]],
    })
  }

  ngOnInit(): void {
    // setTimeout(() => {
    //   this.isShow = false;
    // }, 1000);
  }

  public async insertContactDetail() {
    try {
      if (this.contactUsForm.valid) {
        this.contact = this.contactUsForm.value
        let res = await this.globalService.insertContactDetail(this.contact);
        if (res && res.status == 200) {
          this.contactUsForm.setValue(
            {
              "contactNo": null,
              "name": null,
              "email": null,
              "subject": null,
              "message": null
            }
          );
        }
      }
      else {
        this.validateAllFormFields(this.contactUsForm);
      }
    } catch (error: any) {
      this.toastrService.error(error)
    }
  }

  private validateAllFormFields(formGroup: FormGroup) {         //{1}
    Object.keys(formGroup.controls).forEach(field => {  //{2}
      const control = formGroup.get(field);             //{3}
      if (control instanceof FormControl) {             //{4}
        control.markAsTouched({ onlySelf: true });
      } else if (control instanceof FormGroup) {        //{5}
        this.validateAllFormFields(control);            //{6}
      }
    });
  }
}
