From 39adc39b456a55dc015d67d6a1f7b3105044a799 Mon Sep 17 00:00:00 2001 From: gilles Date: Tue, 24 Dec 2024 02:05:34 +0100 Subject: [PATCH] ajouter un zoom out lorsqu'une carte apparait sur l'ecran ( conserver la taille finalle actuelle --- data/baptiste_final.yaml | 12 +++---- static/js/script_final2_b.js | 66 ++++++++++++++++++++++++++++++++++-- 2 files changed, 70 insertions(+), 8 deletions(-) diff --git a/data/baptiste_final.yaml b/data/baptiste_final.yaml index 080eb09..f055008 100755 --- a/data/baptiste_final.yaml +++ b/data/baptiste_final.yaml @@ -10,12 +10,12 @@ liste_carte_defaut: image: static/css/img/cartes/E_b.webp contenu: E couleur: bleu - donné: non + donné: oui - numero: 3 image: static/css/img/cartes/R_b.webp contenu: R couleur: bleu - donné: non + donné: oui - numero: 4 image: static/css/img/cartes/P_j.webp contenu: P @@ -25,7 +25,7 @@ liste_carte_defaut: image: static/css/img/cartes/T_b.webp contenu: T couleur: bleu - donné: non + donné: oui - numero: 6 image: static/css/img/cartes/E_j.webp contenu: E @@ -41,12 +41,12 @@ liste_carte_échangé: image: static/css/img/cartes/L_j.webp contenu: L couleur: violet - recupéré: non + recupéré: oui - numero: 9 image: static/css/img/cartes/I_j.webp contenu: I couleur: violet - recupéré: non + recupéré: oui - numero: 10 image: static/css/img/cartes/U_b.webp contenu: U @@ -56,7 +56,7 @@ liste_carte_échangé: image: static/css/img/cartes/S_j.webp contenu: S couleur: violet - recupéré: non + recupéré: oui - numero: 12 image: static/css/img/cartes/O_b.webp contenu: O diff --git a/static/js/script_final2_b.js b/static/js/script_final2_b.js index d736775..c6d689b 100644 --- a/static/js/script_final2_b.js +++ b/static/js/script_final2_b.js @@ -1,3 +1,56 @@ +let dernierHash = null; + +async function obtenirHashFichier() { + try { + const response = await fetch('/data/baptiste_final.yaml'); + const contenu = await response.text(); + return btoa(contenu); // Encodage en Base64 comme hash simplifié + } catch (error) { + console.error("Erreur lors de la récupération du contenu du fichier :", error); + return null; + } +} + +async function analyserModifications() { + try { + const response = await fetch('/data/baptiste_final.yaml'); + const data = await response.json(); + + // Vérifier les cartes ajoutées dans `liste_carte_defaut` + if (Array.isArray(data.liste_carte_defaut)) { + data.liste_carte_defaut.forEach((carte) => { + if (carte.donné === "non" && !document.querySelector(`[data-numero="${carte.numero}"]`)) { + creerCarte(document.getElementById('zone_cartes'), carte.image, carte.numero); + } + }); + } + + // Vérifier les cartes ajoutées dans `liste_carte_échangé` + if (Array.isArray(data.liste_carte_échangé)) { + data.liste_carte_échangé.forEach((carte) => { + if (carte.recupéré === "oui" && !document.querySelector(`[data-numero="${carte.numero}"]`)) { + creerCarte(document.getElementById('zone_cartes'), carte.image, carte.numero); + } + }); + } + } catch (error) { + console.error("Erreur lors de l'analyse des modifications :", error); + } +} +async function surveillerModifications() { + try { + const nouveauHash = await obtenirHashFichier(); + + if (dernierHash && nouveauHash !== dernierHash) { + console.log("Fichier modifié. Analyse des modifications..."); + analyserModifications(); // Vérifie les changements dans le fichier + } + + dernierHash = nouveauHash; + } catch (error) { + console.error("Erreur lors de la surveillance des modifications :", error); + } +} async function chargerCartes() { try { const response = await fetch('/data/baptiste_final.yaml'); @@ -10,7 +63,7 @@ async function chargerCartes() { if (Array.isArray(data.liste_carte_defaut)) { data.liste_carte_defaut.forEach((carte) => { if (carte.donné === "non") { - creerCarte(zoneCartes, carte.image); + creerCarte(zoneCartes, carte.image, carte.numero); } }); } @@ -37,10 +90,15 @@ async function chargerCartes() { } // Fonction pour créer une carte -function creerCarte(zone, image) { +function creerCarte(zone, image, numero) { const carte = document.createElement('div'); carte.className = 'carte'; carte.style.backgroundImage = `url(${image})`; + if (numero !== undefined) { + carte.dataset.numero = numero; // Ajoute l'attribut data-numero uniquement si numero est défini + } else { + console.error("Le numéro de la carte est undefined."); + } positionAleatoire(zone, carte); // Positionner aléatoirement dans la partie haute rendreDeplacable(carte); // Rendre la carte déplaçable @@ -263,3 +321,7 @@ function aimanterCarte(carte, rond) { } // Charger les cartes au démarrage document.addEventListener('DOMContentLoaded', chargerCartes); +document.addEventListener('DOMContentLoaded', async () => { + dernierHash = await obtenirHashFichier(); // Initialisation du hash + setInterval(surveillerModifications, 2000); // Surveiller les modifications toutes les 2 secondes +}); \ No newline at end of file