/* =========================================================================
   La Morgue — Reddit Top 100 · popup
   Pide al content script analizar el hilo (fetch + ranking) y exportar el .txt.
   ========================================================================= */

const els = {
  notice: document.getElementById('notice'),
  panel: document.getElementById('panel'),
  postTitle: document.getElementById('postTitle'),
  statAnalyzed: document.getElementById('statAnalyzed'),
  statSelected: document.getElementById('statSelected'),
  statTop: document.getElementById('statTop'),
  state: document.getElementById('state'),
  stateText: document.getElementById('stateText'),
  preview: document.getElementById('preview'),
  previewList: document.getElementById('previewList'),
  analyzeBtn: document.getElementById('analyzeBtn'),
  analyzeText: document.getElementById('analyzeText'),
  exportBtn: document.getElementById('exportBtn'),
  toast: document.getElementById('toast'),
};

let analyzed = false;

// ---------- Mensajería ----------
async function activeTab() {
  const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
  return tab;
}

async function send(type) {
  const tab = await activeTab();
  if (!tab) return { error: 'no_tab' };
  try {
    return await chrome.tabs.sendMessage(tab.id, { type });
  } catch (e) {
    return { error: 'no_content_script' };
  }
}

// ---------- Mensajes de error legibles ----------
function errorMessage(code) {
  if (code === 'no_thread')
    return 'Abre un hilo de Reddit (una página de comentarios) y reintenta.';
  if (code === 'no_content_script')
    return 'Recarga la pestaña de Reddit y vuelve a intentar.';
  if (code === 'network')
    return 'No se pudo conectar. Revisa tu conexión y reintenta.';
  if (code === 'http_429')
    return 'Reddit está limitando las peticiones (429). Espera ~1 minuto y reintenta.';
  if (code === 'http_403')
    return 'Reddit bloqueó la petición (403). Prueba el hilo en old.reddit.com o espera un momento.';
  if (code && code.indexOf('http_') === 0)
    return 'Reddit respondió con un error (' + code.replace('http_', '') + '). Prueba en old.reddit.com.';
  if (code === 'parse' || code === 'shape')
    return 'La respuesta de Reddit no tuvo el formato esperado. Prueba en old.reddit.com.';
  return 'Ocurrió un problema. Reintenta en un momento.';
}

// ---------- UI ----------
function setState(mode, text) {
  els.state.className = 'state ' + mode;
  els.stateText.textContent = text;
}

function toast(text, kind) {
  els.toast.className = 'toast ' + (kind || '');
  els.toast.textContent = text || '';
}

function showNotice() {
  els.panel.classList.add('hidden');
  els.notice.style.display = 'block';
}

function renderSummary(r) {
  els.postTitle.textContent = r.title;
  els.postTitle.classList.remove('empty');
  els.statAnalyzed.textContent = r.analyzed.toLocaleString('es');
  els.statSelected.textContent = r.selected.toLocaleString('es');
  els.statTop.textContent = (r.topScore != null ? r.topScore : 0).toLocaleString('es');

  // Vista previa del top 3
  els.previewList.innerHTML = '';
  (r.preview || []).forEach((c, i) => {
    const item = document.createElement('div');
    item.className = 'pv-item';
    item.innerHTML =
      '<span class="pv-rank">#' + (i + 1) + '</span>' +
      '<span class="pv-author">u/' + escapeHtml(c.author) + '</span>' +
      '<span class="pv-meta">' + c.score + ' pts · ' + c.replies + ' resp.</span>';
    els.previewList.appendChild(item);
  });
  els.preview.classList.toggle('hidden', !(r.preview && r.preview.length));
}

function escapeHtml(s) {
  return (s || '').replace(/[&<>"]/g, (ch) =>
    ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;' }[ch])
  );
}

// ---------- Acciones ----------
els.analyzeBtn.addEventListener('click', async () => {
  toast('');
  setState('running', 'Analizando hilo…');
  els.analyzeBtn.disabled = true;

  const r = await send('ANALYZE');
  els.analyzeBtn.disabled = false;

  if (!r || r.error) return finishError(r && r.error);
  if (!r.ok) return finishError(r.error);

  analyzed = true;
  renderSummary(r);
  setState('done', 'Listo · top ' + r.selected);
  els.analyzeText.textContent = 'Re-analizar';
  els.exportBtn.disabled = false;
  const extra = r.numComments != null ? ' de ' + r.numComments.toLocaleString('es') + ' comentarios' : '';
  toast('✓ ' + r.selected + ' comentarios seleccionados' + extra, 'ok');
});

els.exportBtn.addEventListener('click', async () => {
  toast('');
  const r = await send('EXPORT');
  if (!r || r.error) return toast(errorMessage(r && r.error), 'err');
  if (!r.ok) return toast(errorMessage(r.error), 'err');
  toast('✓ Archivo .txt exportado (' + r.count + ' comentarios)', 'ok');
});

function finishError(code) {
  setState('error', 'No se pudo analizar');
  toast(errorMessage(code), 'err');
}

// ---------- Inicialización ----------
(async function init() {
  const r = await send('PING');
  if (!r || r.error || !r.ok) return showNotice();
  if (!r.isThread) return showNotice();
  setState('', 'Sin analizar');
})();
