import { fetchNui } from './fetchNui.js';
import { Global } from '../../lang/global.js';

let config;
// Eine Variable, um ausstehende Spielerdaten zu speichern
let pendingPlayerData = null;

/**
 * Get element by id
 * @param id {string}
 **/
const getElementById = (id) => document.getElementById(id);

/**
 * Set visibility 
 * @param visibility {string}
 **/
const setVisibility = (visibility) => getElementById('um-idcard').style.visibility = visibility;

/**
 * Set visibility of badge 
 * @param badge {string|Object|null}
 **/
const setBadgeVisibility = (badge) => {
  const badgeElement = getElementById('badge');
  if (!badge || badge === 'none') {
    badgeElement.style.display = 'none';
    return;
  }
  getElementById('badgeimg').src = `badges/${badge.img}.png`;
  getElementById('badgegrade').textContent = badge.grade;
  badgeElement.style.display = 'flex';
};

const closeFunction = () => {
  getElementById('um-idcard').classList.remove('animate__animated', 'animate__fadeInLeft', 'animate__faster');
  setVisibility('hidden');
  setBadgeVisibility('none');
  fetchNui('closeIdCard');
};

/**
 * Open id card
 * @param playerData {Object}
 **/
const openIdCard = (playerData) => {
  // Überprüfen, ob config und config.Licenses existieren
  if (!config || !config.Licenses) {
    console.error('Config oder Licenses nicht initialisiert. Bitte stellen Sie sicher, dass configData vor playerData gesendet wird.');
    return;
  }
  
  // Überprüfen, ob der cardtype gültig ist
  const license = config.Licenses[playerData.cardtype];
  if (!license) {
    console.error(`Lizenztyp "${playerData.cardtype}" nicht in der Konfiguration gefunden`);
    return;
  }
  
  const elements = {
    lastname: playerData.lastname,
    name: playerData.firstname,
    sign: `${playerData.lastname} ${playerData.firstname}`,
    dob: playerData.birthdate,
    sex: playerData.sex,
    nationality: playerData.nationality,
    cardtype: license.header,
  };

  Object.entries(elements).forEach(([key, value]) => {
    getElementById(key).textContent = value;
  });

  getElementById('mugshot').src = playerData.mugShot;
  getElementById('smallmugshot').src = playerData.mugShot;
  getElementById('um-idcard').style.backgroundColor = license.background;
  getElementById('um-idcard').classList.add('animate__animated', 'animate__fadeInLeft', 'animate__faster');
  setBadgeVisibility(playerData.badge);
  setVisibility('visible');
  autoClose();
};

const autoClose = () => {
  if (!config || !config.IdCardSettings || !config.IdCardSettings.autoClose || !config.IdCardSettings.autoClose.status) return;
  setTimeout(closeFunction, config.IdCardSettings.autoClose.time);
};

window.addEventListener('message', (event) => {
  const { type, playerData, configData } = event.data;
  
  if (type === 'configData') {
    config = configData;
    
    // Wenn es ausstehende Spielerdaten gibt, verarbeiten Sie diese jetzt
    if (pendingPlayerData) {
      openIdCard(pendingPlayerData);
      pendingPlayerData = null;
    }
  } 
  else if (type === 'playerData') {
    // Wenn die Konfiguration bereits geladen ist, öffnen Sie die ID-Karte
    if (config) {
      openIdCard(playerData);
    } 
    // Andernfalls speichern Sie die Spielerdaten für später
    else {
      pendingPlayerData = playerData;
      console.log('Konfiguration noch nicht geladen. Spielerdaten werden für später gespeichert.');
    }
  }
});

window.addEventListener('load', () => {
  Object.entries(Global).forEach(([key, value]) => {
    getElementById(key).textContent = value;
  });
});

document.addEventListener('keydown', (e) => {
  if (!config || !config.IdCardSettings || e.key !== config.IdCardSettings.closeKey) return;
  closeFunction();
});