used msUntil start because server has different time than client

src/client/Client.ts

@@ -71,7 +71,7 @@ class Client {
 
         if (nameElement) nameElement.textContent = `Game ${lobby.id}`;
         if (timerElement) {
-            const timeRemaining = Math.max(0, Math.floor((lobby.startTime - Date.now()) / 1000));
+            const timeRemaining = Math.max(0, Math.floor((lobby.msUntilStart) / 1000));
             timerElement.textContent = `Starts in: ${timeRemaining}s`;
         }
         if (playerCountElement) playerCountElement.textContent = `Players: ${lobby.numClients}`;

src/core/Schemas.ts

@@ -27,7 +27,7 @@ export type ClientLeaveMessage = z.infer<typeof ClientLeaveMessageSchema>
 
 export interface Lobby {
     id: string;
-    startTime: number;
+    msUntilStart: number;
     numClients: number;
 }
 

src/server/GameServer.ts

@@ -115,7 +115,6 @@ export class GameServer {
         this.clients.forEach(c => {
             c.ws.send(msg)
         })
-
     }
 
     endGame() {

src/server/Server.ts

@@ -24,8 +24,11 @@ const gm = new GameManager(getConfig())
 
 // New GET endpoint to list lobbies
 app.get('/lobbies', (req, res) => {
+    const now = Date.now()
     res.json({
-        lobbies: gm.gamesByPhase(GamePhase.Lobby).map(g => ({id: g.id, startTime: g.startTime(), numClients: g.numClients()})),
+        lobbies: gm.gamesByPhase(GamePhase.Lobby)
+            .map(g => ({id: g.id, msUntilStart: g.startTime() - now, numClients: g.numClients()}))
+        // .sort((a, b) => a.startTime - b.startTime),
     });
 });