reimplement defense posts

src/client/graphics/layers/BuildMenu.ts

@@ -16,6 +16,7 @@ import missileSiloIcon from "../../../../resources/images/MissileSiloIconWhite.s
 import goldCoinIcon from "../../../../resources/images/GoldCoinIcon.svg";
 import portIcon from "../../../../resources/images/PortIcon.svg";
 import cityIcon from "../../../../resources/images/CityIconWhite.svg";
+import shieldIcon from "../../../../resources/images/ShieldIconWhite.svg";
 import { renderNumber } from "../../Utils";
 import { GameView, PlayerView } from "../../../core/game/GameView";
 
@@ -31,7 +32,7 @@ const buildTable: BuildItemDisplay[][] = [
     { unitType: UnitType.Warship, icon: warshipIcon },
     { unitType: UnitType.Port, icon: portIcon },
     { unitType: UnitType.MissileSilo, icon: missileSiloIcon },
-    // { unitType: UnitType.DefensePost, icon: shieldIcon },
+    { unitType: UnitType.DefensePost, icon: shieldIcon },
     { unitType: UnitType.City, icon: cityIcon },
   ],
 ];

src/client/graphics/layers/TerritoryLayer.ts

@@ -7,7 +7,7 @@ import {
   Unit,
   UnitType,
 } from "../../../core/game/Game";
-import { UnitUpdate } from "../../../core/game/GameUpdates";
+import { GameUpdateType, UnitUpdate } from "../../../core/game/GameUpdates";
 import { PseudoRandom } from "../../../core/PseudoRandom";
 import { colord, Colord } from "colord";
 import { Theme } from "../../../core/configuration/Config";
@@ -19,7 +19,11 @@ import {
   MouseDownEvent,
 } from "../../InputHandler";
 import { GameView, PlayerView } from "../../../core/game/GameView";
-import { euclDistFN, TileRef } from "../../../core/game/GameMap";
+import {
+  euclDistFN,
+  manhattanDistFN,
+  TileRef,
+} from "../../../core/game/GameMap";
 
 export class TerritoryLayer implements Layer {
   private canvas: HTMLCanvasElement;
@@ -46,10 +50,7 @@ export class TerritoryLayer implements Layer {
   private refreshRate = 50;
   private lastRefresh = 0;
 
-  constructor(
-    private game: GameView,
-    private eventBus: EventBus,
-  ) {
+  constructor(private game: GameView, private eventBus: EventBus) {
     this.theme = game.config().theme();
   }
 
@@ -59,6 +60,25 @@ export class TerritoryLayer implements Layer {
 
   tick() {
     this.game.recentlyUpdatedTiles().forEach((t) => this.enqueueTile(t));
+    this.game.updatesSinceLastTick()[GameUpdateType.Unit].forEach((u) => {
+      const update = u as UnitUpdate;
+      if (update.unitType == UnitType.DefensePost && update.isActive) {
+        const tile = this.game.ref(update.pos.x, update.pos.y);
+        this.game
+          .bfs(
+            tile,
+            manhattanDistFN(tile, this.game.config().defensePostRange())
+          )
+          .forEach((t) => {
+            if (
+              this.game.isBorder(t) &&
+              this.game.ownerID(t) == update.ownerID
+            ) {
+              this.enqueueTile(t);
+            }
+          });
+      }
+    });
 
     if (!this.game.inSpawnPhase()) {
       return;
@@ -71,7 +91,7 @@ export class TerritoryLayer implements Layer {
       0,
       0,
       this.game.width(),
-      this.game.height(),
+      this.game.height()
     );
     const humans = this.game
       .playerViews()
@@ -91,7 +111,7 @@ export class TerritoryLayer implements Layer {
           this.paintHighlightCell(
             new Cell(this.game.x(tile), this.game.y(tile)),
             this.theme.spawnHighlightColor(),
-            255,
+            255
           );
         }
       }
@@ -117,7 +137,7 @@ export class TerritoryLayer implements Layer {
       0,
       0,
       this.game.width(),
-      this.game.height(),
+      this.game.height()
     );
     this.initImageData();
     this.canvas.width = this.game.width();
@@ -164,7 +184,7 @@ export class TerritoryLayer implements Layer {
       -this.game.width() / 2,
       -this.game.height() / 2,
       this.game.width(),
-      this.game.height(),
+      this.game.height()
     );
     if (this.game.inSpawnPhase()) {
       context.drawImage(
@@ -172,7 +192,7 @@ export class TerritoryLayer implements Layer {
         -this.game.width() / 2,
         -this.game.height() / 2,
         this.game.width(),
-        this.game.height(),
+        this.game.height()
       );
     }
   }
@@ -203,27 +223,39 @@ export class TerritoryLayer implements Layer {
           this.game.x(tile),
           this.game.y(tile),
           this.theme.falloutColor(),
-          150,
+          150
         );
         return;
       }
       this.clearCell(new Cell(this.game.x(tile), this.game.y(tile)));
       return;
     }
-    const owner = this.game.owner(tile) as Player;
+    const owner = this.game.owner(tile) as PlayerView;
     if (this.game.isBorder(tile)) {
-      this.paintCell(
-        this.game.x(tile),
-        this.game.y(tile),
-        this.theme.borderColor(owner.info()),
-        255,
-      );
+      if (
+        this.game.nearbyDefenses(tile).filter((u) => u.owner() == owner)
+          .length > 0
+      ) {
+        this.paintCell(
+          this.game.x(tile),
+          this.game.y(tile),
+          this.theme.defendedBorderColor(owner.info()),
+          255
+        );
+      } else {
+        this.paintCell(
+          this.game.x(tile),
+          this.game.y(tile),
+          this.theme.borderColor(owner.info()),
+          255
+        );
+      }
     } else {
       this.paintCell(
         this.game.x(tile),
         this.game.y(tile),
         this.theme.territoryColor(owner.info()),
-        150,
+        150
       );
     }
   }