76 lines
1.8 KiB
TypeScript
76 lines
1.8 KiB
TypeScript
|
import { useProcesses } from "contexts/process";
|
||
|
|
import { useSession } from "contexts/session";
|
||
|
|
import { useEffect } from "react";
|
||
|
|
import { useTheme } from "styled-components";
|
||
|
|
import { loadFiles, pxToNum } from "utils/functions";
|
||
|
|
|
||
|
|
declare global {
|
||
|
|
interface Window {
|
||
|
|
AL?: {
|
||
|
|
contexts: {
|
||
|
|
ctx: AudioContext;
|
||
|
|
}[];
|
||
|
|
};
|
||
|
|
ioq3?: {
|
||
|
|
callMain: (args: string[]) => void;
|
||
|
|
elementPointerLock: boolean;
|
||
|
|
exit: () => void;
|
||
|
|
exitHandler: (error: Error | null) => void;
|
||
|
|
setCanvasSize: (width: number, height: number) => void;
|
||
|
|
viewport: HTMLDivElement | null;
|
||
|
|
};
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
const useQuake3 = (
|
||
|
|
id: string,
|
||
|
|
_url: string,
|
||
|
|
containerRef: React.MutableRefObject<HTMLDivElement | null>,
|
||
|
|
setLoading: React.Dispatch<React.SetStateAction<boolean>>
|
||
|
|
): void => {
|
||
|
|
const { processes: { [id]: { libs = [] } = {} } = {} } = useProcesses();
|
||
|
|
const {
|
||
|
|
windowStates: { [id]: windowState },
|
||
|
|
} = useSession();
|
||
|
|
const {
|
||
|
|
sizes: { titleBar },
|
||
|
|
} = useTheme();
|
||
|
|
const { size } = windowState || {};
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
loadFiles(libs).then(() => {
|
||
|
|
if (!window.ioq3) return;
|
||
|
|
|
||
|
|
window.ioq3.viewport = containerRef.current;
|
||
|
|
window.ioq3.elementPointerLock = true;
|
||
|
|
window.ioq3.callMain([]);
|
||
|
|
|
||
|
|
setLoading(false);
|
||
|
|
});
|
||
|
|
}, [containerRef, libs, setLoading]);
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
if (!window.ioq3) return;
|
||
|
|
|
||
|
|
window.ioq3.setCanvasSize(
|
||
|
|
pxToNum(size?.width),
|
||
|
|
pxToNum(size?.height) - titleBar.height
|
||
|
|
);
|
||
|
|
}, [setLoading, size, titleBar.height]);
|
||
|
|
|
||
|
|
useEffect(
|
||
|
|
() => () => {
|
||
|
|
try {
|
||
|
|
window.ioq3?.exit();
|
||
|
|
} catch {
|
||
|
|
// Ignore error on exit
|
||
|
|
}
|
||
|
|
|
||
|
|
window.AL?.contexts.forEach(({ ctx }) => ctx.close());
|
||
|
|
},
|
||
|
|
[]
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default useQuake3;
|