import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators, FormControl, FormsModule } from '@angular/forms';
import { LocalStorage } from "../../core/services/local_storage.service"
import { HyperService } from '../../core/services/http.service';
import { Router } from "@angular/router";
import { SidemenuComponent } from '../../sidemenu/sidemenu.component';
import {Location} from '@angular/common';
declare var $:any;
@Component({
  selector: 'app-lauch-enquiry',
  templateUrl: './lauch-enquiry.component.html',
  styleUrls: ['./lauch-enquiry.component.scss']
})
export class LauchEnquiryComponent implements OnInit {
  lform: FormGroup;
  contact:any={};
  activeBanner:number;
  url:number;
  varient_list:any=[];
  imageSources = [];
  model_id:number=1;
  varient_id:number=1;
  brochure:boolean=true;
  loader:boolean=false;
  temp_model_id:number;
  is_btn:boolean=true;
  constructor(private formBuilder: FormBuilder, private server: HyperService, private router: Router,private loc:Location) {
    this.getBanner()
   }

  ngOnInit() {
    this.formBuild();
    this.getVarient(LocalStorage.getValue('set_model_id'));
  }
  formBuild() {
    this.lform = this.formBuilder.group({
      name: [null, Validators.compose([Validators.required])],
      location: [null, Validators.compose([Validators.required, Validators.email])],
      phone:  [null, Validators.compose([Validators.required,Validators.minLength(10)])],
    });
  }
  validateAllFormFields(formGroup: FormGroup) {
    Object.keys(formGroup.controls).forEach(field => {
      // console.log(field);
      const control = formGroup.get(field);
      if (control instanceof FormControl) {
        control.markAsTouched({
          onlySelf: true
        });
      } else if (control instanceof FormGroup) {
        this.validateAllFormFields(control);
      }
    });
  }
  editSuccess(){
     this.loader=true;
    if (this.lform.valid) {
      let model_id;
      if(this.temp_model_id!=undefined){
        model_id=this.temp_model_id
      }else{
        model_id=LocalStorage.getValue('set_model_id')
      }
      console.log(this.temp_model_id,'this.temp_model_id')
      this.server.post("explore/enquiry/"+model_id,{variant_id:this.varient_id,name:this.contact.customer_name,mobile:this.contact.customer_phone,email:this.contact.customer_email,is_brochure:(this.brochure==false?0:1)})
        .then((data) => {
            if (data.result.status == 200 ) {
              this.loader=false;
              // $('#myModal').modal('show');
                 this.contact.customer_name='';
                this.contact.customer_phone='';
                this.contact.customer_email='';
                this.brochure=true;
                this.lform.markAsUntouched();
            } else if (data.result.status == 401 && data.result.response == 'failed') {
            this.loader=false;
             } else {
              this.loader=false;
             }
        });
    }else{
      this.loader=false;
    this.validateAllFormFields(this.lform);
    }
  }
  isActive(url) {
    this.url = url;
}
show(){
  // console.log("innn")

}
  getBanner() {
    this.loader=true;
    this.server.get("explore/model")
        .then((data) => {
            if (data.status == 200 && data.result.response != 'failed' && data.result.data != null) {
              this.loader=false;
                for (let i = 0; i < data.result.data.length; i++) {
                  this.imageSources=data.result.data;
                  if(this.imageSources[i].model_id == LocalStorage.getValue('set_model_id')){
                    this.activeBanner = i;
                  }
                    // this.imageSources.push(data.result.data[i].model_image_url);

                    // console.log(this.activeBanner)
                }
                // this.activeBanner = 0;
            } else if (data.result.status == 401 && data.result.response == 'failed') {
                this.router.navigateByUrl('');
            } else {
                this.imageSources = [];
                alert(data.result.message)
                this.loader=false;
            }
        });
}

setIndex(){
  this.is_btn=false;
  setTimeout(() => {
     this.model_id=$('.carousel-inner').find('.active').text() ;
    console.log(this.model_id);
    this.temp_model_id=this.imageSources[Number($.trim(this.model_id))-1].model_id;
    this.getVarient(this.temp_model_id);
  }, 1000);
}
getVarient(id){
  this.server.get("explore/variant/"+id)
  .then((data) => {
      if (data.status == 200 && data.result.response != 'failed' && data.result.data != null) {
          this.is_btn=true;
          this.varient_list=data.result.data;
          this.varient_id=this.varient_list[0].id;
          console.log(this.is_btn)
          // console.log(this.varient_list,"this.varient_list",this.varient_id)
       } else if (data.result.status == 401 && data.result.response == 'failed') {
        this.is_btn=false;
       } else {
        this.is_btn=true;
       }
  });
}
selectVarient(id){
  this.varient_id=id;
}
goBack(){
  this.loc.back();
}
}
