From c139047e361c0eb20f2af76c7ca06bfecf9659b8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Magalh=C3=A3es?= <joamag@gmail.com>
Date: Fri, 28 Oct 2022 23:17:39 +0100
Subject: [PATCH] feat: added display resize support
---
examples/web/react/components/display/display.tsx | 15 +++++++++------
1 file changed, 9 insertions(+), 6 deletions(-)
diff --git a/examples/web/react/components/display/display.tsx b/examples/web/react/components/display/display.tsx
index 38a92198..99acfff5 100644
--- a/examples/web/react/components/display/display.tsx
+++ b/examples/web/react/components/display/display.tsx
@@ -59,6 +59,11 @@ export const Display: FC<DisplayProps> = ({
const [width, setWidth] = useState<number | undefined>(undefined);
const [height, setHeight] = useState<number | undefined>(undefined);
const canvasRef = useRef<HTMLCanvasElement>(null);
+ const resizeRef = useRef(() => {
+ const [fullWidth, fullHeight] = crop(options.width / options.height);
+ setWidth(fullWidth);
+ setHeight(fullHeight);
+ });
useEffect(() => {
if (canvasRef.current && !canvasContents) {
@@ -69,16 +74,14 @@ export const Display: FC<DisplayProps> = ({
);
}
if (fullscreen) {
- const [fullWidth, fullHeight] = crop(
- options.width / options.height
- );
- setWidth(fullWidth);
- setHeight(fullHeight);
+ resizeRef.current();
+ window.addEventListener("resize", resizeRef.current);
} else {
setWidth(undefined);
setHeight(undefined);
+ window.removeEventListener("resize", resizeRef.current);
}
- });
+ }, [canvasRef, fullscreen]);
if (onDrawHandler) {
onDrawHandler((pixels: Uint8Array, format: PixelFormat) => {
--
GitLab