document.addEventListener("DOMContentLoaded", function () {
    // Get project name from URL
    const urlParams = new URLSearchParams(window.location.search);
    const projectName = urlParams.get("name");

    // Simulated "database" of projects
    const projects = {
        "mastermind": {
            title: "Projet MasterMind",
            subtitle: "Un projet de création du jeux MasterMind.",
            description: "Le but de ce projet était de réaliser par groupe de 4 personnes sur une durée de 3 mois un jeu de MasterMind en .net Maui.",
            images: ["img/project/scolaire/mastermind_menu.png", "img/project/scolaire/mastermind_game.png", "img/project/scolaire/mastermind_login.png"],
            technologies: ["csharp", "xaml", "json"]
        },
        "etugestion": {
            title: "EtuGestion",
            subtitle: "Création d'un outil de gestion en ligne de commande pour une école.",
            description: "Ce projet réalisé en C par groupe de 2 à l'aide de l'outil git nécecitait d'avoir différentes interfaces pour des élèves, des professeurs et des jury. Les jurys devais pouvoir mettre des notes aux étudiants, les étudiants devaient pouvoir consulter et postuler à des offres de stages et enfin les professeurs devaient pouvoir ajouter et supprimer des offres de stages, affecter des étudiants...etc",
            images: ["img/project/scolaire/brico_menu.png", "img/project/scolaire/brico_add.png", "img/project/scolaire/brico_list.png"],
            technologies: ["c", "git"]
        }
    };

    // Get project data or fallback
    const project = projects[projectName] || {
        title: "Projet Inconnu",
        subtitle: "Désolé, ce projet n'existe pas.",
        description: "Nous n'avons pas trouvé d'informations sur ce projet.",
        images: [],
        technologies: []
    };

    // Update HTML content
    document.getElementById("project-title").innerText = project.title;
    document.getElementById("project-subtitle").innerText = project.subtitle;
    document.getElementById("project-description").innerText = project.description;

    // Update gallery
    const galleryContainer = document.getElementById("project-gallery");
    project.images.forEach(imgSrc => {
        const img = document.createElement("img");
        img.src = imgSrc;
        img.alt = "Image du projet";
        galleryContainer.appendChild(img);
    });

    // Update technologies
    const techContainer = document.getElementById("project-tech-icons");
    project.technologies.forEach(tech => {
        const div = document.createElement("div");
        div.classList.add("tech-box", `${tech}-box`); // Ensure the correct class is added

        const img = document.createElement("img");
        img.src = `logos/${tech}.jpeg`;
        img.alt = tech.toUpperCase();


        const text = document.createElement("span");
        text.innerText = tech.toUpperCase();

        div.appendChild(img);
        div.appendChild(text);
        techContainer.appendChild(div);
    });
    // Fade-in effect when page loads
    document.body.classList.remove("fade-out");
});