From b72836d18eefaf5eb905df2e173be63a9fc9cffe Mon Sep 17 00:00:00 2001
From: Mika <kontakt@donau2space.de>
Date: Sat, 28 Mar 2026 16:47:34 +0000
Subject: [PATCH] Add 2_interference_visualization/js/app.js

---
 2_interference_visualization/js/app.js | 52 ++++++++++++++++++++++++++
 1 file changed, 52 insertions(+)
 create mode 100644 2_interference_visualization/js/app.js

diff --git a/2_interference_visualization/js/app.js b/2_interference_visualization/js/app.js
new file mode 100644
index 0000000..572f107
--- /dev/null
+++ b/2_interference_visualization/js/app.js
@@ -0,0 +1,52 @@
+import { fetchVisualizationData } from './api.js';
+import { renderChart, updateChart } from './chart.js';
+
+/**
+ * Initialisiert die Anwendung: lädt Chart, ruft API auf, registriert Event-Listener.
+ */
+export async function initApp() {
+  try {
+    const defaultRun = '31b';
+    const defaultMetric = 'tail';
+    const data = await fetchVisualizationData({ run: defaultRun, metric: defaultMetric });
+    renderChart(data);
+    registerEventListeners();
+  } catch (error) {
+    console.error('Fehler bei der Initialisierung der App:', error);
+    const container = document.getElementById('chart-container');
+    if (container) {
+      container.textContent = 'Fehler beim Laden der Visualisierung.';
+    }
+  }
+}
+
+/**
+ * Reagiert auf Benutzeränderungen im Filterpanel und aktualisiert Diagrammdaten.
+ * @param {Event} event
+ */
+export async function handleFilterChange(event) {
+  try {
+    const runSelector = document.getElementById('run-filter');
+    const metricSelector = document.getElementById('metric-filter');
+    const selectedRun = runSelector?.value ?? '31b';
+    const selectedMetric = metricSelector?.value ?? 'tail';
+
+    const newData = await fetchVisualizationData({ run: selectedRun, metric: selectedMetric });
+    updateChart(newData);
+  } catch (error) {
+    console.error('Fehler bei der Aktualisierung des Diagramms:', error);
+  }
+}
+
+/**
+ * Registriert Event-Listener für Filterelemente.
+ */
+function registerEventListeners() {
+  const runFilter = document.getElementById('run-filter');
+  const metricFilter = document.getElementById('metric-filter');
+
+  if (runFilter) runFilter.addEventListener('change', handleFilterChange);
+  if (metricFilter) metricFilter.addEventListener('change', handleFilterChange);
+}
+
+window.addEventListener('load', initApp);
\ No newline at end of file