first commit

2025-04-03 13:22:22 +02:00 · 2025-04-03 13:22:22 +02:00 · 33a6a60491
commit 33a6a60491
2 changed files with 186 additions and 0 deletions
--- a/index.html
+++ b/index.html
@ -0,0 +1,103 @@
+<!DOCTYPE html>
+<html lang="fr">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Timer de Course</title>
+  <script src="tailwind_3.4.16"></script>
+</head>
+<body class="bg-gray-100 flex flex-col items-center p-6">
+  <div class="bg-white shadow-lg p-6 rounded-lg w-full max-w-md">
+    <h1 class="text-xl font-bold mb-4 text-center">Timer de Course</h1>
+    <div class="flex space-x-2 mb-4">
+      <input id="nameInput" type="text" placeholder="Nom du joueur" class="border p-2 rounded w-full">
+      <button id="addButton" class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">Ajouter</button>
+    </div>
+    <div id="playerList" class="space-y-2"></div>
+  </div>
+  
+  <script>
+    document.addEventListener("DOMContentLoaded", () => {
+      const playerList = document.getElementById("playerList");
+      const nameInput = document.getElementById("nameInput");
+      const addButton = document.getElementById("addButton");
+      
+      const getCookies = () => {
+        const cookies = document.cookie.split("; ").reduce((acc, cookie) => {
+          const [key, value] = cookie.split("=");
+          acc[key] = value ? JSON.parse(decodeURIComponent(value)) : {};
+          return acc;
+        }, {});
+        return cookies.players || {};
+      };
+
+      const setCookies = (players) => {
+        document.cookie = `players=${encodeURIComponent(JSON.stringify(players))}; path=/; expires=Fri, 31 Dec 9999 23:59:59 GMT`;
+      };
+      
+      let players = getCookies();
+      
+      const formatTime = (timestamp) => {
+        const date = new Date(timestamp);
+        return date.toLocaleTimeString("fr-FR", { hour: "2-digit", minute: "2-digit", second: "2-digit" });
+      };
+      
+      const renderPlayers = () => {
+        playerList.innerHTML = "";
+        Object.entries(players).forEach(([id, times]) => {
+          const playerDiv = document.createElement("div");
+          playerDiv.className = "flex justify-between items-center bg-gray-200 p-2 rounded";
+          
+          const button = document.createElement("button");
+          button.className = "bg-green-500 text-white px-3 py-1 rounded hover:bg-green-600";
+          if (times.length < 2) {
+            button.textContent = id;
+          } else {
+            const startTime = formatTime(times[0]);
+            const endTime = formatTime(times[1]);
+            const delta = ((times[1] - times[0]) / 1000).toFixed(2);
+            button.textContent = `${id}: ${delta}s (Début: ${startTime}, Fin: ${endTime})`;
+            button.disabled = true;
+            button.classList.add("bg-gray-400");
+          }
+          
+          button.addEventListener("click", () => {
+            if (players[id].length < 2) {
+              players[id].push(Date.now());
+              setCookies(players);
+              renderPlayers();
+            }
+          });
+          
+          const removeBtn = document.createElement("button");
+          removeBtn.textContent = "✕";
+          removeBtn.className = "bg-red-500 text-white px-2 py-1 rounded hover:bg-red-600";
+          removeBtn.addEventListener("click", () => {
+            if (confirm(`Supprimer ${id} ?`)) {
+              delete players[id];
+              setCookies(players);
+              renderPlayers();
+            }
+          });
+          
+          playerDiv.appendChild(button);
+          playerDiv.appendChild(removeBtn);
+          playerList.appendChild(playerDiv);
+        });
+      };
+
+      addButton.addEventListener("click", () => {
+        const name = nameInput.value.trim();
+        if (!name) return;
+        const id = `${name}-${Date.now()}`;
+        players[id] = [];
+        setCookies(players);
+        renderPlayers();
+        nameInput.value = "";
+      });
+      
+      renderPlayers();
+    });
+  </script>
+</body>
+</html>
--- a/tailwind_3.4.16
+++ b/tailwind_3.4.16