first place has crown

TODO.txt

@@ -129,13 +129,13 @@
 * create event box DONE 9/20/2024
 * BUG: left click lost after right click DONE 9/20/2024
 * eventbox events dissapear after timeout DONE 9/20/2024
-* auto reject alliance when event dissapears
-* first place has crown
+* auto reject alliance when event dissapears DONE 9/20/2024
+* first place has crown DONE 9/20/2024
 * make fake humans easier
 * BUG: FakeHuman don't be enemy if don't share border
 * BUG: when send boat only captures one pixel
 * store cookies
-* names dissapear on bottom of screen
+* BUG: names dissapear on bottom of screen
 * UI: boats
 * UI: current attacks
 * UI: leader board

src/client/graphics/layers/NameLayer.ts

@@ -8,6 +8,7 @@ import {TransformHandler} from "../TransformHandler"
 import {renderTroops} from "../Utils"
 import traitorIcon from '../../../../resources/images/TraitorIcon.png';
 import allianceIcon from '../../../../resources/images/AllianceIcon.png';
+import crownIcon from '../../../../resources/images/CrownIcon.png';
 import {ClientID} from "../../../core/Schemas"
 
 
@@ -33,9 +34,13 @@ export class NameLayer implements Layer {
     private seenPlayers: Set<Player> = new Set()
     private traitorIconImage: HTMLImageElement;
     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) {
@@ -44,6 +49,9 @@ export class NameLayer implements Layer {
 
         this.allianceIconImage = new Image()
         this.allianceIconImage.src = allianceIcon
+
+        this.crownIconImage = new Image()
+        this.crownIconImage.src = crownIcon
     }
 
     shouldTransform(): boolean {
@@ -59,6 +67,12 @@ export class NameLayer implements Layer {
         const now = Date.now()
         if (now - this.lastChecked > this.refreshRate) {
             this.lastChecked = now
+
+            const sorted = this.game.players().sort((a, b) => b.numTilesOwned() - a.numTilesOwned())
+            if (sorted.length > 0) {
+                this.firstPlace = sorted[0]
+            }
+
             this.renders = this.renders.filter(r => r.player.isAlive())
             for (const player of this.game.players()) {
                 if (player.isAlive()) {
@@ -130,6 +144,17 @@ export class NameLayer implements Layer {
         // const iconX = nameCenterX + render.fontSize * 2; // Position to the right of the name
         // const iconY = nameCenterY - render.fontSize / 2;
 
+        if (render.player == this.firstPlace) {
+            context.drawImage(
+                this.crownIconImage,
+                nameCenterX - iconSize / 2,
+                nameCenterY - iconSize / 2,
+                iconSize,
+                iconSize
+            );
+        }
+
+
         if (render.player.isTraitor() && this.traitorIconImage.complete) {
             context.drawImage(
                 this.traitorIconImage,
@@ -165,7 +190,7 @@ export class NameLayer implements Layer {
     }
 
     private getPlayer(): Player | null {
-        if(this.myPlayer != null) {
+        if (this.myPlayer != null) {
             return this.myPlayer
         }
         this.myPlayer = this.game.players().find(p => p.clientID() == this.clientID)