newWebsite2.0

2026-08-20 20:36:47 +02:00
parent 7020f970d8
commit 7d975feae4
100 changed files with 6774 additions and 3327 deletions
--- a/mini/js/modules/knowledge.js
+++ b/mini/js/modules/knowledge.js
@@ -0,0 +1,95 @@
+export async function initKnowledgePage() {
+    const wissenList = document.getElementById('wissen-list');
+    const gebeteList = document.getElementById('gebete-list');
+
+    if (wissenList) {
+        try {
+            const knowledgeResponse = await fetch('data/knowledge/knowledge.json');
+            const knowledgeItems = await knowledgeResponse.json();
+            renderKnowledgeList(wissenList, knowledgeItems);
+        } catch (error) {
+            console.error('Fehler beim Laden der Wissens-Übersicht:', error);
+        }
+    }
+
+    if (gebeteList) {
+        try {
+            const gebeteResponse = await fetch('data/prayers/prayers.json');
+            const gebeteItems = await gebeteResponse.json();
+            renderGebeteList(gebeteList, gebeteItems);
+        } catch (error) {
+            console.error('Fehler beim Laden der Gebete:', error);
+        }
+    }
+
+    const tabs = document.querySelectorAll('.wissen-tab');
+    const panelGebete = document.getElementById('panel-gebete');
+    const panelWissen = document.getElementById('panel-wissen');
+
+    tabs.forEach(tab => {
+        tab.addEventListener('click', () => {
+            tabs.forEach(t => t.classList.remove('active'));
+            tab.classList.add('active');
+
+            const target = tab.dataset.tab;
+            if (panelGebete) panelGebete.classList.toggle('active', target === 'gebete');
+            if (panelWissen) panelWissen.classList.toggle('active', target === 'wissen');
+        });
+    });
+}
+
+function createAccordionItem(title, filename, basePath) {
+    const element = document.createElement('div');
+    element.className = 'wissen-item';
+
+    element.innerHTML = `
+        <button class="wissen-header">
+            <span class="wissen-title">${title}</span>
+            <img src="assets/icons/arrow_down.svg" alt="Pfeil nach unten" class="wissen-arrow">
+        </button>
+        <div class="wissen-content">
+            <p class="loading">Loading...</p>
+        </div>
+    `;
+
+    const header = element.querySelector('.wissen-header');
+    const contentDiv = element.querySelector('.wissen-content');
+    let isLoaded = false;
+
+    header.addEventListener('click', async () => {
+        element.classList.toggle('active');
+
+        if (element.classList.contains('active') && !isLoaded) {
+            try {
+                const contentResponse = await fetch(`${basePath}/${filename}`);
+                if (!contentResponse.ok) throw new Error('Failed to load file');
+
+                const htmlContent = await contentResponse.text();
+                contentDiv.innerHTML = htmlContent;
+                isLoaded = true;
+            } catch (err) {
+                contentDiv.innerHTML = '<p>Failed to load content.</p>';
+            }
+        }
+    });
+
+    return element;
+}
+
+function renderKnowledgeList(container, items) {
+    container.innerHTML = '';
+    items.forEach(item => {
+        const title = item.titel || item.title;
+        const element = createAccordionItem(title, item.file, 'data/knowledge');
+        container.appendChild(element);
+    });
+}
+
+function renderGebeteList(container, items) {
+    container.innerHTML = '';
+    items.forEach(item => {
+        const title = item.title || item.titel;
+        const element = createAccordionItem(title, item.file, 'data/prayers');
+        container.appendChild(element);
+    });
+}