add pending flag

This commit is contained in:
Felix Roos 2022-02-27 20:24:03 +01:00
parent f361b50f7f
commit 5f424e7113
2 changed files with 12 additions and 7 deletions

View File

@ -37,11 +37,12 @@ const randomTune = getRandomTune();
function App() {
const [editor, setEditor] = useState<any>();
const { setCode, setPattern, error, code, cycle, dirty, log, togglePlay, activateCode, pattern, pushLog } = useRepl({
tune: decoded || randomTune,
defaultSynth,
onDraw: useCallback(markEvent(editor), [editor]),
});
const { setCode, setPattern, error, code, cycle, dirty, log, togglePlay, activateCode, pattern, pushLog, pending } =
useRepl({
tune: decoded || randomTune,
defaultSynth,
onDraw: useCallback(markEvent(editor), [editor]),
});
const logBox = useRef<any>();
// scroll log box to bottom when log changes
useLayoutEffect(() => {
@ -56,7 +57,6 @@ function App() {
switch (e.code) {
case 'Enter':
await activateCode();
!cycle.started && cycle.start();
break;
case 'Period':
cycle.stop();
@ -133,7 +133,7 @@ function App() {
className="flex-none w-full border border-gray-700 p-2 bg-slate-700 hover:bg-slate-500"
onClick={() => togglePlay()}
>
{cycle.started ? 'pause' : 'play'}
{!pending ? <>{cycle.started ? 'pause' : 'play'}</> : <>loading...</>}
</button>
<textarea
className="grow bg-[#283237] border-0 text-xs min-h-[200px]"

View File

@ -17,6 +17,7 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw }: any)
const [activeCode, setActiveCode] = useState<string>();
const [log, setLog] = useState('');
const [error, setError] = useState<Error>();
const [pending, setPending] = useState(false);
const [hash, setHash] = useState('');
const [pattern, setPattern] = useState<Pattern>();
const dirty = code !== activeCode || error;
@ -24,9 +25,11 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw }: any)
const activateCode = async (_code = code) => {
if (activeCode && !dirty) {
setError(undefined);
!cycle.started && cycle.start();
return;
}
try {
setPending(true);
const parsed = await evaluate(_code);
!cycle.started && cycle.start();
broadcast({ type: 'start', from: id });
@ -37,6 +40,7 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw }: any)
setHash(generateHash());
setError(undefined);
setActiveCode(_code);
setPending(false);
} catch (err: any) {
err.message = 'evaluation error: ' + err.message;
console.warn(err);
@ -145,6 +149,7 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw }: any)
};
return {
pending,
code,
setCode,
pattern,