diff --git a/src/App/App.tsx b/src/App/App.tsx index 48d20c3..d7d119a 100644 --- a/src/App/App.tsx +++ b/src/App/App.tsx @@ -44,10 +44,8 @@ export function App() { const [rtIdx, setRTIdx] = useState(); const [time, setTime] = useState({kind: "paused", simtime: 0}); const [modal, setModal] = useState(null); - const [plantName, setPlantName] = usePersistentState("plant", "dummy"); const [zoom, setZoom] = usePersistentState("zoom", 1); - const [showKeys, setShowKeys] = usePersistentState("shortcuts", true); const plant = plants.find(([pn, p]) => pn === plantName)![1]; @@ -251,7 +249,7 @@ export function App() { > {/* Below the top bar: Editor */} @@ -283,7 +281,7 @@ export function App() { input events - + internal events diff --git a/src/App/ShowAST.tsx b/src/App/ShowAST.tsx index 68983ff..c858005 100644 --- a/src/App/ShowAST.tsx +++ b/src/App/ShowAST.tsx @@ -72,60 +72,38 @@ export function ShowAST(props: {root: ConcreteState | PseudoState, transitions: } import BoltIcon from '@mui/icons-material/Bolt'; -import { KeyInfoHidden, KeyInfoVisible } from "./KeyInfo"; -import { useEffect } from "react"; -export function ShowInputEvents({inputEvents, onRaise, disabled, showKeys}: {inputEvents: EventTrigger[], onRaise: (e: string, p: any) => void, disabled: boolean, showKeys: boolean}) { - const raiseHandlers = inputEvents.map(({event}) => { - return () => { - // @ts-ignore - const param = document.getElementById(`input-${event}-param`)?.value; - let paramParsed; - try { - if (param) { - paramParsed = JSON.parse(param); // may throw - } - } - catch (e) { - alert("invalid json"); - return; - } - onRaise(event, paramParsed); - }; - }); - const onKeyDown = (e: KeyboardEvent) => { - const n = (parseInt(e.key)+9) % 10; - if (raiseHandlers[n] !== undefined) { - raiseHandlers[n](); - e.stopPropagation(); - e.preventDefault(); - } - } - useEffect(() => { - window.addEventListener("keydown", onKeyDown); - return () => window.removeEventListener("keydown", onKeyDown); - }, [raiseHandlers]); - const KeyInfo = showKeys ? KeyInfoVisible : KeyInfoHidden; - return inputEvents.map(({event, paramName}, i) => { - const shortcut = (i+1)%10; - const KI = (i <= 10) ? KeyInfo : KeyInfoHidden; - return
- {shortcut}}> - - +export function ShowInputEvents({inputEvents, onRaise, disabled}: {inputEvents: EventTrigger[], onRaise: (e: string, p: any) => void, disabled: boolean}) { + return inputEvents.map(({event, paramName}) => +
+ {paramName && <> }   -
; - }) +
+ ) } export function ShowInternalEvents(props: {internalEvents: EventTrigger[]}) { diff --git a/src/App/TopPanel.tsx b/src/App/TopPanel.tsx index b5abf59..623fae4 100644 --- a/src/App/TopPanel.tsx +++ b/src/App/TopPanel.tsx @@ -43,13 +43,12 @@ export type TopPanelProps = { setModal: Dispatch>, zoom: number, setZoom: Dispatch>, - showKeys: boolean, - setShowKeys: Dispatch>, } -export function TopPanel({rt, rtIdx, time, setTime, onUndo, onRedo, onInit, onClear, onRaise, onBack, ast, mode, setMode, setModal, zoom, setZoom, showKeys, setShowKeys}: TopPanelProps) { +export function TopPanel({rt, rtIdx, time, setTime, onUndo, onRedo, onInit, onClear, onRaise, onBack, ast, mode, setMode, setModal, zoom, setZoom}: TopPanelProps) { const [displayTime, setDisplayTime] = useState("0.000"); const [timescale, setTimescale] = useState(1); + const [showKeys, setShowKeys] = usePersistentState("shortcuts", true); const KeyInfo = showKeys ? KeyInfoVisible : KeyInfoHidden; diff --git a/src/Plant/DigitalWatch/DigitalWatch.tsx b/src/Plant/DigitalWatch/DigitalWatch.tsx index 7817457..9d41279 100644 --- a/src/Plant/DigitalWatch/DigitalWatch.tsx +++ b/src/Plant/DigitalWatch/DigitalWatch.tsx @@ -1,5 +1,6 @@ import imgNote from "./noteSmall.png"; import imgWatch from "./watch.png"; +import imgWatchLight from "./watch-light.png"; import digitalFont from "./digital-font.ttf"; import { Plant } from "../Plant"; import { RaisedEvent } from "@/statecharts/runtime_types"; @@ -37,10 +38,10 @@ export function DigitalWatch({light, h, m, s, alarm, callbacks}: DigitalWatchPro } `} - - - {light && - } + {light ? + + : + } {hhmmss}