fix bug change username after join lobby

TODO.txt

@@ -143,12 +143,12 @@
 * attack radial center button only on enemy DONE 9/28/2024
 * radial center button "spawn" during spawn phase DONE 9/28/2024
 * better color scheme radial menu DONE 9/28/2024
-* Make buttons icons
-* Spawn or attack button icon
-* BUG: change username after selecting map
+* Make buttons icons DONE 9/28/2024
+* BUG: change username after selecting map DONE 9/29/2024
 * make fake humans more difficult
 * test on mobile
 * make event box work on mobile
+* BUG: alliance cooldown request
 * add request attack
 * add emoji button
 * buttons greyed out when not active

src/client/Client.ts

@@ -42,12 +42,6 @@ class Client {
         this.terrainMap = loadTerrainMap()
         this.startLobbyPolling()
         this.ip = getClientIP()
-        setupUsernameCallback((username) => {
-            console.log('Username updated:', username);
-            if (this.game != null) {
-                this.game.playerName = username
-            }
-        });
     }
 
     private startLobbyPolling(): void {
@@ -136,7 +130,7 @@ class Client {
         ]);
         console.log(`got ip ${clientIP}`)
         this.game = createClientGame(
-            refreshUsername(),
+            refreshUsername,
             uuidv4(),
             uuidv4(),
             clientIP,

src/client/ClientGame.ts

@@ -17,7 +17,7 @@ import {placeName} from "./graphics/NameBoxCalculator";
 
 
 
-export function createClientGame(playerName: string, clientID: ClientID, playerID: PlayerID, ip: string | null, gameID: GameID, config: Config, terrainMap: TerrainMap): ClientGame {
+export function createClientGame(playerName: () => string, clientID: ClientID, playerID: PlayerID, ip: string | null, gameID: GameID, config: Config, terrainMap: TerrainMap): ClientGame {
     let eventBus = new EventBus()
 
     let game = createGame(terrainMap, eventBus, config)
@@ -32,7 +32,6 @@ export function createClientGame(playerName: string, clientID: ClientID, playerI
 
 
     return new ClientGame(
-        playerName,
         clientID,
         playerID,
         ip,
@@ -59,7 +58,6 @@ export class ClientGame {
 
 
     constructor(
-        public playerName: string,
         private id: ClientID,
         private playerID: PlayerID,
         private clientIP: string | null,

src/client/Transport.ts

@@ -51,7 +51,7 @@ export class Transport {
         private gameID: GameID,
         private clientID: ClientID,
         private playerID: PlayerID,
-        private playerName: string,
+        private playerName: () => string,
     ) {
         this.eventBus.on(SendAllianceRequestIntentEvent, (e) => this.onSendAllianceRequest(e))
         this.eventBus.on(SendAllianceReplyIntentEvent, (e) => this.onAllianceRequestReplyUIEvent(e))
@@ -94,7 +94,7 @@ export class Transport {
             type: "spawn",
             clientID: this.clientID,
             playerID: this.playerID,
-            name: this.playerName,
+            name: this.playerName(),
             playerType: PlayerType.Human,
             x: event.cell.x,
             y: event.cell.y

src/client/graphics/layers/NameLayer.ts

@@ -36,13 +36,10 @@ export class NameLayer implements Layer {
     private allianceIconImage: HTMLImageElement;
     private crownIconImage: HTMLImageElement;
 
-
     private myPlayer: Player | null = null
 
     private firstPlace: Player | null = null
 
-
-
     constructor(private game: Game, private theme: Theme, private transformHandler: TransformHandler, private clientID: ClientID) {
         this.traitorIconImage = new Image();
         this.traitorIconImage.src = traitorIcon;

src/client/graphics/layers/RadialMenu.ts

@@ -28,8 +28,8 @@ export class RadialMenu implements Layer {
     private isVisible: boolean = false;
     private readonly menuItems = new Map([
         [RadialElement.RequestAlliance, {name: "alliance", color: "#53ac75", disabled: true, action: () => { }, icon: allianceIcon}],
-        [RadialElement.BoatAttack, {name: "boat", color: "#5373ac", disabled: true, action: () => { }, icon: boatIcon}],
-        [RadialElement.BreakAlliance, {name: "break", color: "#ac6753", disabled: true, action: () => { }, icon: traitorIcon}],
+        [RadialElement.BoatAttack, {name: "boat", color: "#3f6ab1", disabled: true, action: () => { }, icon: boatIcon}],
+        [RadialElement.BreakAlliance, {name: "break", color: "#b1593f", disabled: true, action: () => { }, icon: traitorIcon}],
     ]);
 
     private readonly menuSize = 190;