research/statebuddy
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

digital watch plant is now also a statechart

Browse source
This commit is contained in:
Joeri Exelmans 2025-10-28 21:52:30 +01:00
parent 3e5dca437b
commit e27d3c4c88
12 changed files with 334 additions and 118 deletions
Download patch file Download diff file Expand all files Collapse all files

23
src/App/TopPanel/RotateButtons.tsx Normal file
View file

@ -0,0 +1,23 @@
import { memo } from "react"
import Rotate90DegreesCcwTwoToneIcon from '@mui/icons-material/Rotate90DegreesCcwTwoTone';
import Rotate90DegreesCwTwoToneIcon from '@mui/icons-material/Rotate90DegreesCwTwoTone';
import { Selection } from "../VisualEditor/VisualEditor";
export const RotateButtons = memo(function RotateButtons({selection, onRotate}: {selection: Selection, onRotate: (dir: "ccw"|"cw") => void}) {
const disabled = selection.length === 0;
return <>
<button
title="rotate selection 90 degrees counter-clockwise"
onClick={() => onRotate("ccw")}
disabled={disabled}>
{<Rotate90DegreesCcwTwoToneIcon fontSize="small"/>}
</button>
<button
title="rotate selection 90 degrees clockwise"
disabled={disabled}
onClick={() => onRotate("cw")}>
{<Rotate90DegreesCwTwoToneIcon fontSize="small"/>}
</button>
</>
});

9
src/App/TopPanel/TopPanel.tsx
View file

@ -19,6 +19,7 @@ import SkipNextIcon from '@mui/icons-material/SkipNext';
import StopIcon from '@mui/icons-material/Stop';
import { InsertModes } from "./InsertModes";
import { usePersistentState } from "@/App/persistent_state";
import { RotateButtons } from "./RotateButtons";
export type TopPanelProps = {
trace: TraceState | null,
@ -26,6 +27,7 @@ export type TopPanelProps = {
setTime: Dispatch<SetStateAction<TimeMode>>,
onUndo: () => void,
onRedo: () => void,
onRotate: (direction: "ccw"|"cw") => void,
onInit: () => void,
onClear: () => void,
onBack: () => void,
@ -41,7 +43,7 @@ export type TopPanelProps = {
const ShortCutShowKeys = <kbd>~</kbd>;
export const TopPanel = memo(function TopPanel({trace, time, setTime, onUndo, onRedo, onInit, onClear, onBack, insertMode, setInsertMode, setModal, zoom, setZoom, showKeys, setShowKeys, editHistory}: TopPanelProps) {
export const TopPanel = memo(function TopPanel({trace, time, setTime, onUndo, onRedo, onRotate, onInit, onClear, onBack, insertMode, setInsertMode, setModal, zoom, setZoom, showKeys, setShowKeys, editHistory}: TopPanelProps) {
const [displayTime, setDisplayTime] = useState("0.000");
const [timescale, setTimescale] = usePersistentState("timescale", 1);
@ -212,6 +214,11 @@ export const TopPanel = memo(function TopPanel({trace, time, setTime, onUndo, on
&emsp;
</div>
<div className="toolbarGroup">
<RotateButtons selection={editHistory.current.selection} onRotate={onRotate}/>
&emsp;
</div>
{/* execution */}
<div className="toolbarGroup">