generated from Templates_CodeFirst/templateHtmlCss
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
67 lines
2.7 KiB
67 lines
2.7 KiB
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"]
|
|
},
|
|
"dashboards": {
|
|
title: "Projet Dashboards",
|
|
subtitle: "Création de tableaux de bord interactifs.",
|
|
description: "Un projet mettant en avant la visualisation des données avec des graphiques dynamiques.",
|
|
images: ["img/dashboards1.jpg", "img/dashboards2.jpg"],
|
|
technologies: ["react", "nodejs"]
|
|
}
|
|
};
|
|
|
|
// 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}.png`;
|
|
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");
|
|
}); |