script.js

const translations = {
    en: {
        "nav-home": "Home",
        "nav-about": "About me",
        "nav-projects": "My Projects",
        "nav-contact": "Contact me",
        "hero-title": "Born in the mountains,<br>living at the ocean.",
        "hero-desc": "After my German Baccalaureate, wanderlust and love for the ocean led me to study web development in Bordeaux.",
        "edu-title": "Education",
        "edu-desc": "Bachelor’s degree in Web development (Multimedia and Internet) at University Institute of Technology Bordeaux Montaigne",
        "lang-title": "Languages",
        "lang-desc": "Native in German<br>Proficient English & French<br>Beginner in Spanish & Italian",
        "resume-btn": "Read my Resume here",
        "projects-title": "Selection of projects in university",
        "projects-desc": "Collaborating on practical team projects, working on mastery and navigating challenges are part of my studies. Discover my recent projects.",
        "proj-data-title": "Data analysis (API, Data bases)",
        "proj-data-date": "• October 2024",
        "proj-data-desc": "Analysing and treating large databases in JSON and Excel files, and visualising the results to 'What impact do chatbots have on young people's mental health?'.",
        "proj-data-btn": "Discover the Analysis",
        "proj-backend-title": "Backend Project (Ruby on Rails)",
        "proj-backend-date": "• February 2024",
        "proj-backend-desc": "A website containing ocean-themed recipes in blog format, allowing you to delete, create, edit and display them using Ruby on Rails and Bootstrap.",
        "proj-backend-btn": "Discover Marmi'thon",
        "proj-laravel-title": "Backend Project (Laravel)",
        "proj-laravel-date": "• September 2023",
        "proj-laravel-desc": "Developing a web application for surf rentals with a login area for managing (Create, Delete, Update) the bookings, using the Laravel (PHP) framework and Bootstrap.",
        "proj-laravel-btn": "Discover it on GitHub",
        "proj-aki-title": "Aki'Tu penses",
        "proj-aki-date": "• January 2024",
        "proj-aki-desc": "This is an application built using Vue JS that has been designed for the Bacchia Night event at the Fine Arts Museum in Bordeaux. Players select a character from several drawings, and the application reveals fun facts about it.",
        "proj-aki-btn": "Play the game",
        "vol-title": "Volunteering",
        "vol-desc": "Engaging, meeting and working on a volunteer basis in line with my values, such as connecting on an international level and supporting youth participation in politics.",
        "vol-esn-title": "Erasmus Student Network: Bordeaux and International",
        "vol-esn-date": "• Since September 2026",
        "vol-esn-desc": "Supporting international students in Bordeaux. Helping to develop a local AI for the international AI Team.",
        "vol-esn-btn": "Discover ESN",
        "vol-dvbj-title": "Federation of Bavarian youth representatives",
        "vol-dvbj-date": "• Since July 2023",
        "vol-dvbj-desc": "Responsable for the maintenance and updating the contents of their WordPress website.",
        "vol-dvbj-btn": "Discover DVBJ",
        "vol-jupa-title": "Youth parliament Lindenberg",
        "vol-jupa-date": "• 2020 - 2023",
        "vol-jupa-desc": "Project management, event management, chairing internal and public meetings with the city council. Discussions about youth politics at European conferences with other members of the youth council.",
        "vol-jupa-btn": "Discover JuPa",
        "vol-proj-title": "Projects as a volunteer",
        "vol-proj-desc": "Climate protection, health, and youth participation are important values to me. Therefore, I organize and participate in projects that support them.",
        "vol-eco-title": "Sports and ecology weekend at the ocean",
        "vol-eco-date": "• September 2023",
        "vol-eco-desc": "As secretary of the student association for my course, I organised a sports and ecology weekend. The aim was to bring together students from Bordeaux in Lacanau, where we collected rubbish from the beach with two associations and took part in sports activities such as surfing with a surf school.",
        "vol-eco-btn": "Watch the event video",
        "contact-title": "Contact me",
        "contact-insta": "Chat with me on Instagram",
        "contact-linkedin": "Leave me a message on LinkedIn",
        "contact-mail": "Write me an E mail",
        "footer-overview": "Pages Overview",
        "footer-home": "Home",
        "footer-about": "About me",
        "footer-projects": "My projects",
        "footer-contact": "Contact me",
        "footer-copyright": "Copyright © Linda Elbs"
    },
    de: {
        "nav-home": "Startseite",
        "nav-about": "Über mich",
        "nav-projects": "Meine Projekte",
        "nav-contact": "Kontakt",
        "hero-title": "In den Bergen geboren,<br>nun lebe ich am Ozean.",
        "hero-desc": "Abitur in der Tasche, das Meer im Kopf: Mein Fernweh hat mich zum Studium der Webentwicklung nach Bordeaux geführt.",
        "edu-title": "Ausbildung",
        "edu-desc": "Bachelor (BUT) in Webentwicklung (Multimedia und Internet) am IUT Bordeaux Montaigne",
        "lang-title": "Sprachen",
        "lang-desc": "Muttersprache Deutsch<br>Fließend Englisch & Französisch<br>Anfänger in Spanisch & Italienisch",
        "resume-btn": "Meinen Lebenslauf lesen",
        "projects-title": "Ausgewählte Universitätsprojekte",
        "projects-desc": "Die Zusammenarbeit an praktischen Teamprojekten, das Erarbeiten von Fachwissen und das Meistern von Herausforderungen sind Teil meines Studiums. Entdecken Sie meine aktuellen Projekte.",
        "proj-data-title": "Datenanalyse (API, Datenbanken)",
        "proj-data-date": "• Oktober 2024",
        "proj-data-desc": "Analyse und Bearbeitung großer Datenbanken in JSON- und Excel-Dateien sowie Visualisierung der Ergebnisse zu 'Welchen Einfluss haben Chatbots auf die psychische Gesundheit junger Menschen?'.",
        "proj-data-btn": "Zur Analyse",
        "proj-backend-title": "Backend-Projekt (Ruby on Rails)",
        "proj-backend-date": "• Februar 2024",
        "proj-backend-desc": "Eine Website mit Rezepten rund um den Ozean im Blog-Format, die das Löschen, Erstellen, Bearbeiten und Anzeigen mit Ruby on Rails und Bootstrap ermöglicht.",
        "proj-backend-btn": "Marmi'thon entdecken",
        "proj-laravel-title": "Backend-Projekt (Laravel)",
        "proj-laravel-date": "• September 2023",
        "proj-laravel-desc": "Entwicklung einer Webanwendung für Surfverleih mit einem Login-Bereich zur Verwaltung (Erstellen, Löschen, Aktualisieren) der Buchungen unter Verwendung des Laravel (PHP) Frameworks und Bootstrap.",
        "proj-laravel-btn": "Auf GitHub ansehen",
        "proj-aki-title": "Aki'Tu penses",
        "proj-aki-date": "• Januar 2024",
        "proj-aki-desc": "Dies ist eine Anwendung, die mit Vue JS für das Bacchia Night Event im Kunstmuseum in Bordeaux entwickelt wurde. Spieler wählen eine Figur aus mehreren Zeichnungen aus, und die Anwendung enthüllt interessante Fakten darüber.",
        "proj-aki-btn": "Spiel spielen",
        "vol-title": "Ehrenamt",
        "vol-desc": "Engagieren, Treffen und Arbeiten auf freiwilliger Basis im Einklang mit meinen Werten, wie der internationalen Vernetzung und der Unterstützung der Jugendbeteiligung in der Politik.",
        "vol-esn-title": "Erasmus Student Network: Bordeaux und International",
        "vol-esn-date": "• Seit September 2026",
        "vol-esn-desc": "Unterstützung internationaler Studenten in Bordeaux. Hilfe bei der Entwicklung einer lokalen KI für das internationale KI-Team.",
        "vol-esn-btn": "ESN entdecken",
        "vol-dvbj-title": "Dachverband der bayerischen Jugendvertretungen",
        "vol-dvbj-date": "• Seit Juli 2023",
        "vol-dvbj-desc": "Verantwortlich für die Wartung und Aktualisierung der Inhalte ihrer WordPress-Website.",
        "vol-dvbj-btn": "DVBJ entdecken",
        "vol-jupa-title": "Jugendparlament Lindenberg",
        "vol-jupa-date": "• 2020 - 2023",
        "vol-jupa-desc": "Projektmanagement, Eventmanagement, Leitung interner und öffentlicher Sitzungen mit dem Stadtrat. Diskussionen über Jugendpolitik auf europäischen Konferenzen mit anderen Mitgliedern des Jugendrates.",
        "vol-jupa-btn": "JuPa entdecken",
        "vol-proj-title": "Projekte als Freiwillige",
        "vol-proj-desc": "Klimaschutz, Gesundheit und Jugendbeteiligung sind mir wichtige Werte. Deshalb organisiere ich Projekte, die diese unterstützen, und nehme daran teil.",
        "vol-eco-title": "Sport- und Ökologie-Wochenende am Ozean",
        "vol-eco-date": "• September 2023",
        "vol-eco-desc": "Als Sekretärin des Studentenvereins für meinen Studiengang habe ich ein Sport- und Ökologie-Wochenende organisiert. Ziel war es, Studenten aus Bordeaux in Lacanau zusammenzubringen, wo wir mit zwei Vereinen Müll vom Strand sammelten und an sportlichen Aktivitäten wie Surfen mit einer Surfschule teilnahmen.",
        "vol-eco-btn": "Video zum Event ansehen",
        "contact-title": "Kontaktieren Sie mich",
        "contact-insta": "Schreib mir auf Instagram",
        "contact-linkedin": "Hinterlasse eine Nachricht auf LinkedIn",
        "contact-mail": "Schreib mir eine E-Mail",
        "footer-overview": "Seitenübersicht",
        "footer-home": "Startseite",
        "footer-about": "Über mich",
        "footer-projects": "Meine Projekte",
        "footer-contact": "Kontakt",
        "footer-copyright": "Copyright © Linda Elbs"
    },
    fr: {
        "nav-home": "Accueil",
        "nav-about": "À propos",
        "nav-projects": "Mes Projets",
        "nav-contact": "Me contacter",
        "hero-title": "Née dans les montagnes,<br>maintenant je vis à l'océan.",
        "hero-desc": "Une fois mon Abitur en poche, mon goût pour l'aventure et ma passion pour l'océan m'ont conduit à Bordeaux pour y étudier le développement web.",
        "edu-title": "Formation",
        "edu-desc": "BUT Métiers du Multimédia et de l'Internet à l'IUT Bordeaux Montaigne",
        "lang-title": "Langues",
        "lang-desc": "Allemand langue maternelle<br>Anglais & Français courants<br>Débutante en Espagnol & Italien",
        "resume-btn": "Lire mon CV ici",
        "projects-title": "Sélection de projets universitaires",
        "projects-desc": "Collaborer sur des projets d'équipe pratiques, travailler sur la maîtrise et relever des défis font partie de mes études. Découvrez mes projets récents.",
        "proj-data-title": "Analyse de données (API, Bases de données)",
        "proj-data-date": "• Octobre 2024",
        "proj-data-desc": "Analyse et traitement de grandes bases de données en fichiers JSON et Excel, et visualisation des résultats sur 'Quel impact les chatbots ont-ils sur la santé mentale des jeunes ?'.",
        "proj-data-btn": "Découvrir l'analyse",
        "proj-backend-title": "Projet Backend (Ruby on Rails)",
        "proj-backend-date": "• Février 2024",
        "proj-backend-desc": "Un site web contenant des recettes sur le thème de l'océan sous forme de blog, permettant de les supprimer, créer, modifier et afficher en utilisant Ruby on Rails et Bootstrap.",
        "proj-backend-btn": "Découvrir Marmi'thon",
        "proj-laravel-title": "Projet Backend (Laravel)",
        "proj-laravel-date": "• Septembre 2023",
        "proj-laravel-desc": "Développement d'une application web pour la location de surf avec un espace de connexion pour gérer (Créer, Supprimer, Mettre à jour) les réservations, en utilisant le framework Laravel (PHP) et Bootstrap.",
        "proj-laravel-btn": "Voir sur GitHub",
        "proj-aki-title": "Aki'Tu penses",
        "proj-aki-date": "• Janvier 2024",
        "proj-aki-desc": "Ceci est une application construite avec Vue JS conçue pour l'événement Bacchia Night au Musée des Beaux-Arts de Bordeaux. Les joueurs sélectionnent un personnage parmi plusieurs dessins, et l'application révèle des faits amusants à son sujet.",
        "proj-aki-btn": "Jouer au jeu",
        "vol-title": "Bénévolat",
        "vol-desc": "S'engager, rencontrer et travailler bénévolement en accord avec mes valeurs, telles que la connexion au niveau international et le soutien à la participation des jeunes en politique.",
        "vol-esn-title": "Erasmus Student Network : Bordeaux et International",
        "vol-esn-date": "• Depuis Septembre 2026",
        "vol-esn-desc": "Soutien aux étudiants internationaux à Bordeaux. Aide au développement d'une IA locale pour l'équipe IA internationale.",
        "vol-esn-btn": "Découvrir ESN",
        "vol-dvbj-title": "Fédération des représentants de la jeunesse bavaroise",
        "vol-dvbj-date": "• Depuis Juillet 2023",
        "vol-dvbj-desc": "Responsable de la maintenance et de la mise à jour du contenu de leur site WordPress.",
        "vol-dvbj-btn": "Découvrir DVBJ",
        "vol-jupa-title": "Parlement des jeunes de Lindenberg",
        "vol-jupa-date": "• 2020 - 2023",
        "vol-jupa-desc": "Gestion de projet, gestion d'événements, présidence de réunions internes et publiques avec le conseil municipal. Discussions sur la politique de la jeunesse lors de conférences européennes avec d'autres membres du conseil des jeunes.",
        "vol-jupa-btn": "Découvrir JuPa",
        "vol-proj-title": "Projets en tant que bénévole",
        "vol-proj-desc": "La protection du climat, la santé et la participation des jeunes sont des valeurs importantes pour moi. C'est pourquoi j'organise et participe à des projets qui les soutiennent.",
        "vol-eco-title": "Week-end sport et écologie à l'océan",
        "vol-eco-date": "• Septembre 2023",
        "vol-eco-desc": "En tant que secrétaire de l'association étudiante de ma formation, j'ai organisé un week-end sport et écologie. L'objectif était de réunir des étudiants de Bordeaux à Lacanau, où nous avons ramassé des déchets sur la plage avec deux associations et participé à des activités sportives comme le surf avec une école de surf.",
        "vol-eco-btn": "Voir la vidéo de l'événement",
        "contact-title": "Me contacter",
        "contact-insta": "Discuter sur Instagram",
        "contact-linkedin": "Laisser un message sur LinkedIn",
        "contact-mail": "M'écrire un e-mail",
        "footer-overview": "Aperçu des pages",
        "footer-home": "Accueil",
        "footer-about": "À propos",
        "footer-projects": "Mes projets",
        "footer-contact": "Contact",
        "footer-copyright": "Copyright © Linda Elbs"
    }
};

const supportedLanguages = ['de', 'fr', 'en'];

function changeLanguage(lang) {
    document.querySelectorAll('[data-i18n]').forEach(element => {
        const key = element.getAttribute('data-i18n');
        if (translations[lang] && translations[lang][key]) {
            if (translations[lang][key].includes('<')) {
                element.innerHTML = translations[lang][key];
            } else {
                element.innerText = translations[lang][key];
            }
        }
    });

    const currentLangSpan = document.getElementById('currentLang');
    if (currentLangSpan) {
        currentLangSpan.innerText = lang.toUpperCase();
    }
    renderLangMenu(lang);

    localStorage.setItem('preferredLanguage', lang);

    const dropdown = document.querySelector('.lang-dropdown');
    if (dropdown) {
        dropdown.classList.remove('open');
    }
}

function toggleLangMenu() {
    const dropdown = document.querySelector('.lang-dropdown');
    dropdown.classList.toggle('open');
}

function renderLangMenu(currentLang) {
    const menu = document.getElementById('langMenu');
    if (!menu) return;

    menu.innerHTML = ''; 

    supportedLanguages.forEach(lang => {
        if (lang !== currentLang) {
            const btn = document.createElement('button');
            btn.className = 'lang-option';
            btn.innerText = lang.toUpperCase();
            btn.onclick = () => changeLanguage(lang);
            menu.appendChild(btn);
        }
    });
}

document.addEventListener('click', (event) => {
    const dropdown = document.querySelector('.lang-dropdown');
    if (dropdown && dropdown.classList.contains('open')) {
        if (!dropdown.contains(event.target)) {
            dropdown.classList.remove('open');
        }
    }
});

document.addEventListener('DOMContentLoaded', () => {
    const savedLang = localStorage.getItem('preferredLanguage') || 'en'; 
    changeLanguage(savedLang);
});