diff --git a/src/components/Keyboard.jsx b/src/components/Keyboard.jsx index 29e71be..a128106 100644 --- a/src/components/Keyboard.jsx +++ b/src/components/Keyboard.jsx @@ -1,6 +1,7 @@ -import React from "react"; +import React, {useEffect} from "react"; import {CellState} from "../model/CellState"; import {Key} from "./Key"; +import {id} from "../utils"; export const Keyboard = ({enabled, used, onKey}) => { const keys = [ @@ -9,6 +10,21 @@ export const Keyboard = ({enabled, used, onKey}) => { "ENTER", "Z", "X", "C", "V", "B", "N", "M", "BACK" ]; + useEffect(() => { + const keyDownHandler = event => { + if (event.key === "Enter") { + onKey("ENTER"); + } else if (event.key === "Backspace") { + onKey("BACK"); + } else if (event.key.length === 1 && keys.filter(id).indexOf(event.key.toUpperCase())) { + onKey(event.key.toUpperCase()); + } + }; + + window.addEventListener("keydown", keyDownHandler); + return () => window.removeEventListener("keydown", keyDownHandler); + }, [onKey]); + let newlineCounter = 0; return