From 33cb3a7d0a7860ce3c0ef08dc8663e37fa0442e1 Mon Sep 17 00:00:00 2001
From: Evan <evanpelle@gmail.com>
Date: Tue, 18 Feb 2025 19:43:37 -0800
Subject: [PATCH] make pop increase rate yellow or green if
 increasing/decreasing

---
 src/client/graphics/layers/ControlPanel.ts | 21 +++++++++++++++++++--
 1 file changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/client/graphics/layers/ControlPanel.ts b/src/client/graphics/layers/ControlPanel.ts
index dd1468265..3ddd1eed8 100644
--- a/src/client/graphics/layers/ControlPanel.ts
+++ b/src/client/graphics/layers/ControlPanel.ts
@@ -52,6 +52,10 @@ export class ControlPanel extends LitElement implements Layer {
   @state()
   private _goldPerSecond: number;
 
+  private _lastPopulationIncreaseRate: number;
+
+  private _popRateIsIncreasing: boolean = true;
+
   init() {
     this.attackRatio = 0.2;
     this.uiState.attackRatio = this.attackRatio;
@@ -63,12 +67,19 @@ export class ControlPanel extends LitElement implements Layer {
       this.setVisibile(true);
     }
 
-    const player = this.game.playerByClientID(this.clientID);
+    const player = this.game.myPlayer();
     if (player == null || !player.isAlive()) {
       this.setVisibile(false);
       return;
     }
 
+    const popIncreaseRate = player.population() - this._population;
+    if (this.game.ticks() % 5 == 0) {
+      this._popRateIsIncreasing =
+        popIncreaseRate >= this._lastPopulationIncreaseRate;
+      this._lastPopulationIncreaseRate = popIncreaseRate;
+    }
+
     this._population = player.population();
     this._maxPopulation = this.game.config().maxPopulation(player);
     this._gold = player.gold();
@@ -78,6 +89,7 @@ export class ControlPanel extends LitElement implements Layer {
     this._goldPerSecond = this.game.config().goldAdditionRate(player) * 10;
 
     this.currentTroopRatio = player.troops() / player.population();
+    this.requestUpdate();
   }
 
   onAttackRatioChange(newRatio: number) {
@@ -163,7 +175,12 @@ export class ControlPanel extends LitElement implements Layer {
             <span
               >${renderTroops(this._population)} /
               ${renderTroops(this._maxPopulation)}
-              (+${renderTroops(this.popRate)})</span
+              <span
+                class="${this._popRateIsIncreasing
+                  ? "text-green-500"
+                  : "text-yellow-500"}"
+                >(+${renderTroops(this.popRate)})</span
+              ></span
             >
           </div>
           <div class="flex justify-between">