IYRYOO3B2EFA2O3JJKOQLEQ6WWDCCGEH3LSFCZJUMBXTVYFZS44QC
EMED7UWAGESRTWJJWVXRL27O4XMBGZDDAU4LNVF3MQAYKFKRDNXQC
26RDNOXGRCW2E2AOUTKMARJZEGCTVB5K27YXFQFGIAFJ3PP4LWDAC
5BA7VZ3D36S2TC7NZ64R3O364TGXPY5BJUJTGCFZHWZ6JWAXJMUQC
JG36CDUKVUWJT25PJVMWKWI4KFRHM24PFBKPXXRY3D2XVDKUVI7QC
AAKN4XJLZ2GARZMUFYX3CJZKYHTRRZDYNTFRLMY7VPAY7K6W4N3QC
XF75MWE3S7HPZXDNR5A5BCRAYO3AYCPUQ4KS6JAAH5DWJRYBKJTQC
OYNCMT7YDCHK7TFRZDVCMODYMYXRQKK3AU7EOZU7KRA76QGKI3EQC
YNOQHSPKQHAODMORMW4GKQZK5SCC2LYAFLJHH3GEMZTDM7N52JAAC
OEKGYL6XZFMUSQPDFFMGGNAPDDKNW4XJNY6ALYQILBLNCRD5BFRAC
X77LI6U3MBQUEVD6KZ5GTHOCQU2OSUXAMQ52TJKOBFVKAPUENBLAC
T6RGFAV3VFISSGKMFKK544MGGXCURAO4ARG22R5O75UBUKPHFM5AC
THNMNMVRZQVPZTEXHIK6WGYN3QDEFPKFOVOCB5HTWCYC5BOBYQ5AC
QU7JVYXAGGNN4754FJAT7HFTSFHLLIWWNIVYBMCBQJVSLTB5RNIQC
4TYJCGT4MTCAH7GSJJWFQPPHZNAUQZDEIZYT365EYTMXS7D2MTNAC
<h1>{focusedNode.chunk?.id}</h1>
{a.map((z) => (
<div>{z}</div>
))}
<h1>Current</h1>
<h3>Chunk: {focusedNode.chunk?.id}</h3>
<h3>X: {focusedNode.node.location.x}</h3>
<h3>Y: {focusedNode.node.location.y}</h3>
<h2>Previous</h2>
{history.map(({ chunk, node }, i) => {
return (
<div key={i}>
Chunk {chunk.id} at {node.location.x},{node.location.y}
</div>
);
})}
useEffect(() => {
const [application, setApplication] = useState();
function initializeApplication() {
const newApp = new Application({
originalWindowWidth: window.innerWidth,
originalWindowHeight: window.innerHeight,
onFocusedNodeChange,
});
container.current!.removeChild(application.app.view);
// application = new Application({ originalWindowWidth: window.innerHeight * .75, originalWindowHeight: window.innerHeight * .75 });
application = new Application({
originalWindowWidth: window.innerWidth,
originalWindowHeight: window.innerHeight,
});
container.current!.appendChild(application.app.view);
application.drawStart();
container.current!.removeChild(application?.app?.view);
initializeApplication();