merge branch v0.17.3

src/client/ClientGameRunner.ts

@@ -18,12 +18,13 @@ import {
 } from "../core/game/GameUpdates";
 import { WorkerClient } from "../core/worker/WorkerClient";
 import { consolex, initRemoteSender } from "../core/Consolex";
-import { getConfig, getServerConfig } from "../core/configuration/Config";
+import { getConfig, ServerConfig } from "../core/configuration/Config";
 import { GameView, PlayerView } from "../core/game/GameView";
 import { GameUpdateViewData } from "../core/game/GameUpdates";
 import { UserSettings } from "../core/game/UserSettings";
 
 export interface LobbyConfig {
+  serverConfig: ServerConfig;
   flag: () => string;
   playerName: () => string;
   clientID: ClientID;
@@ -51,8 +52,6 @@ export function joinLobby(
     `joinging lobby: gameID: ${lobbyConfig.gameID}, clientID: ${lobbyConfig.clientID}, persistentID: ${lobbyConfig.persistentID}`,
   );
 
-  const serverConfig = getServerConfig();
-
   const userSettings: UserSettings = new UserSettings();
   let gameConfig: GameConfig = null;
   if (lobbyConfig.gameType == GameType.Singleplayer) {
@@ -72,7 +71,7 @@ export function joinLobby(
     lobbyConfig,
     gameConfig,
     eventBus,
-    serverConfig,
+    lobbyConfig.serverConfig,
   );
 
   const onconnect = () => {
@@ -106,7 +105,7 @@ export async function createClientGame(
   transport: Transport,
   userSettings: UserSettings,
 ): Promise<ClientGameRunner> {
-  const config = getConfig(gameConfig, userSettings);
+  const config = await getConfig(gameConfig, userSettings);
 
   const gameMap = await loadTerrainMap(gameConfig.gameMap);
   const worker = new WorkerClient(

src/client/HelpModal.ts

@@ -249,6 +249,10 @@ export class HelpModal extends LitElement {
                   <td>C</td>
                   <td>Center camera on player</td>
                 </tr>
+                <tr>
+                  <td>C</td>
+                  <td>Center camera on player</td>
+                </tr>
                 <tr>
                   <td>Q / E</td>
                   <td>Zoom out/in</td>

src/client/HostLobbyModal.ts

@@ -6,9 +6,12 @@ import { consolex } from "../core/Consolex";
 import "./components/Difficulties";
 import { DifficultyDescription } from "./components/Difficulties";
 import "./components/Maps";
-import { generateID } from "../core/Util";
-import { getConfig, getServerConfig } from "../core/configuration/Config";
 import randomMap from "../../resources/images/RandomMap.png";
+import { generateID } from "../core/Util";
+import {
+  getConfig,
+  getServerConfigFromClient,
+} from "../core/configuration/Config";
 
 @customElement("host-lobby-modal")
 export class HostLobbyModal extends LitElement {
@@ -26,6 +29,8 @@ export class HostLobbyModal extends LitElement {
   @state() private useRandomMap: boolean = false;
 
   private playersInterval = null;
+  // Add a new timer for debouncing bot changes
+  private botsUpdateTimer: number | null = null;
 
   static styles = css`
     .modal-overlay {
@@ -571,11 +576,18 @@ export class HostLobbyModal extends LitElement {
       clearInterval(this.playersInterval);
       this.playersInterval = null;
     }
+    // Clear any pending bot updates
+    if (this.botsUpdateTimer !== null) {
+      clearTimeout(this.botsUpdateTimer);
+      this.botsUpdateTimer = null;
+    }
   }
+
   private async handleRandomMapToggle() {
     this.useRandomMap = true;
     this.putGameConfig();
   }
+
   private async handleMapSelection(value: GameMapType) {
     this.selectedMap = value;
     this.useRandomMap = false;
@@ -586,14 +598,28 @@ export class HostLobbyModal extends LitElement {
     this.putGameConfig();
   }
 
+  // Modified to include debouncing
   private handleBotsChange(e: Event) {
     const value = parseInt((e.target as HTMLInputElement).value);
     if (isNaN(value) || value < 0 || value > 400) {
       return;
     }
+
+    // Update the display value immediately
     this.bots = value;
-    this.putGameConfig();
+
+    // Clear any existing timer
+    if (this.botsUpdateTimer !== null) {
+      clearTimeout(this.botsUpdateTimer);
+    }
+
+    // Set a new timer to call putGameConfig after 300ms of inactivity
+    this.botsUpdateTimer = window.setTimeout(() => {
+      this.putGameConfig();
+      this.botsUpdateTimer = null;
+    }, 300);
   }
+
   private handleInstantBuildChange(e: Event) {
     this.instantBuild = Boolean((e.target as HTMLInputElement).checked);
     this.putGameConfig();
@@ -614,8 +640,9 @@ export class HostLobbyModal extends LitElement {
   }
 
   private async putGameConfig() {
+    const config = await getServerConfigFromClient();
     const response = await fetch(
-      `${window.location.origin}/${getServerConfig().workerPath(this.lobbyId)}/game/${this.lobbyId}`,
+      `${window.location.origin}/${config.workerPath(this.lobbyId)}/api/game/${this.lobbyId}`,
       {
         method: "PUT",
         headers: {
@@ -650,8 +677,9 @@ export class HostLobbyModal extends LitElement {
       `Starting private game with map: ${GameMapType[this.selectedMap]} ${this.useRandomMap ? " (Randomly selected)" : ""}`,
     );
     this.close();
+    const config = await getServerConfigFromClient();
     const response = await fetch(
-      `${window.location.origin}/${getServerConfig().workerPath(this.lobbyId)}/start_game/${this.lobbyId}`,
+      `${window.location.origin}/${config.workerPath(this.lobbyId)}/api/start_game/${this.lobbyId}`,
       {
         method: "POST",
         headers: {
@@ -677,15 +705,13 @@ export class HostLobbyModal extends LitElement {
   }
 
   private async pollPlayers() {
-    fetch(
-      `/${getServerConfig().workerPath(this.lobbyId)}/game/${this.lobbyId}`,
-      {
-        method: "GET",
-        headers: {
-          "Content-Type": "application/json",
-        },
+    const config = await getServerConfigFromClient();
+    fetch(`/${config.workerPath(this.lobbyId)}/api/game/${this.lobbyId}`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json",
       },
-    )
+    })
       .then((response) => response.json())
       .then((data: GameInfo) => {
         console.log(`got response: ${data}`);
@@ -695,11 +721,11 @@ export class HostLobbyModal extends LitElement {
 }
 
 async function createLobby(): Promise<GameInfo> {
-  const serverConfig = getServerConfig();
+  const config = await getServerConfigFromClient();
   try {
     const id = generateID();
     const response = await fetch(
-      `/${serverConfig.workerPath(id)}/create_game/${id}`,
+      `/${config.workerPath(id)}/api/create_game/${id}`,
       {
         method: "POST",
         headers: {

src/client/JoinPrivateLobbyModal.ts

@@ -1,9 +1,9 @@
 import { LitElement, css, html } from "lit";
 import { customElement, query, state } from "lit/decorators.js";
-import { getServerConfig } from "../core/configuration/Config";
 import { consolex } from "../core/Consolex";
 import { GameMapType, GameType } from "../core/game/Game";
 import { GameInfo } from "../core/Schemas";
+import { getServerConfigFromClient } from "../core/configuration/Config";
 
 @customElement("join-private-lobby-modal")
 export class JoinPrivateLobbyModal extends LitElement {
@@ -363,12 +363,13 @@ export class JoinPrivateLobbyModal extends LitElement {
     }
   }
 
-  private joinLobby() {
+  private async joinLobby() {
     const lobbyId = this.lobbyIdInput.value;
     consolex.log(`Joining lobby with ID: ${lobbyId}`);
     this.message = "Checking lobby..."; // Set initial message
 
-    const url = `/${getServerConfig().workerPath(lobbyId)}/game/${lobbyId}/exists`;
+    const config = await getServerConfigFromClient();
+    const url = `/${config.workerPath(lobbyId)}/api/game/${lobbyId}/exists`;
     fetch(url, {
       method: "GET",
       headers: {
@@ -406,9 +407,10 @@ export class JoinPrivateLobbyModal extends LitElement {
 
   private async pollPlayers() {
     if (!this.lobbyIdInput?.value) return;
+    const config = await getServerConfigFromClient();
 
     fetch(
-      `/${getServerConfig().workerPath(this.lobbyIdInput.value)}/game/${this.lobbyIdInput.value}`,
+      `/${config.workerPath(this.lobbyIdInput.value)}/api/game/${this.lobbyIdInput.value}`,
       {
         method: "GET",
         headers: {

src/client/LocalServer.ts

@@ -1,9 +1,4 @@
-import {
-  Config,
-  GameEnv,
-  getServerConfig,
-  ServerConfig,
-} from "../core/configuration/Config";
+import { Config, GameEnv, ServerConfig } from "../core/configuration/Config";
 import { consolex } from "../core/Consolex";
 import { GameEvent } from "../core/EventBus";
 import {
@@ -130,7 +125,7 @@ export class LocalServer {
     const blob = new Blob([JSON.stringify(GameRecordSchema.parse(record))], {
       type: "application/json",
     });
-    const workerPath = getServerConfig().workerPath(this.lobbyConfig.gameID);
+    const workerPath = this.serverConfig.workerPath(this.lobbyConfig.gameID);
     navigator.sendBeacon(`/${workerPath}/archive_singleplayer_game`, blob);
   }
 }

src/client/Main.ts

@@ -20,6 +20,7 @@ import { DarkModeButton } from "./DarkModeButton";
 import "./GoogleAdElement";
 import { HelpModal } from "./HelpModal";
 import { GameType } from "../core/game/Game";
+import { getServerConfigFromClient } from "../core/configuration/Config";
 
 class Client {
   private gameStop: () => void;
@@ -136,9 +137,11 @@ class Client {
       consolex.log("joining lobby, stopping existing game");
       this.gameStop();
     }
+    const config = await getServerConfigFromClient();
     const gameType = event.detail.gameType;
     this.gameStop = joinLobby(
       {
+        serverConfig: config,
         gameType: gameType,
         flag: (): string =>
           this.flagInput.getCurrentFlag() == "xx"

src/client/PublicLobby.ts

@@ -38,6 +38,7 @@ export class PublicLobby extends LitElement {
   private async fetchAndUpdateLobbies(): Promise<void> {
     try {
       const lobbies = await this.fetchLobbies();
+      console.log(`got lobbies: ${JSON.stringify(lobbies)}`);
       this.lobbies = lobbies;
     } catch (error) {
       consolex.error("Error fetching lobbies:", error);
@@ -46,7 +47,7 @@ export class PublicLobby extends LitElement {
 
   async fetchLobbies(): Promise<GameInfo[]> {
     try {
-      const response = await fetch(`/public_lobbies`);
+      const response = await fetch(`/api/public_lobbies`);
       if (!response.ok)
         throw new Error(`HTTP error! status: ${response.status}`);
       const data = await response.json();

src/client/graphics/layers/WinModal.ts

@@ -228,7 +228,6 @@ export class WinModal extends LitElement implements Layer {
       this.won = false;
       this.show();
     }
-
     this.game.updatesSinceLastTick()[GameUpdateType.Win].forEach((wu) => {
       const winner = this.game.playerBySmallID(wu.winnerID) as PlayerView;
       this.eventBus.emit(new SendWinnerEvent(winner.clientID()));