import { fetchDriftMatrix } from './api.js';
import { renderMatrix } from './matrixRenderer.js';

/**
 * Initialisiert die Anwendung, lädt initiale Matrix-Daten, bindet Events.
 * Wird aufgerufen, wenn das Fenster geladen ist.
 */
export async function initApp() {
  const runSelector = document.getElementById('run-selector');
  const matrixContainer = document.getElementById('matrix-container');

  if (!runSelector || !matrixContainer) {
    console.error('App initialisierung fehlgeschlagen: DOM-Elemente fehlen.');
    return;
  }

  runSelector.addEventListener('change', handleRunChange);

  const initialRunId = runSelector.value ?? '';
  await loadAndRenderMatrix(initialRunId);
}

/**
 * Lädt neue Matrix-Daten und rendert sie.
 * @param {string} runId
 */
async function loadAndRenderMatrix(runId) {
  const matrixContainer = document.getElementById('matrix-container');
  matrixContainer.setAttribute('aria-busy', 'true');

  try {
    const matrixData = await fetchDriftMatrix(runId);
    renderMatrix(matrixData);
  } catch (error) {
    console.error('Fehler beim Laden der Drift-Matrix:', error);
    matrixContainer.innerHTML = '<p role="alert">Fehler beim Laden der Matrix-Daten.</p>';
  } finally {
    matrixContainer.setAttribute('aria-busy', 'false');
  }
}

/**
 * Reagiert auf Änderung der Run-Auswahl und lädt neue Matrix-Daten.
 * @param {Event} event
 */
export async function handleRunChange(event) {
  const runId = event.target.value;
  await loadAndRenderMatrix(runId);
}

// Initialisierung beim Laden
window.addEventListener('load', initApp);