From d2c455f9d2ebfc840b4ad634e58bf1a7aa848d7e Mon Sep 17 00:00:00 2001
From: Evan <evanpelle@gmail.com>
Date: Sat, 5 Apr 2025 14:47:54 -0700
Subject: [PATCH] smooth image when zoomed out

---
 src/client/graphics/GameRenderer.ts        |  2 +-
 src/client/graphics/layers/TerrainLayer.ts | 13 ++++++++++++-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/client/graphics/GameRenderer.ts b/src/client/graphics/GameRenderer.ts
index fe743ef54..1fe89a791 100644
--- a/src/client/graphics/GameRenderer.ts
+++ b/src/client/graphics/GameRenderer.ts
@@ -126,7 +126,7 @@ export function createRenderer(
   playerPanel.emojiTable = emojiTable;
 
   const layers: Layer[] = [
-    new TerrainLayer(game),
+    new TerrainLayer(game, transformHandler),
     new TerritoryLayer(game, eventBus),
     new StructureLayer(game, eventBus),
     new UnitLayer(game, eventBus, clientID, transformHandler),
diff --git a/src/client/graphics/layers/TerrainLayer.ts b/src/client/graphics/layers/TerrainLayer.ts
index 82a6fa8b8..d84c1ef9d 100644
--- a/src/client/graphics/layers/TerrainLayer.ts
+++ b/src/client/graphics/layers/TerrainLayer.ts
@@ -1,5 +1,6 @@
 import { Theme } from "../../../core/configuration/Config";
 import { GameView } from "../../../core/game/GameView";
+import { TransformHandler } from "../TransformHandler";
 import { Layer } from "./Layer";
 
 export class TerrainLayer implements Layer {
@@ -8,7 +9,10 @@ export class TerrainLayer implements Layer {
   private imageData: ImageData;
   private theme: Theme;
 
-  constructor(private game: GameView) {}
+  constructor(
+    private game: GameView,
+    private transformHandler: TransformHandler,
+  ) {}
   shouldTransform(): boolean {
     return true;
   }
@@ -54,6 +58,13 @@ export class TerrainLayer implements Layer {
   }
 
   renderLayer(context: CanvasRenderingContext2D) {
+    console.log(this.transformHandler.scale);
+    if (this.transformHandler.scale < 1) {
+      context.imageSmoothingEnabled = true;
+      context.imageSmoothingQuality = "low";
+    } else {
+      context.imageSmoothingEnabled = false;
+    }
     context.drawImage(
       this.canvas,
       -this.game.width() / 2,