diff --git a/examples/web/react/app.tsx b/examples/web/react/app.tsx index a656d73a4edf99a0ee8b7210f7bb1c21e4718a5a..94a03925f7b1e0bfc19b2bdbb9dc4842db02bb3b 100644 --- a/examples/web/react/app.tsx +++ b/examples/web/react/app.tsx @@ -68,10 +68,13 @@ export const App: FC<AppProps> = ({ emulator, backgrounds = ["264653"] }) => { const onResetClick = () => { emulator.reset(); }; + const onFullscreenClick = () => { + setFullscreen((!fullscreen); + }; const onThemeClick = () => { setBackgroundIndex((backgroundIndex + 1) % backgrounds.length); }; - const onDrawHAndler = (handler: DrawHandler) => { + const onDrawHandler = (handler: DrawHandler) => { setInterval(() => { handler(emulator.getImageBuffer(), PixelFormat.RGB); }, 1000); @@ -90,7 +93,7 @@ export const App: FC<AppProps> = ({ emulator, backgrounds = ["264653"] }) => { <PanelSplit left={ <div> - <Display fullscreen={fullscreen} onDrawHandler={onDrawHAndler} /> + <Display fullscreen={fullscreen} onDrawHandler={onDrawHandler} /> </div> } > @@ -148,6 +151,12 @@ export const App: FC<AppProps> = ({ emulator, backgrounds = ["264653"] }) => { imageAlt="reset" onClick={onResetClick} /> + <Button + text={"Fullscreen"} + image={require("../res/maximise.svg")} + imageAlt="maximise" + onClick={onFullscreenClick} + /> <Button text={"Theme"} image={require("../res/marker.svg")}