fix: sometimes entering default state would not highlight initial state marker
This commit is contained in:
parent
22fbe70a60
commit
373e26dc1b
5 changed files with 44 additions and 28 deletions
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue