add setting

resources/lang/en.json

@@ -245,6 +245,8 @@
     "attack_ratio_desc": "What percentage of your troops to send in an attack (1–100%)",
     "troop_ratio_label": "🪖🛠️ Troops and Workers Ratio",
     "troop_ratio_desc": "Adjust the balance between troops (for combat) and workers (for gold production) (1–100%)",
+    "territory_patterns_label": "🏳️ Territory Patterns",
+    "territory_patterns_desc": "Choose whether to display territory pattern designs in game",
     "easter_writing_speed_label": "Writing Speed Multiplier",
     "easter_writing_speed_desc": "Adjust how fast you pretend to code (x1–x100)",
     "easter_bug_count_label": "Bug Count",

src/client/UserSettingModal.ts

@@ -150,6 +150,15 @@ export class UserSettingModal extends LitElement {
     }
   }
 
+  private toggleTerritoryPatterns(e: CustomEvent<{ checked: boolean }>) {
+    const enabled = e.detail?.checked;
+    if (typeof enabled !== "boolean") return;
+
+    this.userSettings.set("settings.territoryPatterns", enabled);
+
+    console.log("🏳️ Territory Patterns:", enabled ? "ON" : "OFF");
+  }
+
   private handleKeybindChange(
     e: CustomEvent<{ action: string; value: string }>,
   ) {
@@ -262,6 +271,15 @@ export class UserSettingModal extends LitElement {
         @change=${this.toggleAnonymousNames}
       ></setting-toggle>
 
+      <!-- 🏳️ Territory Patterns -->
+      <setting-toggle
+        label="${translateText("user_setting.territory_patterns_label")}"
+        description="${translateText("user_setting.territory_patterns_desc")}"
+        id="territory-patterns-toggle"
+        .checked=${this.userSettings.territoryPatterns()}
+        @change=${this.toggleTerritoryPatterns}
+      ></setting-toggle>
+
       <!-- ⚔️ Attack Ratio -->
       <setting-slider
         label="${translateText("user_setting.attack_ratio_label")}"

src/client/graphics/layers/OptionsMenu.ts

@@ -124,6 +124,12 @@ export class OptionsMenu extends LitElement implements Layer {
     this.userSettings.toggleLeftClickOpenMenu();
   }
 
+  private onToggleTerritoryPatterns() {
+    this.userSettings.toggleTerritoryPatterns();
+    this.requestUpdate();
+    this.eventBus.emit(new RefreshGraphicsEvent());
+  }
+
   init() {
     console.log("init called from OptionsMenu");
     this.showPauseButton =
@@ -207,6 +213,12 @@ export class OptionsMenu extends LitElement implements Layer {
             title: "Toggle Special effects",
             children: "💥: " + (this.userSettings.fxLayer() ? "On" : "Off"),
           })}
+          ${button({
+            onClick: this.onToggleTerritoryPatterns,
+            title: "Territory Patterns",
+            children:
+              "🏳️: " + (this.userSettings.territoryPatterns() ? "On" : "Off"),
+          })}
           ${button({
             onClick: this.onToggleDarkModeButtonClick,
             title: "Dark Mode",

src/client/graphics/layers/TerritoryLayer.ts

@@ -6,12 +6,15 @@ import { Cell, PlayerType, UnitType } from "../../../core/game/Game";
 import { euclDistFN, TileRef } from "../../../core/game/GameMap";
 import { GameUpdateType } from "../../../core/game/GameUpdates";
 import { GameView, PlayerView } from "../../../core/game/GameView";
+import { UserSettings } from "../../../core/game/UserSettings";
 import { PseudoRandom } from "../../../core/PseudoRandom";
 import { AlternateViewEvent, DragEvent } from "../../InputHandler";
 import { PatternDecoder } from "../../TerritoryPatterns";
 import { TransformHandler } from "../TransformHandler";
 import { Layer } from "./Layer";
 
+const userSettings: UserSettings = new UserSettings();
+
 export class TerritoryLayer implements Layer {
   private canvas: HTMLCanvasElement;
   private context: CanvasRenderingContext2D;
@@ -287,7 +290,7 @@ export class TerritoryLayer implements Layer {
       }
     } else {
       const patternName = owner.pattern();
-      if (!patternName) {
+      if (!patternName || !userSettings.territoryPatterns()) {
         this.paintTile(tile, this.theme.territoryColor(owner), 150);
       } else {
         const x = this.game.x(tile);

src/core/game/UserSettings.ts

@@ -33,6 +33,10 @@ export class UserSettings {
     return this.get("settings.leftClickOpensMenu", false);
   }
 
+  territoryPatterns() {
+    return this.get("settings.territoryPatterns", true);
+  }
+
   focusLocked() {
     return false;
     // TODO: renable when performance issues are fixed.
@@ -59,6 +63,10 @@ export class UserSettings {
     this.set("settings.specialEffects", !this.fxLayer());
   }
 
+  toggleTerritoryPatterns() {
+    this.set("settings.territoryPatterns", !this.territoryPatterns());
+  }
+
   toggleDarkMode() {
     this.set("settings.darkMode", !this.darkMode());
     if (this.darkMode()) {