import { Component, OnInit } from '@angular/core';
import { Observable, Subject, tap } from 'rxjs';
import { AuthService } from '../../../../auth/services/auth.service';
import { Router } from '@angular/router';
import { DEFAULT_INTERRUPTSOURCES, Idle } from '@ng-idle/core';
import { Keepalive } from '@ng-idle/keepalive';
import Swal from 'sweetalert2';
import { MatDialog } from '@angular/material/dialog';
import { PersonalizarService } from '../../services/personalizar.service';
import { EnviarInfoService } from '../../services/enviar-info.service';
import { ActividadUser } from '../../interfaces/ActividadUser.interface';
import { format } from 'date-fns';
import { ActividadService } from '../../services/actividad.service';
import { NavbarHomeComponent } from '../../../../shared/navbar-home/navbar-home.component';

@Component({
  selector: 'app-layout-page',
  templateUrl: './layout-page.component.html',
  styleUrl: './layout-page.component.css'
})
export class LayoutPageComponent {

  private userData = JSON.parse(localStorage.getItem('userData') || '');
  private windowsV: string = '';
  private navegador: string = '';
  private navegadorV: string = '';
  private dispositivo: string = '';
  public fechaEntrada: string = '';
  private fechaSalida = format(new Date(), 'yyyy-MM-dd HH:mm:ss')
  public publicIP: string = '';
  public localIP: string = '';
  public actividad?: ActividadUser;

  public timeOut = false;
  public timeInterval = 15;
  public lastPing?: any = null;
  public options: Object = {};
  public name: string = '';
  public logo: string = '';
  public message: string = '';
  public firstColorBar: string = '';
  public secondColorBar: string = '';
  public fontColorBar: string = '';
  public firstColorTitles: string = '';
  public textureBar: string = '';
  public links: string = '';
  public currentDate: string = new Date().toLocaleString();
  public token = localStorage.getItem('token') || '';
  public activity = {}


  constructor(
    private _authService: AuthService,
    private _personalizarService: PersonalizarService,
    public dialog: MatDialog,
    private _router: Router,
    private idle: Idle,
    private keepalive: Keepalive,
    private _enviarInfo: EnviarInfoService,
    private authService: AuthService,
    private actividadService: ActividadService,
    // private navbarHome: NavbarHomeComponent
  ) {

    this.getLocalIP();
    this.getPublicIPAddress();
    if (!localStorage.getItem('fechaE')) {
      const fechaActual = new Date();
      this.fechaEntrada = format(fechaActual, 'yyyy-MM-dd HH:mm:ss');
      localStorage.setItem('fechaE', this.fechaEntrada)
      console.log(this.fechaEntrada);
    }

    var userAgent = navigator.userAgent;
    if (/Mobile|iP(hone|od|ad)|Android|BlackBerry|IEMobile/.test(userAgent)) {
      this.dispositivo = 'Mobile Phone';
    } else {
      this.dispositivo = 'Desktop';
    }

    // ------------------------------------------------------------------------

    // obtener versión del navegador
    var getBrowserInfo = function () {
      var ua = navigator.userAgent, tem,
        M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
      if (/trident/i.test(M[1])) {
        tem = /\brv[ :]+(\d+)/g.exec(ua) || [];
        return 'IE ' + (tem[1] || '');
      }
      if (M[1] === 'Chrome') {
        tem = ua.match(/\b(OPR|Edge)\/(\d+)/);
        if (tem != null) return tem.slice(1).join(' ').replace('OPR', 'Opera');
      }
      M = M[2] ? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?'];
      if ((tem = ua.match(/version\/(\d+)/i)) != null) M.splice(1, 1, tem[1]);
      return M.join(' ');
    };
    this.navegador = getBrowserInfo().split(' ')[0]
    this.navegadorV = getBrowserInfo().split(' ')[1]


    var userAgent = window.navigator.userAgent;

    // Verificar si el usuario está utilizando Windows
    if (userAgent.indexOf("Windows") != -1) {
      // Definir los patrones para buscar versiones específicas de Windows
      var windowsVersions: any = {
        "Win11": "Windows NT 10.0",
        "Win10": "Windows NT 10.0",
        "Win8.1": "Windows NT 6.3",
        "Win8": "Windows NT 6.2",
        "Win7": "Windows NT 6.1",
        "WinVista": "Windows NT 6.0",
        "WinXP": "Windows NT 5.1",
        "Win2000": "Windows NT 5.0"
      };

      // Iterar sobre los patrones para detectar la versión específica
      for (var version in windowsVersions) {
        if (userAgent.indexOf(windowsVersions[version]) != -1) {

          this.windowsV = version;
          break;
        }
      }
    } else {
      console.log("No se detectó Windows en el userAgent.");
    }

    this.authService.verifyToken({
      idUsuario: this.userData[0]
    }).subscribe((response) => {
      console.log(response);
    }, (err) => {
      // this.navbarHome.actualizarActividad();
      this.actividad = {
        idUsuario: this.userData[0],
        fechaHora: localStorage.getItem('fechaE') || '',
        ipPublica: this.publicIP,
        ipLocal: this.localIP,
        plataforma: this.windowsV,
        navegador: this.navegador,
        version: this.navegadorV,
        tipoDispositivo: this.dispositivo,
        esMovil: this.dispositivo === 'Mobile Phone' ? '1' : ' 0',
        esTableta: '0',
        esApp: 'No',
        sesionCerrada: '',
        sesionMensual: '',
        fechaHoraFin: this.fechaSalida
      };

      console.log(this.actividad);
      return this.actividadService.storeActivity(this.actividad).subscribe((response) => {
        console.log(response);
        localStorage.clear();
        this._router.navigate(['']);
      }, (err) => {
        console.log(err);
      });

    })

  }


  ngOnInit(): void {

    //Llamar al servicio de personalización de la página
    this._personalizarService.getOptions().subscribe((response: any) => {
      this.name = response.personalizacion.PERNOMBRE;
      this.logo = response.personalizacion.PERLOGO;
      this.message = response.personalizacion.PERMENSAJE;
      this.firstColorBar = response.personalizacion.PERPR_COL_BAR;
      this.secondColorBar = response.personalizacion.PERSDO_COL_BAR;
      this.fontColorBar = response.personalizacion.PERCOL_LTR_BAR;
      this.firstColorTitles = response.personalizacion.PERPR_COL_TIT;
      this.textureBar = response.personalizacion.PERTXT_BAR;
      this.links = response.personalizacion.PERVINCULOS;
      // console.log(response.personalizacion.PERVINCULOS);

      this._enviarInfo.changeMessage(this.message);
      this._enviarInfo.changeColor(this.firstColorTitles);
      this._enviarInfo.changeTextColor(this.fontColorBar);
      this._enviarInfo.changeColorLinks(this.links);
    })

    // const actual = new Date();
    // console.log(actual.toLocaleTimeString());

    this.idle.setIdle(10 * 60); //tiempo de inactividad
    this.idle.setTimeout(5 * 60);//tiempo para cerrar sesión después de pasar setIdle ☝️
    this.idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);

    //mensaje de cierre de sesión forzado
    this.idle.onTimeout.subscribe(() => {
      this.timeOut = true;
      this._authService.logout().subscribe((response) => {
        console.log(response);
        this.dialog.closeAll()
        localStorage.clear();
        this._router.navigate(['']);
      }, (err) => {
        console.log(err);
      });

      Swal.fire({
        icon: 'info',
        title: 'Sesión terminada',
        text: 'No hubo actividad por un tiempo así que cerramos la sesión.',
        showCancelButton: false,
        confirmButtonColor: 'rgb(237,46,56)',
        confirmButtonText: 'Ok'
      })
    });



    //mensaje antes de que te saque
    this.idle.onIdleStart.subscribe(() => {
      Swal.fire({
        icon: 'question',
        title: '¿Sigues ahí?',
        showCancelButton: false,
        confirmButtonColor: 'rgb(237,46,56)',
        confirmButtonText: 'Sí',
        timer: 5000
      }).then((result: any) => {
        if (result.isConfirmed) {
          this.reset;
        }
      })
    });

    // this.idle.onInterrupt.subscribe(() => {
    //   let hoy = new Date();
    //   hoy.setSeconds(this.timeInterval);
    //   localStorage.setItem('expira', hoy.getTime().toString());
    // });

    this.keepalive.onPing.subscribe(() => this.lastPing = new Date());
    // this.checkSession();
    this.reset();
  }

  getLocalIP() {
    this.actividadService.getIP().subscribe((response: any) => {
      this.localIP = response.local_ip;

    })
  }

  getPublicIPAddress() {
    this.actividadService.getPublicIPAddress().subscribe(
      (ip: string) => {
        this.publicIP = ip;
        // console.log(ip);

      }
    );
  }


  reset() {
    this.idle.watch();
    this.timeOut = false;
  }

  // //cerrar sesión
  // logout() {
  //   this._authService.logout().subscribe((response) => {
  //     console.log(response);
  //   });
  //   this.dialog.closeAll()
  // }


  //antes de que destruya el componente se detiene el tiempo de inactividad
  ngOnDestroy(): void {
    this.idle.stop();
    this.keepalive.stop();
  }


  // isTokenExpired(token: string) {
  //   const arrayToken = token.split('.');
  //   const tokenPayload = JSON.parse(atob(arrayToken[1]));
  //   // console.log(new Date().getTime() / 1000 >= tokenPayload.exp);
  //   return Math.floor(new Date().getTime() / 1000) >= tokenPayload.exp;
  // }



}


