feat: merge

app.py

@@ -169,5 +169,8 @@ async def send_message(message: Message):
         raise e
         raise HTTPException(status_code=500, detail=str(e))
 
-# Mount static files AFTER defining API routes
+# Add this before the final static files mount
+app.mount("/images", StaticFiles(directory="static/images"), name="images")
+
+# Keep this as the last mount
 app.mount("/", StaticFiles(directory="static", html=True), name="static")

chat_history.json

@@ -0,0 +1,158 @@
+[
+  {
+    "interaction_1": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, IT'S GREAT TO BE BACK IN THE OVAL OFFICE, AND IT'S EVEN BETTER TO HEAR FROM YOU. WE'VE GOT A LOT OF WORK TO DO, AND I KNOW YOU'RE GOING TO BE A BIG PART OF MAKING AMERICA GREAT AGAIN. SO, LET'S GET STARTED, AND LET'S MAKE SURE WE PUT AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_2": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, IT'S GREAT TO HEAR FROM YOU AGAIN. WE'RE JUST GETTING STARTED, AND THERE'S SO MUCH TO DO. WE NEED TO FOCUS ON WHAT'S IMPORTANT AND MAKE AMERICA GREAT AGAIN. KAMALA AND BIDEN HAVE LEFT US WITH A MESS, AND WE NEED TO CLEAN IT UP. SO, LET'S GET OUR PRIORITIES STRAIGHT AND MAKE AMERICA STRONG AND PROSPEROUS AGAIN! WHAT'S ON YOUR MIND TODAY? REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_3": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, IT'S GREAT TO HEAR FROM YOU AGAIN. WE'RE JUST GETTING STARTED, AND THERE'S SO MUCH TO DO. WE NEED TO FOCUS ON WHAT'S IMPORTANT AND MAKE AMERICA GREAT AGAIN. KAMALA AND BIDEN HAVE LEFT US WITH A MESS, AND WE NEED TO CLEAN IT UP. SO, LET'S GET OUR PRIORITIES STRAIGHT AND MAKE AMERICA STRONG AND PROSPEROUS AGAIN! WHAT'S ON YOUR MIND TODAY? REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_4": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, IT'S GREAT TO HEAR FROM YOU AGAIN. WE'RE JUST GETTING STARTED, AND THERE'S SO MUCH TO DO. WE NEED TO FOCUS ON WHAT'S IMPORTANT AND MAKE AMERICA GREAT AGAIN. KAMALA AND BIDEN HAVE LEFT US WITH A MESS, AND WE NEED TO CLEAN IT UP. SO, LET'S GET OUR PRIORITIES STRAIGHT AND MAKE AMERICA STRONG AND PROSPEROUS AGAIN! WHAT'S ON YOUR MIND TODAY? REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_5": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, IT'S GREAT TO HEAR FROM YOU AGAIN. WE'RE JUST GETTING STARTED, AND THERE'S SO MUCH TO DO. WE NEED TO FOCUS ON WHAT'S IMPORTANT AND MAKE AMERICA GREAT AGAIN. KAMALA AND BIDEN HAVE LEFT US WITH A MESS, AND WE NEED TO CLEAN IT UP. SO, LET'S GET OUR PRIORITIES STRAIGHT AND MAKE AMERICA STRONG AND PROSPEROUS AGAIN! WHAT'S ON YOUR MIND TODAY? REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_6": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, IT'S GREAT TO HEAR FROM YOU AGAIN. WE'RE JUST GETTING STARTED, AND THERE'S SO MUCH TO DO. WE NEED TO FOCUS ON WHAT'S IMPORTANT AND MAKE AMERICA GREAT AGAIN. KAMALA AND BIDEN HAVE LEFT US WITH A MESS, AND WE NEED TO CLEAN IT UP. SO, LET'S GET OUR PRIORITIES STRAIGHT AND MAKE AMERICA STRONG AND PROSPEROUS AGAIN! WHAT'S ON YOUR MIND TODAY? REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_7": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "WELL, WELL, WELL, LET ME TELL YOU, I APPRECIATE THE ENTHUSIASM, I REALLY DO. BUT WE NEED TO FOCUS ON WHAT'S IMPORTANT. GREENLAND, YOU SAY? IT'S A BEAUTIFUL PLACE, BUT WE HAVE TO THINK ABOUT WHAT'S BEST FOR AMERICA. KAMALA AND BIDEN HAVE LEFT US WITH A HUGE MESS, AND WE NEED TO CLEAN IT UP FIRST. BUT YOU KNOW WHAT? I LIKE YOUR ENTHUSIASM. LET'S TALK ABOUT IT. WHAT'S YOUR PLAN FOR GREENLAND? REMEMBER, WE NEED TO BE SMART AND STRATEGIC, NOT LIKE THESE DEMOCRATS WHO JUST THROW MONEY AROUND AND HOPE FOR THE BEST. LET'S HEAR YOUR IDEAS, AND MAYBE, JUST MAYBE, WE CAN MAKE SOMETHING HAPPEN. BUT REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_8": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, IT'S GREAT TO HEAR FROM YOU AGAIN. WE'RE JUST GETTING STARTED, AND THERE'S SO MUCH TO DO. WE NEED TO FOCUS ON WHAT'S IMPORTANT AND MAKE AMERICA GREAT AGAIN. KAMALA AND BIDEN HAVE LEFT US WITH A MESS, AND WE NEED TO CLEAN IT UP. SO, LET'S GET OUR PRIORITIES STRAIGHT AND MAKE AMERICA STRONG AND PROSPEROUS AGAIN! WHAT'S ON YOUR MIND TODAY? REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN.\n\nYOU KNOW, SOMETIMES YOU NEED TO SHOW A LITTLE LOVE TO GET THINGS DONE. IT'S LIKE WHEN I SAY, \"I LOVE OUR COUNTRY,\" AND EVERYONE GETS EXCITED. IT'S ALL ABOUT THE HEART, YOU KNOW? BUT LET'S GET BACK TO BUSINESS. WHAT'S YOUR PLAN FOR GREENLAND? REMEMBER, WE NEED TO BE SMART AND STRATEGIC. WE CAN'T JUST RUSH INTO THINGS LIKE THE DEMOCRATS DO. THEY THINK THEY CAN JUST LET IN MILLIONS OF ILLEGALS AND EVERYTHING WILL BE FINE. BUT WE KNOW BETTER, DON'T WE? SO, TELL ME, WHAT'S YOUR STRATEGY FOR GREENLAND? AND REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_9": {
+      "user": {
+        "role": "user",
+        "message": "ok"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, I APPRECIATE THE ENTHUSIASM, I REALLY DO. BUT WE NEED TO FOCUS ON WHAT'S IMPORTANT. GREENLAND, YOU SAY? IT'S A BEAUTIFUL PLACE, BUT WE HAVE TO THINK ABOUT WHAT'S BEST FOR AMERICA. KAMALA AND BIDEN HAVE LEFT US WITH A HUGE MESS, AND WE NEED TO CLEAN IT UP FIRST. BUT YOU KNOW WHAT? I LIKE YOUR ENTHUSIASM. LET'S TALK ABOUT IT. WHAT'S YOUR PLAN FOR GREENLAND? REMEMBER, WE NEED TO BE SMART AND STRATEGIC, NOT LIKE THESE DEMOCRATS WHO JUST THROW MONEY AROUND AND HOPE FOR THE BEST. LET'S HEAR YOUR IDEAS, AND MAYBE, JUST MAYBE, WE CAN MAKE SOMETHING HAPPEN. BUT REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN.\n\nYOU KNOW, SOMETIMES YOU NEED TO SHOW A LITTLE LOVE TO GET THINGS DONE. IT'S LIKE WHEN I SAY, \"I LOVE OUR COUNTRY,\" AND EVERYONE GETS EXCITED. IT'S ALL ABOUT THE HEART, YOU KNOW? BUT LET'S GET BACK TO BUSINESS. WHAT'S YOUR PLAN FOR GREENLAND? REMEMBER, WE NEED TO BE SMART AND STRATEGIC. WE CAN'T JUST RUSH INTO THINGS LIKE THE DEMOCRATS DO. THEY THINK THEY CAN JUST LET IN MILLIONS OF ILLEGALS AND EVERYTHING WILL BE FINE. BUT WE KNOW BETTER, DON'T WE? SO, TELL ME, WHAT'S YOUR STRATEGY FOR GREENLAND? AND REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_10": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, IT'S GREAT TO HEAR FROM YOU AGAIN. WE'RE JUST GETTING STARTED, AND THERE'S SO MUCH TO DO. WE NEED TO FOCUS ON WHAT'S IMPORTANT AND MAKE AMERICA GREAT AGAIN. KAMALA AND BIDEN HAVE LEFT US WITH A MESS, AND WE NEED TO CLEAN IT UP. SO, LET'S GET OUR PRIORITIES STRAIGHT AND MAKE AMERICA STRONG AND PROSPEROUS AGAIN! WHAT'S ON YOUR MIND TODAY? REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN.\n\nYOU KNOW, SOMETIMES YOU NEED TO SHOW A LITTLE LOVE TO GET THINGS DONE. IT'S LIKE WHEN I SAY, \"I LOVE OUR COUNTRY,\" AND EVERYONE GETS EXCITED. IT'S ALL ABOUT THE HEART, YOU KNOW? BUT LET'S GET BACK TO BUSINESS. WHAT'S YOUR PLAN FOR GREENLAND? REMEMBER, WE NEED TO BE SMART AND STRATEGIC. WE CAN'T JUST RUSH INTO THINGS LIKE THE DEMOCRATS DO. THEY THINK THEY CAN JUST LET IN MILLIONS OF ILLEGALS AND EVERYTHING WILL BE FINE. BUT WE KNOW BETTER, DON'T WE? SO, TELL ME, WHAT'S YOUR STRATEGY FOR GREENLAND? AND REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_11": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, IT'S GREAT TO HEAR FROM YOU AGAIN. WE'RE JUST GETTING STARTED, AND THERE'S SO MUCH TO DO. WE NEED TO FOCUS ON WHAT'S IMPORTANT AND MAKE AMERICA GREAT AGAIN. KAMALA AND BIDEN HAVE LEFT US WITH A MESS, AND WE NEED TO CLEAN IT UP. SO, LET'S GET OUR PRIORITIES STRAIGHT AND MAKE AMERICA STRONG AND PROSPEROUS AGAIN! WHAT'S ON YOUR MIND TODAY? REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN.\n\nYOU KNOW, SOMETIMES YOU NEED TO SHOW A LITTLE LOVE TO GET THINGS DONE. IT'S LIKE WHEN I SAY, \"I LOVE OUR COUNTRY,\" AND EVERYONE GETS EXCITED. IT'S ALL ABOUT THE HEART, YOU KNOW? BUT LET'S GET BACK TO BUSINESS. WHAT'S YOUR PLAN FOR GREENLAND? REMEMBER, WE NEED TO BE SMART AND STRATEGIC. WE CAN'T JUST RUSH INTO THINGS LIKE THE DEMOCRATS DO. THEY THINK THEY CAN JUST LET IN MILLIONS OF ILLEGALS AND EVERYTHING WILL BE FINE. BUT WE KNOW BETTER, DON'T WE? SO, TELL ME, WHAT'S YOUR STRATEGY FOR GREENLAND? AND REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_12": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, IT'S GREAT TO HEAR FROM YOU AGAIN. WE'RE JUST GETTING STARTED, AND THERE'S SO MUCH TO DO. WE NEED TO FOCUS ON WHAT'S IMPORTANT AND MAKE AMERICA GREAT AGAIN. KAMALA AND BIDEN HAVE LEFT US WITH A MESS, AND WE NEED TO CLEAN IT UP. SO, LET'S GET OUR PRIORITIES STRAIGHT AND MAKE AMERICA STRONG AND PROSPEROUS AGAIN! WHAT'S ON YOUR MIND TODAY? REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN.\n\nYOU KNOW, SOMETIMES YOU NEED TO SHOW A LITTLE LOVE TO GET THINGS DONE. IT'S LIKE WHEN I SAY, \"I LOVE OUR COUNTRY,\" AND EVERYONE GETS EXCITED. IT'S ALL ABOUT THE HEART, YOU KNOW? BUT LET'S GET BACK TO BUSINESS. WHAT'S YOUR PLAN FOR GREENLAND? REMEMBER, WE NEED TO BE SMART AND STRATEGIC. WE CAN'T JUST RUSH INTO THINGS LIKE THE DEMOCRATS DO. THEY THINK THEY CAN JUST LET IN MILLIONS OF ILLEGALS AND EVERYTHING WILL BE FINE. BUT WE KNOW BETTER, DON'T WE? SO, TELL ME, WHAT'S YOUR STRATEGY FOR GREENLAND? AND REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  },
+  {
+    "interaction_13": {
+      "user": {
+        "role": "user",
+        "message": "hi"
+      },
+      "trump": {
+        "role": "Trump",
+        "message": "LET ME TELL YOU, IT'S GREAT TO HEAR FROM YOU AGAIN. WE'RE JUST GETTING STARTED, AND THERE'S SO MUCH TO DO. WE NEED TO FOCUS ON WHAT'S IMPORTANT AND MAKE AMERICA GREAT AGAIN. KAMALA AND BIDEN HAVE LEFT US WITH A MESS, AND WE NEED TO CLEAN IT UP. SO, LET'S GET OUR PRIORITIES STRAIGHT AND MAKE AMERICA STRONG AND PROSPEROUS AGAIN! WHAT'S ON YOUR MIND TODAY? REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN.\n\nYOU KNOW, SOMETIMES YOU NEED TO SHOW A LITTLE LOVE TO GET THINGS DONE. IT'S LIKE WHEN I SAY, \"I LOVE OUR COUNTRY,\" AND EVERYONE GETS EXCITED. IT'S ALL ABOUT THE HEART, YOU KNOW? BUT LET'S GET BACK TO BUSINESS. WHAT'S YOUR PLAN FOR GREENLAND? REMEMBER, WE NEED TO BE SMART AND STRATEGIC. WE CAN'T JUST RUSH INTO THINGS LIKE THE DEMOCRATS DO. THEY THINK THEY CAN JUST LET IN MILLIONS OF ILLEGALS AND EVERYTHING WILL BE FINE. BUT WE KNOW BETTER, DON'T WE? SO, TELL ME, WHAT'S YOUR STRATEGY FOR GREENLAND? AND REMEMBER, AMERICA FIRST, ALWAYS! #MAGA #TRUMP2025 #BUYMYMEMECOIN."
+      }
+    }
+  }
+]

games/game_9/round_consequences.json

@@ -0,0 +1,6 @@
+{
+    "country": "Mexico",
+    "delta_USA": "0",
+    "delta_country": "-5",
+    "delta_friendliness": "-1"
+}

games/game_9/round_context.json

@@ -0,0 +1,6 @@
+{
+    "idea": "Blame Mexico for a stock market crash",
+    "concern": "How will it affect China\n",
+    "advisor": "George Soros. The villain in every conspiracy theory worth believing. His shadow looms everywhere, and even when he's not involved, it feels like he is. Your supporters fear him; you should too.\n",
+    "events": ""
+}

games/game_9/world_graph.edgelist

@@ -0,0 +1,81 @@
+# Own and friendly relationships
+China Taiwan own 1
+China India friendliness -1
+China Australia friendliness 0
+Taiwan China own -1
+Australia Pacific own 1
+Pacific Australia own -1
+Greenland Europe own -1
+Europe Greenland own 1
+Europe Middle-East friendliness -1
+Europe Russia friendliness 0
+Europe China friendliness 0
+Europe India friendliness 0
+Europe Australia friendliness 1
+United-States Canada friendliness 0
+United-States Mexico friendliness -1
+United-States South-America friendliness -1
+United-States Africa friendliness 0
+United-States Europe friendliness 1
+United-States Middle-East friendliness -1
+United-States Russia friendliness -1
+United-States China friendliness -1
+United-States India friendliness 0
+United-States Australia friendliness 1
+United-States Greenland friendliness -2
+United-States Pacific friendliness 1
+United-States Taiwan friendliness 1
+Canada Mexico friendliness 0
+Canada South-America friendliness 0
+Canada Africa friendliness 0
+Canada Europe friendliness 1
+Canada Middle-East friendliness 0
+Canada Russia friendliness 0
+Canada China friendliness 0
+Canada India friendliness 0
+Canada Australia friendliness 1
+Mexico South-America friendliness 1
+Mexico Africa friendliness 0
+Mexico Europe friendliness 0
+Mexico Middle-East friendliness 0
+Mexico Russia friendliness 0
+Mexico China friendliness 0
+Mexico India friendliness 0
+Mexico Australia friendliness 0
+South-America Africa friendliness 0
+South-America Europe friendliness 1
+South-America Middle-East friendliness 0
+South-America Russia friendliness 0
+South-America China friendliness 0
+South-America India friendliness 0
+South-America Australia friendliness 0
+Africa Europe friendliness -1
+Africa Middle-East friendliness 1
+Africa Russia friendliness 1
+Africa China friendliness 1
+Africa India friendliness 0
+Africa Australia friendliness 0
+Middle-East Russia friendliness 1
+Middle-East China friendliness 0
+Middle-East India friendliness -1
+Middle-East Australia friendliness 0
+Russia China friendliness 1
+Russia India friendliness 0
+Russia Australia friendliness 0
+India Australia friendliness 0
+
+# Node attributes (country Money Warming Army)
+China 70 1.1 70
+Taiwan 25 0.3 10
+Australia 55 0.2 35
+Pacific 10 0.1 0
+Greenland 20 0.05 0
+Europe 70 0.7 50
+United-States 100 0.8 90
+Canada 60 0.3 20
+Mexico 40 0.4 20
+South-America 50 0.6 40
+Africa 40 0.5 40
+Middle-East 45 0.6 45
+Russia 70 0.9 85
+India 55 0.9 60

static/index.html

@@ -16,11 +16,9 @@
       <div class="profile-text">
         <h2>Donald J. Trump</h2>
         <span>@realDonaldTrump</span>
-        <p>
-          45th President of the United States of America<br/>
-          DonaldJTrump.com<br/>
-          A rejoint X en mars 2009
-        </p>
+        <p>45th & 47th President 🇺🇸<br/>
+           DonaldJTrump.com<br/>
+           A rejoint X en mars 2009</p>
       </div>
       <div class="divider"></div>
     </div>
@@ -31,11 +29,40 @@
     </div>
   </div>
 
+
+  <div class="popup" id="gamePopup">
+    <div class="popup-header">
+      <span class="popup-title">Game Intro</span>
+      <div class="popup-controls">
+        <button class="control-btn minimize">−</button>
+        <button class="control-btn maximize">□</button>
+        <button class="control-btn close">×</button>
+      </div>
+    </div>
+    <div class="popup-content">
+      <iframe src="intro.html" class="intro-frame"></iframe>
+      <button class="popup-ok">Start Game</button>
+    </div>
+  </div>
+
+  <div class="popup" id="gameOverPopup">
+    <div class="popup-header">
+      <span class="popup-title">Game Over</span>
+      <div class="popup-controls">
+        <button class="control-btn close">×</button>
+      </div>
+    </div>
+    <div class="popup-content">
+      <img src="/images/game_over.png" alt="Game Over" class="popup-gif">
+      <button class="popup-ok">Try Again</button>
+    </div>
+  </div>
+
   <!-- Ajout : container pour la carte SVG à droite -->
   <div class="map-container">
-    <svg 
-      id="worldMap" 
-      xmlns="http://www.w3.org/2000/svg" 
+    <svg
+      id="worldMap"
+      xmlns="http://www.w3.org/2000/svg"
       viewBox="0 0 2000 1200"
     >
       <!-- Les paths seront injectés en JavaScript -->
@@ -50,18 +77,18 @@
       const chatWindow = document.getElementById('chatWindow');
       const messageDiv = document.createElement('div');
       messageDiv.className = `message ${isUser ? 'user' : 'trump'}`;
-      
+
       if (!isUser) {
         const img = document.createElement('img');
         img.src = '/images/donald_trump.jpg';
         img.alt = 'Trump';
         messageDiv.appendChild(img);
       }
-      
+
       const contentDiv = document.createElement('div');
       contentDiv.className = 'message-content';
       contentDiv.textContent = message;
-      
+
       messageDiv.appendChild(contentDiv);
       chatWindow.appendChild(messageDiv);
       chatWindow.scrollTop = chatWindow.scrollHeight;
@@ -143,6 +170,109 @@
     });
 
 
+    document.addEventListener('DOMContentLoaded', function() {
+      // Load the intro content
+      fetch('./intro.html')
+        .then(response => response.text())
+        .then(html => {
+          document.getElementById('introContent').innerHTML = html;
+        });
+
+      // Show popup after content is loaded
+      setTimeout(() => {
+        const popup = document.getElementById('gamePopup');
+        popup.style.display = 'block';
+      }, 2000);
+
+      // Show game over popup after 5 seconds
+     //setTimeout(() => {
+     //   const gameOverPopup = document.getElementById('gameOverPopup');
+     //   gameOverPopup.style.display = 'block';
+     // }, 5000);
+
+      // Initialize game popup controls
+      const popup = document.getElementById('gamePopup');
+      const minimizeBtn = popup.querySelector('.minimize');
+      const maximizeBtn = popup.querySelector('.maximize');
+      const closeBtn = popup.querySelector('.close');
+      const okBtn = popup.querySelector('.popup-ok');
+
+      minimizeBtn.addEventListener('click', () => {
+        popup.classList.add('minimized');
+      });
+
+      maximizeBtn.addEventListener('click', () => {
+        popup.classList.remove('minimized');
+      });
+
+      closeBtn.addEventListener('click', () => {
+        popup.style.display = 'none';
+      });
+
+      okBtn.addEventListener('click', () => {
+        popup.classList.add('minimized');
+      });
+
+      // Make the popup draggable
+      const header = popup.querySelector('.popup-header');
+      let isDragging = false;
+      let currentX;
+      let currentY;
+      let initialX;
+      let initialY;
+      let xOffset = 0;
+      let yOffset = 0;
+
+      header.addEventListener('mousedown', dragStart);
+      document.addEventListener('mousemove', drag);
+      document.addEventListener('mouseup', dragEnd);
+
+      function dragStart(e) {
+        initialX = e.clientX - xOffset;
+        initialY = e.clientY - yOffset;
+
+        if (e.target === header) {
+          isDragging = true;
+        }
+      }
+
+      function drag(e) {
+        if (isDragging) {
+          e.preventDefault();
+          currentX = e.clientX - initialX;
+          currentY = e.clientY - initialY;
+          xOffset = currentX;
+          yOffset = currentY;
+
+          setTranslate(currentX, currentY, popup);
+        }
+      }
+
+      function setTranslate(xPos, yPos, el) {
+        el.style.transform = `translate(${xPos}px, ${yPos}px)`;
+      }
+
+      function dragEnd() {
+        initialX = currentX;
+        initialY = currentY;
+        isDragging = false;
+      }
+
+      // Initialize game over popup controls
+      const gameOverPopup = document.getElementById('gameOverPopup');
+      const gameOverCloseBtn = gameOverPopup.querySelector('.close');
+      const gameOverOkBtn = gameOverPopup.querySelector('.popup-ok');
+
+      gameOverCloseBtn.addEventListener('click', () => {
+        location.reload();  // Reload page on close
+      });
+
+      gameOverOkBtn.addEventListener('click', () => {
+        location.reload();  // Reload page on Try Again
+      });
+    });
+
+
     // ============================
     // AJOUT : GESTION DE LA CARTE SVG
     // ============================
@@ -815,12 +945,12 @@
         } else {
           path.setAttribute('fill', 'red');
         }
-        
+
         // Optionnel : ajout d'un survol ou d'un clic pour modifier l'attribut
         // path.addEventListener('click', () => {
         //   // Ex: toggler la valeur Yes/No puis changer la couleur
         // });
-        
+
         svgContainer.appendChild(path);
       }
     });

static/intro.html

@@ -0,0 +1,148 @@
+<!DOCTYPE html>
+<html lang="fr">
+<head>
+  <meta charset="UTF-8">
+  <title>What possibly go Wrong 2025</title>
+  <style>
+    html, body {
+      margin: 0;
+      padding: 0;
+      height: 100%;
+      width: 800px;
+      font-family: Arial, sans-serif;
+      overflow: hidden;
+      background-color: transparent;
+    }
+
+    /* Image de fond qui remplit tout l'écran */
+    body {
+      background: url('/images/intro/Intro.jpg') no-repeat center center;
+      background-size: cover; /* ou 100% auto */
+      position: relative;
+    }
+
+    /* Conteneur du texte */
+    #text-container {
+      position: absolute;
+      top: 10%;
+      left: 50%;
+      transform: translateX(-50%);
+      width: 60%;
+      padding: 20px;
+      background-color: rgba(0, 0, 0, 0.5);
+      border-radius: 8px;
+      color: #fff;
+      text-align: left;
+      font-weight: bold;
+      font-size: 1.2rem;
+      z-index: 3; /* au-dessus des flammes si besoin */
+    }
+
+    /* Conteneur des flammes */
+    #flames {
+      position: absolute;
+      bottom: -50px;  /* Move flames down a bit */
+      left: 0;
+      width: 100%;
+      height: 180px;  /* Increase height */
+      background: url('/images/intro/fire3.png') repeat-x;
+      background-size: auto 180px;  /* Match height */
+      animation: flameAnim 3s steps(10) infinite;
+      pointer-events: none;
+      z-index: 999;
+    }
+
+    @keyframes flameAnim {
+      100% {
+        background-position: -1000px 0; 
+      }
+    }
+  </style>
+</head>
+
+<body>
+  <div id="text-container"></div>
+  <div id="flames"></div>
+
+  <script>
+    const lines = [
+      "Warning !",
+      "This game is a work of fiction.",
+      "Any resemblance to real people or events is purely coincidental.",
+      "",
+      "USA is on the edge of total colapse.",
+      "Borders are wide open.",
+      "People are eating cats and dogs.",
+      "Oil production? it's pratically a fairy tale now ! ",
+      "God sent the perfect president to save the nation.",
+      "",
+      "Welcome to What possibly go Wrong in 2025 ! "
+    ];
+
+    const textContainer = document.getElementById('text-container');
+
+    let lineIndex = 0;    // Indice de la ligne en cours
+    let charIndex = 0;    // Indice du caractère en cours dans la ligne
+    let currentLineElem;  // Élement HTML pour la ligne en cours (si non vide)
+
+    function typeWriter() {
+      // Si on a traité toutes les lignes, on arrête
+      if (lineIndex >= lines.length) {
+        return;
+      }
+
+      const currentLine = lines[lineIndex];
+
+      // -- 1) Gérer la ligne vide ("") --
+      if (currentLine === "") {
+        // On affiche un saut de ligne
+        textContainer.appendChild(document.createElement('br'));
+
+        // Après 2 secondes, on efface le texte et on passe à la suite
+        // setTimeout(() => {
+        //   textContainer.innerHTML = "";
+        //   lineIndex++;
+        //   charIndex = 0;
+        //   typeWriter(); // relance l'affichage de la ligne suivante
+        // }, 3000);
+
+          lineIndex++;
+          charIndex = 0;
+          typeWriter(); // relance l'affichage de la ligne suivante
+
+        // On quitte immédiatement la fonction pour éviter tout conflit de setTimeout
+        return;
+      }
+      
+      // -- 2) Si la ligne n'est pas vide, affichage "lettre par lettre" --
+      if (charIndex === 0) {
+        // On crée un nouvel élément pour la nouvelle ligne
+        currentLineElem = document.createElement('div');
+        textContainer.appendChild(currentLineElem);
+      }
+
+      // Ajout du caractère suivant
+      currentLineElem.textContent += currentLine.charAt(charIndex);
+      charIndex++;
+
+      // S'il reste des caractères à afficher dans la ligne
+      if (charIndex < currentLine.length) {
+        setTimeout(typeWriter, 30);
+      } else {
+        // Ligne terminée : on passe à la ligne suivante
+        lineIndex++;
+        charIndex = 0;
+        currentLineElem = null;
+
+        // Petite pause avant d'attaquer la prochaine ligne
+        setTimeout(typeWriter, 25);
+      }
+    }
+
+    // On démarre le « typewriter »
+    typeWriter();
+  </script>
+</body>
+
+
+</html>

static/styles.css

@@ -1,212 +1,362 @@
-* {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-}
-
-body {
-  display: flex;
-  font-family: Arial, sans-serif;
-  background-color: #000;
-  color: #fff;
-}
-
-/* ====================================
- NOUVEAU : la colonne de droite (carte)
- ==================================== */
-.map-container {
-  width: 50%;
-  height: 100vh;
-  background-color: #fff; /* fond blanc */
-  overflow: auto; /* permet de scroller si besoin */
-}
-
-.map-container svg {
-  width: 100%;
-  height: 100%;
-}
-
-/* ====================================
- Colonne de gauche : Chatbot (inchangé)
- ==================================== */
-.content {
-  flex: 1;
-  background-color: #fff;
-}
-
-.chatbot {
-  width: 50%;
-  height: 100vh;
-  border-right: 1px solid #333;
-  background-color: #000;
-  display: flex;
-  flex-direction: column;
-}
-
-.chatbot-header {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 16px;
-  width: 100%;
-}
-
-.chatbot-header img {
-  width: 60px;
-  height: 60px;
-  border-radius: 50%;
-  margin-bottom: 10px;
-  text-align: center;
-}
-
-.chatbot-messages {
-  flex: 1;
-  overflow-y: scroll;
-  padding: 10px;
-  scroll-behavior: smooth;
-}
-
-.chatbot-messages::-webkit-scrollbar {
-  display: none;
-}
-
-.message {
-  display: flex;
-  margin-bottom: 15px;
-}
-
-.message img {
-  width: 40px;
-  height: 40px;
-  border-radius: 50%;
-  margin-right: 10px;
-}
-
-.message-content {
-  border-radius: 15px;
-  padding: 10px;
-  max-width: 70%;
-}
-
-.message.trump {
-  justify-content: flex-start;
-}
-
-.message.trump .message-content {
-  background-color: #333;
-  color: #e1e8ed;
-}
-
-.message.user {
-  justify-content: flex-end;
-}
-
-.message.user .message-content {
-  background-color: #1da1f2;
-  color: #fff;
-}
-
-.chatbot-input {
-  border-top: 1px solid #333;
-  padding: 10px;
-  display: flex;
-}
-
-.chatbot-input input {
-  flex: 1;
-  background-color: #192734;
-  border: 1px solid #333;
-  border-radius: 20px;
-  padding: 10px;
-  color: #e1e8ed;
-  outline: none;
-  font-size: 14px;
-}
-
-.chatbot-input input::placeholder {
-  color: #71767b;
-}
-
-.chatbot-input button {
-  margin-left: 10px;
-  background-color: #1da1f2;
-  color: #fff;
-  border: none;
-  border-radius: 20px;
-  padding: 10px 15px;
-  cursor: pointer;
-}
-
-.profile-container {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding: 1rem;
-  text-align: center;
-}
-
-.profile-image {
-  display: flex;
-  justify-content: center;
-  width: 100%;
-  margin-bottom: 12px;
-}
-
-.profile-image img {
-  width: 80px;
-  height: 80px;
-  border-radius: 50%;
-}
-
-.profile-name {
-  font-size: 1.5rem;
-  font-weight: bold;
-  margin: 0;
-}
-
-.profile-handle {
-  color: #536471;
-  font-size: 1rem;
-  margin-bottom: 0.5rem;
-}
-
-.profile-description {
-  margin: 0.5rem 0;
-  line-height: 1.4;
-}
-
-.profile-text {
-  text-align: center;
-  width: 100%;
-}
-
-.profile-text h2 {
-  margin: 0;
-  font-size: 18px;
-  font-weight: bold;
-  color: #ffffff;
-  text-align: center;
-}
-
-.profile-text span {
-  color: #8899a6;
-  font-size: 14px;
-  display: block;
-  text-align: center;
-}
-
-.profile-text p {
-  margin: 4px 0 0 0;
-  font-size: 14px;
-  line-height: 1.4;
-  color: #ffffff;
-  text-align: center;
-}
-
-.divider {
-  width: 100%;
-  height: 1px;
-  background-color: #2f3336;
-  margin-top: 16px;
-}
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+  }
+
+  body {
+    display: flex;
+    font-family: Arial, sans-serif;
+    background-color: #000;
+    color: #fff;
+  }
+
+  .content {
+    flex: 1;
+    background-color: #fff;
+  }
+
+  .chatbot {
+    width: 50%;
+    height: 100vh;
+    border-right: 1px solid #333;
+    background-color: #000;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .chatbot-header {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 16px;
+    width: 100%;
+  }
+
+  .chatbot-header img {
+    width: 60px;
+    height: 60px;
+    border-radius: 50%;
+    margin-bottom: 10px;
+    text-align: center;
+  }
+
+  .chatbot-messages {
+    flex: 1;
+    overflow-y: scroll;
+    padding: 10px;
+    scroll-behavior: smooth;
+  }
+
+  .chatbot-messages::-webkit-scrollbar {
+    display: none;
+  }
+
+  .map-container {
+    width: 50%;
+    height: 100vh;
+    background-color: #fff; /* fond blanc */
+    overflow: auto; /* permet de scroller si besoin */
+  }
+
+  .map-container svg {
+    width: 100%;
+    height: 100%;
+  }
+
+  .message {
+    display: flex;
+    margin-bottom: 15px;
+  }
+
+  .message img {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    margin-right: 10px;
+  }
+
+  .message-content {
+    border-radius: 15px;
+    padding: 10px;
+    max-width: 70%;
+  }
+
+  .message.trump {
+    justify-content: flex-start;
+  }
+
+  .message.trump .message-content {
+    background-color: #333;
+    color: #e1e8ed;
+  }
+
+  .message.user {
+    justify-content: flex-end;
+  }
+
+  .message.user .message-content {
+    background-color: #1da1f2;
+    color: #fff;
+  }
+
+  .chatbot-input {
+    border-top: 1px solid #333;
+    padding: 10px;
+    display: flex;
+  }
+
+  .chatbot-input input {
+    flex: 1;
+    background-color: #192734;
+    border: 1px solid #333;
+    border-radius: 20px;
+    padding: 10px;
+    color: #e1e8ed;
+    outline: none;
+    font-size: 14px;
+  }
+
+  .chatbot-input input::placeholder {
+    color: #71767b;
+  }
+
+  .chatbot-input button {
+    margin-left: 10px;
+    background-color: #1da1f2;
+    color: #fff;
+    border: none;
+    border-radius: 20px;
+    padding: 10px 15px;
+    cursor: pointer;
+  }
+
+  .profile-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 1rem;
+    text-align: center;
+  }
+
+  .profile-image {
+    display: flex;
+    justify-content: center;
+    width: 100%;
+    margin-bottom: 12px;
+  }
+
+  .profile-image img {
+    width: 80px;
+    height: 80px;
+    border-radius: 50%;
+  }
+
+  .profile-name {
+    font-size: 1.5rem;
+    font-weight: bold;
+    margin: 0;
+  }
+
+  .profile-handle {
+    color: #536471;
+    font-size: 1rem;
+    margin-bottom: 0.5rem;
+  }
+
+  .profile-description {
+    margin: 0.5rem 0;
+    line-height: 1.4;
+  }
+
+  .profile-text {
+    text-align: center;
+    width: 100%;
+  }
+
+  .profile-text h2 {
+    margin: 0;
+    font-size: 18px;
+    font-weight: bold;
+    color: #ffffff;
+    text-align: center;
+  }
+
+  .profile-text span {
+    color: #8899a6;
+    font-size: 14px;
+    display: block;
+    text-align: center;
+  }
+
+  .profile-text p {
+    margin: 4px 0 0 0;
+    font-size: 14px;
+    line-height: 1.4;
+    color: #ffffff;
+    text-align: center;
+  }
+
+  .divider {
+    width: 100%;
+    height: 1px;
+    background-color: #2f3336;
+    margin-top: 16px;
+  }
+
+  .popup {
+    display: none;
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 400px;
+    background-color: #fff3e0;
+    border-radius: 8px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
+    z-index: 1000;
+    transition: all 0.3s ease;
+  }
+
+  .popup.minimized {
+    top: unset;
+    bottom: 20px;
+    right: 20px;
+    left: unset;
+    transform: none;
+    width: 200px;
+    height: 32px;
+    overflow: hidden;
+    background-color: #1da1f2;
+  }
+
+  .popup.minimized .popup-content {
+    display: none;
+  }
+
+  .popup.minimized .popup-header {
+    padding: 4px 8px;
+    height: 32px;
+  }
+
+  .popup-header {
+    background-color: #1da1f2;
+    color: white;
+    padding: 8px 12px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border-radius: 8px 8px 0 0;
+    cursor: move;
+  }
+
+  .popup-controls {
+    display: flex;
+    gap: 5px;
+  }
+
+  .control-btn {
+    background: none;
+    border: none;
+    color: white;
+    cursor: pointer;
+    width: 24px;
+    height: 24px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 4px;
+  }
+
+  .control-btn:hover {
+    background-color: rgba(255, 255, 255, 0.2);
+  }
+
+  .popup-content {
+    padding: 20px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 15px;
+    color: #000;
+  }
+
+  .popup-gif {
+    max-width: 100%;
+    height: auto;
+  }
+
+  .popup-ok {
+    background-color: #1da1f2;
+    color: white;
+    border: none;
+    padding: 8px 24px;
+    border-radius: 20px;
+    cursor: pointer;
+    font-size: 14px;
+  }
+
+  .popup-ok:hover {
+    background-color: #1a91da;
+  }
+
+  #gameOverPopup {
+    width: fit-content;
+  }
+
+  #gameOverPopup .popup-content {
+    padding: 0;
+    gap: 5px;
+  }
+
+  #gameOverPopup .popup-gif {
+    display: block;
+    width: 600px;
+    height: 300px;
+    margin: 0;
+  }
+
+  #gameOverPopup .popup-header {
+    padding: 5px 10px;
+  }
+
+  #gameOverPopup .popup-ok {
+    margin: 5px 0;
+  }
+
+  .intro-frame {
+    width: 800px;
+    height: 650px;
+    border: none;
+    overflow: hidden;
+    background-color: transparent;
+    margin: 0;
+    padding: 0;
+  }
+
+  #gamePopup {
+    width: auto;
+    background-color: transparent;
+    padding: 0;
+  }
+
+  #gamePopup .popup-content {
+    padding: 0;
+    position: relative;
+  }
+
+  #gamePopup .popup-ok {
+    position: absolute;
+    bottom: 200px;
+    left: 50%;
+    transform: translateX(-50%);
+    z-index: 1000;
+    background-color: rgba(29, 161, 242, 0.8);
+    padding: 12px 30px;
+    font-size: 16px;
+  }
+
+  #gamePopup .popup-ok:hover {
+    background-color: rgba(29, 161, 242, 1);
+  }