"use strict";

/**
 * Entry Script: Initialisierung der UI und Datenvisualisierung.
 * Dieses Skript ist das Einstiegspunktmodul für die Anwendung.
 * Es bindet UI-Ereignisse und startet den initialen Datenabruf.
 */

/**
 * Ruft Messdaten von der API-Route /data ab.
 * @async
 * @returns {Promise<Array<Object>>} Array von Messobjekten
 */
async function fetchMeasurements() {
  try {
    const response = await fetch('/data');
    if (!response.ok) throw new Error(`API error: ${response.status}`);
    const data = await response.json();
    return Array.isArray(data) ? data : [];
  } catch (error) {
    console.error('Fehler beim Laden der Messdaten:', error);
    return [];
  }
}

/**
 * Rendert das Diagramm auf Basis der Messdaten.
 * Placeholder-Funktion, die vom Visualisierungsmodul überschrieben werden kann.
 * @param {Array<Object>} data Messobjekte
 */
function renderChart(data) {
  const chartContainer = document.getElementById('chart-container');
  if (!chartContainer) return;
  chartContainer.textContent = `Gerenderte Datenpunkte: ${data.length}`;
}

/**
 * Registriert UI-Eventhandler für Filter und Interaktionen.
 * @returns {void}
 */
function bindUIEvents() {
  const refreshBtn = document.getElementById('refresh-btn');
  const sensorSelect = document.getElementById('sensor-select');
  const timeRangeInput = document.getElementById('time-range');

  if (refreshBtn) {
    refreshBtn.addEventListener('click', async () => {
      const data = await fetchMeasurements();
      renderChart(data);
    });
  }

  if (sensorSelect) {
    sensorSelect.addEventListener('change', async () => {
      const sensorId = sensorSelect.value;
      const data = await fetchMeasurements();
      const filtered = data.filter(d => d.sensorId === sensorId);
      renderChart(filtered);
    });
  }

  if (timeRangeInput) {
    timeRangeInput.addEventListener('input', async () => {
      const range = timeRangeInput.value;
      const data = await fetchMeasurements();
      const filtered = data.filter(d => d.timestamp >= range);
      renderChart(filtered);
    });
  }
}

/**
 * Initialisiert das UI und startet den initialen Datenabruf.
 * Wird nach dem DOMContentLoaded Event aufgerufen.
 * @returns {Promise<void>}
 */
async function initApp() {
  bindUIEvents();
  const data = await fetchMeasurements();
  renderChart(data);
}

window.addEventListener('DOMContentLoaded', initApp);