vinzenz/servicepoint-tanks
0
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

fix double frame request

Browse source
This commit is contained in:
Vinzenz Schroeter 2024-04-30 23:45:00 +02:00 committed by RobbersDaughter
parent 061c893456
commit 0b10695e07
1 changed files with 40 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

64
tank-frontend/src/ClientScreen.tsx
View file

@ -119,33 +119,49 @@ export default function ClientScreen({theme, player}: {
useEffect(() => { useEffect(() => {
if (lastMessage === null) if (lastMessage === null)
return; return;
if (canvasRef.current === null)
throw new Error('canvas null');
const canvas = canvasRef.current; let ignore = false;
const drawContext = canvas.getContext('2d'); const start = async () => {
if (!drawContext) const canvas = canvasRef.current;
throw new Error('could not get draw context'); if (canvas === null)
throw new Error('canvas null');
let pixels = new Uint8ClampedArray(lastMessage.data); const drawContext = canvas.getContext('2d');
let additionalData: Uint8ClampedArray | null = null; if (!drawContext)
if (pixels.length > observerMessageSize) { throw new Error('could not get draw context');
additionalData = pixels.slice(observerMessageSize);
pixels = pixels.slice(0, observerMessageSize);
}
drawPixelsToCanvas({ let pixels = new Uint8ClampedArray(lastMessage.data);
context: drawContext, let additionalData: Uint8ClampedArray | null = null;
width: canvas.width, if (pixels.length > observerMessageSize) {
height: canvas.height, additionalData = pixels.slice(observerMessageSize);
pixels, pixels = pixels.slice(0, observerMessageSize);
additional: additionalData, }
background: normalizeColor(drawContext, hslToString(theme.background)),
foreground: normalizeColor(drawContext, hslToString(theme.primary)), if (ignore)
playerColor: normalizeColor(drawContext, hslToString(theme.secondary)), return;
otherTanksColor: normalizeColor(drawContext, hslToString(theme.tertiary))
}); drawPixelsToCanvas({
sendMessage(''); context: drawContext,
width: canvas.width,
height: canvas.height,
pixels,
additional: additionalData,
background: normalizeColor(drawContext, hslToString(theme.background)),
foreground: normalizeColor(drawContext, hslToString(theme.primary)),
playerColor: normalizeColor(drawContext, hslToString(theme.secondary)),
otherTanksColor: normalizeColor(drawContext, hslToString(theme.tertiary))
});
if (ignore)
return;
sendMessage('');
};
start();
return () => {
ignore = true;
};
}, [lastMessage, canvasRef.current, theme]); }, [lastMessage, canvasRef.current, theme]);
return <canvas ref={canvasRef} id="screen" width={pixelsPerRow} height={pixelsPerCol}/>; return <canvas ref={canvasRef} id="screen" width={pixelsPerRow} height={pixelsPerCol}/>;