refactor: readAsset to first-class

app/ecs-components/inventory.js

@@ -48,7 +48,7 @@ export default class Inventory extends Component {
       if (!(slot in slots)) {
         return undefined;
       }
-      const {Engine: {readAsset}} = Component.ecs.get(1);
+      const {readAsset} = Component.ecs;
       const json = await (
         readAsset([slots[slot].source, 'item.json'].join('/'))
           .then((response) => (response.ok ? response.json() : {}))

app/engine.js

@@ -32,7 +32,12 @@ export default class Engine {
         super.transmit(connection, encode(packet));
       }
     }
-    this.server = new SilphiusServer();
+    const server = this.server = new SilphiusServer();
+    this.Ecs = class EngineEcs extends Ecs {
+      readAsset(uri) {
+        return server.readAsset(uri);
+      }
+    }
     this.server.addPacketListener('Action', (connection, payload) => {
       this.incomingActions.push([this.connectedPlayers.get(connection).entity, payload]);
     });
@@ -112,7 +117,7 @@ export default class Engine {
   }
 
   createEcs() {
-    return new Ecs({Components, Systems});
+    return new this.Ecs({Components, Systems});
   }
 
   async createHomestead(id) {
@@ -217,11 +222,10 @@ export default class Engine {
   }
 
   async loadEcs(path) {
-    const ecs = this.ecses[path] = await Ecs.deserialize(
+    this.ecses[path] = await this.Ecs.deserialize(
       this.createEcs(),
       await this.server.readData(path),
     );
-    ecs.get(1).Engine.readAsset = (uri) => this.server.readAsset(uri);
   }
 
   async loadPlayer(id) {
@@ -240,7 +244,7 @@ export default class Engine {
   }
 
   async saveEcs(path, ecs) {
-    const view = Ecs.serialize(ecs);
+    const view = this.Ecs.serialize(ecs);
     await this.server.writeData(path, view);
   }
 

app/react-components/ui.jsx

@@ -154,9 +154,6 @@ export default function Ui({disconnected}) {
       return;
     }
     await ecs.apply(payload.ecs);
-    if (payload.ecs[1]) {
-      ecs.get(1).Engine.readAsset = (uri) => fetch(new URL(uri, window.location.origin));
-    }
     for (const listener of client.listeners[':Ecs'] ?? []) {
       listener(payload.ecs);
     }

app/routes/_main-menu.play.$.$/route.jsx

@@ -12,6 +12,12 @@ import Systems from '@/ecs-systems/index.js';
 import Ui from '@/react-components/ui.jsx';
 import {juggleSession} from '@/session.server';
 
+class ClientEcs extends Ecs {
+  readAsset(uri) {
+    return fetch(new URL(uri, window.location.origin));
+  }
+}
+
 export async function loader({request}) {
   await juggleSession(request);
   return json({});
@@ -22,7 +28,7 @@ export default function PlaySpecific() {
   const [client, setClient] = useState();
   const mainEntityTuple = useState();
   const debugTuple = useState(false);
-  const ecsTuple = useState(new Ecs({Components, Systems}));
+  const ecsTuple = useState(new ClientEcs({Components, Systems}));
   const [disconnected, setDisconnected] = useState(false);
   const params = useParams();
   const [type, url] = params['*'].split('/');