import { Component, OnInit } from '@angular/core';
import { Router,ActivatedRoute } from '@angular/router';
import { FormGroup, FormControl, Validators, ValidationErrors } from '@angular/forms';
import { ValidationService } from '../../provider/validation.service';
import { WebService } from '../../provider/web.service';
import { ImageStorage } from '../../../environments/server.config';
import { NgxCarousel } from 'ngx-carousel';

@Component({
  selector: 'app-rating',
  templateUrl: './rating.component.html',
  styleUrls: ['./rating.component.scss']
})
export class RatingComponent implements OnInit {
  prdt_id:any;
  loginDetails:any;
  rateFormClick:boolean;
  loader:boolean;
  productDetails:any;
  imageServer: any;
  rateFormResponse:any;

  public carouselTile: NgxCarousel;
  constructor(
    private router        : Router, 
    private route         : ActivatedRoute,
    public errorMsg       : ValidationService,
    public webService     : WebService
  ) { 
    this.rateFormClick = false;
    this.loader = true;
    this.imageServer = ImageStorage;
  }
  rateForm;
  ngOnInit() {
    this.route.queryParams.subscribe(params => {
      this.prdt_id = params['pId'];
    });

    if(this.prdt_id > 0){
      this.getProductDetails();
    }

    this.rateForm = new FormGroup({
      rating: new FormControl('5'),
      title: new FormControl('',[Validators.required]),
      description: new FormControl('',[Validators.required])
    });

    this.checkUserLogin();
    this.carouselTile = {grid: {xs: 1, sm: 2 , md: 4, lg: 8, all: 0},slide: 1, speed: 400,point: { visible: false },load: 2, touch: true, easing: 'ease'}
  }

  checkUserLogin(){
    this.loginDetails = JSON.parse(this.webService.getLocalStorageItem('userData'));
    if(!this.loginDetails){
      this.goToPage('purchaseHome','');
    }
  }

  getProductDetails(){
    this.loader = true;
    this.webService.post_data('SingleProductSearch',{'product_id':this.prdt_id}).subscribe(response => {
      if(response.status == 'success'){
        this.productDetails = response.data;
      }else{
        this.productDetails = false;
      }
      this.loader = false;
    })
  }

  rateFormSubmit(data){
    if(this.rateForm.invalid){
      return false;
    }
    data.product_id = this.prdt_id;
    data.customer_id = this.loginDetails.customer_id;
    this.loader = true;
    const This = this;
    this.webService.post_data('rateProduct',data).subscribe(response => {
      if(response.status == 'success'){
        this.rateFormResponse = response;
        setTimeout( function() {
          This.rateFormResponse = false;
        }, 3000);
      }else{
        response.status = 'error';
        response.message = (response.message == '')?this.errorMsg.errorList.req_failure:response.message;

        this.rateFormResponse = response;
        setTimeout( function() {
          This.rateFormResponse = false;
        }, 3000);
      }
    },error => {
      this.rateFormResponse = {'status':'error','message':this.errorMsg.errorList.req_failure};
      setTimeout( function() {
        This.rateFormResponse = false;
      }, 3000);
    });
  }

  goToPage(path,data=null){
    this.router.navigate([path],{queryParams:  data});
    document.body.scrollTop  =  document.documentElement.scrollTop  =  0;
  }

  carouselTileLoad(){ return ''; }

}
