import { Component, AfterViewInit } from '@angular/core';
import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
import { Router } from '@angular/router';
import { IAMService } from 'src/app/services/iam/iam.service';
import { USERInterface } from 'src/app/interfaces/user-interface';
import { ENCService } from 'src/app/services/enc/enc.service';


@Component({
  selector: 'app-mes',
  templateUrl: './mes.component.html',
  styleUrls: ['./mes.component.css']
})
export class MESComponent implements AfterViewInit {

  
  
  title = 'vacaciones';
  anio: number;
  menuMCO = false;
  isLoggedIn:Boolean = false;
  events: string[] = [];
  opened: boolean = false;
  pantallaGrande:boolean =  !this.breakpointObserver.isMatched('(max-width: 1700px)');
  nombreUsuario: string;
  usuario_session:USERInterface = JSON.parse(localStorage.getItem('TIMUSERENC')!);
  empresa:string = "";
  public auxCont:boolean = false
  razonSocial: string = "";
  public perfil : string;
  public activateMenu( response:Boolean ){
    this.isLoggedIn = response;
  }

  constructor( private _encService:ENCService, private breakpointObserver:BreakpointObserver, private _IAMService:IAMService) {
    this.anio = new Date().getFullYear();
    this.isLoggedIn = (localStorage.getItem('jwt') !== "");
    
    this.nombreUsuario = this.usuario_session.NOMBRE;
    this.razonSocial = this._encService.desencriptar(this.usuario_session.RAZONSOCIAL);
    this.empresa = this._encService.desencriptar( this.usuario_session.RFCEMPRESA);
    this.perfil = this._encService.desencriptar(this.usuario_session.NOMBREPERFIL);
  }

  ngAfterViewInit(): void {
    this.cargarColores();

    if(!this.pantallaGrande){
      this.auxCont = true;
    }else{
      this.auxCont = false;
    }
  }
  
  onResize(event:any) {
    this.pantallaGrande = event.target.innerWidth > 1700
    if(!this.pantallaGrande){
      this.auxCont = true;
    }else{
      this.auxCont = false;
    } 
  }

  smallMenu(){
    if (this.auxCont) {
      this.pantallaGrande = !this.pantallaGrande;
    }
  }

  async cargarColores(){  
   
    if(this.pantallaGrande){
      
      document.getElementById("colorApp4")!.classList.remove('primary');
      document.getElementById("colorApp4")!.classList.add(this.empresa);
  
      document.getElementById("colorApp5")!.classList.remove('primary');
      document.getElementById("colorApp5")!.classList.add(this.empresa);
  
      /* document.getElementById("colorApp6")!.classList.remove('primary');
      document.getElementById("colorApp6")!.classList.add(this.empresa); */
  
      document.getElementById("colorAppText3")!.classList.remove('text-primary');
      document.getElementById("colorAppText3")!.classList.add(`text-${this.empresa}`);
    }else{
      document.getElementById("colorApp1")!.classList.remove('primary');
      document.getElementById("colorApp1")!.classList.add(this.empresa);
  
      document.getElementById("colorApp2")!.classList.remove('primary');
      document.getElementById("colorApp2")!.classList.add(this.empresa);
  
      document.getElementById("colorApp3")!.classList.remove('primary');
      document.getElementById("colorApp3")!.classList.add(this.empresa);

      document.getElementById("colorAppText1")!.classList.remove('text-primary');
      document.getElementById("colorAppText1")!.classList.add(`text-${this.empresa}`);

      document.getElementById("colorAppText1")!.classList.remove('text-primary');
      document.getElementById("colorAppText1")!.classList.add(`text-${this.empresa}`);
    }

    
  }

  imagenLogo(){
    let empresa = localStorage.getItem("RFCEMPRESA")!;    
    if (window.location.href.includes("ferrariventilatori")) {
      return `https://ferrariventilatori.mx/vacaciones/assets/img/${empresa}-NO-BG.png`  
    }else{
      return `../assets/img/${ this._encService.desencriptar(empresa)}-NO-BG.png`
    }
  }

  imagenLogoITTEC(){
    if (window.location.href.includes("ferrariventilatori")) {
      return "https://ferrariventilatori.mx/vacaciones/assets/img/ITTEC-NO-BG.png"
      
    }else{
      return "../assets/img/ITTEC-NO-BG.png"
    }
  }
  

  logout() {
    this._IAMService.logout();
    this.isLoggedIn = false;
  }

}