Merge pull request #149 from UnBuiltTree/icon-remake

Icon Remake

src/client/graphics/layers/StructureLayer.ts

@@ -3,10 +3,10 @@ import { Theme } from "../../../core/configuration/Config";
 import { Layer } from "./Layer";
 import { EventBus } from "../../../core/EventBus";
 
-import anchorIcon from "../../../../resources/images/AnchorIcon.png";
-import missileSiloIcon from "../../../../resources/images/MissileSiloUnit.png";
-import shieldIcon from "../../../../resources/images/ShieldIcon.png";
-import cityIcon from "../../../../resources/images/CityIcon.png";
+import anchorIcon from "../../../../resources/images/buildings/port1.png";
+import missileSiloIcon from "../../../../resources/images/buildings/silo1.png";
+import shieldIcon from "../../../../resources/images/buildings/fortAlt2.png";
+import cityIcon from "../../../../resources/images/buildings/cityAlt1.png";
 import { GameView, UnitView } from "../../../core/game/GameView";
 import { Cell, UnitType } from "../../../core/game/Game";
 import { GameUpdateType } from "../../../core/game/GameUpdates";
@@ -30,8 +30,13 @@ export class StructureLayer implements Layer {
   private readonly unitConfigs: Partial<Record<UnitType, UnitRenderConfig>> = {
     [UnitType.Port]: {
       icon: anchorIcon,
-      borderRadius: 8,
-      territoryRadius: 6,
+      borderRadius: 8.525,
+      territoryRadius: 6.525,
+    },
+    [UnitType.City]: {
+      icon: cityIcon,
+      borderRadius: 8.525,
+      territoryRadius: 6.525,
     },
     [UnitType.MissileSilo]: {
       icon: missileSiloIcon,
@@ -43,11 +48,6 @@ export class StructureLayer implements Layer {
       borderRadius: 8,
       territoryRadius: 6,
     },
-    [UnitType.City]: {
-      icon: cityIcon,
-      borderRadius: 8,
-      territoryRadius: 6,
-    },
   };
 
   constructor(

src/core/game/GameMap.ts

@@ -321,7 +321,16 @@ export function euclDistFN(
   root: TileRef,
   dist: number,
 ): (gm: GameMap, tile: TileRef) => boolean {
-  return (gm: GameMap, n: TileRef) => gm.euclideanDist(root, n) <= dist;
+  return (gm: GameMap, n: TileRef) => {
+    // shifts the root tile’s coordinates by -0.5 so that its “center”
+    // center becomes the corner of four pixels rather than the middle of one pixel.
+    // just makes things based off even pixels instead of odd. Used to use 9x9 icons now 10x10 icons etc...
+    const rootX = gm.x(root) - 0.5;
+    const rootY = gm.y(root) - 0.5;
+    const dx = gm.x(n) - rootX;
+    const dy = gm.y(n) - rootY;
+    return Math.sqrt(dx * dx + dy * dy) <= dist;
+  };
 }
 
 export function manhattanDistFN(