refactor: useEcsTick (always after apply)

This commit is contained in:
cha0s 2024-06-27 05:44:34 -05:00
parent 438a0c3be5
commit 76f18e09c7
4 changed files with 28 additions and 17 deletions

View File

@ -14,9 +14,12 @@ export function usePacket(type, fn, dependencies) {
if (!client) { if (!client) {
return; return;
} }
client.addPacketListener(type, fn); function listener(payload) {
fn(payload, client);
}
client.addPacketListener(type, listener);
return () => { return () => {
client.removePacketListener(type, fn); client.removePacketListener(type, listener);
}; };
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [client, ...dependencies]); }, [client, ...dependencies]);

View File

@ -1,5 +1,7 @@
import {createContext, useContext} from 'react'; import {createContext, useContext} from 'react';
import {usePacket} from './client.js';
const context = createContext(); const context = createContext();
export default context; export default context;
@ -7,3 +9,8 @@ export default context;
export function useEcs() { export function useEcs() {
return useContext(context); return useContext(context);
} }
export function useEcsTick(fn, dependencies) {
const ecs = useEcs();
usePacket(':Ecs', fn, [ecs, ...dependencies]);
}

View File

@ -2,8 +2,7 @@ import {Container} from '@pixi/react';
import {useEffect, useState} from 'react'; import {useEffect, useState} from 'react';
import {RESOLUTION} from '@/constants.js'; import {RESOLUTION} from '@/constants.js';
import {usePacket} from '@/context/client.js'; import {useEcs, useEcsTick} from '@/context/ecs.js';
import {useEcs} from '@/context/ecs.js';
import {useMainEntity} from '@/context/main-entity.js'; import {useMainEntity} from '@/context/main-entity.js';
import Entities from './entities.jsx'; import Entities from './entities.jsx';
@ -25,14 +24,11 @@ export default function EcsComponent() {
}); });
} }
}, [ecs, mainEntity]); }, [ecs, mainEntity]);
usePacket('Tick', (payload) => { useEcsTick((payload) => {
if (0 === Object.keys(payload.ecs).length) {
return;
}
if ( if (
mainEntity mainEntity
&& payload.ecs[mainEntity] && payload[mainEntity]
&& (payload.ecs[mainEntity].Inventory || payload.ecs[mainEntity].Wielder) && (payload[mainEntity].Inventory || payload[mainEntity].Wielder)
) { ) {
ecs.get(mainEntity) ecs.get(mainEntity)
.Wielder.activeItem() .Wielder.activeItem()
@ -41,8 +37,8 @@ export default function EcsComponent() {
}); });
} }
const updatedEntities = {...entities}; const updatedEntities = {...entities};
for (const id in payload.ecs) { for (const id in payload) {
const update = payload.ecs[id]; const update = payload[id];
if (false === update) { if (false === update) {
delete updatedEntities[id]; delete updatedEntities[id];
} }

View File

@ -4,7 +4,7 @@ import addKeyListener from '@/add-key-listener.js';
import {RESOLUTION} from '@/constants.js'; import {RESOLUTION} from '@/constants.js';
import {useClient, usePacket} from '@/context/client.js'; import {useClient, usePacket} from '@/context/client.js';
import {useDebug} from '@/context/debug.js'; import {useDebug} from '@/context/debug.js';
import {useEcs} from '@/context/ecs.js'; import {useEcs, useEcsTick} from '@/context/ecs.js';
import {useMainEntity} from '@/context/main-entity.js'; import {useMainEntity} from '@/context/main-entity.js';
import Disconnected from './disconnected.jsx'; import Disconnected from './disconnected.jsx';
@ -149,15 +149,20 @@ export default function Ui({disconnected}) {
} }
}); });
}, [client, debug, setDebug]); }, [client, debug, setDebug]);
usePacket('Tick', (payload) => { usePacket('Tick', async (payload, client) => {
if (0 === Object.keys(payload.ecs).length) { if (0 === Object.keys(payload.ecs).length) {
return; return;
} }
ecs.apply(payload.ecs); await ecs.apply(payload.ecs);
for (const listener of client.listeners[':Ecs'] ?? []) {
listener(payload.ecs);
}
}, [hotbarSlots, mainEntity, setMainEntity]);
useEcsTick((payload) => {
let localMainEntity = mainEntity; let localMainEntity = mainEntity;
for (const id in payload.ecs) { for (const id in payload) {
const entity = ecs.get(id); const entity = ecs.get(id);
const update = payload.ecs[id]; const update = payload[id];
if (update.Sound?.play) { if (update.Sound?.play) {
for (const sound of update.Sound.play) { for (const sound of update.Sound.play) {
(new Audio(sound)).play(); (new Audio(sound)).play();