From 8527be39fbe461cfe00a54293722dd7780523458 Mon Sep 17 00:00:00 2001
From: cha0s <git@cha0s.io>
Date: Sun, 17 Nov 2024 04:11:15 -0600
Subject: [PATCH] feat: debug flags

---
 app/react/components/devtools/dashboard.jsx | 26 ++++++++++-----------
 app/react/components/pixi/ecs.jsx           |  6 +++--
 app/react/components/pixi/entities.jsx      |  2 +-
 app/react/components/ui.jsx                 |  2 +-
 app/routes/_main-menu.play.$.$/route.jsx    |  5 +++-
 5 files changed, 22 insertions(+), 19 deletions(-)

diff --git a/app/react/components/devtools/dashboard.jsx b/app/react/components/devtools/dashboard.jsx
index 9fe6e19..b36c89b 100644
--- a/app/react/components/devtools/dashboard.jsx
+++ b/app/react/components/devtools/dashboard.jsx
@@ -1,22 +1,11 @@
-import {useCallback, useState} from 'react';
-
 import {useClient} from '@/react/context/client.js';
-import {useEcsTick} from '@/react/context/ecs.js';
-import {useMainEntity} from '@/react/context/main-entity.js';
+import {useDebug} from '@/react/context/debug.js';
 
 import styles from './dashboard.module.css';
 
 function Dashboard() {
   const client = useClient();
-  const mainEntityRef = useMainEntity();
-  const [mainEntityJson, setMainEntityJson] = useState('');
-  const onEcsTick = useCallback((payload, ecs) => {
-    if (!mainEntityRef.current) {
-      return;
-    }
-    setMainEntityJson(JSON.stringify(ecs.get(mainEntityRef.current), null, 2));
-  }, [mainEntityRef]);
-  useEcsTick(onEcsTick);
+  const [debug, setDebug] = useDebug();
   return (
     <div className={styles.dashboard}>
       <form>
@@ -25,8 +14,17 @@ function Dashboard() {
           <div>{Math.round(((client.throughput.down * 8) / 1024) * 10) / 10}kb/s down</div>
           <div>{Math.round(((client.throughput.up * 8) / 1024) * 10) / 10}kb/s up</div>
         </div>
+        <label>
+          Disable ambient light
+          <input
+            type="checkbox"
+            checked={debug.disableAmbientLight}
+            onChange={() => {
+              setDebug({...debug, disableAmbientLight: !debug.disableAmbientLight});
+            }}
+          />
+        </label>
       </form>
-      <pre><code><small>{mainEntityJson}</small></code></pre>
     </div>
   );
 }
diff --git a/app/react/components/pixi/ecs.jsx b/app/react/components/pixi/ecs.jsx
index 157fbbd..7d9670a 100644
--- a/app/react/components/pixi/ecs.jsx
+++ b/app/react/components/pixi/ecs.jsx
@@ -1,6 +1,7 @@
 import {Container, useApp} from '@pixi/react';
 import {useCallback, useState} from 'react';
 
+import {useDebug} from '@/react/context/debug.js';
 import {useEcsTick} from '@/react/context/ecs.js';
 import {useMainEntity} from '@/react/context/main-entity.js';
 
@@ -12,6 +13,7 @@ import Water from './water.jsx';
 
 export default function Ecs({monopolizers, particleWorker}) {
   const app = useApp();
+  const [debug] = useDebug();
   const mainEntityRef = useMainEntity();
   const [layers, setLayers] = useState([]);
   const [projected, setProjected] = useState([]);
@@ -104,7 +106,7 @@ export default function Ecs({monopolizers, particleWorker}) {
               }
             }
             // 7 - 19 day
-            if (hour >= 7 && hour < 19) {
+            if (debug.disableAmbientLight || hour >= 7 && hour < 19) {
               brightness = 1;
               color = 0xffffff;
             }
@@ -132,7 +134,7 @@ export default function Ecs({monopolizers, particleWorker}) {
           : projected;
       });
     }
-  }, [app.ambientLight, mainEntityRef]);
+  }, [app.ambientLight, debug, mainEntityRef]);
   useEcsTick(onEcsTick);
   return (
     <>
diff --git a/app/react/components/pixi/entities.jsx b/app/react/components/pixi/entities.jsx
index 722ef43..c758baf 100644
--- a/app/react/components/pixi/entities.jsx
+++ b/app/react/components/pixi/entities.jsx
@@ -60,7 +60,7 @@ export default function Entities({monopolizers, particleWorker}) {
   }, []);
   useEffect(() => {
     for (const key in entities.current) {
-      entities.current[key].setDebug(debug);
+      entities.current[key].setDebug(debug.info);
     }
   }, [debug]);
   usePacket('EcsChange', () => {
diff --git a/app/react/components/ui.jsx b/app/react/components/ui.jsx
index 0e9b4b8..cbe079e 100644
--- a/app/react/components/ui.jsx
+++ b/app/react/components/ui.jsx
@@ -198,7 +198,7 @@ function Ui({disconnected}) {
             event.preventDefault();
           }
           if ('keyDown' === type) {
-            setDebug((debug) => !debug);
+            setDebug(({...debug}) => ({...debug, info: !debug.info}));
           }
           return;
         }
diff --git a/app/routes/_main-menu.play.$.$/route.jsx b/app/routes/_main-menu.play.$.$/route.jsx
index 8b96d5c..d1dd8bb 100644
--- a/app/routes/_main-menu.play.$.$/route.jsx
+++ b/app/routes/_main-menu.play.$.$/route.jsx
@@ -16,7 +16,10 @@ export default function PlaySpecific() {
   const assetsTuple = useState({});
   const [client, setClient] = useState();
   const mainEntityRef = useRef();
-  const debugTuple = useState(false);
+  const debugTuple = useState({
+    disableAmbientLight: false,
+    info: false,
+  });
   const reconnectionBackoff = useRef(0);
   const ecsRef = useRef();
   const [disconnected, setDisconnected] = useState(false);