From 3787460bd8b67f893edb197d365a92ba52a69bda Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Magalh=C3=A3es?= <joamag@gmail.com>
Date: Sun, 30 Oct 2022 10:55:24 +0000
Subject: [PATCH] feat: better fullscreen actions
---
examples/web/index.ts | 4 ++--
examples/web/react/app.tsx | 23 +++++++++++++++++------
2 files changed, 19 insertions(+), 8 deletions(-)
diff --git a/examples/web/index.ts b/examples/web/index.ts
index cd74123f..6f37cdaa 100644
--- a/examples/web/index.ts
+++ b/examples/web/index.ts
@@ -406,7 +406,7 @@ class GameboyEmulator extends Observable implements Emulator {
registerKeys() {
document.addEventListener("keydown", (event) => {
const keyCode = KEYS[event.key];
- const isArrow = KEYS[event.key] ?? false;
+ const isArrow = ARROW_KEYS[event.key] ?? false;
if (isArrow) event.preventDefault();
if (keyCode !== undefined) {
this.gameBoy!.key_press(keyCode);
@@ -430,7 +430,7 @@ class GameboyEmulator extends Observable implements Emulator {
document.addEventListener("keyup", (event) => {
const keyCode = KEYS[event.key];
- const isArrow = KEYS[event.key] ?? false;
+ const isArrow = ARROW_KEYS[event.key] ?? false;
if (isArrow) event.preventDefault();
if (keyCode !== undefined) {
this.gameBoy!.key_lift(keyCode);
diff --git a/examples/web/react/app.tsx b/examples/web/react/app.tsx
index 36c13768..309445de 100644
--- a/examples/web/react/app.tsx
+++ b/examples/web/react/app.tsx
@@ -99,6 +99,7 @@ export const App: FC<AppProps> = ({ emulator, backgrounds = ["264653"] }) => {
const [backgroundIndex, setBackgroundIndex] = useState(0);
const [romInfo, setRomInfo] = useState<RomInfo>({});
const [framerate, setFramerate] = useState(0);
+ const [keyaction, setKeyaction] = useState<string | null>(null);
const frameRef = useRef<boolean>(false);
const errorRef = useRef<boolean>(false);
const getPauseText = () => (paused ? "Resume" : "Pause");
@@ -136,21 +137,31 @@ export const App: FC<AppProps> = ({ emulator, backgrounds = ["264653"] }) => {
await handler(undefined, require("../res/storm.png"), 0.2);
});
};
- const onKeyDown = (event: KeyboardEvent) => {
-
- }
+ const onKeyDown = (event: KeyboardEvent) => {};
useEffect(() => {
document.body.style.backgroundColor = `#${getBackground()}`;
- });
+ }, [backgroundIndex]);
+ useEffect(() => {
+ switch (keyaction) {
+ case "Escape":
+ setFullscreen(false);
+ setKeyaction(null);
+ break;
+ case "Fullscreen":
+ setFullscreen(!fullscreen);
+ setKeyaction(null);
+ break;
+ }
+ }, [keyaction]);
useEffect(() => {
document.addEventListener("keydown", (event) => {
if (event.key === "Escape") {
- setFullscreen(false);
+ setKeyaction("Escape");
event.stopPropagation();
event.preventDefault();
}
if (event.key === "f" && event.ctrlKey === true) {
- setFullscreen(true);
+ setKeyaction("Fullscreen");
event.stopPropagation();
event.preventDefault();
}
--
GitLab