diff --git a/index.html b/index.html
index 0b58ea1..e242df1 100644
--- a/index.html
+++ b/index.html
@@ -132,6 +132,7 @@
Q homeW food
E obstacleR erase
+ V toggle view mode
drag + scroll to move camera
diff --git a/src/App.ts b/src/App.ts
index 6aa39ec..5881461 100644
--- a/src/App.ts
+++ b/src/App.ts
@@ -1,4 +1,4 @@
-import Config from "./Config";
+import Config, { saveConfig } from "./Config";
import GUI from "./GUI";
import Renderer from "./Renderer";
import StatsOverlay from "./StatsOverlay";
@@ -48,6 +48,11 @@ export default new (class App {
this.gui.on("zoomChange", () => {
this.scenes.screen.applyCameraZoom();
});
+
+ window.addEventListener("viewModeToggle", () => {
+ saveConfig();
+ this.resetRenderer();
+ });
}
private resetRenderer() {
diff --git a/src/Config.ts b/src/Config.ts
index 42cc365..93d1513 100644
--- a/src/Config.ts
+++ b/src/Config.ts
@@ -15,7 +15,7 @@ const defaults = {
brushRadius: 20,
cameraZoom: 0,
gravityDirection: "down" as const,
- viewMode: "side" as const,
+ viewMode: "side" as "side" | "top",
// per-channel pheromone params
repellentFadeOutFactor: 0.0005,
repellentBlurRadius: 0.05,
diff --git a/src/GUI.ts b/src/GUI.ts
index f0806d7..7a81359 100644
--- a/src/GUI.ts
+++ b/src/GUI.ts
@@ -50,6 +50,11 @@ class GUIController {
.step(0.1)
.listen()
.onChange(() => this.emit("zoomChange"));
+ controlsFolder
+ .add(Config, "viewMode", ["side", "top"])
+ .name("View mode")
+ .listen()
+ .onChange(() => this.saveAndEmit("reset"));
simFolder.open();
controlsFolder.open();
diff --git a/src/scenes/ScreenScene.ts b/src/scenes/ScreenScene.ts
index a641dd2..d2dc4b4 100644
--- a/src/scenes/ScreenScene.ts
+++ b/src/scenes/ScreenScene.ts
@@ -174,6 +174,12 @@ export default class ScreenScene extends AbstractScene {
this.drawMode = MAT_DIRT;
break;
}
+ case "KeyV": {
+ Config.viewMode =
+ Config.viewMode === "side" ? "top" : "side";
+ window.dispatchEvent(new CustomEvent("viewModeToggle"));
+ break;
+ }
}
});