diff --git a/public/js/script.js b/public/js/script.js
new file mode 100644
index 0000000..35aa59e
--- /dev/null
+++ b/public/js/script.js
@@ -0,0 +1,395 @@
+ // index.html
+ 
+ // Funktion, um die WEB_NAME-Variable abzurufen und einzufügen
+ document.addEventListener('DOMContentLoaded', () => {
+    fetch('/api/web-name')
+        .then(response => response.json())
+        .then(data => {
+            const webName = data.name;
+            // Ersetze den Text im h1- und title-Tag
+            document.getElementById('welcome-title').textContent = `Willkommen bei ${webName}`;
+            document.getElementById('web-title').textContent = webName;
+        })
+        .catch(error => console.error('Fehler beim Abrufen des Web-Namens:', error));
+});
+
+
+// Funktion, um die Umgebungsvariablen abzurufen
+const fetchEnvVariables = async () => {
+    const response = await fetch('/api/env');
+    const data = await response.json();
+
+    document.getElementById('bot-alias').textContent = data.botAlias;
+    document.getElementById('telegram-link').href = data.telegramLink;
+};
+
+document.addEventListener('DOMContentLoaded', () => {
+    fetch('/api/telegram-link') // API-Endpunkt zum Abrufen des Telegram-Links
+        .then(response => response.json())
+        .then(data => {
+            const telegramLink = document.getElementById('telegram-link');
+            telegramLink.href = data.link; // Setze den Link im Anchor-Tag
+        })
+        .catch(error => console.error('Fehler beim Abrufen des Telegram-Links:', error));
+
+    // Version abrufen
+    fetch('/api/bot-version')
+        .then(response => response.json())
+        .then(data => {
+            const botVersion = document.getElementById('bot-version');
+            botVersion.textContent = data.version; // Setze die Versionsnummer
+        })
+        .catch(error => console.error('Fehler beim Abrufen der Bot-Version:', error));
+
+    // Funktion, um die neuesten Filme abzurufen
+    async function fetchLatestMovies() {
+        try {
+            const response = await fetch('/api/latest-movies'); // API-URL
+            const movies = await response.json(); // Filme abrufen
+            const moviesList = document.getElementById('movies-list');
+
+            // Leere die Liste, bevor du neue Filme hinzufügst
+            moviesList.innerHTML = '';
+
+            // Füge die neuesten Filme zur Liste hinzu
+            movies.forEach(movie => {
+                const listItem = document.createElement('li');
+                listItem.classList.add('movie-item'); // Füge Klasse hinzu für CSS
+
+                // Erstelle das Coverbild
+                const coverImage = document.createElement('img');
+                coverImage.src = movie.coverImage; // URL des Coverbilds
+                coverImage.alt = movie.title; // Alternativtext für das Bild
+
+                // Überprüfen, ob das Bild geladen werden kann
+                coverImage.onerror = () => {
+                    console.error(`Konnte das Bild für ${movie.title} nicht laden: ${coverImage.src}`);
+                    coverImage.src = 'fallback-image-url.jpg'; // Fallback-Bild, wenn das Bild nicht geladen werden kann
+                };
+
+                // Füge das Bild zur Liste hinzu
+                listItem.appendChild(coverImage);
+                moviesList.appendChild(listItem);
+            });
+
+            // Animation für das Einblenden der Filme
+            requestAnimationFrame(() => {
+                moviesList.childNodes.forEach((item, index) => {
+                    setTimeout(() => {
+                        item.style.opacity = 1; // Opazität für sanftes Einblenden
+                    }, index * 100); // Verzögerung für jeden Film
+                });
+            });
+
+        } catch (error) {
+            console.error('Fehler beim Abrufen der Filme:', error);
+        }
+    }
+
+    // Event-Listener für das Formular
+    document.getElementById('subscribe-form').addEventListener('submit', function(event) {
+        event.preventDefault();
+        const email = document.getElementById('email').value;
+        const username = document.getElementById('username').value;
+
+        // Generiere eine Dummy-Chat-ID
+        const chatId = Math.floor(Math.random() * 1000000); // Zufällige Zahl zwischen 0 und 999999
+
+        fetch('/subscribe', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ email, chatId, username })
+        })
+        .then(response => response.text())
+        .then(data => alert(data))
+        .catch(error => alert('Fehler: ' + error));
+    });
+
+    // Darkmode umschalten
+    const toggle = document.getElementById('dark-mode-toggle');
+
+    // Darkmode-Zustand beim Laden der Seite überprüfen und anwenden
+    const darkModeEnabled = localStorage.getItem('darkMode') === 'true';
+    toggle.checked = darkModeEnabled;
+    if (darkModeEnabled) {
+        document.body.classList.add('dark-mode');
+    }
+
+    toggle.addEventListener('change', () => {
+        const isChecked = toggle.checked;
+        document.body.classList.toggle('dark-mode', isChecked);
+        // Speichere den Zustand in localStorage
+        localStorage.setItem('darkMode', isChecked);
+    });
+
+    // Beim Laden der Seite die neuesten Filme abrufen
+    window.onload = fetchLatestMovies;
+
+    // Aktualisiere die Filme jede Minute (60000 Millisekunden)
+    setInterval(fetchLatestMovies, 60000);
+
+    // Changelog-Daten
+    const changelogData = {
+"changelog": [
+{
+    "version": "1.8.5",  
+    "date": "2024-10-18", 
+    "changes": [
+        "Dev-Report Filme können jetzt gemeldet werden",
+        "Backend Notification für Dev-Melungen hinzugefügt",
+        "Diverse kleinere Bugfix",
+        "Darkmode Bugfix"
+    ]
+},
+{
+    "version": "1.8.4",  
+    "date": "2024-10-17", 
+    "changes": [
+        "Backups Passwort schutz",
+        "Verbesserter Passwort schutz für Admin Bereich"
+    ]
+},
+{
+    "version": "1.8.3",  
+    "date": "2024-10-17", 
+    "changes": [
+        "Logout Timer hinzugefügt.",
+        "Automatisches Logout bei Inaktivität",
+        "Login-Seite überarbeitet für bessere Benutzerfreundlichkeit.",
+        "Darkmode im Adminbereich hinzugefügt."
+    ]
+},
+{
+    "version": "1.8.2",  
+    "date": "2024-10-16", 
+    "changes": [
+        "Neue FAQ-Seite für Benutzer hinzugefügt.",
+        "Benutzerfreundliche Darstellung der FAQs.",
+        "Verbesserte Performance bei der Datenabfrage.",
+        "Diverse kleinere Fehlerbehebungen."
+    ]
+},
+{
+    "version": "1.8.1",
+    "date": "2024-10-16",
+    "changes": [
+        "Bugfix mit Darkmode.",
+        "Dev-Report hinzugefügt (Bug-Report & Funktionswünsche)."
+    ]
+}
+]
+};
+
+
+    // Changelog im Popup anzeigen
+    const changelogList = document.getElementById('changelog-list');
+
+    changelogData.changelog.forEach(entry => {
+        const changelogItem = document.createElement('div');
+        changelogItem.classList.add('changelog-entry'); // Füge eine Klasse für das Styling hinzu
+
+        changelogItem.innerHTML = `
+            <strong>Version ${entry.version} (${entry.date}):</strong>
+            <ul>
+                ${entry.changes.map(change => `<li>${change}</li>`).join('')}
+            </ul>
+        `;
+        changelogList.appendChild(changelogItem);
+    });
+
+    // Changelog-Popup-Elemente
+    const changelogIcon = document.getElementById('changelog-icon');
+    const popup = document.getElementById('changelog-popup');
+    const closePopup = document.getElementById('close-popup');
+
+    // Popup öffnen
+    changelogIcon.addEventListener('click', () => {
+        popup.style.display = 'block';
+        document.body.classList.toggle('dark-mode', toggle.checked); // Darkmode bei Popup-Anzeige aktivieren
+    });
+
+    // Popup schließen
+    closePopup.addEventListener('click', () => {
+        popup.style.display = 'none';
+        document.body.classList.toggle('dark-mode', toggle.checked); // Darkmode wieder zurücksetzen
+    });
+
+    // Klick außerhalb des Popups schließt es
+    window.addEventListener('click', (event) => {
+        if (event.target === popup) {
+            popup.style.display = 'none';
+            document.body.classList.toggle('dark-mode', toggle.checked); // Darkmode wieder zurücksetzen
+        }
+    });
+});
+
+
+
+//wunsch html
+
+
+
+document.addEventListener('DOMContentLoaded', () => {
+    fetch('/api/telegram-link') // API-Endpunkt zum Abrufen des Telegram-Links
+        .then(response => response.json())
+        .then(data => {
+            const telegramLink = document.getElementById('telegram-link');
+            telegramLink.href = data.link; // Setze den Link im Anchor-Tag
+        })
+        .catch(error => console.error('Fehler beim Abrufen des Telegram-Links:', error));
+
+    // Version abrufen
+    fetch('/api/bot-version')
+        .then(response => response.json())
+        .then(data => {
+            const botVersion = document.getElementById('bot-version');
+            botVersion.textContent = data.version; // Setze die Versionsnummer
+        })
+        .catch(error => console.error('Fehler beim Abrufen der Bot-Version:', error));
+    
+
+    // Handle form submission
+    document.getElementById('wunsch-form').addEventListener('submit', function(event) {
+        event.preventDefault();
+        const wunsch = document.getElementById('wunsch').value;
+        const type = document.getElementById('type').value;
+
+        fetch('/api/telegram-wunsch', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ wunsch, type })
+        })
+        .then(response => response.json())
+        .then(data => {
+            document.getElementById('response-message').textContent = data.message;
+        })
+        .catch(error => {
+            document.getElementById('response-message').textContent = 'Fehler beim Senden des Wunsches: ' + error;
+        });
+    });
+});
+
+// Darkmode umschalten
+const toggle = document.getElementById('dark-mode-toggle');
+const darkModeEnabled = localStorage.getItem('darkMode') === 'true';
+toggle.checked = darkModeEnabled;
+if (darkModeEnabled) document.body.classList.add('dark-mode');
+
+toggle.addEventListener('change', () => {
+    const isChecked = toggle.checked;
+    document.body.classList.toggle('dark-mode', isChecked);
+    localStorage.setItem('darkMode', isChecked);
+});
+
+
+
+//faq html
+        // Funktion zum Abrufen der FAQs
+        function fetchFaqs() {
+            fetch('/api/faqs')
+                .then(response => response.json())
+                .then(data => {
+                    const faqSection = document.getElementById('faq-section');
+                    faqSection.innerHTML = ''; // Leere den Inhalt zuerst
+
+                    if (data.length === 0) {
+                        faqSection.innerHTML = '<p><h3>Es gibt derzeit keine FAQs.</h3></p>';
+                    } else {
+                        data.forEach((faq, index) => {
+                            const faqItem = document.createElement('div');
+                            faqItem.classList.add('faq-item');
+                            
+                            const faqToggle = document.createElement('div');
+                            faqToggle.classList.add('faq-toggle');
+                            faqToggle.innerHTML = `<h3 class="faq-question">${index + 1}. ${faq.question}</h3>
+                                                   <i class="fas fa-chevron-down arrow"></i>`;
+                            faqItem.appendChild(faqToggle);
+
+                            const faqAnswer = document.createElement('p');
+                            faqAnswer.classList.add('faq-answer');
+                            faqAnswer.innerText = faq.answer;
+                            faqItem.appendChild(faqAnswer);
+                            
+                            // Event-Listener hinzufügen, um die Antwort anzuzeigen oder auszublenden
+                            faqToggle.addEventListener('click', () => {
+                                faqAnswer.classList.toggle('show');
+                                const arrow = faqToggle.querySelector('.arrow');
+                                arrow.style.transform = faqAnswer.classList.contains('show') ? 'rotate(180deg)' : 'rotate(0deg)';
+                            });
+                            
+                            faqSection.appendChild(faqItem);
+                        });
+                    }
+                })
+                .catch(error => console.error('Fehler beim Abrufen der FAQs:', error));
+        }
+
+        document.addEventListener('DOMContentLoaded', () => {
+            // FAQs beim Laden der Seite abrufen
+            fetchFaqs();
+
+            
+        });
+
+
+//kontakt html
+
+// Kontaktinformationen aus .env abrufen
+document.addEventListener('DOMContentLoaded', () => {
+    fetch('/api/contact-info') // API-Endpunkt zum Abrufen der Kontaktinformationen
+        .then(response => response.json())
+        .then(data => {
+            document.getElementById('contact-email').href = `mailto:${data.email}`;
+            document.getElementById('contact-email').textContent = data.email;
+            document.getElementById('contact-telegram').href = data.telegram;
+            document.getElementById('contact-telegram').textContent = data.telegram.split('/').pop(); // Extrahiere den Benutzernamen aus der URL
+        })
+        .catch(error => console.error('Fehler beim Abrufen der Kontaktinformationen:', error));
+});
+
+
+//Report html
+
+document.getElementById('report-form').addEventListener('submit', function(event) {
+    event.preventDefault();
+
+    const type = document.getElementById('report-type').value;
+    const user = { name: document.getElementById('username').value };
+    const message = document.getElementById('message').value;
+
+    fetch('/api/submit-report', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ type, user, message })
+    })
+    .then(response => response.json())
+    .then(data => {
+        // Bestätigung anzeigen
+        document.getElementById('confirmation').style.display = 'block';
+        
+        // Formular leeren
+        document.getElementById('report-form').reset();
+
+        // Bestätigung nach 5 Sekunden ausblenden
+        setTimeout(() => {
+            document.getElementById('confirmation').style.display = 'none';
+        }, 5000);
+    })
+    .catch(error => {
+        console.error('Fehler beim Übermitteln des Berichts:', error);
+        alert('Es gab ein Problem beim Senden des Berichts. Bitte versuche es später erneut.');
+    });
+});
+
+
+toggle.addEventListener('change', () => {
+    const isChecked = toggle.checked;
+    document.body.classList.toggle('dark-mode', isChecked);
+    // Speichere den Zustand in localStorage
+    localStorage.setItem('darkMode', isChecked);
+});
+
+
+//link html --> keine Scripte
+
+//funktionen html --> keine Scripte