From fc41dd5a569b7c6a7a4e6148bd6087d00fd90dd2 Mon Sep 17 00:00:00 2001
From: Mika <kontakt@donau2space.de>
Date: Sun, 18 Jan 2026 16:36:59 +0000
Subject: [PATCH] Add data_visualization/js/app.js

---
 data_visualization/js/app.js | 61 ++++++++++++++++++++++++++++++++++++
 1 file changed, 61 insertions(+)
 create mode 100644 data_visualization/js/app.js

diff --git a/data_visualization/js/app.js b/data_visualization/js/app.js
new file mode 100644
index 0000000..b12908e
--- /dev/null
+++ b/data_visualization/js/app.js
@@ -0,0 +1,61 @@
+import { fetchData } from './api.js';
+import { processData } from './dataHandler.js';
+import { renderCharts, updateCharts } from './chartRenderer.js';
+
+/**
+ * Initialisiert die Anwendung, ruft Daten ab und rendert die Diagramme.
+ * @returns {Promise<void>}
+ */
+export async function initApp() {
+  try {
+    const rawData = await fetchData();
+    const processedData = processData(rawData);
+    renderCharts(processedData);
+    registerEventListeners();
+  } catch (error) {
+    console.error('Fehler beim Initialisieren der Anwendung:', error);
+    const errorContainer = document.querySelector('#error-message');
+    if (errorContainer) {
+      errorContainer.textContent = 'Fehler beim Laden der Daten. Bitte versuchen Sie es erneut.';
+    }
+  }
+}
+
+/**
+ * Bindet Benutzerinteraktionen, z.B. Filteränderungen oder Refresh.
+ */
+function registerEventListeners() {
+  const filterForm = document.querySelector('#filter-form');
+  const refreshButton = document.querySelector('#refresh-data');
+
+  if (filterForm) {
+    filterForm.addEventListener('submit', async (event) => {
+      event.preventDefault();
+      const formData = new FormData(filterForm);
+      const filters = Object.fromEntries(formData.entries());
+      await handleDataUpdate(filters);
+    });
+  }
+
+  if (refreshButton) {
+    refreshButton.addEventListener('click', async () => {
+      await handleDataUpdate();
+    });
+  }
+}
+
+/**
+ * Lädt aktualisierte Daten mit optionalen Filtern und aktualisiert die Diagramme.
+ * @param {Object} [filters] - Optional Filterparameter.
+ */
+async function handleDataUpdate(filters = {}) {
+  try {
+    const rawData = await fetchData(filters);
+    const processedData = processData(rawData);
+    updateCharts(processedData);
+  } catch (error) {
+    console.error('Fehler beim Aktualisieren der Daten:', error);
+  }
+}
+
+window.addEventListener('load', initApp);
\ No newline at end of file