From f68e04d099b407003b17c5ede174a76b74752ae6 Mon Sep 17 00:00:00 2001 From: Mika Date: Wed, 11 Mar 2026 12:43:08 +0000 Subject: [PATCH] Add max_outlier_visualization/js/app.js --- max_outlier_visualization/js/app.js | 61 +++++++++++++++++++++++++++++ 1 file changed, 61 insertions(+) create mode 100644 max_outlier_visualization/js/app.js diff --git a/max_outlier_visualization/js/app.js b/max_outlier_visualization/js/app.js new file mode 100644 index 0000000..bcf3b94 --- /dev/null +++ b/max_outlier_visualization/js/app.js @@ -0,0 +1,61 @@ +import { fetchMaxOutlierResults } from './api.js'; +import { renderTable, renderChart, updateFilters, exportData } from './ui.js'; + +/** + * Initialisiert die Anwendung, ruft Daten ab und richtet UI-Interaktionen ein. + * @returns {Promise} + */ +export async function initApp() { + try { + const data = await fetchMaxOutlierResults(); + if (!Array.isArray(data) || data.length === 0) { + console.warn('Keine Max-Outlier-Ergebnisse verfügbar'); + return; + } + + renderTable(data); + renderChart(data); + bindUIEvents(data); + } catch (err) { + console.error('Fehler beim Initialisieren der Anwendung:', err); + } +} + +/** + * Verbindet UI-Elemente mit Logik – z. B. Filteränderungen und Export. + * @param {Array} dataset + */ +export function bindUIEvents(dataset) { + const filterForm = document.querySelector('#filter-form'); + const exportCsvBtn = document.querySelector('#export-csv'); + const exportJsonBtn = document.querySelector('#export-json'); + + if (filterForm) { + filterForm.addEventListener('submit', async (e) => { + e.preventDefault(); + const formData = new FormData(filterForm); + const filter = Object.fromEntries(formData.entries()); + + try { + const filteredData = await fetchMaxOutlierResults(filter); + renderTable(filteredData); + renderChart(filteredData); + updateFilters(filter); + } catch (err) { + console.error('Fehler beim Anwenden der Filter:', err); + } + }); + } + + if (exportCsvBtn) { + exportCsvBtn.addEventListener('click', () => exportData(dataset, 'csv')); + } + + if (exportJsonBtn) { + exportJsonBtn.addEventListener('click', () => exportData(dataset, 'json')); + } +} + +window.addEventListener('load', () => { + initApp(); +}); \ No newline at end of file