Add WebGPU Debug Overlay and Shader Management

- Introduced WebGPUComputeMetricsEvent to track compute timing.
- Added WebGPUDebugOverlay component for displaying WebGPU performance metrics.
- Refactored TerritoryLayer to utilize new shader management for territory rendering.
- Updated shaders to support new parameters for enhanced visual effects.
- Removed deprecated territory border mode settings from UserSettingModal and SettingsModal.
- Enhanced GroundTruthData to manage new textures for owner indices and relations.
- Improved shader parameter handling in TerritoryRenderer and related classes.

This commit enhances the WebGPU rendering pipeline, providing better performance insights and visual fidelity through improved shader management and debugging capabilities.

src/core/game/UserSettings.ts

@@ -55,6 +55,10 @@ export class UserSettings {
     return this.get("settings.performanceOverlay", false);
   }
 
+  webgpuDebug(): boolean {
+    return this.get("settings.webgpuDebug", true);
+  }
+
   alertFrame() {
     return this.get("settings.alertFrame", true);
   }
@@ -87,10 +91,6 @@ export class UserSettings {
     return this.get("settings.territoryPatterns", true);
   }
 
-  territoryBorderMode(): number {
-    return this.getInt("settings.territoryBorderMode", 1);
-  }
-
   cursorCostLabel() {
     const legacy = this.get("settings.ghostPricePill", true);
     return this.get("settings.cursorCostLabel", legacy);
@@ -118,6 +118,10 @@ export class UserSettings {
     this.set("settings.performanceOverlay", !this.performanceOverlay());
   }
 
+  toggleWebgpuDebug() {
+    this.set("settings.webgpuDebug", !this.webgpuDebug());
+  }
+
   toggleAlertFrame() {
     this.set("settings.alertFrame", !this.alertFrame());
   }