/* global loadCSSModule, SBdispatcher, getModuleUrl */
;(function () {
  const DEFAULT_DELAY_SECONDS = 12;
  const MAX_ITEMS = 8;
  const MODULE_ID = 'killfeed-container';

  const moduleUrl = window.getModuleUrl ? window.getModuleUrl() : '';
  loadCSSModule('overlay-killfeed-css', moduleUrl + '/css/killfeed.css');

  // ==== Init DOM ====
  function initModule() {
    if (document.getElementById(MODULE_ID)) return;

    const root = document.createElement('div');
    root.id = MODULE_ID;

    const list = document.createElement('ul');
    list.id = 'killfeed-list';

    root.appendChild(list);
    document.body.appendChild(root);
  }

  // Construit un LI de killfeed
  function buildKillItem(p1Name, p1Img, p2Name, p2Img, eventName) {
    const li = document.createElement('li');
    li.className = 'killfeed-item';

    // Zone gauche (joueur 1)
    const left = document.createElement('div');
    left.className = 'kf-left';

    const leftName = document.createElement('span');
    leftName.className = 'kf-name kf-name-left';
    leftName.textContent = p1Name || '';

    const leftImg = document.createElement('img');
    leftImg.className = 'kf-avatar kf-avatar-left';
    if (p1Img) leftImg.src = p1Img;
    leftImg.alt = p1Name ? `Avatar ${p1Name}` : 'Avatar joueur 1';

    left.append(leftName, leftImg);

    // Zone centrale (event)
    const center = document.createElement('div');
    center.className = 'kf-center';
    const evtImg = document.createElement('img');
    evtImg.className = 'kf-event';
    if (eventName) evtImg.src = `${moduleUrl}/assets/${eventName}.png`;
    evtImg.alt = eventName || 'Event';
    center.appendChild(evtImg);

    // Zone droite (joueur 2)
    const right = document.createElement('div');
    right.className = 'kf-right';

    const rightImg = document.createElement('img');
    rightImg.className = 'kf-avatar kf-avatar-right';
    if (p2Img) rightImg.src = p2Img;
    rightImg.alt = p2Name ? `Avatar ${p2Name}` : 'Avatar joueur 2';

    const rightName = document.createElement('span');
    rightName.className = 'kf-name kf-name-right';
    rightName.textContent = p2Name || '';

    right.append(rightImg, rightName);

    li.append(left, center, right);
    return li;
  }

  // Ajoute un event (kill)
function addKill(p1Name, p1Img, p2Name, p2Img, eventName, delaySeconds) {
  const list = document.getElementById('killfeed-list');
  if (!list) return;

  const li = buildKillItem(p1Name, p1Img, p2Name, p2Img, eventName);
  li.classList.add('appearing');

  // ✅ AJOUT EN DESSOUS (fin de liste)
  list.appendChild(li);

  // Auto-disparition
  const ms = (isFinite(delaySeconds) && delaySeconds > 0)
    ? delaySeconds * 1000
    : DEFAULT_DELAY_SECONDS * 1000;

  const fadeRemove = () => {
    li.style.opacity = '0';
    setTimeout(() => {
      if (li.parentElement === list) list.removeChild(li);
    }, 500);
  };
  setTimeout(fadeRemove, ms);

  // Limite par nombre (supprime en haut)
  while (list.children.length > MAX_ITEMS) {
    list.removeChild(list.firstElementChild);
  }

  // Limite par hauteur (supprime en haut tant que ça dépasse)
  const container = document.getElementById('killfeed-container');
  if (container) {
    while (list.scrollHeight > container.clientHeight && list.firstElementChild) {
      list.removeChild(list.firstElementChild);
    }
  }

  setTimeout(() => li.classList.remove('appearing'), 400);
}



  // Expose globalement
  window.Killfeed = { addKill };

  // === SBdispatcher Listener ===
  // wsParam1 = pseudo joueur 1
  // wsParam2 = image joueur 1
  // wsParam3 = pseudo joueur 2
  // wsParam4 = image joueur 2
  // wsParam5 = eventName
  // wsParam6 = délai (secondes)
  if (window.SBdispatcher) {
    SBdispatcher.on('killfeed-add', data => {
      addKill(
        data.param1, // Joueur 1
        data.param2, // Avatar joueur 1
        data.param3, // Joueur 2
        data.param4, // Avatar joueur 2
        data.param5, // Nom de l'event (image)
        parseFloat(data.param6) // Délai (optionnel)
      );
    });
  }

  initModule();
})();