import { Component, OnInit ,TemplateRef,ViewChild} from '@angular/core';
import { AuthService } from '../auth.service';
import { Router } from '@angular/router';
import { LogoutService } from './logout.service';
import { ToastrService } from 'ngx-toastr';
import { debug } from 'util';
import {  BsModalService, BsModalRef, ModalOptions } from 'ngx-bootstrap/modal';
@Component({
  selector: 'app-logout',
  templateUrl: './logout.component.html',
  styleUrls: ['./logout.component.css']
})
export class LogoutComponent implements OnInit {
  @ViewChild("pendinglotinfoTemplate", { static: true })
  pendinglotinfoTemplate: TemplateRef<any>;
  postresult: boolean;
  config: ModalOptions = {
    backdrop: "static",
    keyboard: false,
    animated: true,
    class: "modal-dialog-centered",
    ignoreBackdropClick: true,
  };
  pendinglotinfoModalRef: BsModalRef;
  pendinglot:number=0;
  assignlot:number=0;
  userid = localStorage.getItem('userid');
  constructor(private authService: AuthService, private router: Router, private logoutservice: LogoutService
    , private toastr: ToastrService,
    private modalService: BsModalService,) { }
  ngOnInit() {

    if (localStorage.getItem('LoggedIn') == null || localStorage.getItem('LoggedIn') === undefined) {
      localStorage.clear();
      sessionStorage.clear();
      localStorage.removeItem('sessionexpire');
      localStorage.setItem('sessionexpire', 'true');
      this.router.navigate(['/login']); 
      //this.show_pendinglotd();
    } else {
      //this.show_pendinglotd();
      this.call_logout();
    }

    // this.authService.logout();
    // this.router.navigate(['login']);
  }
  show_pendinglotd(){
    this.logoutservice.GetUsersPendinginfo(this.userid).subscribe(res => {
      if (res.status === 200) {
        console.log(JSON.parse(res.body[0])[0].assignlot);
        console.log(JSON.parse(res.body[0])[0].pendinglot);
        this.pendinglot=JSON.parse(res.body[0])[0].pendinglot;
        this.assignlot=JSON.parse(res.body[0])[0].assignlot;
        this.pendinglotinfoModalRef = this.modalService.show(this.pendinglotinfoTemplate, this.config);
        const aa = document.getElementsByClassName("modal-content");
        aa[0].classList.remove("modal-content");
      }
    }, err => {
      this.toastr.error('Error while geting user info');
    });
  }
  async call_logout(){
    const logid = localStorage.getItem('logid');
   // const returnedid = this.logoutservice.logout(logid,userid).subscribe(res => {
    
      const returnedid = await this.logoutservice.logout(logid).subscribe(res => {
        if (res.status === 200) {
          this.postresult = true;
          localStorage.clear();
          sessionStorage.clear();
          localStorage.removeItem('LoggedIn');
          localStorage.removeItem('sessionexpire');
          localStorage.setItem('sessionexpire', 'true');
          this.router.navigate(['/login']);
        }

      },
        error => {
          this.toastr.error(error.error);
          this.postresult = false;
        });
  }
  listenForStorageChanges(): void {
    window.addEventListener('storage', (event) => {
      if (event.key === 'broadcastSessionStorage' && event.newValue) {
        const { key, value } = JSON.parse(event.newValue);

        // Set the value in sessionStorage for this tab
        sessionStorage.setItem(key, value);
      }
    });
  }
  closeppop(){
    this.call_logout();
    if (this.pendinglotinfoModalRef) {
      this.pendinglotinfoModalRef.hide();
    }
  }
  // ngOnInit() {

  //   if (localStorage.getItem('LoggedIn') == null || localStorage.getItem('LoggedIn') === undefined) {
  //     localStorage.clear();

  //     this.router.navigate(['/login']);
  //   } else {
  //     const logid = localStorage.getItem('logid');
  //     const returnedid = this.logoutservice.logout(logid).subscribe(res => {
  //       // console.log(res);
  //       if (res.status === 200) {
  //         this.postresult = true;
  //         localStorage.clear();
  //         localStorage.removeItem('LoggedIn');
  //         this.router.navigate(['/login']);
  //       }

  //     },
  //       error => {
  //         this.toastr.error(error.error);
  //         this.postresult = false;
  //       });
  //   }

  //   // this.authService.logout();
  //   // this.router.navigate(['login']);
  // }

}
