inclus page final

static/js/script_julien.js

@@ -1,4 +1,4 @@
-const modeDebug = true; // Passez à true pour activer le mode debug
+const modeDebug = false; // Passez à true pour activer le mode debug
 
 document.addEventListener('DOMContentLoaded', () => {
     toggleDebugMode(); // Appliquer le mode debug au chargement de la page
@@ -53,7 +53,7 @@ function showPopup(challenge) {
         return;
     }
 
-    const { image, textFound, mode } = challenge;
+    const { image, textFound } = challenge;
 
     // Créer l'élément popup
     const popup = document.createElement('div');
@@ -76,35 +76,59 @@ function showPopup(challenge) {
 
     // Ajouter le texte trouvé
     const text = document.createElement('p');
-    text.textContent = `Texte à trouver : ${textFound}`;
+    text.textContent = textFound;
+    text.style.marginTop = '10px';
+    text.style.fontSize = '1.2rem';
+    text.style.textAlign = 'center';
     popup.appendChild(text);
 
-    // Ajouter une action en fonction du mode
-    if (mode === 'message') {
-        const message = document.createElement('p');
-        message.textContent = "Mode : Message";
-        popup.appendChild(message);
-    } else if (mode === 'reponse') {
-        const input = document.createElement('input');
-        input.type = 'text';
-        input.placeholder = 'Entrez votre réponse';
-        popup.appendChild(input);
-
-        const submitButton = document.createElement('button');
-        submitButton.textContent = 'Envoyer';
-        popup.appendChild(submitButton);
-    }
-
     // Ajouter un bouton pour fermer
     const closeButton = document.createElement('button');
     closeButton.textContent = 'Fermer';
-    closeButton.onclick = () => document.body.removeChild(popup);
+    closeButton.style.marginTop = '10px';
+    closeButton.style.padding = '10px 20px';
+    closeButton.style.backgroundColor = '#b19cd5';
+    closeButton.style.color = '#fff';
+    closeButton.style.border = 'none';
+    closeButton.style.cursor = 'pointer';
+    closeButton.onclick = async () => {
+        document.body.removeChild(popup);
+        await markChallengeResolved(challenge.key);
+        
+    };
     popup.appendChild(closeButton);
 
     // Ajouter le popup au corps de la page
     document.body.appendChild(popup);
 }
 
+async function markChallengeResolved(challengeKey) {
+    try {
+        // cache la popup
+        const popup = document.getElementById('popup');
+        popup.style.display = 'none';   
+
+        const response = await fetch('/mark-challenge-resolved', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({
+                username: 'julien',
+                challengeKey: challengeKey,
+                state: 'oui'
+            })
+        });
+        const result = await response.json();
+
+        if (result.success) {
+            console.log(`Défi ${challengeKey} marqué comme résolu.`);
+        } else {
+            console.error(`Erreur lors de la résolution du défi :`, result.error);
+        }
+    } catch (error) {
+        console.error("Erreur lors de la mise à jour du défi :", error);
+    }
+}
+
 // Fonction pour charger les données utilisateur
 async function fetchUserData() {
     try {
@@ -139,19 +163,21 @@ async function fetchUserData() {
             target = { latitude, longitude };
 
             // Extraire les informations du défi actif
-            const { image_1, text_found_1, mode } = firstUnresolvedChallenge;
+            const { image_1, text_found_1, mode, key, key_number } = firstUnresolvedChallenge;
 
             // Stocker les informations du défi actif dans une variable globale
             window.activeChallenge = {
                 image: image_1,
                 textFound: text_found_1,
                 mode: mode,
+                key: `defi_${challengeNumber}`,
+                key_number: challengeNumber
             };
 
             // Mettre à jour l'interface avec les coordonnées du défi
             document.getElementById('target-latitude').textContent = latitude.toFixed(6);
             document.getElementById('target-longitude').textContent = longitude.toFixed(6);
-            document.getElementById('challenge-number').textContent = `défi n°${challengeNumber}`;
+            document.getElementById('user-progression').textContent = challengeNumber;
         } else {
             console.log("Tous les défis sont résolus !");
             target = null; // Réinitialisation de la cible
@@ -228,34 +254,9 @@ function positionAvatar(distance) {
     }
 }
 
-// Fonction pour gérer les flèches directionnelles
-function updateArrows(distance) {
-    const arrowApproaching = document.getElementById('arrow-approaching');
-    const arrowMovingAway = document.getElementById('arrow-moving-away');
 
-    if (lastDistance !== null) {
-        if (distance < lastDistance) {
-            arrowApproaching.style.display = 'block';
-            arrowMovingAway.style.display = 'none';
-        } else {
-            arrowApproaching.style.display = 'none';
-            arrowMovingAway.style.display = 'block';
-        }
-    }
-}
 
-// Fonction pour calculer la direction vers la cible (bearing)
-function calculateBearing(lat1, lon1, lat2, lon2) {
-    const toRad = (value) => (value * Math.PI) / 180;
-    const toDeg = (value) => (value * 180) / Math.PI;
 
-    const dLon = toRad(lon2 - lon1);
-    const y = Math.sin(dLon) * Math.cos(toRad(lat2));
-    const x = Math.cos(toRad(lat1)) * Math.sin(toRad(lat2)) -
-              Math.sin(toRad(lat1)) * Math.cos(toRad(lat2)) * Math.cos(dLon);
-
-    return (toDeg(Math.atan2(y, x)) + 360) % 360; // Angle en degrés, ajusté pour être positif
-}
 
 // Fonction pour mettre à jour l'orientation de la flèche
 function updateCompass(bearing) {
@@ -293,7 +294,7 @@ function updatePosition(position) {
     updateCompass(bearing);
 
     // Afficher le popup si distance < 5m
-    if (distance < 4) {
+    if (distance < 4000) {
         showPopup(window.activeChallenge);
     }