Datenschutzeinstellungen-Hinweis neu erstellt (noch funktionslos)

src/components/popupManager.js

@@ -1,4 +1,4 @@
-export function createPopup({ title, body, footer = '', closeCallback = null, customClass = '' }) {
+export function createPopup({ title, body, footer = '', customClass = '' }) {
     // Popup-Container erstellen
     const popup = document.createElement('div');
     popup.classList.add('popup');
@@ -17,32 +17,41 @@ export function createPopup({ title, body, footer = '', closeCallback = null, cu
         </div>
     `;
 
+    // Popup dem Body hinzufügen
     document.body.appendChild(popup);
 
+    // Scrollen deaktivieren
+    document.body.classList.add('body-no-scroll');
+
     // Event-Listener für Schließen-Button
     const closeButton = popup.querySelector('.close-popup');
-    closeButton.addEventListener('click', () => closePopup(popup, closeCallback));
+    closeButton.addEventListener('click', () => closePopup(popup));
 
     // Event-Listener für ESC-Taste
     document.addEventListener('keydown', (event) => {
-        if (event.key === 'Escape') closePopup(popup, closeCallback);
+        if (event.key === 'Escape') closePopup(popup);
     });
 
     // Event-Listener für Klick außerhalb des Popups
     popup.addEventListener('click', (event) => {
-        if (event.target === popup) closePopup(popup, closeCallback);
+        if (event.target === popup) closePopup(popup);
     });
 
     return popup;
 }
 
-function closePopup(popup, closeCallback) {
+export function closePopup(popup) {
+    // Popup entfernen
     popup.remove();
-    if (typeof closeCallback === 'function') {
-        closeCallback();
-    }
+
+    // Scrollen wieder aktivieren
+    document.body.classList.remove('body-no-scroll');
 }
 
 export function destroyAllPopups() {
+    // Alle Popups entfernen
     document.querySelectorAll('.popup').forEach(popup => popup.remove());
+
+    // Scrollen wieder aktivieren
+    document.body.classList.remove('body-no-scroll');
 }

src/main.js

@@ -2,21 +2,28 @@ import { createStarterKitElement, enhanceStarterKits } from './utils/starterkit-
 import { seededShuffleChildren } from './utils/shuffle-utils.js';
 import { initializeCreateStarterKitPopup } from './utils/create-starterkit.js';
 import { loadPostwall } from './components/postwall.js';
-
-
-let userConsent = null;
-export { userConsent };
-
-async function loadTemplates() {
-    const response = await fetch('src/template/template.html');
-    const templateHTML = await response.text();
-
-    const templateContainer = document.createElement('div');
-    templateContainer.innerHTML = templateHTML;
-    document.body.appendChild(templateContainer);
-}
+import { checkConsent, setUserConsent, showConsentPopup } from './utils/consent-utils.js';
 
 document.addEventListener('DOMContentLoaded', async function () {
+    // Überprüfe Consent, bevor Inhalte geladen werden
+    const consent = checkConsent();
+    if (!consent) {
+        showConsentPopup(
+            () => {
+                setUserConsent(true);
+                initializeApp();
+            },
+            () => {
+                setUserConsent(false);
+                initializeApp();
+            }
+        );
+    } else {
+        initializeApp();
+    }
+});
+
+async function initializeApp() {
     await loadTemplates();
 
     initializeCreateStarterKitPopup();
@@ -50,4 +57,13 @@ document.addEventListener('DOMContentLoaded', async function () {
             enhanceStarterKits();
         })
         .catch(error => console.error('Fehler beim Laden der StarterKits:', error));
-});
+}
+
+async function loadTemplates() {
+    const response = await fetch('src/template/template.html');
+    const templateHTML = await response.text();
+
+    const templateContainer = document.createElement('div');
+    templateContainer.innerHTML = templateHTML;
+    document.body.appendChild(templateContainer);
+}

src/utils/consent-utils.js

@@ -1,16 +1,24 @@
-import { createPopup } from '../components/popupManager.js';
+import { createPopup, closePopup } from '../components/popupManager.js';
 
+// Speichert die Benutzerzustimmung
 export function setUserConsent(consent) {
     localStorage.setItem('userConsent', JSON.stringify(consent));
 }
 
+// Ruft die Benutzerzustimmung ab
 export function getUserConsent() {
     const consent = localStorage.getItem('userConsent');
     return consent !== null ? JSON.parse(consent) : null;
 }
 
+// Überprüft, ob bereits eine Zustimmung vorliegt
+export function checkConsent() {
+    return getUserConsent() !== null;
+}
+
+// Zeigt das Consent-Banner an
 export function showConsentPopup(onAccept, onDecline) {
-    const title = 'Zustimmung zur Datenabfrage';
+    const title = 'Datenschutzeinstellungen';
     const body = `
         <p>
             Mit dem Klicken auf "Bestätigen" erlaubst du, dass Profilinformationen von unterschiedlichen Mastodon-Instanzen
@@ -26,38 +34,22 @@ export function showConsentPopup(onAccept, onDecline) {
         </div>
     `;
 
+    // Erstelle das Popup
     const popup = createPopup({
         title,
         body,
-        customClass: 'consent-popup',
-        closeCallback: () => {
-            document.body.classList.remove('body-no-scroll');
-            window.removeEventListener('popstate', onPopState);
-        }
+        customClass: 'consent-popup'
     });
 
-    // Klasse hinzufügen, um das Scrollen des Hintergrunds zu verhindern
-    document.body.classList.add('body-no-scroll');
-
-    // Füge einen neuen Eintrag zur Browser-Historie hinzu
-    history.pushState({ popupOpen: true }, null, '');
-
-    const onPopState = () => {
-        popup.remove();
-        document.body.classList.remove('body-no-scroll');
-        window.removeEventListener('popstate', onPopState);
-        history.back();
-    };
-    window.addEventListener('popstate', onPopState);
-
     // Event-Listener für die Buttons
     popup.querySelector('#consent-accept').addEventListener('click', () => {
-        popup.remove();
-        onAccept(); // Zustimmung
+        closePopup(popup); // Popup korrekt schließen
+        onAccept(); // Zustimmung speichern
     });
     
     popup.querySelector('#consent-decline').addEventListener('click', () => {
-        popup.remove();
-        onDecline(); // Ablehnung
+        closePopup(popup); // Popup korrekt schließen
+        onDecline(); // Ablehnung speichern
     });
+    
 }