Add data_visualization/js/app.js

data_visualization/js/app.js

@@ -0,0 +1,47 @@
+import { fetchData } from './modules/fetch_data.js';
+import { renderChart } from './modules/render_chart.js';
+
+/**
+ * Initialisiert die Anwendung: Daten laden, Diagramme rendern, Events binden.
+ * @returns {Promise<void>}
+ */
+export async function initApp() {
+  try {
+    const sensorData = await fetchData();
+
+    if (!sensorData || typeof sensorData !== 'object') {
+      console.error('Keine gültigen Sensordaten gefunden.');
+      return;
+    }
+
+    renderChart(sensorData);
+    bindFilterEvents();
+  } catch (error) {
+    console.error('Fehler bei der Initialisierung der App:', error);
+  }
+}
+
+/**
+ * Verknüpft Filterelemente mit Datenaktualisierungen.
+ */
+export function bindFilterEvents() {
+  const filterForm = document.querySelector('#data-filters');
+  if (!filterForm) return;
+
+  filterForm.addEventListener('change', async (event) => {
+    event.preventDefault();
+
+    const formData = new FormData(filterForm);
+    const filters = Object.fromEntries(formData.entries());
+
+    try {
+      const filteredData = await fetchData(filters);
+      renderChart(filteredData);
+    } catch (error) {
+      console.error('Fehler beim Aktualisieren der Diagrammdaten:', error);
+    }
+  });
+}
+
+// Startpunkt, wenn Seite geladen ist
+window.addEventListener('load', initApp);