import { Component, OnInit } from '@angular/core';
import { PersonalizarService } from '../../../Administrador/services/personalizar.service';
import { EnviarInfoService } from '../../../Administrador/services/enviar-info.service';
import { DEFAULT_INTERRUPTSOURCES, Idle } from '@ng-idle/core';
import { AuthService } from '../../../../auth/services/auth.service';
import { Keepalive } from '@ng-idle/keepalive';
import { MatDialog } from '@angular/material/dialog';
import { Router } from '@angular/router';
import Swal from 'sweetalert2';

@Component({
  selector: 'app-layout-page',
  templateUrl: './layout-page.component.html',
  styleUrl: './layout-page.component.css'
})
export class LayoutPageComponent implements OnInit {
  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 timeOut = false;
  public lastPing?: any = null;

  constructor(
    private _enviarInfo: EnviarInfoService,
    private _personalizarService: PersonalizarService,
    private _authService: AuthService,
    private idle: Idle,
    private keepalive: Keepalive,
    public dialog: MatDialog,
    private _router: Router,
  ) { }



  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);



    })

    let userDataS = localStorage.getItem('userDataS');
    if (!userDataS) {
      // Configuración de idle
      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.dialog.closeAll();
      
        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'
        }).then(() => {
          this._authService.logout().subscribe(() => {
            localStorage.clear();
            this._router.navigate(['']); // ruta login explícita
          }, () => {
            // Incluso si falla el logout del backend, borra y navega
            localStorage.clear();
            this._router.navigate(['']);
          });
        });
      });
      

      // 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.reset();

  }

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

  ngOnDestroy(): void {
    this.idle.stop();
    this.keepalive.stop();
  }
}
