fix: sometimes entering default state would not highlight initial state marker

This commit is contained in:
Joeri Exelmans 2025-10-19 12:30:55 +02:00
parent 22fbe70a60
commit 373e26dc1b
5 changed files with 44 additions and 28 deletions

View file

@ -1,8 +1,9 @@
details.active {
/* background-color: rgba(128, 72, 0, 0.855);
color: white; */
box-shadow: rgba(128, 72, 0, 0.856) 0 0 8;
border: rgb(192, 125, 0);
background-color:rgb(255, 251, 244);
filter: drop-shadow( 0px 0px 3px rgba(192, 125, 0, 0.856));
}
details {
@ -11,6 +12,8 @@ details {
background-color: white;
margin-bottom: 4px;
padding-right: 2px;
padding-top: 2px;
padding-bottom: 2px;
color: black;
width: fit-content;
border-radius: 10px;

View file

@ -105,10 +105,12 @@ export function App() {
};
}, []);
const highlightActive = (rtIdx !== undefined) && new Set([...rt[rtIdx].mode].filter(uid => {
const state = ast.uid2State.get(uid);
return state && state.parent?.kind !== "and";
})) || new Set();
// const highlightActive = (rtIdx !== undefined) && new Set([...rt[rtIdx].mode].filter(uid => {
// const state = ast.uid2State.get(uid);
// return state && state.parent?.kind !== "and";
// })) || new Set();
const highlightActive = (rtIdx === undefined) ? new Set() : rt[rtIdx].mode;
const highlightTransitions = (rtIdx === undefined) ? [] : rt[rtIdx].firedTransitions;

View file

@ -4,7 +4,6 @@ import { getSimTime, setPaused, setRealtime, TimeMode } from "../statecharts/tim
import { Statechart } from "../statecharts/abstract_syntax";
import CachedIcon from '@mui/icons-material/Cached';
import ClearIcon from '@mui/icons-material/Clear';
import PauseIcon from '@mui/icons-material/Pause';
import PlayArrowIcon from '@mui/icons-material/PlayArrow';
import BoltIcon from '@mui/icons-material/Bolt';
@ -63,6 +62,19 @@ export function TopPanel({rt, time, setTime, onInit, onClear, onRaise, ast, mode
const [displayTime, setDisplayTime] = useState("0.000");
const [timescale, setTimescale] = useState(1);
useEffect(() => {
const onKeyDown = (e: KeyboardEvent) => {
if (e.key === " ") {
e.preventDefault();
onChangePaused(time.kind !== "paused", performance.now());
};
};
window.addEventListener("keydown", onKeyDown);
return () => {
window.removeEventListener("keydown", onKeyDown);
};
}, [time]);
function updateDisplayedTime() {
const now = performance.now();
const timeMs = getSimTime(time, now);
@ -81,7 +93,7 @@ export function TopPanel({rt, time, setTime, onInit, onClear, onRaise, ast, mode
function onChangePaused(paused: boolean, wallclktime: number) {
setTime(time => {
if (paused) {
return setPaused(time, performance.now());
return setPaused(time, wallclktime);
}
else {
return setRealtime(time, timescale, wallclktime);