build(Script): Script de lancement projet complet (PS1)

- Utilise Windows Terminal pour ouvrir multiples onglets - Lance le frontend Vue (npm run dev) - Lance automatiquement les services backend (score, quizz, buzzer, session...)
feat(Editor): Nouveau composant SessionSelector
2026-02-08 16:49:29 +01:00 · 2026-02-08 16:49:29 +01:00 · 2026-02-08 16:49:29 +01:00 · 2026-02-08 16:49:29 +01:00 · 2026-02-08 16:49:29 +01:00 · 2026-02-08 16:49:29 +01:00
81 changed files with 5077 additions and 2411 deletions
--- a/Start-FullProject.ps1
+++ b/Start-FullProject.ps1
@@ -0,0 +1,33 @@
+# Chemins de base
+$ServicesPath = "$($PSScriptRoot)\VNode\services"
+$VAppPath = "$($PSScriptRoot)\VApp"
+
+# Liste des services
+$JsServices = @(
+    "score-manager.js",
+    "quizz-collector.js",
+    "buzzer-manager.js",
+    "buzzer-watcher.js",
+    "session-manager.js"
+)
+
+# Utilisation de -d (startingDirectory) pour wt.exe
+# Cela évite de faire le Set-Location manuellement
+$WtArguments = "nt --title VultureGame -d `"$($VAppPath)`" powershell.exe -NoExit -Command `"npm run dev -- --host`""
+
+# Boucle pour ajouter chaque service
+foreach ($ServiceName in $JsServices) {
+    # Recherche du fichier
+    $ServiceSearch = Get-ChildItem -Path "$($ServicesPath)" -Filter "$($ServiceName)" -Recurse | Select-Object -First 1
+    
+    if ($ServiceSearch) {
+        # On définit le répertoire de travail sur le dossier du script trouvé
+        $Directory = $ServiceSearch.DirectoryName
+        $NodeCommand = "node $($ServiceSearch.FullName)"
+        
+        $WtArguments += " `; nt --title $($ServiceName) -d `"$($Directory)`" powershell.exe -NoExit -Command `"$($NodeCommand)`""
+    }
+}
+
+# Lancement final
+Start-Process "wt.exe" -ArgumentList $WtArguments
--- a/VApp/index.html
+++ b/VApp/index.html
@@ -1,6 +1,6 @@
 <!DOCTYPE html>
 <html lang="fr">
-  <head> <meta charset="UTF-8"> <link rel="icon" href="/favicon.ico"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Brain Blast</title>
+  <head> <meta charset="UTF-8"> <link rel="icon" href="/favicon.ico"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Vulture</title>
    <script src="/config.js"></script>
  </head>
  <body> <div id="app"></div> <script type="module" src="/src/main.js"></script>
--- a/VApp/package-lock.json
+++ b/VApp/package-lock.json
--- a/VApp/package.json
+++ b/VApp/package.json
@@ -14,6 +14,7 @@
  "dependencies": {
    "@mdi/font": "^7.4.47",
    "@videojs-player/vue": "^1.0.0",
+    "axios": "^1.13.4",
    "express": "^5.0.0",
    "mqtt": "^5.3.5",
    "ping": "^0.4.4",
@@ -21,6 +22,7 @@
    "video.js": "^8.22.0",
    "vue": "^3.4.19",
    "vue-router": "^4.2.5",
+    "vuetify": "^3.11.8",
    "vuex": "^4.1.0"
  },
  "devDependencies": {
--- a/VApp/public/config.js
+++ b/VApp/public/config.js
@@ -1,7 +1,19 @@
 window.APP_CONFIG = {
-    mqttBrokerUrl: 'ws://192.168.73.252:9001',
+    mqttBrokerUrl: 'ws://192.168.1.201:9001',
    redBuzzerIP: '192.168.73.40',
    blueBuzzerIP: '192.168.73.41',
    orangeBuzzerIP: '192.168.73.42',
-    greenBuzzerIP: '192.168.73.43'
+    greenBuzzerIP: '192.168.73.43',
+    apiUrl: 'http://192.168.1.178:3001',
+    topics: {
+        requestList: 'game/session/list/request',
+        responseList: 'game/session/list/response',
+        requestConfig: 'game/session/config/request',
+        getConfig: 'game/session/config/get',
+        updateConfig: 'game/session/config/update',
+        createSession: 'game/session/create',
+        deleteSession: 'game/session/delete',
+        deleteMedia: 'game/session/media/delete',
+        renameMedia: 'game/session/media/rename'
+    }
 };
--- a/VApp/src/App.vue
+++ b/VApp/src/App.vue
@@ -1,19 +1,28 @@
 <template>
  <v-app> 
-    <BrainBlastBar v-if="$route.name != 'Game Display (Projection)'" />   
-    <GameStatus v-if="$route.name === 'Game Control (Présentateur)'">
-    </GameStatus> 
+    <VultureBar v-if="showVultureBar" />   
+    <GameStatus v-if="showGameStatus" /> 
    <v-main>   
-      <RouterView /> 
+      <RouterView :key="$route.fullPath" /> 
    </v-main> <!-- <v-footer class="footer" :elevation=12 border><v-row justify="center">© 2024 - ASCO section Fablab</v-row></v-footer> -->
  </v-app>
 </template>

 <script setup>
-
-import BrainBlastBar from '@/components/BrainBlastBar.vue'
+import { computed } from 'vue';
+import { useRoute } from 'vue-router';
+import VultureBar from '@/components/VultureBar.vue'
 import GameStatus from '@/components/GameStatus.vue'

+const route = useRoute();
+
+const showVultureBar = computed(() => {
+  return route.name !== 'Game Display (Projection)' && route.name !== 'Score Display (Projection)';
+});
+
+const showGameStatus = computed(() => {
+  return route.name === 'Game Control (Présentateur)';
+});
 </script>

 <style>
--- a/VApp/src/components/BrainBlastBar.vue
+++ b/VApp/src/components/BrainBlastBar.vue
@@ -1,10 +0,0 @@
-<template>
-  <v-app-bar :collapse="$route.name === 'Game Display (Projection)'" :elevation="5" height="50"> 
-    <RouterMenu /> 
-    <v-app-bar-title v-if="$route.name !== 'Accueil'">Brain Blast</v-app-bar-title>
-  </v-app-bar>
-</template>
-
-<script setup>
-  import RouterMenu from '@/components/RouterMenu.vue'
-</script>
--- a/VApp/src/components/BuzzerValidationDialog.vue
+++ b/VApp/src/components/BuzzerValidationDialog.vue
@@ -1,6 +1,6 @@
 <template>
-  <v-dialog v-model="dialog" persistent max-width="800" height="500">
-    <v-card  dark rounded="xl">
+  <v-dialog v-model="dialog" persistent max-width="800" height="500" style="background-color: rgba(0, 0, 0, 0.8);">
+    <v-card dark rounded="xl">
      <v-card-title :style="{ backgroundColor: buzzerColor }" class="headline text-center justify-center">
        <v-icon color="background" dark large left size="70">mdi-alarm-light</v-icon>
      </v-card-title>
@@ -25,6 +25,7 @@
          rounded="0"
          height="100%"
          width="50%"
+          :style="{ backgroundColor: buzzerColor }"
          @click="validate">
          <v-icon left size="40">mdi-check-circle</v-icon>
          <span style="font-size: 20px; padding-left: 10px;">Valider (+1)</span>
@@ -46,7 +47,7 @@
    const buzzerColor = ref('');
    const client = mqtt.connect(config.mqttBrokerUrl);

-    // Map hex colors to team names if needed, or just use the color directly
+    // Associe les couleurs hex aux noms d'équipe si besoin, ou utilise directement la couleur
    function getTeamNameFromColor(color) {
        const c = color.toUpperCase();
        const colors = theme.current.value.colors;
@@ -58,7 +59,7 @@
        if (c === colors.BlueBuzzer.toUpperCase()) return 'bleue';
        if (c === colors.YellowBuzzer.toUpperCase()) return 'jaune';
        if (c === colors.GreenBuzzer.toUpperCase()) return 'verte';
-        return color; // Fallback
+        return color; // Valeur par défaut
    }

    function getTeamKeyFromColor(color) {
@@ -87,7 +88,7 @@
                        buzzerTeam.value = getTeamNameFromColor(data.color);
                        dialog.value = true;
                    } else if (data.status === 'unblocked') {
-                        // Optional: auto-close if unblocked from elsewhere
+                        // Optionnel : fermer automatiquement si débloqué depuis ailleurs
                        dialog.value = false;
                    }
                } catch (e) {
@@ -108,7 +109,7 @@
            client.publish('game/score/update', JSON.stringify(payload));
        }
        
-        // Add a small delay before unlocking to ensure the score update is processed
+        // Petit délai avant le déblocage pour que la mise à jour du score soit traitée
        setTimeout(() => {
            unlockBuzzers();
        }, 100);
@@ -133,14 +134,13 @@
        display: flex;
        align-items: center;
        justify-content: center;
-        height: 100%; /* Ensure it takes full height of the container if possible, or substantial height */
+        height: 100%; /* S'assure que l'élément occupe toute la hauteur du conteneur si possible, ou une hauteur substantielle */
    }
    .validate-btn {
-        background-color: rgb(var(--v-theme-success),1);
        color: rgb(var(--v-theme-background),1);
    }
    .refuse-btn {
-        background-color: rgb(var(--v-theme-error),1);
+        background-color: rgb(var(--v-theme-inactiveButton),1);
        color: rgb(var(--v-theme-background),1);
    }
 </style>
--- a/VApp/src/components/CardButtonScore.vue
+++ b/VApp/src/components/CardButtonScore.vue
@@ -59,7 +59,7 @@
 </template>

 <script setup>
-  import { ref, reactive, onMounted } from 'vue';
+  import { ref, reactive, onMounted, onUnmounted } from 'vue';
  import mqtt from 'mqtt';
  import config from '@/config.js'; // Ensure correct path

@@ -72,34 +72,48 @@
    Green: { Total: 0, Round: 0 },
  });

-  const client = mqtt.connect(config.mqttBrokerUrl);
+  // const client = mqtt.connect(config.mqttBrokerUrl);
+  let client = null;
  
-  client.on('connect', () => {
-      console.log('CardButtonScore: Connected to MQTT broker at', config.mqttBrokerUrl);
-      client.subscribe('game/score');
+  onMounted(() => {
+    client = mqtt.connect(config.mqttBrokerUrl);
+
+    client.on('connect', () => {
+        console.log('CardButtonScore: Connected to MQTT broker at', config.mqttBrokerUrl);
+        client.subscribe('game/score');
+        
+        console.log("CardButtonScore: Requesting scores.");
+        client.publish('game/score/request', '{}');
+    });
+
+    client.on('error', (err) => {
+        console.error('CardButtonScore: MQTT Error:', err);
+    });
+    
+    client.on('message', (topic, message) => {
+        if (topic === 'game/score') {
+            try {
+                const data = JSON.parse(message.toString());
+                console.log('CardButtonScore: Received score update:', data);
+                if (data && data.TEAM) {
+                  Object.keys(scores).forEach(color => {
+                      if (data.TEAM[color]) {
+                          scores[color].Total = data.TEAM[color].TotalScore;
+                          scores[color].Round = data.TEAM[color].RoundScore;
+                      }
+                  });
+                }
+            } catch (e) {
+                console.error("Error parsing score update:", e);
+            }
+        }
+    });
  });

-  client.on('error', (err) => {
-      console.error('CardButtonScore: MQTT Error:', err);
-  });
-  
-  client.on('message', (topic, message) => {
-      if (topic === 'game/score') {
-          try {
-              const data = JSON.parse(message.toString());
-              console.log('CardButtonScore: Received score update:', data);
-              if (data && data.TEAM) {
-                 Object.keys(scores).forEach(color => {
-                     if (data.TEAM[color]) {
-                         scores[color].Total = data.TEAM[color].TotalScore;
-                         scores[color].Round = data.TEAM[color].RoundScore;
-                     }
-                 });
-              }
-          } catch (e) {
-              console.error("Error parsing score update:", e);
-          }
-      }
+  onUnmounted(() => {
+    if (client) {
+      client.end();
+    }
  });

  function toggleCardSize() {
--- a/VApp/src/components/CardControl.vue
+++ b/VApp/src/components/CardControl.vue
@@ -26,7 +26,7 @@
            <v-icon left size="60">mdi-play</v-icon>       
          </mqtt-button>     
        </v-col>   
-      </v-row> 
+      </v-row>
    </v-container>
  </v-card>
 </template>
@@ -39,8 +39,7 @@
  const isCardReduced = ref(false);

  // Méthode pour basculer l'état de la carte
-  function toggleCardSize() { isCardReduced.value = !isCardReduced.value;
-  }
+  function toggleCardSize() { isCardReduced.value = !isCardReduced.value; }
 </script>

 <style>
--- a/VApp/src/components/CardCurrentQuizz.vue
+++ b/VApp/src/components/CardCurrentQuizz.vue
@@ -28,7 +28,12 @@ const quizzList = ref([]);
 // Fonction pour mettre à jour la liste
 const handleMessage = (topic, message) => {
  try {
-    quizzList.value = JSON.parse(message.toString());
+    const parsed = JSON.parse(message.toString());
+    if (Array.isArray(parsed)) {
+      quizzList.value = parsed;
+    } else {
+      console.warn('CardCurrentQuizz: Received non-array data', parsed);
+    }
  } catch (error) {
    console.error('Erreur de parsing JSON:', error);
  }
--- a/VApp/src/components/CardScore.vue
+++ b/VApp/src/components/CardScore.vue
@@ -91,7 +91,6 @@

 <script setup>
 import { onMounted, ref, reactive } from 'vue';
-import variables from '@/variables.js';
 import mqtt from 'mqtt'
 import config from '@/config.js'

@@ -131,24 +130,6 @@ function handleMessage(topic, message) {
  scores.BlueRoundScore = parsedMessage.TEAM.Blue.RoundScore
  scores.YellowRoundScore = parsedMessage.TEAM.Yellow.RoundScore
  scores.GreenRoundScore = parsedMessage.TEAM.Green.RoundScore
-	// Mettre à jour l'état des buzzers en fonction des messages
-  /*
-	switch (buzzer) {
-		case 'redBuzzerIP':
-			redBuzzerState.value = status === "online" ? 1 : 0;
-			break;
-		case 'blueBuzzerIP':
-			blueBuzzerState.value = status === "online" ? 1 : 0;
-			break;
-		case 'yellowBuzzerIP':
-			yellowBuzzerState.value = status === "online" ? 1 : 0;
-			break;
-		case 'greenBuzzerIP':
-			greenBuzzerState.value = status === "online" ? 1 : 0;
-			break;
-	}
-  */
-
 }


@@ -162,7 +143,9 @@ onMounted(() => {
 	subscribeToTopic('game/score', (topic, message) => {
 		handleMessage(topic, message);
 	});
-  
+
+  // Request score refresh
+  client.publish('game/score/request', '{}');
 });

 </script>
--- a/VApp/src/components/CardSolution.vue
+++ b/VApp/src/components/CardSolution.vue
@@ -3,14 +3,36 @@
 		<v-card-title class="card__title primary" @click="toggleCardSize">   
 		<v-icon left class="white--text pr-5 pl-2" size="40">mdi-play-network-outline</v-icon>   
 		Solution </v-card-title> 
-		<v-container class="text-center">   
-			<v-row justify="center">     
-				<v-container class="text-center">       <!-- Utilisation de styles CSS personnalisés pour centrer l'image -->       
-					<v-img width="450" src="@/assets/copilot-solution-FULL-HD.jpg" style="margin: 0 auto;">
-					</v-img>     
-				</v-container>   
-			</v-row> 
+		<v-container class="text-center" v-if="currentQuestion">
+            <div class="text-h6 mb-2">Question {{ currentQuestionIndex + 1 }}</div>
+            <div class="text-body-1 font-weight-bold mb-4">{{ currentQuestion.QuestionText }}</div>
+            
+            <v-divider class="mb-4"></v-divider>
+            
+            <v-btn 
+                :color="showSolution ? 'red' : 'green'" 
+                class="mb-4"
+                @click="showSolution = !showSolution"
+            >
+                {{ showSolution ? 'Masquer Solution' : 'Voir Solution' }}
+            </v-btn>
+
+            <v-slide-y-transition>
+                <div v-if="showSolution" class="solution-block">
+                    <div class="text-h5 success--text mb-2">{{ currentQuestion.MasterData.CorrectAnswer }}</div>
+                    <div class="text-body-2 grey--text text--lighten-1 mb-2">
+                        <v-icon small>mdi-information</v-icon> {{ currentQuestion.MasterData.MasterNotes }}
+                    </div>
+                     <div class="text-body-2 info--text">
+                        <v-icon small>mdi-help-circle</v-icon> {{ currentQuestion.MasterData.Help }}
+                    </div>
+                </div>
+            </v-slide-y-transition>
+
 		</v-container>
+        <v-container v-else class="text-center">
+            <div class="text-caption">Aucun quiz chargé ou fin du quiz.</div>
+        </v-container>
 	</v-card>
 </template>
 <style>
@@ -34,13 +56,18 @@
 </style>

 <script setup>
-	import { ref } from 'vue';
+	import { ref, computed } from 'vue';
+    import quizStore from '@/store/quizStore';

 	// Variable pour contrôler l'état de la carte
 	const isCardReduced = ref(false);
+    const showSolution = ref(false);

 	// Méthode pour basculer l'état de la carte
 	function toggleCardSize() { 
 		isCardReduced.value = !isCardReduced.value;
 	}
+
+    const currentQuestion = quizStore.getters.currentQuestion;
+    const currentQuestionIndex = quizStore.getters.currentQuestionIndex;
 </script>
--- a/VApp/src/components/CardTimer.vue
+++ b/VApp/src/components/CardTimer.vue
@@ -1,85 +1,39 @@
 <template> 
    <div class="container">   
        <div class="timer">     
-            <v-label color="primary" class="labelTime-style" >{{ formatTime }}</v-label> 
+            <v-label class="labelTime-style" >{{ formatTime }}</v-label> 
        </div>
-        <v-row no-gutters justify="space-around" >     
-            <v-btn class="buttons" color="primary" icon="mdi-play" @click="startTimer"></v-btn>     
-            <v-btn color="primary"  icon="mdi-pause" @click="pauseTimer"></v-btn>     
-            <v-btn color="primary" icon="mdi-restart" @click="resetTimer"></v-btn>   
-        </v-row> 
    </div>
 </template>
  
 <script setup>
-  import { ref, computed, onBeforeUnmount } from 'vue';
+  import { computed, watch } from 'vue';
+  import quizStore from '@/store/quizStore';
  
-  const timerActive = ref(false);
-  const startTime = ref(null);
-  const currentTime = ref(null);
-  const elapsedTime = ref(0);
+  const timer = quizStore.getters.timer;
+  
+  watch(timer, (val) => {
+    console.log('CardTimer: timer value changed', val);
+  }, { immediate: true });
  
  const formatTime = computed(() => { 
-    let seconds = Math.floor(elapsedTime.value / 1000); 
-    let minutes = Math.floor(seconds / 60); 
-    let hours = Math.floor(minutes / 60);
-    seconds = seconds % 60; minutes = minutes % 60;
-   return `${pad(hours)}:${pad(minutes)}:${pad(seconds)}`;
-    });
+    const seconds = timer.value % 60;
+    const minutes = Math.floor(timer.value / 60);
+    const hours = Math.floor(minutes / 60);
+    return `${pad(minutes % 60)}:${pad(seconds)}`;
+  });

-    const pad = (number) => { 
-        return (number < 10 ? "0" : "") + number;
-    };
-
-    const startTimer = () => { 
-        if (!timerActive.value) {   
-            timerActive.value = true;   
-            startTime.value = Date.now() - elapsedTime.value;   
-            updateTimer(); }
-    };
-
-    const pauseTimer = () => { 
-        if (timerActive.value) {   
-            timerActive.value = false;   
-            clearInterval(currentTime.value); }
-    };
-
-    const resetTimer = () => { 
-        elapsedTime.value = 0; 
-        timerActive.value = false; 
-        clearInterval(currentTime.value);
-    };
-
-    const updateTimer = () => { 
-        currentTime.value = setInterval(() => {elapsedTime.value = Date.now() - startTime.value; }, 1000);
-    };
-
-    onBeforeUnmount(() => { clearInterval(currentTime.value);
-    });
-</script> 
-<script> 
-	const startTimer = () => { 
-		if (!timerActive.value) {     
-			timerActive.value = true;     
-			startTime.value = Date.now() - elapsedTime.value;     
-			updateTimer(); } };
-	const pauseTimer = () => { 
-		if (timerActive.value) {     
-			timerActive.value = false;     
-			clearInterval(currentTime.value); } };
-	const resetTimer = () => { 
-		elapsedTime.value = 0;
-		timerActive.value = false; 
-		clearInterval(currentTime.value); };
-	export { startTimer, pauseTimer, resetTimer };
+  const pad = (number) => { 
+      return (number < 10 ? "0" : "") + number;
+  };
 </script>

 <style>
 	.container { 
 		text-align: center; 
-		margin-top: auto; /* Place le container en bas de son parent */ 
-		margin-bottom: 1px; /* Marge en bas pour un espacement */ 
-		position: fixed; /* Le positionne de manière fixe */ 
+		margin-top: auto;
+		margin-bottom: 1px;
+		position: fixed;
 		left: 0; 
 		right: 0; 
 		bottom: 0; 
@@ -89,12 +43,9 @@
 		margin-bottom: 15px;
  }
  .labelTime-style { 
-		font-size: 30px !important; 
+		font-size: 40px !important; 
 		font-weight: 500; 
 		color: #d42828 !important; 
 		opacity: 90% !important;
  }
-  .buttons{ 
-		background-color: rgb(255, 255, 255);
-  }
 </style>
--- a/VApp/src/components/GameMedia.vue
+++ b/VApp/src/components/GameMedia.vue
@@ -0,0 +1,265 @@
+<template>
+    <v-container v-show="gamehiding === false" class="player_video_div">
+        <div v-if="currentQuestion" style="width: 100%; height: 100%;">
+            
+            <!-- LECTEUR VIDÉO -->
+            <div v-show="currentQuestion.Type === 'video'" style="width: 100%; height: 100%;">
+                <video ref="videoPlayer" class="video-js player_video" controls preload="auto">
+                </video>
+            </div>
+
+            <!-- AFFICHAGE IMAGE -->
+            <div v-if="currentQuestion.Type === 'picture'" style="width: 100%; height: 100%;">
+                <v-img 
+                    :src="getMediaUrl(currentQuestion.MediaUrl)" 
+                    :key="currentQuestion.QuestionId"
+                    class="player_video"
+                ></v-img>
+            </div>
+
+            <!-- LECTEUR AUDIO -->
+             <div v-if="currentQuestion.Type === 'audio'" class="audio-container player_video">
+                 <div class="audio-visualizer">
+                    <v-icon size="150" color="white" class="mb-4">mdi-music-circle</v-icon>
+                    <span class="text-h2 white--text">ÉCOUTEZ</span>
+                 </div>
+                 <audio ref="audioPlayer" :src="getMediaUrl(currentQuestion.MediaUrl)" class="custom-audio"></audio>
+             </div>
+
+        </div>
+    </v-container>
+</template>
+
+<script setup>
+import { ref, computed, watch, onMounted, onBeforeUnmount, nextTick } from 'vue';
+import quizStore from '@/store/quizStore';
+import videojs from 'video.js';
+import 'video.js/dist/video-js.css';
+import { subscribeToTopic, publishMessage } from '@/services/mqttService';
+
+// Accès au store
+const currentQuestion = quizStore.getters.currentQuestion;
+
+// Références du lecteur vidéo
+const videoPlayer = ref(null);
+let vjsPlayer = null;
+
+// Références du lecteur audio
+const audioPlayer = ref(null);
+
+let gamehiding = ref(true);
+
+// Méthodes
+function getMediaUrl(relativePath) {
+    if (!relativePath) return '';
+    const cleanPath = relativePath.startsWith('/') ? relativePath.substring(1) : relativePath;
+    const url = new URL(`../quizz/vulture-session-2026-01/${cleanPath}`, import.meta.url).href;
+    console.log('GameMedia: Resolved URL:', { relativePath, url });
+    return url;
+}
+
+function initVideoPlayer() {
+    if (vjsPlayer) return; // Déjà initialisé
+    if (!videoPlayer.value) return; // DOM pas prêt
+
+    console.log('GameMedia: Initializing VideoJS');
+    vjsPlayer = videojs(videoPlayer.value, {
+        autoplay: false,
+        controls: false,
+        preload: 'auto',
+        fluid: true,
+        loop: false,
+        volume: 0,
+    }, () => {
+        console.log('GameMedia: VideoJS Ready');
+        // Si la question courante est une vidéo, la charger
+        if (currentQuestion.value && currentQuestion.value.Type === 'video') {
+             updateVideoSource();
+        }
+        
+        // Masquer automatiquement à la fin de la vidéo
+        vjsPlayer.on('ended', () => {
+            console.log('GameMedia: Video ended, hiding');
+            gamehiding.value = true;
+            publishMessage('/display/control', 'hide');
+        });
+    });
+}
+
+function updateVideoSource() {
+    if (!vjsPlayer || !currentQuestion.value) return;
+    
+    const url = getMediaUrl(currentQuestion.value.MediaUrl);
+    console.log('GameMedia: Loading Video Source', url);
+    vjsPlayer.src({ type: 'video/mp4', src: url });
+    
+    // L'autoplay est géré par la commande MQTT 'play' maintenant
+    // if (currentQuestion.value.Settings?.AutoPlay) {
+    //      vjsPlayer.play().catch(e => console.log('Autoplay blocked', e));
+    // }
+}
+
+// Observateurs
+watch(currentQuestion, async (newVal, oldVal) => {
+    console.log('GameMedia: Question Changed', newVal);
+    
+    // Arrêter d'abord tous les médias
+    if (vjsPlayer) {
+        vjsPlayer.pause();
+    }
+    if (audioPlayer.value) {
+        audioPlayer.value.pause();
+    }
+    
+    // Rester masqué au changement de question jusqu'à la lecture
+    gamehiding.value = true;
+    publishMessage('/display/control', 'hide');
+    if (!newVal) return;
+
+    await nextTick(); // Attendre la mise à jour du DOM (v-if)
+
+    if (newVal.Type === 'video') {
+         if (!vjsPlayer) {
+             initVideoPlayer();
+         } else {
+             updateVideoSource();
+         }
+    } else if (newVal.Type === 'audio') {
+        // Chargement audio (pas d'autoplay)
+         setTimeout(() => {
+             if(audioPlayer.value){
+                  console.log('GameMedia: Loading Audio');
+                  audioPlayer.value.load();
+                  
+                  // Masquer automatiquement à la fin de l'audio
+                  audioPlayer.value.onended = () => {
+                      console.log('GameMedia: Audio ended, hiding');
+                      gamehiding.value = true;
+                      publishMessage('/display/control', 'hide');
+                  };
+             }
+         }, 100);
+    }
+    // Pour le type 'picture', rien à faire, vidéo/audio déjà en pause
+}, { immediate: true });
+
+// Cycle de vie
+onMounted(async () => {
+    await nextTick();
+    if (currentQuestion.value?.Type === 'video') {
+        initVideoPlayer();
+    }
+
+    subscribeToTopic('#', (topic, message) => {
+        handleMessage(topic, message);
+    });
+});
+
+const handleMessage = (topic, message) => {
+    console.log('GameMedia: Received', topic, message);
+    if (topic === "/display/control") {
+        switch (message) {
+            case "play":
+                gamehiding.value = false;
+                console.log("▶️ GameMedia: Play");
+                // Only play the media relevant to this question type
+                if (currentQuestion.value?.Type === 'video' && vjsPlayer) {
+                    vjsPlayer.play().catch(e => console.error("Error playing video:", e));
+                }
+                if (currentQuestion.value?.Type === 'audio' && audioPlayer.value) {
+                    audioPlayer.value.play().catch(e => console.error("Error playing audio:", e));
+                }
+                if (currentQuestion.value?.Type === 'picture') {
+                    // Démarrer le timer si PlayTime est configuré
+                    const playTime = currentQuestion.value.Settings?.PlayTime;
+                    if (playTime && playTime > 0) {
+                        quizStore.actions.startTimer(playTime);
+                    }
+                }
+                break;
+            case "pause":
+                gamehiding.value = true;
+                console.log("⏸️ GameMedia: Pause");
+                quizStore.actions.stopTimer();
+                if (vjsPlayer) {
+                    vjsPlayer.pause();
+                }
+                if (audioPlayer.value) {
+                    audioPlayer.value.pause();
+                }
+                break;
+             case "hide":
+                console.log("🛑 GameMedia: Hide");
+                gamehiding.value = true;
+                quizStore.actions.stopTimer();
+                break;
+        }
+    }
+    // Vérifier le statut du buzzer pour masquer automatiquement au buzz (comme HidingOverlay)
+    // Réplication de VideoPlayer qui n'avait que /display/control dans l'extrait fourni.
+    // Comportement optionnel selon les événements du système.
+    if (topic === 'vulture/buzzer/status') {
+         try {
+             const data = JSON.parse(message);
+             if (data.status === 'blocked') {
+                 console.log("GameMedia: Buzzer Blocked -> Hiding");
+                 gamehiding.value = true;
+                 if (vjsPlayer) vjsPlayer.pause();
+                 if (audioPlayer.value) audioPlayer.value.pause();
+             }
+         } catch (e) { console.error('JSON Error', e); }
+    }
+};
+
+onBeforeUnmount(() => {
+    if (vjsPlayer) {
+        vjsPlayer.dispose();
+    }
+});
+</script>
+
+<style>
+.player_video_div {
+    margin-top: 40px;
+    width: calc(100vw - 20%);
+    height: calc(100vh - 20%);
+    border-radius: 20px !important;
+  }
+  .player_video {
+    width: 100%;
+    height: 100%;
+    max-width: 100vw;
+    max-height: 100vh;
+    border-radius: 25px !important;
+  }
+  .vjs-tech{
+    border-radius: 25px;
+  }
+  
+  /* Styles additionnels pour les éléments Audio/Custom pour s'adapter au thème */
+  .audio-container {
+      display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        background: linear-gradient(45deg, #1a1a1a, #2c3e50);
+  }
+  .audio-visualizer {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        animation: pulse 2s infinite;
+    }
+    .text-h2 {
+        font-family: 'Bahnschrift', sans-serif !important;
+    }
+    .custom-audio {
+        margin-top: 30px;
+        width: 80%;
+    }
+    @keyframes pulse {
+        0% { transform: scale(1); opacity: 0.8; }
+        50% { transform: scale(1.05); opacity: 1; }
+        100% { transform: scale(1); opacity: 0.8; }
+    }
+</style>
--- a/VApp/src/components/HidingOverlay.vue
+++ b/VApp/src/components/HidingOverlay.vue
@@ -18,6 +18,9 @@
        case "pause":
          gamehiding.value = true;
          break;
+        case "hide":
+          gamehiding.value = true;
+          break;
        default:
          console.warn("Commande non reconnue :", message);
          gamehiding.value = true;
@@ -29,6 +32,17 @@
  onMounted(() => {
    subscribeToTopic('#', (topic, message) => {
      handleMessage(topic, message);
+      
+      if (topic === 'vulture/buzzer/status') {
+          try {
+              const data = JSON.parse(message);
+              if (data.status === 'blocked') {
+                  gamehiding.value = true;
+              }
+          } catch (e) {
+              console.error('HidingOverlay JSON error', e);
+          }
+      }
    });
  });

--- a/VApp/src/components/MQTTColorPublisher.vue
+++ b/VApp/src/components/MQTTColorPublisher.vue
@@ -53,12 +53,12 @@ import { publishMessage } from '@/services/mqttService';
 const selectedTopic = ref('Selectionnez un topic');
 const selectedColor = ref('#FF0000');
 const topics = ref([
-  '/wled/all',
-  '/wled/1',
-  '/wled/2',
-  '/wled/3',
-  '/wled/4',
-  '/wled/5',
+  'wled/all/col',
+  'wled/panel/col',
+  'wled/2',
+  'wled/3',
+  'wled/4',
+  'wled/5',
 ]);

 const publishCustomColor = () => {
--- a/VApp/src/components/MqttButton.vue
+++ b/VApp/src/components/MqttButton.vue
@@ -16,6 +16,7 @@
 	const disabled = ref(false)

 	const _publishMessage = () => { 
+        console.log('MqttButton: Publishing', props.topic, props.message)
 		publishMessage(props.topic, props.message) 
 		disabled.value = true
 	}
--- a/VApp/src/components/QuestionEditorDialog.vue
+++ b/VApp/src/components/QuestionEditorDialog.vue
@@ -0,0 +1,352 @@
+<template>
+    <v-dialog v-model="visible" persistent max-width="800px">
+      <v-card rounded="xl" class="pa-3">
+        <v-card-title class="text-title-style">
+            {{ isNew ? 'Nouvelle question' : 'Éditer la question' }}
+        </v-card-title>
+        <v-card-text>
+          <v-container>
+            <v-row>
+              <v-col cols="12" md="4">
+                <v-text-field color="primary" density="compact" variant="outlined" rounded="xl" v-model="editedItem.QuestionId" label="ID Question" hint="Unique ID, ex: Q-005"></v-text-field>
+              </v-col>
+              <v-col cols="12" md="4">
+                <v-select color="primary" density="compact" variant="outlined" rounded="xl" v-model="editedItem.Type" :items="['video', 'audio', 'picture']" label="Type"></v-select>
+              </v-col>
+              <v-col cols="12" md="4">
+                <v-text-field color="primary" density="compact" variant="outlined" rounded="xl" v-model.number="editedItem.Points" type="number" label="Points"></v-text-field>
+              </v-col>
+              <v-col cols="12">
+                <v-textarea color="primary" variant="outlined" rounded="xl" v-model="editedItem.QuestionText" label="Texte de la question" rows="2"></v-textarea>
+              </v-col>
+              
+              <!-- Media Section -->
+              <v-col cols="12">
+                 <div class="d-flex align-center">
+                    <!-- Preview Section -->
+                    <div v-if="editedItem.MediaUrl" class="preview-box mr-4 text-center">
+                        <img v-if="editedItem.Type === 'picture'" :src="getPreviewUrl(editedItem.MediaUrl)" class="preview-content" @click="showFullPreview = true">
+                        <video 
+                            v-else-if="editedItem.Type === 'video'" 
+                            :src="getPreviewUrl(editedItem.MediaUrl)" 
+                            class="preview-content"
+                            @click="showVideoPreview = true"    
+                            @loadedmetadata="(e) => e.target.currentTime = e.target.duration / 3"
+                            muted
+                        ></video>
+                        <div v-else-if="editedItem.Type === 'audio'" class="text-caption" style="cursor: pointer;" @click="showAudioPreview = true">
+                            <v-icon size="64" color="primary">mdi-music</v-icon>
+                        </div>
+                    </div>
+                    
+                    <v-text-field color="primary" density="compact" variant="outlined" rounded="xl" v-model="editedItem.MediaUrl" label="URL du Média" class="flex-grow-2 mr-2" hide-details></v-text-field>
+                    <input 
+                        type="file" 
+                        ref="fileInputRef" 
+                        color="primary"
+                        style="display: none;" 
+                        @change="onFileSelected"
+                        accept="image/*,video/*,audio/*"
+                    />
+                    <v-btn 
+                        rounded="xl"
+                        variant="tonal" 
+                        color="primary"
+                        :loading="uploading"
+                        :disabled="!editedItem.Type"
+                        @click="$refs.fileInputRef.click()"
+                    >
+                        <v-icon start>mdi-upload</v-icon>
+                        Upload
+                    </v-btn>
+                    
+                    <v-btn
+                        v-if="editedItem.MediaUrl"
+                        rounded="xl"
+                        text="Supprimer"
+                        variant="tonal"
+                        color="red"
+                        class="ml-2"
+                        @click="deleteMedia"
+                        title="Supprimer le média"
+                    ></v-btn>
+                 </div>
+                 <div v-if="uploadError" class="text-caption text-red">{{ uploadError }}</div>
+              </v-col>
+
+              <v-col cols="12"><v-divider></v-divider></v-col>
+              <v-col cols="12" class="text-h6">Paramètres</v-col>
+              
+              <v-col cols="6" md="4">
+                  <v-switch inset v-model="editedItem.Settings.AutoPlay" label="AutoPlay" density="compact" color="primary"></v-switch>
+              </v-col>
+              <v-col cols="6" md="4">
+                  <v-switch inset v-model="editedItem.Settings.Loop" label="Loop" density="compact" color="primary"></v-switch>
+              </v-col>
+              <v-col cols="6" md="4">
+                  <v-text-field color="primary" variant="outlined" rounded="xl" v-model.number="editedItem.Settings.PlayTime" type="number" label="Durée (sec)" density="compact"></v-text-field>
+              </v-col>
+
+              <v-col cols="12"><v-divider></v-divider></v-col>
+              <v-label class="text-title-style">
+                Réponse (Maître du jeu)
+              </v-label>
+              <v-col cols="12" class="text-h6"></v-col>
+              
+              <v-col cols="12">
+                <v-text-field color="primary" variant="outlined" rounded="xl" v-model="editedItem.MasterData.CorrectAnswer" label="Réponse Correcte"></v-text-field>
+              </v-col>
+              <v-col cols="12">
+                <v-textarea color="primary" variant="outlined" rounded="xl" v-model="editedItem.MasterData.MasterNotes" label="Notes pour le MJ" rows="2"></v-textarea>
+              </v-col>
+              <v-col cols="12">
+                <v-textarea color="primary" variant="outlined" rounded="xl" v-model="editedItem.MasterData.Help" label="Indice / Aide" rows="2"></v-textarea>
+              </v-col>
+            </v-row>
+          </v-container>
+        </v-card-text>
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn color="primary" rounded="xl" variant="outlined" @click="close">Annuler</v-btn>
+          <v-btn color="success" rounded="xl" variant="outlined" @click="save">Ok</v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+
+    <!-- Dialog Preview Image -->
+    <v-dialog v-model="showFullPreview" max-width="90vw">
+        <v-card rounded="xl" class="pa-2">
+            <v-card-text class="d-flex justify-center" style="padding: 16px;">
+                <v-img
+                    :src="getPreviewUrl(editedItem.MediaUrl)" 
+                    max-height="80vh"
+                    rounded="lg"
+                    @click="showFullPreview = false"
+                    style="cursor: pointer;"
+                ></v-img>
+            </v-card-text>
+            <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn color="primary" variant="text" @click="showFullPreview = false">Fermer</v-btn>
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
+
+    <!-- Dialog Preview Video -->
+    <v-dialog v-model="showVideoPreview" max-width="90vw">
+        <v-card rounded="xl" class="pa-2">
+            <v-card-text class="d-flex justify-center" style="padding: 16px;">
+                <video 
+                    :src="getPreviewUrl(editedItem.MediaUrl)" 
+                    controls
+                    autoplay
+                    disablepictureinpicture 
+                    disableremoteplayback
+                    controlslist="nodownload"
+                    style="max-width: 100%; max-height: 80vh; border-radius: 12px;"
+                ></video>
+            </v-card-text>
+            <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn color="primary" variant="text" @click="showVideoPreview = false">Fermer</v-btn>
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
+
+    <!-- Dialog Preview Audio -->
+    <v-dialog v-model="showAudioPreview" max-width="500px">
+        <v-card rounded="xl" class="pa-4">
+            <v-card-title class="text-center">
+                <v-icon size="64" color="primary">mdi-music-circle</v-icon>
+            </v-card-title>
+            <v-card-text class="d-flex justify-center" style="padding: 16px;">
+                <audio 
+                    :src="getPreviewUrl(editedItem.MediaUrl)" 
+                    controls
+                    controlslist="nodownload"
+                    disablepictureinpicture 
+                    disableremoteplayback
+                    autoplay
+                    style="width: 100%;"
+                ></audio>
+            </v-card-text>
+            <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn color="primary" variant="text" @click="showAudioPreview = false">Fermer</v-btn>
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
+</template>
+
+<script setup>
+import { ref, reactive, watch, computed } from 'vue';
+import axios from 'axios';
+
+const props = defineProps({
+    modelValue: Boolean,
+    question: {
+        type: Object,
+        default: null
+    },
+    sessionId: {
+        type: String,
+        required: true
+    },
+    apiUrl: {
+        type: String,
+        required: true
+    },
+    nextIndex: {
+        type: Number,
+        default: 1
+    }
+});
+
+const emit = defineEmits(['update:modelValue', 'save', 'delete-media']);
+
+const visible = computed({
+    get: () => props.modelValue,
+    set: (val) => emit('update:modelValue', val)
+});
+
+const defaultQuestion = {
+  QuestionId: '',
+  Type: '',
+  Points: 1,
+  QuestionText: '',
+  MediaUrl: '',
+  Settings: {
+    StartAt: null,
+    StopAt: null,
+    AutoPlay: false,
+    Loop: false,
+    PlayTime: null,
+    DisplayMode: 'Cover',
+    BlurEffect: false
+  },
+  MasterData: {
+    CorrectAnswer: '',
+    MasterNotes: '',
+    Help: ''
+  }
+};
+
+const editedItem = reactive(JSON.parse(JSON.stringify(defaultQuestion)));
+// Copy question data when opening
+watch(() => props.modelValue, (val) => {
+    if (val) {
+        if (props.question) {
+            Object.assign(editedItem, JSON.parse(JSON.stringify(props.question)));
+            // Ensure nested objects exist
+            if(!editedItem.Settings) editedItem.Settings = {...defaultQuestion.Settings};
+            if(!editedItem.MasterData) editedItem.MasterData = {...defaultQuestion.MasterData};
+        } else {
+            Object.assign(editedItem, JSON.parse(JSON.stringify(defaultQuestion)));
+            // Auto-generate ID: Q-005 for 5th question
+            const idNumber = props.nextIndex.toString().padStart(3, '0');
+            editedItem.QuestionId = `Q-${idNumber}`; 
+        }
+        uploadError.value = '';
+    }
+});
+
+const isNew = computed(() => !props.question);
+
+const showFullPreview = ref(false);
+const showVideoPreview = ref(false);
+const showAudioPreview = ref(false);
+const uploading = ref(false);
+const uploadError = ref('');
+
+function close() {
+    visible.value = false;
+}
+
+function save() {
+    emit('save', JSON.parse(JSON.stringify(editedItem)));
+    close();
+}
+
+function getPreviewUrl(relativePath) {
+    if (!relativePath || relativePath.startsWith('http')) return relativePath;
+    return `${props.apiUrl}/quizz/${props.sessionId}${relativePath}`;
+}
+
+// Upload Handling
+const fileInputRef = ref(null);
+
+function onFileSelected(event) {
+    const file = event.target.files[0];
+    if (file) handleFileUpload(file);
+    event.target.value = '';
+}
+
+async function handleFileUpload(file) {
+    if (!file) return;
+    
+    uploading.value = true;
+    uploadError.value = '';
+
+    if (!editedItem.Type) {
+        uploadError.value = "Veuillez sélectionner un Type avant d'uploader un fichier.";
+        uploading.value = false;
+        return;
+    }
+    
+    try {
+        const formData = new FormData();
+        formData.append('questionId', editedItem.QuestionId);
+        formData.append('type', editedItem.Type);
+        formData.append('file', file);
+        
+        const response = await axios.post(`${props.apiUrl}/upload/${props.sessionId}`, formData);
+        
+        if (response.data && response.data.path) {
+            editedItem.MediaUrl = response.data.path;
+        }
+    } catch (e) {
+        console.error("Upload error:", e);
+        uploadError.value = "Erreur lors de l'upload du fichier.";
+    } finally {
+        uploading.value = false;
+    }
+}
+
+function deleteMedia() {
+    if (!editedItem.MediaUrl) return;
+
+    if (confirm('Voulez-vous vraiment supprimer ce média ? Cette action est irréversible.')) {
+        emit('delete-media', editedItem.MediaUrl);
+        editedItem.MediaUrl = ''; 
+    }
+}
+</script>
+
+<style scoped>
+    .text-title-style {
+        color: rgb(var(--v-theme-primary), 1) !important; 
+        opacity: 1;
+        font-size: 20px;
+        font-weight: bold;
+    }
+    
+    .preview-box {
+        width: 120px; 
+        height: 120px; 
+        background: #333; 
+        display: flex; 
+        align-items: center; 
+        justify-content: center; 
+        overflow: hidden; 
+        border-radius: 8px; 
+        position: relative;
+        flex-shrink: 0;
+    }
+
+    .preview-content {
+        width: 100%; 
+        height: 100%; 
+        object-fit: cover; 
+        cursor: pointer;
+    }
+</style>
--- a/VApp/src/components/SessionDetails.vue
+++ b/VApp/src/components/SessionDetails.vue
@@ -0,0 +1,162 @@
+<template>
+    <div>
+        <v-alert v-if="error" type="error" closable class="mb-4">{{ error }}</v-alert>
+        <v-alert rounded="xl" v-if="success" type="success" closable class="ma-15">{{ success }}</v-alert>
+
+        <v-card class="ma-15 pa-5" rounded="xl">
+        <v-card-title class="pb-10">Configuration Générale</v-card-title>
+        <v-card-text>
+            <v-row>
+            <v-col cols="12" md="6">
+                <v-text-field color="primary" v-model="config.PackId" label="ID du Pack" readonly variant="outlined" rounded="xl"></v-text-field>
+            </v-col>
+            <v-col cols="12" md="6">
+                <v-text-field color="primary" v-model="config.PackTitle" label="Titre du Pack" variant="outlined" rounded="xl"></v-text-field>
+            </v-col>
+            </v-row>
+        </v-card-text>
+        </v-card>
+
+        <v-card rounded="xl" class="pa-5 ma-15">
+            <!-- List container without v-list wrapper for clean transition -->
+            <SessionQuestionsList 
+                :questions="config.Questions"
+                :session-id="sessionId"
+                :api-url="apiUrl"
+                @move="(index, dir) => moveQuestion(index, dir)"
+                @update="(q, i) => updateQuestion(q, i)"
+                @delete="(i) => deleteQuestion(i)"
+                @delete-media="(path) => $emit('delete-media', path)"
+            />
+        </v-card>
+    </div>
+</template>
+
+<script setup>
+import SessionQuestionsList from '@/components/SessionQuestionsList.vue';
+
+const props = defineProps({
+    config: {
+        type: Object,
+        required: true
+    },
+    sessionId: {
+        type: String,
+        required: true
+    },
+    apiUrl: {
+        type: String,
+        required: true
+    },
+    success: String,
+    error: String
+});
+
+const emit = defineEmits(['delete-media', 'rename-media']);
+const cleanUrl = (url) => url ? url.split('?')[0] : url;
+
+function deleteQuestion(index) {
+    if (confirm('Êtes-vous sûr de vouloir supprimer cette question ? (Le média sera aussi supprimé)')) {
+        const question = props.config.Questions[index];
+        if (question.MediaUrl) {
+            emit('delete-media', cleanUrl(question.MediaUrl));
+        }
+        props.config.Questions.splice(index, 1);
+        reindexQuestions();
+    }
+}
+
+function reindexQuestions() {
+    // Step 1: Rename conflict candidates to temporary names
+    console.log("reindexQuestions: Starting Step 1 (Rename to TMP)");
+    props.config.Questions.forEach((q, i) => {
+        const idNumber = (i + 1).toString().padStart(3, '0');
+        const newId = `Q-${idNumber}`;
+
+        if (q.QuestionId !== newId && q.MediaUrl) {
+            // It will be renamed. Rename to TEMP first.
+            const lastDotIndex = q.MediaUrl.lastIndexOf('.');
+            if (lastDotIndex !== -1) {
+                const ext = q.MediaUrl.substring(lastDotIndex);
+                const lastSlashIndex = q.MediaUrl.lastIndexOf('/');
+                const folderPath = q.MediaUrl.substring(0, lastSlashIndex + 1);
+                
+                const tempId = `TMP-${q.QuestionId}`;
+                const tempPath = folderPath + tempId + ext;
+                
+                emit('rename-media', {
+                    oldPath: cleanUrl(q.MediaUrl),
+                    newName: tempId
+                });
+                console.log(`Step 1: Renaming ${q.MediaUrl} to ${tempId}`);
+                
+                // Store temp path but DO NOT update MediaUrl yet to avoid browser locking the file
+                q._temp_path = tempPath;
+                
+                // Mark for second pass
+                q._temp_renamed = true;
+            }
+        }
+    });
+
+    // Step 2: Rename all to final names (Delayed to allow FS to settle)
+    setTimeout(() => {
+        console.log("reindexQuestions: Starting Step 2 (Rename to Final)");
+        props.config.Questions.forEach((q, i) => {
+            const idNumber = (i + 1).toString().padStart(3, '0');
+            const newId = `Q-${idNumber}`;
+            
+            if (q._temp_renamed && q._temp_path) {
+                // Rename TMP -> Final
+                const lastDotIndex = q.MediaUrl.lastIndexOf('.');
+                const ext = q.MediaUrl.substring(lastDotIndex);
+                const lastSlashIndex = q.MediaUrl.lastIndexOf('/');
+                const folderPath = q.MediaUrl.substring(0, lastSlashIndex + 1);
+                
+                console.log(`Step 2: Renaming ${q._temp_path} to ${newId}`);
+                emit('rename-media', {
+                    oldPath: cleanUrl(q._temp_path), // Use the stored temp path
+                    newName: newId
+                });
+                
+                // Update with timestamp to force refresh
+                q.MediaUrl = folderPath + newId + ext + `?t=${Date.now()}`;
+
+                delete q._temp_renamed;
+                delete q._temp_path;
+            } 
+            
+            // Note: QuestionId update is done here inside the timeout
+            // This might cause a slight reactive delay but ensures alignment
+            q.QuestionId = newId;
+        });
+    }, 200); // 200ms delay
+}
+
+function updateQuestion(questionData, index) {
+    if (index > -1) {
+        Object.assign(props.config.Questions[index], questionData);
+    } else {
+        // Add new
+        if (!questionData._ui_key) {
+             Object.defineProperty(questionData, '_ui_key', {
+                value: `q-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
+                writable: true,
+                enumerable: false,
+                configurable: true
+            });
+        }
+        props.config.Questions.push(questionData);
+        reindexQuestions();
+    }
+}
+
+function moveQuestion(index, direction) {
+    const newIndex = index + direction;
+    if (newIndex >= 0 && newIndex < props.config.Questions.length) {
+        const item = props.config.Questions.splice(index, 1)[0];
+        props.config.Questions.splice(newIndex, 0, item);
+        reindexQuestions();
+    }
+}
+</script>
--- a/VApp/src/components/SessionQuestionsList.vue
+++ b/VApp/src/components/SessionQuestionsList.vue
@@ -0,0 +1,256 @@
+<template>
+    <div class="session-questions-list">
+        <div class="d-flex justify-space-between align-center mb-5 px-4">
+            <span class="text-h6">Questions ({{ questions.length }})</span>
+            <v-btn rounded="xl" color="secondary" size="small" prepend-icon="mdi-plus" @click="openDialog()">Ajouter</v-btn>
+        </div>
+
+        <div v-if="questions.length === 0" class="text-h5 font-weight-bold text-center text-primary pb-5">
+            Aucune question définie.
+        </div>
+        
+        <!-- List container without v-list wrapper for clean transition -->
+        <transition-group name="flip-list" tag="div" class="question-list-container">
+            <v-card v-for="(question, index) in questions" :key="question._ui_key" rounded="xl" variant="outlined" class="mb-2 question-item">
+            <v-card-text class="d-flex align-center py-2">
+                <div class="mr-4 font-weight-bold text-h6 text-primary">{{ index + 1 }}</div>
+                <div class="flex-grow-1">
+                <div class="text-subtitle-1 font-weight-bold">
+                    <span class="text-primary opacity-100 pb-2">{{ question.QuestionId }}</span>
+                </div>
+                <div class="text-body-2 font-weight-bold"><span class="text-primary opacity-100">Question :</span> {{ question.QuestionText }}</div>
+                <div class="text-body-2 font-weight-bold"><span class="text-primary opacity-100">Réponse :</span> {{ question.MasterData.CorrectAnswer }}</div>
+                <div class="text-body-2 font-weight-bold"><span class="text-primary opacity-100">Points :</span> {{ question.Points }}</div>
+                <div class="text-body-2 font-weight-bold"><span class="text-primary opacity-100">Temps :</span> {{ question.Settings.PlayTime }} secondes</div>
+                <div class="text-body-2 font-weight-bold"><span class="text-primary opacity-100">Type :</span> {{ question.Type }}</div>
+                </div>
+                
+                <div v-if="question.MediaUrl" class="mr-10">
+                     <div class="list-preview-box" @click="openPreview(question.Type, question.MediaUrl)" style="cursor: pointer;">
+                        <img v-if="question.Type === 'picture'" :src="getPreviewUrl(question.MediaUrl)" class="list-preview-content">
+                        <video 
+                            v-else-if="question.Type === 'video'" 
+                            :src="getPreviewUrl(question.MediaUrl) + '#t=0.1'" 
+                            class="list-preview-content"
+                            preload="metadata"
+                            muted
+                        ></video>
+                         <div v-else-if="question.Type === 'audio'">
+                            <v-icon size="32" color="primary">mdi-music</v-icon>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="d-flex flex-column gap-1">
+                    <v-btn icon="mdi-arrow-up" size="x-large" variant="text" :disabled="index === 0" @click="$emit('move', index, -1)"></v-btn>
+                    <v-btn icon="mdi-arrow-down" size="x-large" variant="text" :disabled="index === questions.length - 1" @click="$emit('move', index, 1)"></v-btn>
+                </div>
+                <div class="d-flex ml-2">
+                <v-btn icon="mdi-pencil" size="x-large" variant="text" color="blue" @click="openDialog(question, index)"></v-btn>
+                <v-btn icon="mdi-delete" size="x-large" variant="text" color="red" @click="$emit('delete', index)"></v-btn>
+                </div>
+            </v-card-text>
+            </v-card>
+        </transition-group>
+
+        <!-- Use persistent prop if needed, though hidden by v-model -->
+        <QuestionEditorDialog 
+            v-model="dialogVisible"
+            :question="editingQuestion"
+            :session-id="sessionId"
+            :api-url="apiUrl"
+            :next-index="nextQuestionIndex"
+            @save="onSave"
+            @delete-media="onDeleteMedia"
+        />
+
+        <!-- Dialog Preview Image -->
+        <v-dialog v-model="showFullPreview" max-width="90vw">
+            <v-card rounded="xl" class="pa-2">
+                <v-card-text class="d-flex justify-center" style="padding: 16px;">
+                    <v-img
+                        :src="getPreviewUrl(previewMediaUrl)" 
+                        max-height="80vh"
+                        rounded="lg"
+                        @click="showFullPreview = false"
+                        style="cursor: pointer;"
+                    ></v-img>
+                </v-card-text>
+                <v-card-actions>
+                    <v-spacer></v-spacer>
+                    <v-btn color="primary" variant="text" @click="showFullPreview = false">Fermer</v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+
+        <!-- Dialog Preview Video -->
+        <v-dialog v-model="showVideoPreview" max-width="90vw">
+            <v-card rounded="xl" class="pa-2">
+                <v-card-text class="d-flex justify-center" style="padding: 16px;">
+                    <video 
+                        :src="getPreviewUrl(previewMediaUrl)" 
+                        controls
+                        autoplay
+                        disablepictureinpicture 
+                        disableremoteplayback
+                        controlslist="nodownload"
+                        style="max-width: 100%; max-height: 80vh; border-radius: 12px;"
+                    ></video>
+                </v-card-text>
+                <v-card-actions>
+                    <v-spacer></v-spacer>
+                    <v-btn color="primary" variant="text" @click="showVideoPreview = false">Fermer</v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+
+        <!-- Dialog Preview Audio -->
+        <v-dialog v-model="showAudioPreview" max-width="500px">
+            <v-card rounded="xl" class="pa-4">
+                <v-card-title class="text-center">
+                    <v-icon size="64" color="primary">mdi-music-circle</v-icon>
+                </v-card-title>
+                <v-card-text class="d-flex justify-center" style="padding: 16px;">
+                    <audio 
+                        :src="getPreviewUrl(previewMediaUrl)" 
+                        controls
+                        controlslist="nodownload"
+                        disablepictureinpicture 
+                        disableremoteplayback
+                        autoplay
+                        style="width: 100%;"
+                    ></audio>
+                </v-card-text>
+                <v-card-actions>
+                    <v-spacer></v-spacer>
+                    <v-btn color="primary" variant="text" @click="showAudioPreview = false">Fermer</v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+    </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import QuestionEditorDialog from './QuestionEditorDialog.vue';
+
+const props = defineProps({
+    questions: {
+        type: Array,
+        required: true,
+        default: () => []
+    },
+    sessionId: {
+        type: String,
+        required: true
+    },
+    apiUrl: {
+        type: String,
+        required: true
+    }
+});
+
+const emit = defineEmits(['move', 'delete', 'update', 'delete-media']);
+
+// Dialog state
+const dialogVisible = ref(false);
+const editingQuestion = ref(null);
+const editingIndex = ref(-1);
+const nextQuestionIndex = ref(1);
+
+function openDialog(question = null, index = -1) {
+    editingQuestion.value = question; // if null, dialog treats as new
+    editingIndex.value = index;
+    
+    // Calculate next index: if editing, use current index + 1, else use length + 1
+    if (index >= 0) {
+        nextQuestionIndex.value = index + 1;
+    } else {
+        nextQuestionIndex.value = props.questions.length + 1;
+    }
+
+    dialogVisible.value = true;
+}
+
+function onSave(questionData) {
+    emit('update', questionData, editingIndex.value);
+}
+
+function onDeleteMedia(mediaUrl) {
+    emit('delete-media', mediaUrl);
+}
+
+function getPreviewUrl(relativePath) {
+    if (!relativePath || relativePath.startsWith('http')) return relativePath;
+    return `${props.apiUrl}/quizz/${props.sessionId}${relativePath}`;
+}
+
+const showFullPreview = ref(false);
+const showVideoPreview = ref(false);
+const showAudioPreview = ref(false);
+const previewMediaUrl = ref('');
+
+function openPreview(type, url) {
+    previewMediaUrl.value = url;
+    if (type === 'picture') showFullPreview.value = true;
+    else if (type === 'video') showVideoPreview.value = true;
+    else if (type === 'audio') showAudioPreview.value = true;
+}
+</script>
+
+<style scoped>
+    .gap-1 {
+        gap: 4px;
+    }
+
+    .question-list-container {
+        position: relative;
+    }
+
+    .question-item {
+        transition: all 0.5s ease;
+        /* Ensure z-index is handled during move for better visual stack */
+        z-index: 1; 
+    }
+
+    /* Transition d'animation de liste */
+    .flip-list-move {
+        transition: transform 0.5s;
+    }
+
+    /* Entering items */
+    .flip-list-enter-active,
+    .flip-list-leave-active {
+        transition: all 0.5s ease;
+    }
+    
+    .flip-list-enter-from,
+    .flip-list-leave-to {
+        opacity: 0;
+        transform: translateX(30px);
+    }
+    
+    /* Ensure removed items are taken out of flow so others can move up smoothly */
+    .flip-list-leave-active {
+        position: absolute; 
+        width: 100%; /* Important to maintain width when absolute */
+    }
+
+    .list-preview-box {
+        width: 80px; 
+        height: 80px; 
+        background: #333; 
+        display: flex; 
+        align-items: center; 
+        justify-content: center; 
+        overflow: hidden; 
+        border-radius: 8px; 
+        flex-shrink: 0;
+    }
+
+    .list-preview-content {
+        width: 100%; 
+        height: 100%; 
+        object-fit: cover; 
+    }
+</style>
--- a/VApp/src/components/SessionSelector.vue
+++ b/VApp/src/components/SessionSelector.vue
@@ -0,0 +1,56 @@
+<template>
+    <v-row class="ml-15 mr-15 mt-5 mb-10 align-center">
+      <v-col cols="12" md="4" class="d-flex align-center gap-2">
+         <v-select
+            v-model="internalValue"
+            :items="sessions"
+            item-title="title"
+            item-value="id"
+            label="Choisir une session"
+            variant="outlined"
+            hide-details
+            rounded="xl"
+            class="flex-grow-1"
+         ></v-select>
+         <v-btn icon="mdi-plus" color="green" variant="tonal" @click="$emit('create')" title="Nouvelle Session"></v-btn>
+         <v-btn icon="mdi-delete" color="red" variant="tonal" @click="$emit('delete')" :disabled="!internalValue" title="Supprimer Session"></v-btn>
+      </v-col>
+      <v-col class="text-right">
+        <v-btn rounded="xl" color="primary" @click="$emit('save')" :loading="saving" :disabled="!internalValue">
+          <v-icon start>mdi-content-save</v-icon> Sauvegarder
+        </v-btn>
+      </v-col>
+    </v-row>
+</template>
+
+<script setup>
+import { computed } from 'vue';
+
+const props = defineProps({
+    modelValue: {
+        type: String,
+        default: null
+    },
+    sessions: {
+        type: Array,
+        default: () => []
+    },
+    saving: {
+        type: Boolean,
+        default: false
+    }
+});
+
+const emit = defineEmits(['update:modelValue', 'create', 'delete', 'save']);
+
+const internalValue = computed({
+    get: () => props.modelValue,
+    set: (val) => emit('update:modelValue', val)
+});
+</script>
+
+<style scoped>
+    .gap-2 {
+        gap: 8px;
+    }
+</style>
--- a/VApp/src/components/VultureBar.vue
+++ b/VApp/src/components/VultureBar.vue
@@ -0,0 +1,10 @@
+<template>
+  <v-app-bar :elevation="5" height="50"> 
+    <RouterMenu /> 
+    <v-app-bar-title v-if="$route.name !== 'Accueil'">Vulture</v-app-bar-title>
+  </v-app-bar>
+</template>
+
+<script setup>
+  import RouterMenu from '@/components/RouterMenu.vue'
+</script>
--- a/VApp/src/config.js
+++ b/VApp/src/config.js
@@ -3,11 +3,23 @@
 // This allows runtime configuration changes without rebuilding the app.

 const defaults = {
-  mqttBrokerUrl: 'ws://192.168.73.252:9001',
+  mqttBrokerUrl: 'ws://192.168.1.201:9001',
  redBuzzerIP: '192.168.73.40',
  blueBuzzerIP: '192.168.73.41',
  orangeBuzzerIP: '192.168.73.42',
-  greenBuzzerIP: '192.168.73.43'
+  greenBuzzerIP: '192.168.73.43',
+  apiUrl: 'http://192.168.1.178:3001',
+  topics: {
+    requestList: 'game/session/list/request',
+    responseList: 'game/session/list/response',
+    requestConfig: 'game/session/config/request',
+    getConfig: 'game/session/config/get',
+    updateConfig: 'game/session/config/update',
+    createSession: 'game/session/create',
+    deleteSession: 'game/session/delete',
+    deleteMedia: 'game/session/media/delete',
+    renameMedia: 'game/session/media/rename'
+  }
 };

 const config = window.APP_CONFIG || defaults;
--- a/VApp/src/plugins/router.js
+++ b/VApp/src/plugins/router.js
@@ -3,30 +3,41 @@ import HomeView from '../views/HomeView.vue'

 const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
-  routes: [ {   
-    path: '/',   
-    name: 'Accueil',   
-    component: HomeView 
-  }, 
-  {   
-    path: '/game/control',  
-    name: 'Game Control (Présentateur)',   
-    component: () => import('@/views/GameControl.vue') 
-  }, 
-  {   
-    path: '/game/display',   
-    name: 'Game Display (Projection)',   
-    component: () => import('@/views/GameDisplay.vue') 
-  }, 
-  {   
-    path: '/mqtt-debugger',   
-    name: 'Debugger MQTT',   
-    component: () => import('@/views/MQTTDebugView.vue') 
-  }, 
-  {   
-    path: '/settings',   
-    name: 'Paramètres',   
-    component: () => import('@/views/SettingsView.vue') }
+  routes: [{
+    path: '/',
+    name: 'Accueil',
+    component: HomeView
+  },
+  {
+    path: '/game/control',
+    name: 'Game Control (Présentateur)',
+    component: () => import('@/views/GameControl.vue')
+  },
+  {
+    path: '/game/display',
+    name: 'Game Display (Projection)',
+    component: () => import('@/views/GameDisplay.vue')
+  },
+  {
+    path: '/score/display',
+    name: 'Score Display (Projection)',
+    component: () => import('@/views/ScoreDisplay.vue')
+  },
+  {
+    path: '/mqtt-debugger',
+    name: 'Debugger MQTT',
+    component: () => import('@/views/MQTTDebugView.vue')
+  },
+  {
+    path: '/settings',
+    name: 'Paramètres',
+    component: () => import('@/views/SettingsView.vue')
+  },
+  {
+    path: '/session-editor',
+    name: 'Éditeur de Session',
+    component: () => import('@/views/SessionEditor.vue')
+  }
  ]
 })

--- a/VApp/src/plugins/vuetify.js
+++ b/VApp/src/plugins/vuetify.js
@@ -13,36 +13,38 @@ import { createVuetify } from 'vuetify'

 const CustomThemeDark = {
  dark: true,
-  colors: { 
-    background: '#121212', 
-    primary: '#d42828', 
-    secondary: '#F44336', 
-    accent: '#FFC107', 
-    error: '#e91e1e', 
-    warning: '#FFC107', 
-    info: '#607D8B', 
-    success: '#15B01B', 
-    BlueBuzzer: '#2867d4', 
-    YellowBuzzer: '#D4D100', 
-    RedBuzzer: '#d42828', 
+  colors: {
+    background: '#121212',
+    primary: '#d42828',
+    secondary: '#F44336',
+    accent: '#FFC107',
+    error: '#e91e1e',
+    warning: '#FFC107',
+    info: '#607D8B',
+    inactiveButton: '#707070ff',
+    success: '#15B01B',
+    BlueBuzzer: '#2867d4',
+    YellowBuzzer: '#D4D100',
+    RedBuzzer: '#d42828',
    GreenBuzzer: '#28d42e',
    DisconnectedBuzzer: '#595959',
  }
 }
 const CustomThemeLight = {
  dark: false,
-  colors: { 
-    background: '#ffffff', 
-    primary: '#d42828', 
-    secondary: '#F44336', 
-    accent: '#FFC107', 
-    error: '#e91e1e', 
-    warning: '#FFC107', 
-    info: '#607D8B', 
-    success: '#4CAF50', 
-    BlueBuzzer: '#2867d4', 
-    YellowBuzzer: '#D4D100', 
-    RedBuzzer: '#d42828', 
+  colors: {
+    background: '#ffffff',
+    primary: '#d42828',
+    secondary: '#F44336',
+    accent: '#FFC107',
+    error: '#e91e1e',
+    warning: '#FFC107',
+    info: '#607D8B',
+    inactiveButton: '#707070ff',
+    success: '#4CAF50',
+    BlueBuzzer: '#2867d4',
+    YellowBuzzer: '#D4D100',
+    RedBuzzer: '#d42828',
    GreenBuzzer: '#28d42e',
    DisconnectedBuzzer: '#595959',
  }
@@ -50,10 +52,11 @@ const CustomThemeLight = {

 // https://vuetifyjs.com/en/introduction/why-vuetify/#feature-guides
 export default createVuetify({
-  theme: { 
-    defaultTheme: 'CustomThemeDark', 
-    themes: {   
-      CustomThemeDark,   
-      CustomThemeLight, },
+  theme: {
+    defaultTheme: 'CustomThemeDark',
+    themes: {
+      CustomThemeDark,
+      CustomThemeLight,
+    },
  },
 })
--- a/VApp/src/store/quizStore.js
+++ b/VApp/src/store/quizStore.js
@@ -0,0 +1,166 @@
+import { reactive, computed } from 'vue';
+import mqtt from 'mqtt';
+import config from '@/config.js';
+import sessionConfig from '@/quizz/vulture-session-2026-01/session-configuration.json';
+
+// Reactive state
+const state = reactive({
+    currentQuestionIndex: 0,
+    questions: [],
+    isMediaHidden: true,
+    packTitle: '',
+    timer: 0  // Timer in seconds
+});
+
+// MQTT Client
+let client = null;
+let timerInterval = null;
+let initialized = false;
+
+// Initialize Store
+function init() {
+    if (initialized) {
+        console.log('QuizStore: Already initialized');
+        return;
+    }
+    initialized = true;
+
+    // Load local config immediately
+    state.questions = sessionConfig.Questions || [];
+    state.packTitle = sessionConfig.PackTitle || '';
+
+    // Connect MQTT
+    client = mqtt.connect(config.mqttBrokerUrl);
+
+    client.on('connect', () => {
+        console.log('QuizStore: MQTT Connected');
+        client.subscribe('game/quiz/control');
+        client.subscribe('/display/control');
+    });
+
+    client.on('message', (topic, message) => {
+        const msgStr = message.toString();
+        console.log('QuizStore: MQTT Message Received', topic, msgStr);
+        if (topic === 'game/quiz/control') {
+            try {
+                const payload = JSON.parse(msgStr);
+                handleRemoteCommand(payload);
+            } catch (e) {
+                console.error('QuizStore: JSON Parse Error', e);
+            }
+        } else if (topic === '/display/control') {
+            // Handle raw string commands from MqttButtons
+            if (msgStr === 'next') {
+                _nextQuestion(true);
+            } else if (msgStr === 'previous') {
+                _prevQuestion(true);
+            } else if (msgStr === 'play') {
+                // Start timer for picture questions
+                const currentQ = state.questions[state.currentQuestionIndex];
+                if (currentQ?.Type === 'picture') {
+                    const playTime = currentQ.Settings?.PlayTime;
+                    if (playTime && playTime > 0) {
+                        console.log('QuizStore: Starting timer for picture', playTime);
+                        actions.startTimer(playTime);
+                    }
+                }
+            } else if (msgStr === 'pause') {
+                stopTimer();
+            }
+        }
+    });
+}
+
+function handleRemoteCommand(cmd) {
+    if (cmd.action === 'next') {
+        _nextQuestion(false);
+    } else if (cmd.action === 'prev') {
+        _prevQuestion(false);
+    } else if (cmd.action === 'setIndex') {
+        state.currentQuestionIndex = cmd.index;
+    }
+}
+
+// Internal actions (boolean publish determines if we send MQTT)
+function _nextQuestion(publish = true) {
+    if (state.currentQuestionIndex < state.questions.length - 1) {
+        state.currentQuestionIndex++;
+        if (publish && client) {
+            client.publish('game/quiz/control', JSON.stringify({ action: 'setIndex', index: state.currentQuestionIndex }));
+        }
+    }
+}
+
+function _prevQuestion(publish = true) {
+    if (state.currentQuestionIndex > 0) {
+        state.currentQuestionIndex--;
+        if (publish && client) {
+            client.publish('game/quiz/control', JSON.stringify({ action: 'setIndex', index: state.currentQuestionIndex }));
+        }
+    }
+}
+
+// Public Actions
+const actions = {
+    init,
+    nextQuestion: () => _nextQuestion(true),
+    prevQuestion: () => _prevQuestion(true),
+    setQuestion: (index) => {
+        if (index >= 0 && index < state.questions.length) {
+            state.currentQuestionIndex = index;
+            if (client) {
+                client.publish('game/quiz/control', JSON.stringify({ action: 'setIndex', index: index }));
+            }
+        }
+    },
+    startTimer: (seconds) => {
+        stopTimer();
+        state.timer = seconds;
+        publishTimer();
+        timerInterval = setInterval(() => {
+            if (state.timer > 0) {
+                state.timer--;
+                publishTimer();
+            } else {
+                stopTimer();
+                // Auto-hide by publishing pause
+                if (client) {
+                    client.publish('/display/control', 'pause');
+                }
+            }
+        }, 1000);
+    },
+    stopTimer
+};
+
+function stopTimer() {
+    if (timerInterval) {
+        clearInterval(timerInterval);
+        timerInterval = null;
+    }
+    state.timer = 0;
+    publishTimer();
+}
+
+function publishTimer() {
+    if (client) {
+        client.publish('game/timer', JSON.stringify({ time: state.timer }));
+    }
+}
+
+// Getters
+const getters = {
+    currentQuestion: computed(() => state.questions[state.currentQuestionIndex]),
+    isFirstQuestion: computed(() => state.currentQuestionIndex === 0),
+    isLastQuestion: computed(() => state.currentQuestionIndex === state.questions.length - 1),
+    totalQuestions: computed(() => state.questions.length),
+    packTitle: computed(() => state.packTitle),
+    currentQuestionIndex: computed(() => state.currentQuestionIndex),
+    timer: computed(() => state.timer)
+};
+
+export default {
+    state,
+    actions,
+    getters
+};
--- a/VApp/src/views/GameControl.vue
+++ b/VApp/src/views/GameControl.vue
@@ -5,17 +5,17 @@
      <card-control /> 
    </v-col> 
    <v-col class="pl-3">   
-      <card-soundboard /> 
+      <CardButtonScore />  
    </v-col>
  </v-row>
 </v-container>
  <v-row no-gutters class="pr-4 pl-4"> 
    <v-row no-gutters>   
      <v-col class="align-start">     
-        <CardButtonScore />   
+        <card-solution />   
+         
      </v-col>   
      <v-col class="pl-3">     
-        <card-solution />   
      </v-col> 
    </v-row>
  </v-row>
@@ -26,9 +26,14 @@

 import CardSolution from '@/components/CardSolution.vue'
 import CardControl from '@/components/CardControl.vue'
-import CardSoundboard from '@/components/CardSoundboard.vue';
 import CardButtonScore from '@/components/CardButtonScore.vue'
 import BuzzerValidationDialog from '@/components/BuzzerValidationDialog.vue';
+import { onMounted } from 'vue';
+import quizStore from '@/store/quizStore';
+
+onMounted(() => {
+  quizStore.actions.init();
+});

 </script>

--- a/VApp/src/views/GameDisplay.vue
+++ b/VApp/src/views/GameDisplay.vue
@@ -1,47 +1,35 @@
 <template>
  <div class="main_div">
    <div>
-      <v-container class="score_div_main">
-        <v-container class="score_div color-blue">
+      <v-container class="score_div_main" :style="getMainShadow()">
+        <v-container class="score_div color-blue" :class="[getDimClass('Blue'), getFlashClass('Blue')]">
          <div class="d-flex flex-column align-center">
            <Transition name="score-fade" mode="out-in">
-              <span :key="scores.BlueRoundScore" class="v-label-round-score">Manche : {{ scores.BlueRoundScore }}</span>
-            </Transition>
-            <Transition name="score-fade" mode="out-in">
-              <span :key="scores.BlueTotalScore" class="v-label-score">{{ scores.BlueTotalScore }}</span>
+              <span :key="scores.BlueTotalScore" class="v-label-score">{{ scores.BlueRoundScore }}</span>
            </Transition>
          </div>
        </v-container>
-        <v-container class="score_div color-red">
+        <v-container class="score_div color-red" :class="[getDimClass('Red'), getFlashClass('Red')]">
          <div class="d-flex flex-column align-center">
            <Transition name="score-fade" mode="out-in">
-              <span :key="scores.RedRoundScore" class="v-label-round-score">Manche : {{ scores.RedRoundScore }}</span>
-            </Transition>
-            <Transition name="score-fade" mode="out-in">
-              <span :key="scores.RedTotalScore" class="v-label-score">{{ scores.RedTotalScore }}</span>
+              <span :key="scores.RedTotalScore" class="v-label-score">{{ scores.RedRoundScore }}</span>
            </Transition>
          </div>
        </v-container>
        <v-container class="score_div color-white d-flex align-center justify-center">
-          <span class="v-label-time">00:00</span>
+          <span class="v-label-time">{{ timerDisplay }}</span>
        </v-container>
-        <v-container class="score_div color-green">
+        <v-container class="score_div color-green" :class="[getDimClass('Green'), getFlashClass('Green')]">
          <div class="d-flex flex-column align-center">
            <Transition name="score-fade" mode="out-in">
-              <span :key="scores.GreenRoundScore" class="v-label-round-score">Manche : {{ scores.GreenRoundScore }}</span>
-            </Transition>
-            <Transition name="score-fade" mode="out-in">
-              <span :key="scores.GreenTotalScore" class="v-label-score">{{ scores.GreenTotalScore }}</span>
+              <span :key="scores.GreenTotalScore" class="v-label-score">{{ scores.GreenRoundScore }}</span>
            </Transition>
          </div>
        </v-container>
-        <v-container class="score_div color-yellow">
+        <v-container class="score_div color-yellow" :class="[getDimClass('Yellow'), getFlashClass('Yellow')]">
          <div class="d-flex flex-column align-center">
            <Transition name="score-fade" mode="out-in">
-              <span :key="scores.YellowRoundScore" class="v-label-round-score">Manche : {{ scores.YellowRoundScore }}</span>
-            </Transition>
-            <Transition name="score-fade" mode="out-in">
-              <span :key="scores.YellowTotalScore" class="v-label-score">{{ scores.YellowTotalScore }}</span>
+              <span :key="scores.YellowTotalScore" class="v-label-score">{{ scores.YellowRoundScore }}</span>
            </Transition>
          </div>
        </v-container>
@@ -50,21 +38,24 @@

    <div>
      <HidingOverlay/>
-      <VideoPlayer/>
+      <GameMedia/>
    </div>
  </div>
 </template>

 <script setup>
-  import VideoPlayer from "@/components/VideoPlayer.vue"
+  import GameMedia from "@/components/GameMedia.vue"
  import HidingOverlay from "@/components/HidingOverlay.vue"
  import { onMounted, reactive } from 'vue';
  import mqtt from 'mqtt'
  import config from '@/config.js'
+  import quizStore from '@/store/quizStore';

+  // Configuration MQTT
  const mqttBrokerUrl = config.mqttBrokerUrl
  const client = mqtt.connect(mqttBrokerUrl)

+  // Objet réactif pour stocker les scores des équipes
  const scores = reactive({
    RedTotalScore: 0,
    BlueTotalScore: 0,
@@ -76,6 +67,18 @@
    GreenRoundScore: 0,
  });

+  import { ref } from 'vue';
+  // Variable réactive pour l'affichage du timer
+  const timerDisplay = ref('00:00');
+
+  // Fonction pour formater le temps en mm:ss
+  function formatTime(seconds) {
+    const mins = Math.floor(seconds / 60);
+    const secs = seconds % 60;
+    return `${String(mins).padStart(2, '0')}:${String(secs).padStart(2, '0')}`;
+  }
+
+  // Fonction de gestion des messages MQTT reçus
  function handleMessage(topic, message) {
    let parsedMessage;
    try {
@@ -85,7 +88,8 @@
      return;
    }

-    if (parsedMessage.TEAM) {
+    // Mise à jour des scores si le message vient du topic 'game/score'
+    if (topic === 'game/score' && parsedMessage.TEAM) {
       scores.RedTotalScore = parsedMessage.TEAM.Red.TotalScore
       scores.BlueTotalScore = parsedMessage.TEAM.Blue.TotalScore
       scores.YellowTotalScore = parsedMessage.TEAM.Yellow.TotalScore
@@ -96,8 +100,14 @@
       scores.YellowRoundScore = parsedMessage.TEAM.Yellow.RoundScore
       scores.GreenRoundScore = parsedMessage.TEAM.Green.RoundScore
    }
+
+    // Mise à jour du timer si le message vient du topic 'game/timer'
+    if (topic === 'game/timer' && parsedMessage.time !== undefined) {
+       timerDisplay.value = formatTime(parsedMessage.time);
+    }
  }

+  // Fonction utilitaire pour s'abonner à un topic MQTT
  function subscribeToTopic(topic, callback) {
    client.subscribe(topic)
    client.on('message', (receivedTopic, message) => { callback(receivedTopic.toString(), message.toString())
@@ -105,10 +115,105 @@
  }

  onMounted(() => {
+    // Initialisation du store du quiz
+    quizStore.actions.init();
+    
+    // Abonnement aux topics MQTT pour les scores et le timer
    subscribeToTopic('game/score', (topic, message) => {
      handleMessage(topic, message);
    });
+    subscribeToTopic('game/timer', (topic, message) => {
+      handleMessage(topic, message);
+    });
+
+    // Demande de rafraîchissement des scores au chargement
+    // Cela permet de récupérer les scores actuels même après un rechargement de page
+    client.publish('game/score/request', '{}');
+
+    // Abonnement au statut des buzzers
+    subscribeToTopic('vulture/buzzer/status', (topic, message) => {
+        try {
+            const data = JSON.parse(message);
+            if (data.status === 'blocked') {
+                const color = data.color || '';
+                const team = identifyTeamByColor(color);
+                activeTeam.value = team;
+                
+                // Trigger flash effect
+                if (team) {
+                    flashingTeam.value = team;
+                    setTimeout(() => {
+                        if (flashingTeam.value === team) {
+                            flashingTeam.value = null;
+                        }
+                    }, 2000);
+                }
+
+                console.log(`Buzzer Blocked: Color=${color}, Identified Team=${activeTeam.value}`);
+            } else if (data.status === 'unblocked') {
+                activeTeam.value = null;
+                flashingTeam.value = null;
+                console.log('Buzzer Unblocked');
+            }
+        } catch (e) {
+            console.error('Error parsing buzzer status', e);
+        }
+    });
  });
+
+  const activeTeam = ref(null);
+  const flashingTeam = ref(null);
+
+  function identifyTeamByColor(hexColor) {
+      if (!hexColor) return null;
+      // Normalisation (retirer le # et mettre en majuscule)
+      const color = hexColor.replace('#', '').toUpperCase();
+      
+      // Liste des couleurs connues (Theme + Standard)
+      // RED
+      if (['FF0000', 'D42828'].includes(color)) return 'Red';
+      // BLUE
+      if (['0000FF', '2867D4'].includes(color)) return 'Blue';
+      // GREEN
+      if (['00FF00', '28D42E'].includes(color)) return 'Green';
+      // YELLOW
+      if (['FFFF00', 'D4D100'].includes(color)) return 'Yellow';
+
+      // Fallback: Détection approximative par composante dominante
+      const r = parseInt(color.substr(0, 2), 16);
+      const g = parseInt(color.substr(2, 2), 16);
+      const b = parseInt(color.substr(4, 2), 16);
+
+      if (r > 200 && g > 200 && b < 100) return 'Yellow';
+      if (g > r && g > b) return 'Green';
+      if (b > r && b > g) return 'Blue';
+      if (r > g && r > b) return 'Red';
+
+      return null;
+  }
+
+  function getDimClass(team) {
+      if (!activeTeam.value) return '';
+      return activeTeam.value !== team ? 'dimmed-score' : '';
+  }
+
+  function getFlashClass(team) {
+      return flashingTeam.value === team ? 'flashing-glow' : '';
+  }
+
+  function getMainShadow() {
+      if (!activeTeam.value) return {};
+      
+      let shadowColor = '';
+      switch (activeTeam.value) {
+          case 'Blue': shadowColor = 'rgb(40, 103, 212)'; break;
+          case 'Red': shadowColor = 'rgb(212, 40, 40)'; break;
+          case 'Green': shadowColor = 'rgb(40, 212, 46)'; break;
+          case 'Yellow': shadowColor = 'rgb(212, 209, 0)'; break;
+          default: return {};
+      }
+      return { boxShadow: `0px 3px 45px ${shadowColor}` };
+  }
 </script>

 <style scoped>
@@ -125,7 +230,7 @@
    background-color: rgb(40, 40, 40);
    padding: 25px 30px;
    border-radius: 0px 0px 30px 30px;
-    box-shadow: 0px 3px 45px rgb(45, 115, 166);
+    box-shadow: 0px 3px 45px rgb(141, 141, 141);
  }
  .score_div {
    height: 100px;
@@ -134,32 +239,37 @@
    display: flex;
    justify-content: center;
    align-items: center;
+    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
+    transition: transform 0.2s;
  }
  .color-blue {
-    background-color: rgb(var(--v-theme-BlueBuzzer), 1);
+    background: linear-gradient(135deg, rgb(var(--v-theme-BlueBuzzer)), #1a3a5a);
    border-radius: 40px 5px 40px 5px;
  }
  .color-red {
-    background-color: rgb(var(--v-theme-RedBuzzer), 1);
+    background: linear-gradient(135deg, rgb(var(--v-theme-RedBuzzer)), #5a1a1a);
    border-radius: 40px 5px 40px 5px;
  }
  .color-green {
-    background-color: rgb(var(--v-theme-GreenBuzzer), 1);
+    background: linear-gradient(135deg, rgb(var(--v-theme-GreenBuzzer)), #1a5a2a);
    border-radius: 5px 40px 5px 40px;
  }
  .color-yellow {
-    background-color: rgb(var(--v-theme-YellowBuzzer), 1);
+    background: linear-gradient(135deg, rgb(var(--v-theme-YellowBuzzer)), #5a5a1a);
    border-radius: 5px 40px 5px 40px;
  }
  .color-white {
-    background-color: white;
+    background-color: #1a1a1a;
+    border: 3px solid #333;
    border-radius: 40px;
+    box-shadow: 0 0 30px rgba(0,0,0,0.6);
  }
  .v-label-time {
    padding-top: 5px;
-    color: black;
+    color: white;
    font-size: 49px;
    font-family: 'Bahnschrift';
+    text-shadow: 0 0 15px rgba(255, 255, 255, 0.2);
  }
  .v-label-score {
    color: white;
@@ -167,6 +277,7 @@
    font-family: 'Bahnschrift';
    font-weight: bold;
    line-height: 1;
+    text-shadow: 4px 4px 8px rgba(0,0,0,0.4);
  }
  .v-label-round-score {
      color: rgba(255, 255, 255, 0.8);
@@ -174,6 +285,7 @@
      font-family: 'Bahnschrift';
      font-weight: 500;
      margin-bottom: 2px;
+      text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
  }
  
  /* Transition styles */
@@ -186,4 +298,22 @@
  .score-fade-leave-to {
    opacity: 0;
  }
+
+  .dimmed-score {
+      opacity: 0.3;
+      transform: scale(0.95);
+      filter: grayscale(100%);
+      transition: all 0.3s ease;
+  }
+
+  @keyframes flash-glow {
+      0%, 100% { box-shadow: 0 0 0 rgba(255, 255, 255, 0); }
+      10% { box-shadow: 0 0 20px 10px rgba(255, 255, 255, 0.9); }
+  }
+
+  .flashing-glow {
+      animation: flash-glow 0.5s ease-in-out infinite;
+      z-index: 10;
+      position: relative;
+  }
 </style>
--- a/VApp/src/views/ScoreDisplay.vue
+++ b/VApp/src/views/ScoreDisplay.vue
@@ -0,0 +1,425 @@
+<template>
+  <div class="score-grid">
+    <div class="score-cell cell-blue color-blue" :class="[getDimClass('Blue'), getFlashClass('Blue')]">
+      <div class="score-content">
+        <div class="score-info info-left">
+          <div class="team-name">Bleue</div>
+          <div class="sub-score-container sub-left">
+            <span class="sub-label">Total</span>
+            <span class="team-score sub-score">{{ scores.BlueTotalScore }}</span>
+          </div>
+        </div>
+        <div class="score-main">
+          <Transition name="score-pop" mode="out-in">
+            <div :key="scores.BlueRoundScore" class="team-score main-score">{{ scores.BlueRoundScore }}</div>
+          </Transition>
+        </div>
+      </div>
+    </div>
+    <div class="score-cell cell-red color-red" :class="[getDimClass('Red'), getFlashClass('Red')]">
+      <div class="score-content">
+        <div class="score-main">
+          <Transition name="score-pop" mode="out-in">
+            <div :key="scores.RedRoundScore" class="team-score main-score">{{ scores.RedRoundScore }}</div>
+          </Transition>
+        </div>
+        <div class="score-info info-right">
+          <div class="team-name">Rouge</div>
+          <div class="sub-score-container sub-right">
+            <span class="sub-label">Total</span>
+            <span class="team-score sub-score">{{ scores.RedTotalScore }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="score-cell cell-green color-green" :class="[getDimClass('Green'), getFlashClass('Green')]">
+      <div class="score-content">
+        <div class="score-info info-left">
+          <div class="team-name">Verte</div>
+          <div class="sub-score-container sub-left">
+            <span class="sub-label">Total</span>
+            <span class="team-score sub-score">{{ scores.GreenTotalScore }}</span>
+          </div>
+        </div>
+        <div class="score-main">
+          <Transition name="score-pop" mode="out-in">
+            <div :key="scores.GreenRoundScore" class="team-score main-score">{{ scores.GreenRoundScore }}</div>
+          </Transition>
+        </div>
+      </div>
+    </div>
+    <div class="score-cell cell-yellow color-yellow" :class="[getDimClass('Yellow'), getFlashClass('Yellow')]">
+      <div class="score-content">
+        <div class="score-main">
+          <Transition name="score-pop" mode="out-in">
+            <div :key="scores.YellowRoundScore" class="team-score main-score">{{ scores.YellowRoundScore }}</div>
+          </Transition>
+        </div>
+        <div class="score-info info-right">
+          <div class="team-name">Jaune</div>
+          <div class="sub-score-container sub-right">
+            <span class="sub-label">Total</span>
+            <span class="team-score sub-score">{{ scores.YellowTotalScore }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    
+    <div class="timer-container">
+      <div class="timer-display">{{ timerDisplay }}</div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  import { onMounted, onUnmounted, reactive, ref } from 'vue';
+  import mqtt from 'mqtt'
+  import config from '@/config.js'
+
+  const mqttBrokerUrl = config.mqttBrokerUrl
+  let client = null
+
+  const scores = reactive({
+    RedTotalScore: 0,
+    BlueTotalScore: 0,
+    YellowTotalScore: 0,
+    GreenTotalScore: 0,
+    RedRoundScore: 0,
+    BlueRoundScore: 0,
+    YellowRoundScore: 0,
+    GreenRoundScore: 0,
+  });
+
+  const timerDisplay = ref('00:00');
+
+  function formatTime(seconds) {
+    const mins = Math.floor(seconds / 60);
+    const secs = seconds % 60;
+    return `${String(mins).padStart(2, '0')}:${String(secs).padStart(2, '0')}`;
+  }
+
+  function handleMessage(topic, message) {
+    let parsedMessage;
+    try {
+      parsedMessage = JSON.parse(message);
+    } catch (e) {
+      console.error("Erreur d'analyse JSON:", e);
+      return;
+    }
+
+    if (topic === 'game/score' && parsedMessage.TEAM) {
+       scores.RedTotalScore = parsedMessage.TEAM.Red.TotalScore
+       scores.BlueTotalScore = parsedMessage.TEAM.Blue.TotalScore
+       scores.YellowTotalScore = parsedMessage.TEAM.Yellow.TotalScore
+       scores.GreenTotalScore = parsedMessage.TEAM.Green.TotalScore
+
+       scores.RedRoundScore = parsedMessage.TEAM.Red.RoundScore
+       scores.BlueRoundScore = parsedMessage.TEAM.Blue.RoundScore
+       scores.YellowRoundScore = parsedMessage.TEAM.Yellow.RoundScore
+       scores.GreenRoundScore = parsedMessage.TEAM.Green.RoundScore
+    }
+
+    if (topic === 'game/timer' && parsedMessage.time !== undefined) {
+       timerDisplay.value = formatTime(parsedMessage.time);
+    }
+  }
+
+  function subscribeToTopic(topic, callback) {
+    if(client) {
+        client.subscribe(topic)
+        client.on('message', (receivedTopic, message) => { callback(receivedTopic.toString(), message.toString())
+        })
+    }
+  }
+
+  onMounted(() => {
+    client = mqtt.connect(mqttBrokerUrl)
+    subscribeToTopic('game/score', (topic, message) => {
+      handleMessage(topic, message);
+    });
+    subscribeToTopic('game/timer', (topic, message) => {
+      handleMessage(topic, message);
+    });
+    // Request score refresh
+    client.publish('game/score/request', '{}');
+
+    subscribeToTopic('vulture/buzzer/status', (topic, message) => {
+        try {
+            const data = JSON.parse(message);
+            if (data.status === 'blocked') {
+                const color = data.color || '';
+                const team = identifyTeamByColor(color);
+                activeTeam.value = team;
+
+                // Trigger flash effect
+                if (team) {
+                    flashingTeam.value = team;
+                    setTimeout(() => {
+                        if (flashingTeam.value === team) {
+                            flashingTeam.value = null;
+                        }
+                    }, 2000);
+                }
+            } else if (data.status === 'unblocked') {
+                activeTeam.value = null;
+                flashingTeam.value = null;
+            }
+        } catch (e) {
+            console.error('Error parsing buzzer status', e);
+        }
+    });
+  });
+
+  const activeTeam = ref(null);
+  const flashingTeam = ref(null);
+
+  function identifyTeamByColor(hexColor) {
+      if (!hexColor) return null;
+      const color = hexColor.replace('#', '').toUpperCase();
+      
+      // RED
+      if (['FF0000', 'D42828'].includes(color)) return 'Red';
+      // BLUE
+      if (['0000FF', '2867D4'].includes(color)) return 'Blue';
+      // GREEN
+      if (['00FF00', '28D42E'].includes(color)) return 'Green';
+      // YELLOW
+      if (['FFFF00', 'D4D100'].includes(color)) return 'Yellow';
+
+      // Fallback
+      const r = parseInt(color.substr(0, 2), 16);
+      const g = parseInt(color.substr(2, 2), 16);
+      const b = parseInt(color.substr(4, 2), 16);
+
+      if (r > 200 && g > 200 && b < 100) return 'Yellow';
+      if (g > r && g > b) return 'Green';
+      if (b > r && b > g) return 'Blue';
+      if (r > g && r > b) return 'Red';
+
+      return null;
+  }
+
+  function getDimClass(team) {
+      if (!activeTeam.value) return '';
+      return activeTeam.value !== team ? 'dimmed-score' : '';
+  }
+
+  function getFlashClass(team) {
+      return flashingTeam.value === team ? 'flashing-glow' : '';
+  }
+
+  onUnmounted(() => {
+    if (client) {
+      client.end()
+    }
+  })
+</script>
+
+<style scoped>
+  .score-grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    grid-template-rows: 1fr 1fr;
+    width: 100vw;
+    height: 100vh;
+    padding: 40px;
+    gap: 60px;
+    position: relative;
+    font-family: 'Bahnschrift', sans-serif;
+  }
+
+  .score-cell {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
+    transition: transform 0.2s;
+    overflow: hidden;
+  }
+  .cell-blue {
+    border-radius: 65px 225px 75px 225px !important;
+  }
+  .cell-red {
+    border-radius: 225px 65px 225px 75px !important;
+  }
+  .cell-green {
+    border-radius: 225px 65px 225px 75px !important;
+  } 
+  .cell-yellow {
+    border-radius: 75px 225px 65px 225px !important;
+  }
+
+  .score-content {
+    display: flex;
+    flex-direction: row; /* Horizontal layout */
+    align-items: center;
+    justify-content: space-around; /* Spread out */
+    width: 100%;
+    padding: 0 40px;
+  }
+
+  .score-main {
+    flex: 2; /* Takes more space */
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .score-info {
+    flex: 1; /* Takes less space */
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+  }
+
+  .info-right {
+    align-items: flex-end;
+    text-align: right;
+  }
+
+  .info-left {
+    align-items: flex-start;
+    text-align: left;
+  }
+
+  .team-name {
+    font-size: 2.2rem;
+    font-weight: 900;
+    letter-spacing: 2px;
+    opacity: 0.9;
+    color: rgba(255, 255, 255, 0.95);
+    text-transform: uppercase;
+    margin-bottom: 15px;
+    text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
+  }
+
+  .team-score {
+    font-weight: bold;
+    color: white;
+    line-height: 1;
+    text-shadow: 4px 4px 8px rgba(0,0,0,0.4);
+  }
+
+  .main-score {
+    font-size: 10rem; /* Even larger */
+    margin: 0;
+  }
+
+  .sub-score-container {
+    background-color: rgba(0, 0, 0, 0.2);
+    padding: 10px 20px;
+    border-radius: 20px;
+    display: flex;
+    flex-direction: column;
+    min-width: 120px;
+  }
+
+  .sub-right {
+    align-items: flex-end;
+  }
+
+  .sub-left {
+    align-items: flex-start;
+  }
+
+  .sub-label {
+    font-size: 1rem;
+    text-transform: uppercase;
+    opacity: 0.8;
+    color: rgba(255, 255, 255, 0.9);
+    margin-bottom: 2px;
+    font-weight: 600;
+  }
+
+  .sub-score {
+    font-size: 2.5rem;
+  }
+
+  .timer-container {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    z-index: 10;
+    background-color: #1a1a1a;
+    padding: 20px 40px;
+    border-radius: 80px;
+    border: 6px solid #333;
+    box-shadow: 0 0 50px rgba(0,0,0,0.8);
+  }
+
+  .timer-display {
+    font-size: 8rem;
+    font-weight: bold;
+    color: white;
+    font-family: monospace;
+    text-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
+  }
+
+  .color-blue {
+    background: linear-gradient(135deg, rgb(var(--v-theme-BlueBuzzer)), #1a3a5a);
+  }
+
+  .color-red {
+    background: linear-gradient(135deg, rgb(var(--v-theme-RedBuzzer)), #5a1a1a);
+  }
+
+  .color-green {
+    background: linear-gradient(135deg, rgb(var(--v-theme-GreenBuzzer)), #1a5a2a);
+  }
+
+  .color-yellow {
+    background: linear-gradient(135deg, rgb(var(--v-theme-YellowBuzzer)), #5a5a1a);
+  }
+
+  /* Score Pop Animation */
+  .score-pop-enter-active {
+    animation: pop-in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+  }
+  .score-pop-leave-active {
+    animation: pop-out 0.2s ease-in;
+  }
+
+  @keyframes pop-in {
+    0% {
+      transform: scale(0.5);
+      opacity: 0;
+    }
+    100% {
+      transform: scale(1);
+      opacity: 1;
+    }
+  }
+
+  @keyframes pop-out {
+    0% {
+      transform: scale(1);
+      opacity: 1;
+    }
+    100% {
+      transform: scale(1.5);
+      opacity: 0;
+    }
+  }
+
+  .dimmed-score {
+      opacity: 0.3;
+      transform: scale(0.95);
+      filter: grayscale(100%);
+      transition: all 0.3s ease;
+  }
+
+  @keyframes flash-glow {
+      0%, 100% { box-shadow: 0 0 0 rgba(255, 255, 255, 0); }
+      10% { box-shadow: 0 0 60px 20px rgba(255, 255, 255, 0.9); }
+  }
+
+  .flashing-glow {
+      animation: flash-glow 0.5s ease-in-out infinite;
+      z-index: 10;
+      position: relative;
+  }
+
+</style>
--- a/VApp/src/views/SessionEditor.vue
+++ b/VApp/src/views/SessionEditor.vue
@@ -0,0 +1,314 @@
+<template>
+  <v-container>
+    <SessionSelector
+        v-model="selectedSessionId"
+        :sessions="availableSessions"
+        :saving="saving"
+        @update:model-value="loadSession"
+        @create="openCreateDialog"
+        @delete="deleteDialogVisible = true"
+        @save="saveSession"
+    />
+
+    <div v-if="!selectedSessionId" class="text-center mt-10 text-h5 grey--text">
+        Veuillez sélectionner une session pour commencer.
+    </div>
+
+    <div v-else>
+        <SessionDetails 
+            :config="sessionConfig"
+            :session-id="selectedSessionId"
+            :api-url="API_URL"
+            :success="success"
+            :error="error"
+            @delete-media="deleteMediaFile"
+            @rename-media="renameMediaFile"
+        />
+    </div>
+
+    <!-- Dialog Création de session -->
+    <v-dialog v-model="createDialogVisible" persistent max-width="500px">
+        <v-card rounded="xl">
+            <v-card-title class="text-h5">Nouvelle Session</v-card-title>
+            <v-card-text>
+                <v-text-field 
+                    v-model="newSessionName" 
+                    label="Nom de la session" 
+                    variant="outlined" 
+                    autofocus
+                    @keyup.enter="createSession"
+                ></v-text-field>
+            </v-card-text>
+            <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn color="grey" variant="text" @click="createDialogVisible = false">Annuler</v-btn>
+                <v-btn color="green" variant="elevated" @click="createSession" :disabled="!newSessionName">Créer</v-btn>
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
+
+    <!-- Dialog Suppression de session -->
+    <v-dialog v-model="deleteDialogVisible" max-width="400px">
+        <v-card rounded="xl">
+            <v-card-title class="text-h5 delete-dialog-title-style">Supprimer la session ?</v-card-title>
+            <v-card-text>
+                Cette action est irréversible !  Tous les fichiers de cette session seront supprimés.
+            </v-card-text>
+            <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn rounded="xl" class="mb-3" color="grey" variant="text" @click="deleteDialogVisible = false">Annuler</v-btn>
+                <v-btn rounded="xl" class="mb-3 mr-3" color="red" variant="elevated" @click="confirmDeleteSession">Supprimer</v-btn>
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
+  </v-container>
+</template>
+
+<script setup>
+import SessionSelector from '@/components/SessionSelector.vue';
+import SessionDetails from '@/components/SessionDetails.vue';
+import { ref, reactive, onMounted, onUnmounted } from 'vue';
+import mqtt from 'mqtt';
+import config from '@/config.js';
+
+// --- État de l'Application ---
+
+// Liste des sessions disponibles récupérées via MQTT
+const availableSessions = ref([]);
+
+// ID de la session actuellement sélectionnée
+const selectedSessionId = ref(null);
+
+// Configuration de la session active (Lié au formulaire)
+const sessionConfig = reactive({
+  PackId: '',
+  PackTitle: '',
+  Questions: []
+});
+
+// --- Gestion des Dialogues et États de Chargement ---
+
+// Création de session
+const createDialogVisible = ref(false);
+const newSessionName = ref('');
+
+// Suppression de session
+const deleteDialogVisible = ref(false);
+
+// États UI
+const saving = ref(false);
+const error = ref('');
+const success = ref('');
+
+// --- Configuration MQTT & API ---
+
+const mqttBrokerUrl = config.mqttBrokerUrl;
+
+// URL API (Backend Express) définie dans config.js
+const API_URL = config.apiUrl;
+
+let client = null;
+
+// Topics MQTT utilisés pour la communication avec le backend
+const topics = config.topics;
+
+// --- Cycle de Vie du Composant ---
+
+onMounted(() => {
+    // Connexion au broker MQTT
+    client = mqtt.connect(mqttBrokerUrl);
+
+    client.on('connect', () => {
+        console.log('SessionEditor: Connecté à MQTT');
+        client.subscribe(topics.responseList);
+        client.subscribe(topics.getConfig);
+        
+        // Demande initiale de la liste des sessions
+        client.publish(topics.requestList, '{}');
+    });
+
+    client.on('message', (topic, message) => {
+        if (topic === topics.responseList) {
+            try {
+                // Mise à jour de la liste des sessions
+                availableSessions.value = JSON.parse(message.toString());
+                console.log("Sessions reçues:", availableSessions.value);
+            } catch (e) { console.error(e); }
+        }
+        else if (topic === topics.getConfig) {
+            try {
+                // Chargement de la configuration de la session reçue
+                const data = JSON.parse(message.toString());
+                
+                // Réinitialisation et peuplement de sessionConfig
+                sessionConfig.Questions = [];
+                
+                // Ajout d'une clé UI unique pour chaque question (pour les animations de liste)
+                if (Array.isArray(data.Questions)) {
+                    data.Questions.forEach(q => {
+                        if (!q._ui_key) {
+                            Object.defineProperty(q, '_ui_key', {
+                                value: `q-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
+                                writable: true,
+                                enumerable: false,
+                                configurable: true
+                            });
+                        }
+                    });
+                }
+                
+                // Fusion des données reçues dans l'objet réactif
+                Object.assign(sessionConfig, data);
+                console.log('Configuration de session chargée');
+            } catch (e) {
+                console.error('Erreur parsing config session', e);
+                error.value = "Erreur lors du chargement de la configuration.";
+            }
+        }
+    });
+});
+
+onUnmounted(() => {
+    if (client) client.end();
+});
+
+// --- Méthodes Métier ---
+
+// Charge la configuration de la session sélectionnée
+function loadSession() {
+    if (!selectedSessionId.value) return;
+    console.log("Chargement session:", selectedSessionId.value);
+    client.publish(topics.requestConfig, JSON.stringify({ SessionId: selectedSessionId.value }));
+}
+
+// Envoie une requête pour supprimer un fichier média spécifique
+function deleteMediaFile(mediaPath) {
+    try {
+        const payload = JSON.stringify({
+            SessionId: selectedSessionId.value,
+            MediaPath: mediaPath
+        });
+        client.publish(topics.deleteMedia, payload);
+        console.log("Requête suppression média envoyée:", payload);
+    } catch (e) {
+        console.error("Erreur suppression média", e);
+    }
+}
+
+// Envoie une requête pour renommer un fichier média
+function renameMediaFile({ oldPath, newName }) {
+    try {
+        const payload = JSON.stringify({
+            SessionId: selectedSessionId.value,
+            OldPath: oldPath,
+            NewName: newName
+        });
+        client.publish(topics.renameMedia, payload);
+        console.log("Requête renommage média envoyée:", payload);
+    } catch (e) {
+        console.error("Erreur renommage média", e);
+    }
+}
+
+// Ouvre le dialogue de création
+function openCreateDialog() {
+    newSessionName.value = '';
+    createDialogVisible.value = true;
+}
+
+// Crée une nouvelle session via MQTT
+function createSession() {
+    if (!newSessionName.value) return;
+    
+    console.log("Création session:", newSessionName.value);
+    
+    try {
+        const payload = JSON.stringify({ SessionName: newSessionName.value });
+        client.publish(topics.createSession, payload);
+        
+        success.value = "Demande de création envoyée...";
+        setTimeout(() => success.value = '', 3000);
+        
+        createDialogVisible.value = false;
+    } catch (e) {
+        console.error("Erreur création session", e);
+        error.value = "Erreur lors de la création.";
+    }
+}
+
+// Supprime la session actuellement sélectionnée
+function confirmDeleteSession() {
+    if (!selectedSessionId.value) return;
+    
+    console.log("Suppression session:", selectedSessionId.value);
+    
+    try {
+        const payload = JSON.stringify({ SessionId: selectedSessionId.value });
+        client.publish(topics.deleteSession, payload);
+        
+        success.value = "Demande de suppression envoyée...";
+        setTimeout(() => success.value = '', 3000);
+        
+        deleteDialogVisible.value = false;
+        selectedSessionId.value = null;
+        sessionConfig.Questions = [];
+        sessionConfig.PackId = '';
+        sessionConfig.PackTitle = '';
+    } catch (e) {
+        console.error("Erreur suppression session", e);
+        error.value = "Erreur lors de la suppression.";
+    }
+}
+
+// Sauvegarde la configuration actuelle via MQTT
+function saveSession() {
+    if (!selectedSessionId.value) return;
+    saving.value = true;
+    success.value = '';
+    error.value = '';
+    
+    try {
+        const payload = JSON.stringify({
+            SessionId: selectedSessionId.value,
+            Config: JSON.parse(JSON.stringify(sessionConfig, (key, value) => {
+                // Filter out keys starting with underscore (internal UI state)
+                if (key.startsWith('_')) return undefined;
+                // Filter out cache busting querystring
+                if (key === 'MediaUrl' && typeof value === 'string') {
+                    return value.split('?')[0];
+                }
+                return value;
+            }))
+        });
+        client.publish(topics.updateConfig, payload);
+        success.value = "Sauvegarde envoyée."; 
+        setTimeout(() => success.value = '', 3000);
+    } catch (e) {
+        error.value = "Erreur lors de la sauvegarde : " + e.message;
+    } finally {
+        saving.value = false;
+    }
+}
+</script>
+
+<style scoped>
+    .gap-1 {
+        gap: 4px;
+    }
+    .gap-2 {
+        gap: 8px;
+    }
+    .delete-dialog-title-style {
+        color: rgb(var(--v-theme-primary)) !important; 
+        padding-left: 6%;
+        padding-top: 3%;
+    }
+    .text-title-style {
+        color: rgb(var(--v-theme-primary), 1) !important; 
+        opacity: 1;
+        font-size: 20px;
+        font-weight: bold;
+    }
+
+
+</style>
--- a/VContainers/README.md
+++ b/VContainers/README.md
@@ -3,94 +3,100 @@
 Construction et lancements des containers.
 Toutes les commandes sont à taper depuis la racine du dépôt.

+## Upgrade :
+
+```bash
+git pull
+podmane-compose build
+systemctl --user restart vulture-stack.service
+pkill -u vulture cage
+```
+
 ## Build

 ```bash
-./VContainers/build.sh
-```
-
-Ou manuellement :
-```bash
-podman build . -f ./VContainers/VNode/Containerfile -t vnode
-podman build . -f ./VContainers/VApp/Containerfile -t vapp
+podman-compose build
 ```

 ## Run

-### Mode Manuel avec Scripts
-
-**Développement (localhost):**
-```bash
-./VContainers/run_dev.sh
-```
-
-**Production (IP 192.168.73.252):**
-```bash
-./VContainers/run_prod.sh
-```
-
-Les containers sont lancés sur le réseau bridge `vulture-net` :
- **nanomq** : Broker MQTT (ports 1883, 9001, 8081, 8083, 8883)
- **vnode** : Services Node.js backend
- **vapp** : Frontend Vue.js (port 8080)
+`podman-compose up -d`

 ## Stop

-```bash
-./VContainers/stop.sh
-```
+`podman-compose down`

-Ou manuellement :
-```bash
-podman stop vapp vnode nanomq
-podman network rm vulture-net
-```
+## Installation

-## Lancement automatique avec Quadlet
+### Automatisation au boot (User Mode)

-Copier les fichiers du répertoire `quadlet` vers `~/.config/containers/systemd/`
+#### Étape A : Activer la persistance de l'utilisateur
+
+Par défaut, Fedora tue les processus utilisateurs à la déconnexion. On active le "lingering" pour que vos containers tournent dès le boot :

 ```bash
-cp ./VContainers/quadlet/*.network ~/.config/containers/systemd/
-cp ./VContainers/quadlet/*.container ~/.config/containers/systemd/
+sudo loginctl enable-linger $USER
+```
+#### Étape B : Créer l'unité Systemd
+
+Créez le dossier pour les services utilisateurs : `mkdir -p ~/.config/systemd/user/`
+
+Créez le fichier ~/.config/systemd/user/vulture-stack.service :
+```TOML
+[Unit]
+Description=Vulture Project Stack (Podman Compose)
+After=network-online.target
+
+[Service]
+Type=simple
+WorkingDirectory=%h/Vulture
+# Lancement au boot
+ExecStart=/usr/bin/podman-compose up
+# Arrêt propre
+ExecStop=/usr/bin/podman-compose down
+Restart=always
+
+[Install]
+WantedBy=default.target
 ```

-**Pour l'environnement de développement :**
+#### Étape C : Activer le service
+
 ```bash
 systemctl --user daemon-reload
-systemctl --user enable --now nanomq.service
-systemctl --user enable --now vnode.service
-systemctl --user enable --now vapp_dev.service
+systemctl --user enable vulture-stack.service
+systemctl --user start vulture-stack.service
 ```

-**Pour l'environnement de production :**
+## Surveillance des Containers (Backend)
+
+Puisque la stack tourne en mode utilisateur via Systemd, les commandes standard doivent être préfixées par `--user`.
+
+* **Vérifier l'état de la stack :**
 ```bash
-systemctl --user daemon-reload
-systemctl --user enable --now nanomq.service
-systemctl --user enable --now vnode.service
-systemctl --user enable --now vapp_prod.service
+systemctl --user status vulture-stack.service
+
 ```

-**Vérifier le statut :**
+
+* **Consulter les logs en temps réel (équivalent `tail -f`) :**
 ```bash
-systemctl --user status nanomq.service vnode.service vapp_dev.service
+journalctl --user -u vulture-stack.service -f
+
 ```

-**Arrêter les services :**
+
+* **Redémarrer proprement toute la stack :**
 ```bash
-systemctl --user stop vapp_dev.service vnode.service nanomq.service
-systemctl --user disable vapp_dev.service vnode.service nanomq.service
+systemctl --user restart vulture-stack.service
+
 ```

-## Configuration

-Les fichiers de configuration se trouvent dans `VContainers/VApp/config/` :
- `config_dev.js` : Configuration développement (MQTT sur localhost)
- `config_prod.js` : Configuration production (MQTT sur 192.168.73.252)
-
-Vous pouvez modifier ces fichiers selon vos besoins. En mode manuel, redémarrez les containers. Avec Quadlet, redémarrez le service correspondant :
+* **Lister les containers actifs :**
 ```bash
-systemctl --user restart vapp_dev.service
+podman ps
+
 ```

 ## Tip
--- a/VContainers/quadlet/nanomq.container
+++ b/VContainers/quadlet/nanomq.container
@@ -1,19 +0,0 @@
-[Unit]
-Description=Broker MQTT NanoMQ
-Wants=network-online.target
-After=network-online.target
-
-[Container]
-Image=docker.io/emqx/nanomq:latest
-ContainerName=nanomq
-Network=vulture-net.network
-PublishPort=1883:1883
-PublishPort=9001:9001
-PublishPort=8081:8081
-PublishPort=8083:8083
-PublishPort=8883:8883
-Volume=%h/Src/Fablab/Vulture/VContainers/MQTT/config/nanomq.conf:/etc/nanomq.conf:Z
-Exec=--conf /etc/nanomq.conf
-
-[Install]
-WantedBy=default.target
--- a/VContainers/quadlet/vapp.container
+++ b/VContainers/quadlet/vapp.container
@@ -1,12 +0,0 @@
-[Unit]
-Description=Application Node.js VApp
-Requires=vulture.pod
-After=vulture.pod
-
-[Container]
-Image=localhost/vapp:latest
-ContainerName=vapp
-Pod=vulture
-
-[Install]
-WantedBy=vulture.pod
--- a/VContainers/quadlet/vapp_dev.container
+++ b/VContainers/quadlet/vapp_dev.container
@@ -1,16 +0,0 @@
-[Unit]
-Description=Application Vue.js VApp (DEV)
-Wants=network-online.target
-After=network-online.target
-Requires=nanomq.service
-After=nanomq.service
-
-[Container]
-Image=localhost/vapp:latest
-ContainerName=vapp
-Network=vulture-net.network
-PublishPort=8080:80
-Volume=%h/Src/Fablab/Vulture/VContainers/VApp/config/config_dev.js:/usr/share/nginx/html/config.js:Z
-
-[Install]
-WantedBy=default.target
--- a/VContainers/quadlet/vapp_prod.container
+++ b/VContainers/quadlet/vapp_prod.container
@@ -1,16 +0,0 @@
-[Unit]
-Description=Application Vue.js VApp (PROD)
-Wants=network-online.target
-After=network-online.target
-Requires=nanomq.service
-After=nanomq.service
-
-[Container]
-Image=localhost/vapp:latest
-ContainerName=vapp
-Network=vulture-net.network
-PublishPort=8080:80
-Volume=%h/Src/Fablab/Vulture/VContainers/VApp/config/config_prod.js:/usr/share/nginx/html/config.js:Z
-
-[Install]
-WantedBy=default.target
--- a/VContainers/quadlet/vnode.container
+++ b/VContainers/quadlet/vnode.container
@@ -1,14 +0,0 @@
-[Unit]
-Description=Application Node.js VNode
-Wants=network-online.target
-After=network-online.target
-Requires=nanomq.service
-After=nanomq.service
-
-[Container]
-Image=localhost/vnode:latest
-ContainerName=vnode
-Network=vulture-net.network
-
-[Install]
-WantedBy=default.target
--- a/VContainers/quadlet/vulture-net.network
+++ b/VContainers/quadlet/vulture-net.network
@@ -1,6 +0,0 @@
-[Unit]
-Description=Reseau Bridge pour Vulture
-
-[Network]
-NetworkName=vulture-net
-Driver=bridge
--- a/VContainers/quadlet/vulture.pod
+++ b/VContainers/quadlet/vulture.pod
@@ -1,14 +0,0 @@
-[Unit]
-Description=Pod Vulture pour le Broker MQTT et les Applications Node
-Wants=network-online.target
-After=network-online.target
-
-[Pod]
-# Mappings de ports : Host:Container (ces ports sont partagés par tous les conteneurs)
-PublishPort=8080:80
-PublishPort=1883:1883
-PublishPort=8083:8083
-PublishPort=8883:8883
-
-[Install]
-WantedBy=default.target
--- a/VContainers/run_dev.sh
+++ b/VContainers/run_dev.sh
@@ -1,33 +0,0 @@
-#!/bin/bash
-set -e
-
-# Move to repository root
-cd "$(dirname "$0")/.."
-
-NETWORK_NAME="vulture-net"
-
-echo "Creating network $NETWORK_NAME..."
-if podman network exists $NETWORK_NAME; then
-    echo "Network $NETWORK_NAME already exists."
-else
-    podman network create $NETWORK_NAME
-fi
-
-echo "Starting NanoMQ..."
-# NanoMQ needs to expose ports for external access (e.g. VApp frontend) and be on the network for VNode
-podman run -dt --rm --network $NETWORK_NAME --name nanomq \
-    -p 1883:1883 -p 9001:9001 -p 8081:8081 -p 8083:8083 -p 8883:8883 \
-    -v ./VContainers/MQTT/config/nanomq.conf:/etc/nanomq.conf:Z \
-    docker.io/emqx/nanomq:latest --conf /etc/nanomq.conf
-
-echo "Starting VNode..."
-# VNode connects to nanomq via the network, no ports needed on host unless for debugging
-podman run -dt --rm --network $NETWORK_NAME --name vnode vnode:latest
-
-echo "Starting VApp (DEV CONFIG)..."
-# VApp (nginx) needs port 5173 exposed
-podman run -dt --rm --network $NETWORK_NAME --name vapp -p 5173:5173 \
-    -v ./VContainers/VApp/config/config_dev.js:/usr/share/nginx/html/config.js:Z \
-    vapp:latest
-
-echo "All containers started on network $NETWORK_NAME with DEV configuration."
--- a/VContainers/run_prod.sh
+++ b/VContainers/run_prod.sh
@@ -1,33 +0,0 @@
-#!/bin/bash
-set -e
-
-# Move to repository root
-cd "$(dirname "$0")/.."
-
-NETWORK_NAME="vulture-net"
-
-echo "Creating network $NETWORK_NAME..."
-if podman network exists $NETWORK_NAME; then
-    echo "Network $NETWORK_NAME already exists."
-else
-    podman network create $NETWORK_NAME
-fi
-
-echo "Starting NanoMQ..."
-# NanoMQ needs to expose ports for external access (e.g. VApp frontend) and be on the network for VNode
-podman run -dt --rm --network $NETWORK_NAME --name nanomq \
-    -p 1883:1883 -p 9001:9001 -p 8081:8081 -p 8083:8083 -p 8883:8883 \
-    -v ./VContainers/MQTT/config/nanomq.conf:/etc/nanomq.conf:Z \
-    docker.io/emqx/nanomq:latest --conf /etc/nanomq.conf
-
-echo "Starting VNode..."
-# VNode connects to nanomq via the network, no ports needed on host unless for debugging
-podman run -dt --rm --network $NETWORK_NAME --name vnode vnode:latest
-
-echo "Starting VApp (PROD CONFIG)..."
-# VApp (nginx) needs port 5173 exposed
-podman run -dt --rm --network $NETWORK_NAME --name vapp -p 5173:5173 \
-    -v ./VContainers/VApp/config/config_prod.js:/usr/share/nginx/html/config.js:Z \
-    vapp:latest
-
-echo "All containers started on network $NETWORK_NAME with PROD configuration."
--- a/VContainers/stop.sh
+++ b/VContainers/stop.sh
@@ -1,11 +0,0 @@
-#!/bin/bash
-
-echo "Stopping containers..."
-podman stop vapp || echo "vapp not running"
-podman stop vnode || echo "vnode not running"
-podman stop nanomq || echo "nanomq not running"
-
-echo "Removing network..."
-podman network rm vulture-net || echo "Network vulture-net not found"
-
-echo "Cleanup complete."
--- a/VContainers/upgrade.sh
+++ b/VContainers/upgrade.sh
@@ -0,0 +1,9 @@
+#!/bin/bash
+set -e
+
+# Move to repository root
+cd "$(dirname "$0")/.."
+
+git pull
+./VContainers/build.sh
+systemctl --user restart vulture-stack
--- a/VHard/vulturesrv/affichage_score_kiosque.md
+++ b/VHard/vulturesrv/affichage_score_kiosque.md
@@ -20,39 +20,11 @@ Coller le contenu suivant :
 ```ini
 [Service]
 ExecStart=
-ExecStart=-/sbin/agetty --autologin VOTRE_USER --noclear %I $TERM
+ExecStart=-/sbin/agetty --autologin vulture --noclear %I $TERM

 ```

-## 3. Script de lancement et Watchdog
-
-Créer un script nommé `kiosk-waiter.sh` dans votre dossier personnel pour relancer Chrome s'il crash :
-
-```bash
-#!/bin/bash
-# kiosk-waiter.sh
-
-URL="https://votre-url-quizz.com"
-
-while true; do
-  cage -- google-chrome-stable \
-    --kiosk \
-    --no-first-run \
-    --password-store=basic \
-    --ozone-platform=wayland \
-    --autoplay-policy=no-user-gesture-required \
-    --disable-component-update \
-    "$URL"
-
-  echo "Chrome s'est arrêté. Relancement dans 2 secondes..."
-  sleep 2
-done
-
-```
-
-*N'oubliez pas : `chmod +x ~/kiosk-waiter.sh*`
-
-## 4. Configuration Zsh (`~/.zlogin`)
+## 3. Configuration Zsh (`~/.zlogin`)

 Ajouter ces lignes à la fin de votre fichier `~/.zlogin` pour déclencher l'affichage uniquement sur le port HDMI physique (TTY1) :

@@ -65,12 +37,12 @@ if [[ -z "$DISPLAY" && "$XDG_VTNR" -eq 1 ]]; then
  export XDG_SESSION_TYPE=wayland

  # Lancement du script de monitoring
-  exec ~/kiosk-waiter.sh
+  exec ~/Vulture/VHard/vulturesrv/kiosk-waiter.sh
 fi

 ```

-## 5. Debug et Commandes utiles
+## 4. Debug et Commandes utiles

 * **Relancer le navigateur à distance (SSH) :**
 `pkill -u $USER cage` (Le script de boucle le relancera instantanément).
--- a/VHard/vulturesrv/kiosk-waiter.sh
+++ b/VHard/vulturesrv/kiosk-waiter.sh
@@ -0,0 +1,36 @@
+#!/bin/bash
+# kiosk-waiter.sh
+
+URL="http://localhost:5173/" # URL locale de vapp
+SERVICE_NAME="vulture-stack.service"
+
+echo "Attente du démarrage de la stack Vulture..."
+
+# 1. Attente que le service Systemd soit considéré comme actif
+while [[ $(systemctl --user is-active $SERVICE_NAME) != "active" ]]; do
+    sleep 1
+done
+
+# 2. Attente que le serveur HTTP réponde (Healthy)
+# On boucle tant que le code de retour HTTP n'est pas 200
+until $(curl --output /dev/null --silent --head --fail $URL); do
+    echo "Le quizz n'est pas encore prêt... attente (2s)"
+    sleep 2
+done
+
+echo "Stack Vulture détectée et saine. Lancement du kiosque."
+
+# 3. Boucle de lancement de Chrome
+while true; do
+  cage -- google-chrome-stable \
+    --kiosk \
+    --no-first-run \
+    --password-store=basic \
+    --ozone-platform=wayland \
+    --autoplay-policy=no-user-gesture-required \
+    --disable-component-update \
+    "$URL"
+
+  echo "Chrome s'est arrêté. Relancement dans 2 secondes..."
+  sleep 2
+done
--- a/VNode/package-lock.json
+++ b/VNode/package-lock.json
--- a/VNode/package.json
+++ b/VNode/package.json
@@ -1,6 +1,9 @@
 {
  "dependencies": {
-    "mqtt": "^5.10.1",
+    "cors": "^2.8.6",
+    "express": "^5.2.1",
+    "mqtt": "^5.14.1",
+    "multer": "^2.0.2",
    "ping": "^0.4.4",
    "ws": "^8.18.0"
  }
--- a/VNode/quizz/Quizz-1/festival/MysteryLand.jpg
+++ b/VNode/quizz/Quizz-1/festival/MysteryLand.jpg
--- a/VNode/quizz/Quizz-1/geography-history/Q-1.jpeg
+++ b/VNode/quizz/Quizz-1/geography-history/Q-1.jpeg
--- a/VNode/quizz/Quizz-1/geography-history/Q-2.jpeg
+++ b/VNode/quizz/Quizz-1/geography-history/Q-2.jpeg
--- a/VNode/quizz/Quizz-1/geography-history/Q-3.jpeg
+++ b/VNode/quizz/Quizz-1/geography-history/Q-3.jpeg
--- a/VNode/quizz/Quizz-1/geography-history/Q-4.jpeg
+++ b/VNode/quizz/Quizz-1/geography-history/Q-4.jpeg
--- a/VNode/quizz/Quizz-1/geography-history/Q-5.jpeg
+++ b/VNode/quizz/Quizz-1/geography-history/Q-5.jpeg
--- a/VNode/quizz/Quizz-1/geography-history/config.yml
+++ b/VNode/quizz/Quizz-1/geography-history/config.yml
@@ -1,27 +0,0 @@
-name: "Histoire & Géographie"
-questions:  
-  1:
-    Q:  "Quelle bataille célèbre s'est déroulée en 1815, marquant la défaite de Napoléon Bonaparte ?"
-    T:  "Elle a eu lieu en Belgique"
-    R:  "La bataille de Waterloo."
-    P:  "Q-1.jpeg"
-  2:
-    Q:  "Quelle est la capitale de l'Australie ?"
-    T:  "Le nom de cette ville commence par la lettre 'C'"
-    R:  "Canberra."
-    P:  "Q-2.jpeg"
-  3:
-    Q:  "En quelle année la Seconde Guerre mondiale a-t-elle pris fin ?"
-    T:  "C'est au milieu des années 40."
-    R:  "En 1945."
-    P:  "Q-3.jpeg"
-  4:
-    Q:  "Quel fleuve traverse la ville du Caire en Égypte ?"
-    T:  "C'est l'un des plus longs fleuves du monde"
-    R:  "Le Nil."
-    P:  "Q-4.jpeg"
-  5:
-    Q:  "Quel pays a été divisé par un mur de 1961 à 1989 ?"
-    T:  "Sa chute a marqué la fin de la guerre froide."
-    R:  "L'Allemagne (le mur de Berlin)."
-    P:  "Q-5.jpeg"
--- a/VNode/quizz/Quizz-1/geography-history/originales/Q-1.webp
+++ b/VNode/quizz/Quizz-1/geography-history/originales/Q-1.webp
--- a/VNode/quizz/Quizz-1/geography-history/originales/Q-2.webp
+++ b/VNode/quizz/Quizz-1/geography-history/originales/Q-2.webp
--- a/VNode/quizz/Quizz-1/geography-history/originales/Q-3.webp
+++ b/VNode/quizz/Quizz-1/geography-history/originales/Q-3.webp
--- a/VNode/quizz/Quizz-1/geography-history/originales/Q-4.webp
+++ b/VNode/quizz/Quizz-1/geography-history/originales/Q-4.webp
--- a/VNode/quizz/Quizz-1/geography-history/originales/Q-5.webp
+++ b/VNode/quizz/Quizz-1/geography-history/originales/Q-5.webp
--- a/VNode/quizz/Quizz-1/video-games/Original/Q-1.jpg
+++ b/VNode/quizz/Quizz-1/video-games/Original/Q-1.jpg
--- a/VNode/quizz/Quizz-1/video-games/Original/Q-2.jpg
+++ b/VNode/quizz/Quizz-1/video-games/Original/Q-2.jpg
--- a/VNode/quizz/Quizz-1/video-games/Original/Q-3.webp
+++ b/VNode/quizz/Quizz-1/video-games/Original/Q-3.webp
--- a/VNode/quizz/Quizz-1/video-games/Original/Q-4.webp
+++ b/VNode/quizz/Quizz-1/video-games/Original/Q-4.webp
--- a/VNode/quizz/Quizz-1/video-games/Original/Q-5.webp
+++ b/VNode/quizz/Quizz-1/video-games/Original/Q-5.webp
--- a/VNode/quizz/Quizz-1/video-games/Q-1.jpeg
+++ b/VNode/quizz/Quizz-1/video-games/Q-1.jpeg
--- a/VNode/quizz/Quizz-1/video-games/Q-2.jpeg
+++ b/VNode/quizz/Quizz-1/video-games/Q-2.jpeg
--- a/VNode/quizz/Quizz-1/video-games/Q-3.jpeg
+++ b/VNode/quizz/Quizz-1/video-games/Q-3.jpeg
--- a/VNode/quizz/Quizz-1/video-games/Q-4.jpeg
+++ b/VNode/quizz/Quizz-1/video-games/Q-4.jpeg
--- a/VNode/quizz/Quizz-1/video-games/Q-5.jpeg
+++ b/VNode/quizz/Quizz-1/video-games/Q-5.jpeg
--- a/VNode/quizz/Quizz-1/video-games/config.yml
+++ b/VNode/quizz/Quizz-1/video-games/config.yml
@@ -1,27 +0,0 @@
-name: "Jeux vidéos"
-questions:  
-  1:
-    Q:  "Quel personnage de jeu vidéo est un plombier moustachu qui saute sur des ennemis pour sauver une princesse ?"
-    T:  "C’est le personnage le plus célèbre de Nintendo, son nom commence par 'M'."
-    R:  "Mario."
-    P:  "Q-1.jpeg"
-  2:
-    Q:  "Quel jeu vidéo multijoueur de football avec des voitures est très populaire ?"
-    T:  "Il s'agit d'un mélange de sport et de voitures rapides."
-    R:  "Rocket League."
-    P:  "Q-2.jpeg"
-  3:
-    Q:  "Quel jeu vidéo mobile consiste à faire exploser des bonbons en alignant trois pièces identiques ?"
-    T:  "Son nom fait référence aux bonbons."
-    R:  "Candy Crush Saga."
-    P:  "Q-3.jpeg"
-  4:
-    Q:  "Quel est le nom du célèbre personnage bleu de SEGA qui court à une vitesse incroyable ?"
-    T:  "Son nom commence par la lettre 'S' et c'est un hérisson."
-    R:  "Sonic"
-    P:  "Q-4.jpeg"
-  5:
-    Q:  "Quel jeu permet de construire et explorer un monde fait de blocs, tout en survivant face à des monstres ?"
-    T:  "Le monde est entièrement fait de blocs carrés."
-    R:  "Minecraft."
-    P:  "Q-5.jpeg"
--- a/retravailler_test-buzzer-manager.js
+++ b/retravailler_test-buzzer-manager.js
@@ -1,161 +0,0 @@
-// Import necessary modules
-const mqtt = require('mqtt');
-
-// MQTT broker configuration
-const brokerUrl = 'mqtt://localhost'; // Broker URL (change if needed)
-const options = {
-    clientId: 'test_buzzer_manager',
-    clean: true
-};
-
-// Set up MQTT client
-const client = mqtt.connect(brokerUrl, options);
-
-// Variables for tracking test results
-let testResults = {
-    buzzerActivity: false,
-    confirmationReceived: false,
-    statusBlocked: false,
-    statusUnblocked: false,
-    tiltAddConfirmed: false,
-    tiltRemoveConfirmed: false,
-    tiltIgnored: false,
-    unlockConfirmation: false,
-    tiltUpdateAdd: false,
-    tiltUpdateRemove: false
-};
-
-// Subscribe to topics to capture the responses from the buzzer manager
-client.on('connect', () => {
-    console.log('[INFO] Connected to MQTT broker for testing');
-
-    // Subscribe to all topics related to the buzzer manager
-    client.subscribe('vulture/buzzer/#', (err) => {
-        if (err) console.error('[ERROR] Failed to subscribe to topics for testing');
-        else console.log('[INFO] Subscribed to topics successfully');
-    });
-
-    // Run the test sequence after a short delay
-    setTimeout(runTestSequence, 500);
-});
-
-// Capture and process incoming MQTT messages
-client.on('message', (topic, message) => {
-    const payload = JSON.parse(message.toString());
-    console.log(`[INFO] Message received on ${topic}: ${message.toString()}`);
-
-    // Track the test results based on the topics and payloads
-    if (topic.startsWith('vulture/buzzer/activity') && payload.buzzer_id === 1) {
-        testResults.buzzerActivity = true;
-    }
-
-    if (topic.startsWith(`vulture/buzzer/confirmation/1`) && payload.status === "received") {
-        testResults.confirmationReceived = true;
-    }
-
-    if (topic === 'vulture/buzzer/status' && payload.status === "blocked") {
-        testResults.statusBlocked = true;
-    }
-
-    if (topic === 'vulture/buzzer/status' && payload.status === "unblocked") {
-        testResults.statusUnblocked = true;
-    }
-
-    if (topic.startsWith(`vulture/buzzer/tilt/confirmation/2`) && payload.status === "received" && payload.action === "add") {
-        testResults.tiltAddConfirmed = true;
-    }
-
-    if (topic.startsWith(`vulture/buzzer/tilt/confirmation/2`) && payload.status === "received" && payload.action === "remove") {
-        testResults.tiltRemoveConfirmed = true;
-    }
-
-    if (topic === `vulture/buzzer/tilt/ignored/2` && payload.status === "tilt_ignored") {
-        testResults.tiltIgnored = true;
-    }
-
-    if (topic === 'vulture/buzzer/status' && payload.status === "tilt_update") {
-        // Check for tilt update with added buzzer
-        if (payload.tilt_buzzers.includes(2) && payload.message.includes("added")) {
-            testResults.tiltUpdateAdd = true;
-        }
-
-        // Check for tilt update with removed buzzer
-        if (!payload.tilt_buzzers.includes(2) && payload.message.includes("removed")) {
-            testResults.tiltUpdateRemove = true;
-        }
-    }
-
-    if (topic === 'vulture/buzzer/unlock/confirmation' && payload.status === "received") {
-        testResults.unlockConfirmation = true;
-    }
-});
-
-// Function to run the complete test sequence
-function runTestSequence() {
-    console.log('[INFO] Starting test sequence...');
-
-    // 1. Simulate a buzzer press (buzzer 1, color red)
-    console.log('[TEST] Simulating buzzer press (ID 1, color #FF0000)...');
-    client.publish('vulture/buzzer/pressed/1', JSON.stringify({
-        buzzer_id: 1,
-        color: "#FF0000"
-    }));
-
-    // 2. Simulate a second buzzer press (buzzer 2, color blue) to check blocking
-    setTimeout(() => {
-        console.log('[TEST] Simulating second buzzer press (ID 2, color #0000FF)...');
-        client.publish('vulture/buzzer/pressed/2', JSON.stringify({
-            buzzer_id: 2,
-            color: "#0000FF"
-        }));
-    }, 1000);
-
-    // 3. Simulate adding a buzzer to tilt mode (buzzer 2)
-    setTimeout(() => {
-        console.log('[TEST] Adding buzzer ID 2 to tilt mode...');
-        client.publish('vulture/buzzer/tilt', JSON.stringify({
-            buzzer_id: 2,
-            status: "add"
-        }));
-    }, 1500);
-
-    // 4. Simulate pressing a buzzer in tilt mode (should be ignored)
-    setTimeout(() => {
-        console.log('[TEST] Simulating tilt buzzer press (ID 2, color #0000FF)...');
-        client.publish('vulture/buzzer/pressed/2', JSON.stringify({
-            buzzer_id: 2,
-            color: "#0000FF"
-        }));
-    }, 2000);
-
-    // 5. Remove tilt mode from buzzer 2
-    setTimeout(() => {
-        console.log('[TEST] Removing tilt mode for buzzer ID 2...');
-        client.publish('vulture/buzzer/tilt', JSON.stringify({
-            buzzer_id: 2,
-            status: "remove"
-        }));
-    }, 2500);
-
-    // 6. Unlock buzzers to reset state
-    setTimeout(() => {
-        console.log('[TEST] Unlocking buzzers...');
-        client.publish('vulture/buzzer/unlock', '{}');
-    }, 3000);
-
-    // 7. Display results
-    setTimeout(() => {
-        console.log('[INFO] Test sequence complete. Results:');
-        console.log(`1. Buzzer activity detected for buzzer 1: ${testResults.buzzerActivity ? 'PASSED' : 'FAILED'}`);
-        console.log(`2. Confirmation received for buzzer 1: ${testResults.confirmationReceived ? 'PASSED' : 'FAILED'}`);
-        console.log(`3. Buzzer 1 status set to "blocked": ${testResults.statusBlocked ? 'PASSED' : 'FAILED'}`);
-        console.log(`4. Buzzer status set to "unblocked": ${testResults.statusUnblocked ? 'PASSED' : 'FAILED'}`);
-        console.log(`5. Tilt mode add confirmed for buzzer 2: ${testResults.tiltAddConfirmed ? 'PASSED' : 'FAILED'}`);
-        console.log(`6. Tilted buzzer press ignored: ${testResults.tiltIgnored ? 'PASSED' : 'FAILED'}`);
-        console.log(`7. Tilt status update sent (add): ${testResults.tiltUpdateAdd ? 'PASSED' : 'FAILED'}`);
-        console.log(`8. Tilt mode remove confirmed for buzzer 2: ${testResults.tiltRemoveConfirmed ? 'PASSED' : 'FAILED'}`);
-        console.log(`9. Tilt status update sent (remove): ${testResults.tiltUpdateRemove ? 'PASSED' : 'FAILED'}`);
-        console.log(`10. Unlock confirmation received: ${testResults.unlockConfirmation ? 'PASSED' : 'FAILED'}`);
-        client.end(); // End the MQTT connection
-    }, 4000);
-}
--- a/VNode/services/buzzer/buzzer-manager.js
+++ b/VNode/services/buzzer/buzzer-manager.js
@@ -1,8 +1,14 @@
 // Import necessary modules
 const mqtt = require('mqtt');
+const fs = require('fs');
+const path = require('path');
+
+// Load configuration
+const configPath = path.join(__dirname, '../config/configuration.json');
+const config = JSON.parse(fs.readFileSync(configPath, 'utf8'));

 // MQTT broker configuration
-const brokerUrl = 'mqtt://nanomq'; // Broker URL (change if needed)
+const brokerUrl = config.mqttHost;
 const clientId = 'buzzer_manager';
 const options = {
    clientId,
@@ -182,10 +188,10 @@ client.on('message', (topic, message) => {
    if (topic === 'vulture/buzzer/unlock') {
        console.log('[INFO] Buzzer unlock requested');

-        // Notify the light manager to change to the team's color
+        // Notify the light manager to change to the default color
        client.publish('vulture/light/change', JSON.stringify({
-            color: "#FFFFFF",
-            effect: 'rainbow'
+            color: "#FF00FF",
+            effect: 'none'
        }));

        // Reset buzzer manager state
--- a/VNode/services/buzzer/buzzer-watcher.js
+++ b/VNode/services/buzzer/buzzer-watcher.js
@@ -4,16 +4,16 @@ const mqtt = require('mqtt');
 const fs = require('fs');

 // Lecture du fichier de configuration
-const config = JSON.parse(fs.readFileSync(path.join('services','config','config_network.json'), 'utf8'));
+const config = JSON.parse(fs.readFileSync(path.join(__dirname, '../config/configuration.json'), 'utf8'));

 // Extraction des informations de config
-const { hosts: { buzzers: { IP: buzzerIPs, MQTTconfig: { mqttHost, mqttTopic } } } } = config;
+const { mqttHost, hosts: { buzzers: { IP: buzzerIPs, MQTTconfig: { mqttTopic } } } } = config;

 // Connexion au broker MQTT
 const client = mqtt.connect(mqttHost);

 client.on('connect', () => {
-    console.log(`Connecté au broker MQTT à ${mqttHost}`);
+    console.log(`[INFO] Connecté au broker MQTT à ${mqttHost}`);

    // Fonction pour pinger les buzzers et publier l'état
    const pingAndPublish = async () => {
@@ -24,9 +24,8 @@ client.on('connect', () => {

                // Publication du statut dans le topic MQTT
                client.publish(`${mqttTopic}`, JSON.stringify({ buzzer: buzzerName, ip, status }));
-                console.log(`Ping ${buzzerName} (${ip}) - Status: ${status}`);
            } catch (error) {
-                console.error(`Erreur avec le buzzer ${buzzerName} (${ip}):`, error.message);
+                console.error(`[ERREUR] Erreur avec le buzzer ${buzzerName} (${ip}):`, error.message);
            }
        }
    };
@@ -36,5 +35,5 @@ client.on('connect', () => {
 });

 client.on('error', (error) => {
-    console.error('Erreur de connexion au broker MQTT:', error.message);
+    console.error('[ERREUR] Erreur de connexion au broker MQTT:', error.message);
 });
--- a/VNode/services/config/config_game.json
+++ b/VNode/services/config/config_game.json
@@ -1,17 +0,0 @@
-{
-    "services": {
-        "mqttHost": "mqtt://nanomq",
-        "score": {
-            "MQTTconfig": {
-                "mqttScoreTopic": "game/score",
-                "mqttScoreChangeTopic": "game/score/update"
-            }
-        },
-        "quizzcollector": {
-            "MQTTconfig": {
-                "mqttQuizzCollectorListTopic": "game/quizz-collector/list",
-                "mqttQuizzCollectorCmdTopic": "game/quizz-collector/cmd"
-            }
-        }
-    }
-}
--- a/VNode/services/config/config_network.json
+++ b/VNode/services/config/config_network.json
@@ -1,16 +0,0 @@
-{
-    "hosts": {
-        "buzzers": {
-            "IP": {
-                "redBuzzerIP": "192.168.73.40",
-                "blueBuzzerIP": "192.168.73.41",
-                "greenBuzzerIP": "192.168.73.42",
-                "yellowBuzzerIP": "192.168.73.43"
-            },
-            "MQTTconfig": {
-                "mqttHost": "mqtt://nanomq",
-                "mqttTopic": "buzzer/watcher"
-            }
-        }
-    }
-}
--- a/VNode/services/config/configuration.json
+++ b/VNode/services/config/configuration.json
@@ -0,0 +1,45 @@
+{
+    "mqttHost": "mqtt://192.168.1.201",
+    "services": {
+        "score": {
+            "MQTTconfig": {
+                "mqttScoreTopic": "game/score",
+                "mqttScoreChangeTopic": "game/score/update",
+                "mqttScoreRequestTopic": "game/score/request"
+            }
+        },
+        "quizzcollector": {
+            "MQTTconfig": {
+                "mqttQuizzCollectorListTopic": "game/quizz-collector/list",
+                "mqttQuizzCollectorCmdTopic": "game/quizz-collector/cmd"
+            }
+        },
+        "session": {
+            "MQTTconfig": {
+                "mqttSessionRequestTopic": "game/session/config/request",
+                "mqttSessionGetTopic": "game/session/config/get",
+                "mqttSessionUpdateTopic": "game/session/config/update",
+                "mqttSessionListTopic": "game/session/list/request",
+                "mqttSessionListResponseTopic": "game/session/list/response",
+                "mqttSessionCreateTopic": "game/session/create",
+                "mqttSessionDeleteTopic": "game/session/delete",
+                "mqttSessionDeleteMediaTopic": "game/session/media/delete",
+                "mqttSessionRenameMediaTopic": "game/session/media/rename"
+            },
+            "httpPort": 3001
+        }
+    },
+    "hosts": {
+        "buzzers": {
+            "IP": {
+                "redBuzzerIP": "8.8.8.6",
+                "blueBuzzerIP": "8.8.8.8",
+                "greenBuzzerIP": "8.8.8.8",
+                "yellowBuzzerIP": "8.8.8.8"
+            },
+            "MQTTconfig": {
+                "mqttTopic": "buzzer/watcher"
+            }
+        }
+    }
+}
--- a/VNode/services/game/quizz-collector.js
+++ b/VNode/services/game/quizz-collector.js
@@ -3,10 +3,10 @@ const mqtt = require('mqtt');
 const path = require('path');

 // Lecture du fichier de configuration
-const config = JSON.parse(fs.readFileSync(path.join('services','config','config_game.json'), 'utf8'));
+const config = JSON.parse(fs.readFileSync(path.join(__dirname, '../config/configuration.json'), 'utf8'));

 // Extraction des informations de config
-const { services: { mqttHost, quizzcollector: { MQTTconfig: { mqttQuizzCollectorListTopic, mqttQuizzCollectorCmdTopic } } } } = config;
+const { mqttHost, services: { quizzcollector: { MQTTconfig: { mqttQuizzCollectorListTopic, mqttQuizzCollectorCmdTopic } } } } = config;

 // Configuration
 const folderPath = 'quizz'; // Remplace par le chemin de ton dossier
@@ -15,19 +15,19 @@ const folderPath = 'quizz'; // Remplace par le chemin de ton dossier
 const client = mqtt.connect(mqttHost);

 client.on('connect', () => {
-    console.log('Connecté au broker MQTT');
+    console.log('[INFO] Connecté au broker MQTT');
    client.subscribe(mqttQuizzCollectorCmdTopic, (err) => {
        if (err) {
-            console.error("Erreur lors de l'abonnement au topic de commande:", err);
+            console.error("[ERREUR] Erreur lors de l'abonnement au topic de commande:", err);
        } else {
-            console.log(`Abonné au topic ${mqttQuizzCollectorCmdTopic}`);
+            console.log(`[INFO] Abonné au topic ${mqttQuizzCollectorCmdTopic}`);
        }
    });
 });

 client.on('message', (topic, message) => {
    if (topic === mqttQuizzCollectorCmdTopic) {
-        console.log('Commande reçue, lecture du dossier en cours...');
+        console.log('[INFO] Commande reçue, lecture du dossier en cours...');
        Collect();
    }
 });
@@ -36,17 +36,17 @@ client.on('message', (topic, message) => {
 function Collect() {
    fs.readdir(folderPath, (err, files) => {
        if (err) {
-            console.error('Erreur lors de la lecture du dossier:', err);
+            console.error('[ERREUR] Erreur lors de la lecture du dossier:', err);
            return;
        }
-        
-        console.log('Dossiers trouvés:', files);
-        const message = JSON.stringify( files );
+
+        console.log('[INFO] Dossiers trouvés:', files);
+        const message = JSON.stringify(files);
        client.publish(mqttQuizzCollectorListTopic, message, { qos: 1 }, (err) => {
            if (err) {
-                console.error('Erreur lors de la publication MQTT:', err);
+                console.error('[ERREUR] Erreur lors de la publication MQTT:', err);
            } else {
-                console.log('Liste des fichiers publiée sur MQTT');
+                console.log('[INFO] Liste des fichiers publiée sur MQTT');
            }
        });
    });
--- a/VNode/services/game/score-manager.js
+++ b/VNode/services/game/score-manager.js
@@ -33,14 +33,14 @@ fs.access(filePath, fs.constants.F_OK, (err) => {
        // Le fichier existe, on le lit et on le parse en JSON
        fs.readFile(filePath, 'utf8', (err, data) => {
            if (err) {
-                console.error("Erreur de lecture du fichier :", err);
+                console.error("[ERREUR] Erreur de lecture du fichier :", err);
                return;
            }
            try {
                global.jsonData = JSON.parse(data);
-                console.log("Propriétés importées depuis le fichier JSON :");
+                console.log("[INFO] Propriétés importées depuis le fichier JSON :");
            } catch (parseErr) {
-                console.error("Erreur de parsing JSON :", parseErr);
+                console.error("[ERREUR] Erreur de parsing JSON :", parseErr);
            }
        });
    } else {
@@ -82,10 +82,10 @@ fs.access(filePath, fs.constants.F_OK, (err) => {

        fs.writeFile(newFilePath, JSON.stringify(initialContent, null, 2), (err) => {
            if (err) {
-                console.error("Erreur de création du fichier :", err);
+                console.error("[ERREUR] Erreur de création du fichier :", err);
                return;
            }
-            console.log(`Fichier JSON créé avec succès : ${newFilePath}`);
+            console.log(`[INFO] Fichier JSON créé avec succès : ${newFilePath}`);
            // Mettre à jour ScoreFile et filePath

            // Charger les données initiales si nécessaire
@@ -99,14 +99,14 @@ fs.access(filePath, fs.constants.F_OK, (err) => {
 function updateTeamTotalScore(teamColor, points) {
    fs.readFile(filePath, 'utf8', (err, data) => {
        if (err) {
-            console.error("Erreur de lecture du fichier :", err);
+            console.error("[ERREUR] Erreur de lecture du fichier :", err);
            return;
        }
        try {
            const jsonData = JSON.parse(data);
            // Vérifier si l'équipe existe
            if (!jsonData.TEAM.hasOwnProperty(teamColor)) {
-                console.error(`L'équipe ${teamColor} n'existe pas.`);
+                console.error(`[ERREUR] L'équipe ${teamColor} n'existe pas.`);
                return;
            }

@@ -114,48 +114,71 @@ function updateTeamTotalScore(teamColor, points) {

            // Mettre à jour le score
            jsonData.TEAM[teamColor].TotalScore += points;
-            console.log(`Le score total pour l'équipe ${teamColor} est de ${jsonData.TEAM[teamColor].TotalScore} points !`)
+
+            // Update global state
+            global.jsonData = jsonData;
+
+            console.log(`[INFO] Le score total pour l'équipe ${teamColor} est de ${jsonData.TEAM[teamColor].TotalScore} points !`)
            // Enregistrer les modifications dans le fichier
            client.publish(mqttScoreTopic, JSON.stringify(jsonData));
            fs.writeFile(filePath, JSON.stringify(jsonData, null, 2), (err) => {
                if (err) {
-                    console.error("Erreur lors de l'écriture du fichier :", err);
+                    console.error("[ERREUR] Erreur lors de l'écriture du fichier :", err);
                } else {
-                    console.log(`Le score total de l'équipe ${teamColor} a été mis à jour avec succès dans le fichier json !`);
+                    console.log(`[INFO] Le score total de l'équipe ${teamColor} a été mis à jour avec succès dans le fichier json !`);
                }
            });
        } catch (parseErr) {
-            console.error("Erreur de parsing JSON :", parseErr);
+            console.error("[ERREUR] Erreur de parsing JSON :", parseErr);
        }
    });
 }


 // Lecture du fichier de configuration
-const configPath = path.join(__dirname, '../config/config_game.json');
+const configPath = path.join(__dirname, '../config/configuration.json');
 const config = JSON.parse(fs.readFileSync(configPath, 'utf8'));

 // Extraction des informations de config
-const { services: { mqttHost, score: { MQTTconfig: { mqttScoreTopic, mqttScoreChangeTopic } } } } = config;
-console.log("DEBUG: Config loaded from:", configPath);
-console.log("DEBUG: MQTT Host:", mqttHost);
-console.log("DEBUG: Topics:", mqttScoreTopic, mqttScoreChangeTopic);
+const { mqttHost, services: { score: { MQTTconfig: { mqttScoreTopic, mqttScoreChangeTopic, mqttScoreRequestTopic } } } } = config;
+console.log("------------------------------------------------------------------------------");
+console.log("[CONFIG] Configuration chargée depuis   :", configPath);
+console.log("[CONFIG] Hôte MQTT                      :", mqttHost);
+console.log("[CONFIG] Topics chargés                 :", mqttScoreTopic, mqttScoreChangeTopic, mqttScoreRequestTopic);
+console.log("------------------------------------------------------------------------------");

 // Connexion au broker MQTT
 const client = mqtt.connect(mqttHost);

 client.on('connect', () => {
-    console.log(`Connecté au broker MQTT à ${mqttHost}`);
+    console.log(`[INFO] Connecté au broker MQTT à ${mqttHost}`);

    client.subscribe(mqttScoreChangeTopic, (err) => {
-        if (err) console.error('[ERROR] impossible de souscrire au topic de gestion du score total');
-        else console.log(`[INFO] Souscription réalisée avec succès au topic ${mqttScoreChangeTopic}]`);
+        if (err) console.error('[ERREUR] impossible de souscrire au topic de gestion du score total');
+        else console.log(`[INFO] Souscription réalisée avec succès au topic ${mqttScoreChangeTopic}`);
+    });
+
+    client.subscribe(mqttScoreRequestTopic, (err) => {
+        if (err) console.error('[ERREUR] impossible de souscrire au topic de demande de score');
+        else console.log(`[INFO] Souscription réalisée avec succès au topic ${mqttScoreRequestTopic}`);
    });

 });

 // Gestion des messages entrants
 client.on('message', (topic, message) => {
+    // Gestion de la demande de score (REFRESH)
+    if (topic === mqttScoreRequestTopic) {
+        console.log(`[INFO] Demande de rafraîchissement des scores reçue sur ${topic}`);
+        if (global.jsonData) {
+            client.publish(mqttScoreTopic, JSON.stringify(global.jsonData));
+            console.log(`[INFO] Scores envoyés sur ${mqttScoreTopic}`);
+        } else {
+            console.warn("[INFO] Aucune donnée de score disponible pour le rafraîchissement");
+        }
+        return; // Fin du traitement pour ce message
+    }
+
    let payload;
    let process;
    let Team;
@@ -167,7 +190,7 @@ client.on('message', (topic, message) => {
        // Analyse du message reçu
        payload = JSON.parse(message.toString());
    } catch (e) {
-        console.error(`[ERROR] Invalid JSON message received on topic ${topic}: ${message.toString()}`);
+        console.error(`[ERREUR] Invalid JSON message received on topic ${topic}: ${message.toString()}`);
        return;
    }
    // Vérifie que le payload est bien un objet
@@ -202,7 +225,7 @@ client.on('message', (topic, message) => {
            if (!isNaN(change)) {
                updateTeamTotalScore(Team, change);
            } else {
-                console.error(`Action invalide : ${Action}`);
+                console.error(`[ERREUR] Action invalide : ${Action}`);
            }
        }
    }
@@ -213,7 +236,7 @@ client.on('message', (topic, message) => {
 function updateTeamScoreAbsolute(teamColor, totalScore, roundScore) {
    fs.readFile(filePath, 'utf8', (err, data) => {
        if (err) {
-            console.error("Erreur de lecture du fichier :", err);
+            console.error("[ERREUR] Erreur de lecture du fichier :", err);
            return;
        }
        try {
@@ -232,26 +255,26 @@ function updateTeamScoreAbsolute(teamColor, totalScore, roundScore) {

            console.log(`Mise à jour absolue pour ${teamColor} -> Total: ${jsonData.TEAM[teamColor].TotalScore}, Round: ${jsonData.TEAM[teamColor].RoundScore}`);

+            // Update global state
+            global.jsonData = jsonData;
+
            client.publish(mqttScoreTopic, JSON.stringify(jsonData));
            fs.writeFile(filePath, JSON.stringify(jsonData, null, 2), (err) => {
-                if (err) console.error("Erreur d'écriture :", err);
+                if (err) console.error("[ERREUR] Erreur d'écriture :", err);
            });
        } catch (parseErr) {
-            console.error("Erreur JSON :", parseErr);
+            console.error("[ERREUR] Erreur JSON :", parseErr);
        }
    });
 }

 (async () => {
    while (true) {
-        console.log("Boucle en arrière-plan");
-
        await new Promise((resolve) => setTimeout(resolve, 2000)); // Pause de 2 secondes
        //client.publish(mqttScoreTopic, JSON.stringify(global.jsonData));
    }
 })();

 client.on('error', (error) => {
-    console.error('Erreur de connexion au broker MQTT:', error.message);
-});
-
+    console.error("[ERREUR] Erreur de connexion au broker MQTT:", error.message);
+});
--- a/VNode/services/game/session-manager.js
+++ b/VNode/services/game/session-manager.js
@@ -0,0 +1,399 @@
+const fs = require('fs');
+const mqtt = require('mqtt');
+const path = require('path');
+const express = require('express');
+const multer = require('multer');
+const cors = require('cors');
+
+// Lecture du fichier de configuration
+const configPath = path.join(__dirname, '../config/configuration.json');
+const config = JSON.parse(fs.readFileSync(configPath, 'utf8'));
+
+// Extraction des informations de config
+const {
+    mqttHost,
+    services: {
+        session: {
+            MQTTconfig: {
+                mqttSessionRequestTopic,
+                mqttSessionGetTopic,
+                mqttSessionUpdateTopic,
+                mqttSessionListTopic,
+                mqttSessionListResponseTopic,
+                mqttSessionCreateTopic,
+                mqttSessionDeleteTopic,
+                mqttSessionDeleteMediaTopic,
+                mqttSessionRenameMediaTopic
+            },
+            httpPort
+        }
+    }
+} = config;
+
+const PORT = httpPort || 3000;
+const quizzDir = path.join(__dirname, 'quizz');
+
+// Configurer Express
+const app = express();
+app.use(cors());
+
+// Configuration de Multer pour l'upload
+const storage = multer.diskStorage({
+    destination: function (req, file, cb) {
+        const sessionId = req.params.sessionId;
+        let subfolder = 'assets';
+
+        // Organiser par type (envoyé par le frontend dans req.body.type)
+        if (req.body.type === 'video') subfolder = 'assets/videos';
+        else if (req.body.type === 'audio') subfolder = 'assets/audios';
+        else if (req.body.type === 'picture') subfolder = 'assets/pictures';
+
+        const uploadPath = path.join(quizzDir, sessionId, subfolder);
+
+        // Créer le dossier s'il n'existe pas
+        fs.mkdirSync(uploadPath, { recursive: true });
+        cb(null, uploadPath);
+    },
+    filename: function (req, file, cb) {
+        // Utiliser l'ID de la question comme nom de fichier si disponible
+        const ext = path.extname(file.originalname);
+        let filename = 'file-' + Date.now() + '-' + Math.round(Math.random() * 1E9);
+
+        if (req.body.questionId) {
+            filename = req.body.questionId;
+        }
+
+        cb(null, filename + ext);
+    }
+});
+
+const upload = multer({ storage: storage });
+
+// Route d'upload
+app.post('/upload/:sessionId', upload.single('file'), (req, res) => {
+    if (!req.file) {
+        return res.status(400).send('No file uploaded.');
+    }
+
+    // Calculer le chemin relatif pour l'URL
+    // req.file.path est le chemin absolu sur le disque
+    // On veut le chemin relatif à partir du dossier de session
+    const sessionId = req.params.sessionId;
+    const sessionDir = path.join(quizzDir, sessionId);
+
+    // path.relative(from, to) -> donne le chemin relatif
+    let relativeId = path.relative(sessionDir, req.file.path);
+    // Remplacer les backslashes par des slashs pour les URLs web
+    relativeId = relativeId.replace(/\\/g, '/');
+
+    // Ajouter le slash initial
+    const relativePath = `/${relativeId}`;
+
+    res.json({ path: relativePath, fullPath: req.file.path });
+});
+
+// App.use pour servir les fichiers statiques
+app.use('/quizz', express.static(quizzDir));
+
+app.listen(PORT, () => {
+    console.log(`[HTTP] Serveur d'upload démarré sur le port ${PORT}`);
+});
+
+
+// Connexion au broker MQTT
+const client = mqtt.connect(mqttHost);
+
+console.log("------------------------------------------------------------------------------");
+console.log("[CONFIG] Session Manager chargé (Multi-Session + Upload)");
+console.log("[CONFIG] Hôte MQTT                      :", mqttHost);
+console.log("[CONFIG] Port HTTP                      :", PORT);
+console.log("[CONFIG] Dossier Quizz                  :", quizzDir);
+console.log("------------------------------------------------------------------------------");
+
+client.on('connect', () => {
+    console.log(`[INFO] Connecté au broker MQTT à ${mqttHost}`);
+
+    client.subscribe(mqttSessionRequestTopic);
+    client.subscribe(mqttSessionUpdateTopic);
+    client.subscribe(mqttSessionListTopic);
+    client.subscribe(mqttSessionCreateTopic);
+    client.subscribe(mqttSessionDeleteTopic);
+    client.subscribe(mqttSessionDeleteMediaTopic);
+    client.subscribe(mqttSessionRenameMediaTopic);
+
+    console.log(`[INFO] Abonné aux topics session`);
+});
+
+client.on('message', (topic, message) => {
+    if (topic === mqttSessionListTopic) {
+        console.log(`[INFO] Demande de liste de sessions`);
+        sendSessionList();
+    } else if (topic === mqttSessionRequestTopic) {
+        try {
+            const payload = JSON.parse(message.toString());
+            console.log(`[INFO] Demande de configuration pour session: ${payload.SessionId}`);
+            if (payload.SessionId) {
+                sendSessionConfiguration(payload.SessionId);
+            }
+        } catch (e) { console.error("Erreur payload request", e); }
+
+    } else if (topic === mqttSessionUpdateTopic) {
+        try {
+            const payload = JSON.parse(message.toString());
+            console.log(`[INFO] Mise à jour configuration pour session: ${payload.SessionId}`);
+            if (payload.SessionId && payload.Config) {
+                saveSessionConfiguration(payload.SessionId, payload.Config);
+            }
+        } catch (e) {
+            console.error('[ERREUR] Impossible de parser la mise à jour', e);
+        }
+    } else if (topic === mqttSessionCreateTopic) {
+        try {
+            const payload = JSON.parse(message.toString());
+            console.log(`[INFO] Demande de création de session: ${payload.SessionName}`);
+            if (payload.SessionName) {
+                createSession(payload.SessionName);
+            }
+        } catch (e) {
+            console.error('[ERREUR] Impossible de parser la demande de création', e);
+        }
+    } else if (topic === mqttSessionDeleteTopic) {
+        try {
+            const payload = JSON.parse(message.toString());
+            console.log(`[INFO] Demande de suppression de session: ${payload.SessionId}`);
+            if (payload.SessionId) {
+                deleteSession(payload.SessionId);
+            }
+        } catch (e) {
+            console.error('[ERREUR] Impossible de parser la demande de suppression', e);
+        }
+    } else if (topic === mqttSessionDeleteMediaTopic) {
+        try {
+            const payload = JSON.parse(message.toString());
+            console.log(`[INFO] Demande de suppression de média: ${payload.MediaPath} pour session: ${payload.SessionId}`);
+            if (payload.SessionId && payload.MediaPath) {
+                deleteMedia(payload.SessionId, payload.MediaPath);
+            }
+        } catch (e) {
+            console.error('[ERREUR] Impossible de parser la demande de suppression de média', e);
+        }
+    } else if (topic === mqttSessionRenameMediaTopic) {
+        try {
+            const payload = JSON.parse(message.toString());
+            console.log(`[INFO] Demande de renommage de média: ${payload.OldPath} -> ${payload.NewName}`);
+            if (payload.SessionId && payload.OldPath && payload.NewName) {
+                renameMedia(payload.SessionId, payload.OldPath, payload.NewName);
+            }
+        } catch (e) {
+            console.error('[ERREUR] Impossible de parser la demande de renommage', e);
+        }
+    }
+});
+
+function sendSessionList() {
+    fs.readdir(quizzDir, { withFileTypes: true }, (err, entries) => {
+        if (err) {
+            console.error('[ERREUR] Lecture dossier quizz', err);
+            return;
+        }
+
+        const sessions = [];
+        entries.forEach(entry => {
+            if (entry.isDirectory()) {
+                const configPath = path.join(quizzDir, entry.name, 'session-configuration.json');
+                if (fs.existsSync(configPath)) {
+                    try {
+                        const sessConfig = JSON.parse(fs.readFileSync(configPath, 'utf8'));
+                        sessions.push({
+                            id: entry.name,
+                            title: sessConfig.PackTitle || entry.name
+                        });
+                    } catch (e) {
+                        sessions.push({ id: entry.name, title: entry.name + " (Erreur Config)" });
+                    }
+                }
+            }
+        });
+
+        client.publish(mqttSessionListResponseTopic, JSON.stringify(sessions));
+        console.log(`[INFO] Liste envoyée : ${sessions.length} sessions`);
+    });
+}
+
+function sendSessionConfiguration(sessionId) {
+    const sessionFilePath = path.join(quizzDir, sessionId, 'session-configuration.json');
+    fs.readFile(sessionFilePath, 'utf8', (err, data) => {
+        if (err) {
+            console.error('[ERREUR] Impossible de lire le fichier de session', err);
+            return;
+        }
+        client.publish(mqttSessionGetTopic, data);
+        console.log(`[INFO] Configuration envoyée pour ${sessionId}`);
+    });
+}
+
+function saveSessionConfiguration(sessionId, newConfig) {
+    const sessionFilePath = path.join(quizzDir, sessionId, 'session-configuration.json');
+
+    // Validation
+    if (!newConfig.Questions || !Array.isArray(newConfig.Questions)) {
+        console.error('[ERREUR] Configuration invalide');
+        return;
+    }
+
+    const data = JSON.stringify(newConfig, null, 2);
+    fs.writeFile(sessionFilePath, data, (err) => {
+        if (err) {
+            console.error('[ERREUR] Impossible d\'écrire le fichier de session', err);
+        } else {
+            console.log(`[INFO] Session ${sessionId} mise à jour avec succès`);
+            // Confirmer la sauvegarde en renvoyant la config
+            client.publish(mqttSessionGetTopic, data);
+        }
+    });
+}
+
+function createSession(sessionName) {
+    // Nettoyer le nom pour le dossier
+    const safeName = sessionName.replace(/[^a-z0-9]/gi, '_').toLowerCase();
+    const newSessionPath = path.join(quizzDir, safeName);
+
+    if (fs.existsSync(newSessionPath)) {
+        console.error(`[ERREUR] La session ${safeName} existe déjà`);
+        return;
+    }
+
+    // Créer le dossier
+    try {
+        fs.mkdirSync(newSessionPath, { recursive: true });
+
+        // Créer la structure de base
+        const defaultConfig = {
+            PackId: "",
+            PackTitle: sessionName,
+            Questions: []
+        };
+
+        fs.writeFileSync(
+            path.join(newSessionPath, 'session-configuration.json'),
+            JSON.stringify(defaultConfig, null, 2)
+        );
+
+        console.log(`[INFO] Nouvelle session créée: ${safeName}`);
+
+        // Renvoyer la liste mise à jour
+        sendSessionList();
+
+    } catch (e) {
+        console.error(`[ERREUR] Impossible de créer la session ${safeName}`, e);
+    }
+}
+
+function deleteSession(sessionId) {
+    const sessionPath = path.join(quizzDir, sessionId);
+
+    if (!fs.existsSync(sessionPath)) {
+        console.error(`[ERREUR] La session ${sessionId} n'existe pas`);
+        return;
+    }
+
+    try {
+        fs.rmSync(sessionPath, { recursive: true, force: true });
+        console.log(`[INFO] Session supprimée: ${sessionId}`);
+
+        // Renvoyer la liste mise à jour
+        sendSessionList();
+
+    } catch (e) {
+        console.error(`[ERREUR] Impossible de supprimer la session ${sessionId}`, e);
+    }
+}
+
+function deleteMedia(sessionId, relativePath) {
+    // Sécuriser le chemin
+    // relativePath devrait être du type "/assets/..."
+    if (!relativePath) return;
+
+    // Nettoyer le chemin (retirer le slash initial s'il existe)
+    if (relativePath.startsWith('/')) relativePath = relativePath.substring(1);
+
+    const fullPath = path.join(quizzDir, sessionId, relativePath);
+
+    // Vérifier que le chemin reste dans le dossier de la session (protection directory traversal)
+    if (!fullPath.startsWith(path.join(quizzDir, sessionId))) {
+        console.error(`[ERREUR] Tentative de suppression hors session: ${fullPath}`);
+        return;
+    }
+
+    if (!fs.existsSync(fullPath)) {
+        console.error(`[ERREUR] Le fichier ${fullPath} n'existe pas`);
+        return;
+    }
+
+    try {
+        fs.unlinkSync(fullPath);
+        console.log(`[INFO] Média supprimé: ${fullPath}`);
+    } catch (e) {
+        console.error(`[ERREUR] Impossible de supprimer le fichier ${fullPath}`, e);
+    }
+}
+
+client.on('error', (error) => {
+    console.error('[ERREUR] Erreur de connexion au broker MQTT:', error.message);
+});
+
+// Helper pour les renames tenaces sur Windows
+function renameWithRetry(oldPath, newPath, retries = 5, delay = 100) {
+    try {
+        fs.renameSync(oldPath, newPath);
+        console.log(`[INFO] Média renommé : ${oldPath} -> ${newPath}`);
+    } catch (e) {
+        if (retries > 0) {
+            console.log(`[WARN] Échec renommage, nouvel essai dans ${delay}ms... (${retries} restants)`);
+            setTimeout(() => {
+                renameWithRetry(oldPath, newPath, retries - 1, delay * 2);
+            }, delay);
+        } else {
+            console.error(`[ERREUR] Impossible de renommer le fichier après plusieurs essais`, e);
+        }
+    }
+}
+
+function renameMedia(sessionId, oldRelativePath, newName) {
+    if (!oldRelativePath || !newName) return;
+
+    // Clean paths
+    if (oldRelativePath.startsWith('/')) oldRelativePath = oldRelativePath.substring(1);
+
+    const oldFullPath = path.join(quizzDir, sessionId, oldRelativePath);
+
+    // Security check
+    if (!oldFullPath.startsWith(path.join(quizzDir, sessionId))) {
+        console.error(`[ERREUR] Tentative de renommage hors session`);
+        return;
+    }
+
+    if (!fs.existsSync(oldFullPath)) {
+        console.error(`[ERREUR] Fichier à renommer introuvable: ${oldFullPath}`);
+        return;
+    }
+
+    const dir = path.dirname(oldFullPath);
+    const ext = path.extname(oldFullPath);
+    // newName comes as "Q-005", we add the extension
+    const newFilename = newName + ext;
+    const newFullPath = path.join(dir, newFilename);
+
+    // Prevent overwriting existing files (check & delete)
+    if (fs.existsSync(newFullPath)) {
+        console.log(`[INFO] Le fichier de destination existe déjà, on supprime : ${newFullPath}`);
+        try {
+            fs.unlinkSync(newFullPath);
+        } catch (e) {
+            console.error(`[ERREUR] Impossible de supprimer le fichier existant ${newFullPath}`, e);
+            // On continue quand même pour tenter le rename (le rename écrasera peut-être ou échouera)
+        }
+    }
+
+    renameWithRetry(oldFullPath, newFullPath);
+}
--- a/VNode/services/light/light-manager.js
+++ b/VNode/services/light/light-manager.js
@@ -2,7 +2,7 @@
 const mqtt = require('mqtt');

 // Configuration du broker MQTT et de WLED
-const brokerUrl = 'mqtt://nanomq';  // Change ce lien si nécessaire
+const brokerUrl = 'mqtt://192.168.1.201';  // Change ce lien si nécessaire
 const clientId = 'light_manager_wled';
 const wledTopicBase = 'wled/all';  // Le topic de base pour ton ruban WLED
 const options = {
@@ -11,7 +11,7 @@ const options = {
 };

 // État des lumières
-let currentColor = '#FFFFFF';  // Couleur par défaut (blanc)
+let currentColor = '#FF00FF';  // Couleur par défaut
 let currentEffect = 'none';  // Pas d'effet par défaut

 // Connexion au broker MQTT
@@ -25,6 +25,12 @@ client.on('connect', () => {
        if (err) console.error('[ERROR] Subscription to light topics failed');
        else console.log('[INFO] Successfully subscribed to light topics');
    });
+
+    // Souscription aux topics des buzzers pour synchronisation directe
+    client.subscribe('vulture/buzzer/pressed/#', (err) => {
+        if (err) console.error('[ERROR] Subscription to buzzer topics failed');
+        else console.log('[INFO] Successfully subscribed to buzzer topics');
+    });
 });

 // Fonction pour envoyer un message au ruban WLED
@@ -65,9 +71,9 @@ function applyLightChange(color, effect, intensity) {
 function getWLEDEffectId(effect) {
    const effectsMap = {
        'none': 0,
-        'blink': 1,      // Effet de fondu
-        'fade': 12,     // Clignotement
-        'rainbow': 9    // Effet arc-en-ciel
+        'blink': 0,      // Effet de fondu
+        'fade': 0,     // Clignotement
+        'rainbow': 0    // Effet arc-en-ciel
    };
    return effectsMap[effect] || 0;  // Par défaut, aucun effet
 }
@@ -116,7 +122,7 @@ client.on('message', (topic, message) => {
    } else if (topic === 'vulture/light/reset') {
        // Réinitialisation des lumières à la couleur et l'effet par défaut
        console.log('[INFO] Resetting lights to default state');
-        applyLightChange('#FFFFFF', 'reset', 255);
+        applyLightChange('#FF00FF', 'reset', 255);

    } else if (topic === 'vulture/light/status/request') {
        // Répondre à la requête de statut
@@ -125,6 +131,23 @@ client.on('message', (topic, message) => {
    } else if (topic === 'vulture/light/status/response') {
        // Répondre à la requête de statut
        console.log('[INFO] Light status response received');
+
+    } else if (topic.startsWith('vulture/buzzer/pressed/')) {
+        // Synchronisation directe Buzzer -> WLED
+        const { color } = payload;
+
+        if (color && /^#[0-9A-F]{6}$/i.test(color)) {
+            console.log(`[INFO] Buzzer pressed, syncing WLED color to ${color}`);
+            // Envoi direct de la couleur (format hex avec #)
+            sendToWLED('col', color);
+
+            // Mise à jour de l'état interne
+            currentColor = color;
+            currentEffect = 'none'; // Reset effect on direct color set
+        } else {
+            console.warn(`[WARN] Invalid color in buzzer payload: ${color}`);
+        }
+
    } else {
        console.error(`[ERROR] Unrecognized topic: ${topic}`);
    }
--- a/compose.yml
+++ b/compose.yml
@@ -0,0 +1,49 @@
+services:
+  nanomq:
+    image: docker.io/emqx/nanomq:latest
+    container_name: nanomq
+    restart: always
+    networks:
+      - vulture-net
+    ports:
+      - "1883:1883"
+      - "9001:9001"
+      - "8081:8081"
+      - "8083:8083"
+      - "8883:8883"
+    volumes:
+      - ./VContainers/MQTT/config/nanomq.conf:/etc/nanomq.conf:Z
+    command: ["--conf", "/etc/nanomq.conf"]
+
+  vnode:
+    image: vnode:latest
+    container_name: vnode
+    build:
+      context: .
+      dockerfile: ./VContainers/VNode/Containerfile
+    restart: always
+    networks:
+      - vulture-net
+    depends_on:
+      - nanomq
+
+  vapp:
+    image: vapp:latest
+    container_name: vapp
+    build:
+      context: .
+      dockerfile: ./VContainers/VApp/Containerfile
+    restart: always
+    networks:
+      - vulture-net
+    ports:
+      - "5173:5173"
+    volumes:
+      - ./VContainers/VApp/config/config_prod.js:/usr/share/nginx/html/config.js:Z
+    depends_on:
+      - nanomq
+
+networks:
+  vulture-net:
+    name: vulture-net
+    driver: bridge
Author	SHA1	Message	Date
Jérémy CHOMAZ	b4ca539e7b	build(Script): Script de lancement projet complet (PS1) - Utilise Windows Terminal pour ouvrir multiples onglets - Lance le frontend Vue (npm run dev) - Lance automatiquement les services backend (score, quizz, buzzer, session...)	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	a632ca98b0	feat(Editor): Nouveau composant SessionSelector - Dropdown de sélection des sessions - Boutons d'actions rapides (Créer, Supprimer, Sauvegarder) - Interface simplifiée avec Vuetify (arrondis, icônes)	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	cdb3cdf642	feat(Editor): Refactor liste des questions (SessionQuestionsList) - Affichage liste avec previews média (Image/Vidéo/Audio) - Fix génération miniature vidéo via le hack #t=0.1 - Boutons de ré-ordonnancement (Monter/Descendre) - Intégration du dialogue d'édition QuestionEditorDialog	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	1ce14eca13	feat(Editor): Refactor et Renommage avancé des médias - Algorithme de renommage en 2 passes (TMP -> Final) pour éviter les verrous fichiers - Gestion propre de la suppression des questions et médias associés - Délégation de l'affichage de la liste à SessionQuestionsList	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	46bd3f5917	feat(Editor): Nouveau composant QuestionEditorDialog - Dialogue modal pour l'ajout/édition de questions - Support complet de l'upload et preview des médias (Image/Vidéo/Audio) - Gestion des paramètres de question (points, autoplay, loop...) - Gestion des notes pour le maître du jeu	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	eae80c0c39	build(deps): Mise à jour package.json et package-lock.json	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	c0f5b35398	build(deps): Mise à jour package.json et package-lock.json	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	f5dbd08565	feat(Config): Centralisation topics MQTT et MAJ IPs - Mise à jour IP Broker MQTT (192.168.1.201) - Ajout API URL (192.168.1.178) - Ajout objet 'topics' pour centraliser les routes MQTT (session, media...)	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	7586095bd5	feat(SessionManager): Gestion avancée des médias (Rename/Delete) - Implémentation renameMedia avec retry (fix Windows file locking) - Implémentation deleteMedia via MQTT - Sécurisation des chemins d'accès (Directory Traversal prevention)	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	bcaa97e7e2	feat(MQTTPublisher): Mise à jour liste topics WLED - Correction format topics (suppression slash initial) - Ajout topics spécifiques couleur (wled/all/col, wled/panel/col)	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	b1b7080fbe	style(QuizzCollector): Amélioration formatage des logs ([INFO]/[ERREUR])	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	ce8d859126	feat(Router): Ajout de la route vers l'éditeur de session (/session-editor)	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	f800262278	feat(Config): Ajout topics MQTT gestion média - Ajout mqttSessionDeleteMediaTopic (game/session/media/delete) - Ajout mqttSessionRenameMediaTopic (game/session/media/rename)	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	2dbb270e17	feat(BuzzerManager): Alignement couleur déblocage avec WLED - Changement de la couleur de déblocage vers Magenta (#FF00FF) - Suppression de l'effet rainbow au déblocage pour éviter les conflits visuels	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	f3fc94cab3	fix(SessionEditor): Nettoyage config avant sauvegarde et traductions - Suppression des timestamps (cache-busting) dans les MediaUrl avant l'envoi au serveur - Filtrage des propriétés internes (commençant par _) pour ne pas polluer le JSON - Traduction des logs console en français	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	92daf14a09	(update) ScoreDisplay : Feedback visuel lors des buzzer - Ajout de l'état 'activeTeam' et flashingTeam' basé sur les messages MQT - Implémentation du grisement (dimming) des équipes inactives - Ajout d'une lueur blanche clignotante (flash-glow) de 2s sur l'équipe active	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	c62f76aeec	(update) GameDisplay : Feedback visuel lors des buzzer - Ajout de l'état 'activeTeam' et 'flashingTeam' basé sur les messages MQTT - Implémentation du grisement (dimming) des équipes inactives - Ajout d'une lueur blanche clignotante (flash-glow) de 2s sur l'équipe active - La box-shadow du panneau des scores prend la couleur de l'équipe active	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	74c0448dfc	(update): Formatage mineur (one-line function)	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	922b7850ea	(update) Changement du nom de l'onglet en Vulture	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	cdf0952ca1	(delete) Suppression du vieux style de quizz	2026-02-08 16:49:29 +01:00
Jérémy CHOMAZ	ab102ed1df	feat(light): Sync buzzers vers WLED et maj des defaults - Modification de la couleur par défaut vers Magenta (#FF00FF) - Ajout de la synchronisation directe : la couleur du buzzer est envoyée immédiatement au bandeau LED - Désactivation des effets (rainbow, blink...) pour stabiliser l'affichage - Abonnement au topic vulture/buzzer/pressed/#	2026-02-08 16:49:28 +01:00
Laurent Ollagnier	36d07f313b	script de lancement du kiosque intégré au dépot	2026-02-06 21:35:16 +01:00
Laurent Ollagnier	013d629625	Utilisation de compose plutot que de script pour builder, lancer et stopper les containers (maj de la doc)	2026-02-06 21:35:16 +01:00
Jérémy CHOMAZ	31649435a6	(update) : gestion des sessions et prévisualisation des médias - Ajout bouton création de session avec dialog - Ajout bouton suppression de session avec confirmation - Ajout preview plein écran pour images, vidéos et audio - Remplacement v-file-input par v-btn stylé pour upload - Preview vidéo à 1/3 de la durée pour éviter écran noir - Améliorations de style: dialogs arrondis, champs alignés	2026-02-05 21:53:34 +01:00
Jérémy CHOMAZ	0f0f1ffe33	(update) : implémentation création et suppression de sessions) - Ajout de createSession() pour créer un dossier session avec config par défaut - Ajout de deleteSession() pour supprimer un dossier session récursivement - Abonnement aux topics game/session/create et game/session/delete - Rafraîchissement automatique de la liste après création/suppression	2026-02-05 21:52:26 +01:00
Jérémy CHOMAZ	1c2c8dfcbf	(update) : ajout des topics MQTT pour création et suppression de session	2026-02-05 21:51:17 +01:00
Jérémy CHOMAZ	ed9a939121	(update) Mise à jour de buzzer-watcher.js pour mettre en forme le debug de console	2026-02-03 21:12:56 +01:00
Jérémy CHOMAZ	a15d811092	(delete) Suppression de _a retravailler_test-buzzer-manager.js car remplacé par le nouveau service buzzer-manager.js	2026-02-03 21:07:41 +01:00
Jérémy CHOMAZ	bab961ace7	(update) Mise à jour de Score-Manager.js pour mettre en forme le debug de console)	2026-02-03 21:05:55 +01:00
Jérémy CHOMAZ	07d76a7669	(update) Ajout d'une animation à la mise à jour des scores	2026-02-03 20:54:01 +01:00
Jérémy CHOMAZ	3f63801df9	(update) Suppression de l'import des variables (ne sert plus)	2026-02-03 20:48:45 +01:00
Jérémy CHOMAZ	66c9e68eb7	(update) Mise à jour de ScoreDisplay pour récupérer les scores si la page est rechargée.	2026-02-03 20:47:08 +01:00
Jérémy CHOMAZ	cc9cf987b1	(update) Mise à jour de Score-Manager.js pour ajouter le mecanisme de request des scores (utiles en cas de reload de page).	2026-02-03 20:42:04 +01:00
Jérémy CHOMAZ	212e2f350f	(update) Mise à jour du configuration.json pour ajouter le topic de request des scores	2026-02-03 20:41:06 +01:00
Jérémy CHOMAZ	5379e0ed53	(update) Mise à jour de MqttButton pour ajouter un console.log	2026-02-03 20:39:40 +01:00
Jérémy CHOMAZ	6403b8a299	(update) Mise à jour de CardScore pour récupérer les scores si la page est rechargée.	2026-02-03 20:38:49 +01:00
Jérémy CHOMAZ	827427ed28	(update) Mise à jour de CardScore pour récupérer les scores si la page est rechargée.	2026-02-03 20:38:37 +01:00
Jérémy CHOMAZ	4efe3b00c4	(update) Mise à jour de GameDisplay pour récupérer les scores si la page est rechargée.	2026-02-03 20:37:53 +01:00
jchomaz	a844c21a1b	Merge pull request '(update) mise à jour des commentaires en francais' (#4 ) from update/improve-uix into main Reviewed-on: #4	2026-02-03 19:59:19 +01:00
Jérémy CHOMAZ	332098a6fd	(update) mise à jour des commentaires en francais	2026-02-03 19:59:02 +01:00
jchomaz	f7e2a7a37e	Merge pull request 'update/improve-uix' (#3 ) from update/improve-uix into main Reviewed-on: #3	2026-02-03 19:56:32 +01:00
jchomaz	4c1fac7543	Merge pull request 'update/improve-uix' (#2 ) from update/improve-uix into main Reviewed-on: #2	2026-02-03 19:54:50 +01:00
Jérémy CHOMAZ	df2c9d4788	(new) track the new quizstore.js for manage the current Vulture Session	2026-02-01 16:20:49 +01:00
Jérémy CHOMAZ	2fe8527c37	(update) track the time in the new real timer for the remaining time and new uix placements	2026-02-01 16:19:39 +01:00
Jérémy CHOMAZ	5938e269e1	(update) track the time in the new real timer for the remaining time	2026-02-01 16:18:59 +01:00
Jérémy CHOMAZ	ff03299645	(update) track the time in the new real timer for the remaining time	2026-02-01 16:18:18 +01:00
Jérémy CHOMAZ	5624336173	(new) add the new media manager in the GameDisplay	2026-02-01 16:17:10 +01:00
Jérémy CHOMAZ	7aa5ddb4ec	(update) add buzzer blocked action in hiding overlay	2026-02-01 16:16:22 +01:00
Jérémy CHOMAZ	be8c18710d	(update) add info card about the current question for the game master	2026-02-01 16:15:28 +01:00
Jérémy CHOMAZ	f4530e8e50	(new) add info card about the current question for the game master	2026-02-01 16:14:20 +01:00
Jérémy CHOMAZ	8db6f16ac8	(update) add real timer from the current question	2026-02-01 16:12:21 +01:00
Jérémy CHOMAZ	fb3b7fabd4	Modification du thème de la fenêtre de validation de buzzer	2026-02-01 13:54:15 +01:00
Jérémy CHOMAZ	0244854ddb	patch MQTT	2026-02-01 13:53:36 +01:00
Jérémy CHOMAZ	bcec23a751	Mise à jour du fichier de configuration et patch MQTT	2026-02-01 13:52:24 +01:00
Jérémy CHOMAZ	70fb7cbcea	Mise à jour des couleur et du thème	2026-02-01 13:51:57 +01:00
Jérémy CHOMAZ	353541541d	Mise à jour du fichier de configuration et patch MQTT	2026-02-01 13:50:25 +01:00
Jérémy CHOMAZ	ee4c2604db	Retrait des anciens fichiers de configuration	2026-02-01 13:49:54 +01:00
Jérémy CHOMAZ	ad9b29ca93	Mise à jour du fichier de configuration et patch MQTT	2026-02-01 13:49:11 +01:00
Jérémy CHOMAZ	7413a2a78f	Mise à jour du fichier de configuration et patch MQTT	2026-02-01 13:48:53 +01:00
Jérémy CHOMAZ	54bbfa00b3	Ajout de la nouvelle page	2026-02-01 13:48:02 +01:00
Jérémy CHOMAZ	de8f8f051f	Patch des soucis de passage d'une page à une autre	2026-02-01 13:43:09 +01:00
Jérémy CHOMAZ	f855601217	update the configuration file to be in unique file	2026-02-01 13:41:09 +01:00
Jérémy CHOMAZ	ddbd00ae3f	Update components and remove BrainBlastBar.vue -> VultureBar.vue	2026-02-01 13:39:35 +01:00