add evaluateOnly

This commit is contained in:
Felix Roos
2022-06-04 23:54:33 +02:00
parent 1c77e7e5b3
commit 6fde3f2231
4 changed files with 29 additions and 13 deletions
+2 -2
View File
File diff suppressed because one or more lines are too long
+13 -5
View File
@@ -383,16 +383,16 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw: onDrawP
});
const activateCode = useCallback(
async (_code = code) => {
async (_code = code, evaluateOnly = false) => {
if (activeCode && !dirty) {
setError(undefined);
cycle.start();
!evaluateOnly && cycle.start();
return;
}
try {
setPending(true);
const parsed = await evaluate(_code);
cycle.start();
!evaluateOnly && cycle.start();
broadcast({ type: 'start', from: id });
setPattern(() => parsed.pattern);
if (autolink) {
@@ -423,6 +423,10 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw: onDrawP
}
};
const evaluateOnly = () => {
activateCode(code, true);
};
useEffect(() => {
return () => cycle.stop();
}, []);
@@ -440,6 +444,7 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw: onDrawP
togglePlay,
setActiveCode,
activateCode,
evaluateOnly,
activeCode,
pushLog,
hash,
@@ -542,12 +547,15 @@ function Icon({ type }) {
}[type]);
}
function MiniRepl({ tune, defaultSynth, hideOutsideView = false, theme }) {
const { code, setCode, pattern, activateCode, error, cycle, dirty, togglePlay } = useRepl({
function MiniRepl({ tune, defaultSynth, hideOutsideView = false, theme, init }) {
const { code, setCode, pattern, activateCode, evaluateOnly, error, cycle, dirty, togglePlay } = useRepl({
tune,
defaultSynth,
autolink: false
});
useEffect(() => {
init && evaluateOnly();
}, [tune, init]);
const [view, setView] = useState();
const [ref, isVisible] = useInView({
threshold: 0.01
+6 -3
View File
@@ -1,4 +1,4 @@
import React, { useState, useMemo, useRef } from 'react';
import React, { useState, useMemo, useRef, useEffect } from 'react';
import { useInView } from 'react-hook-inview';
import useRepl from '../hooks/useRepl.mjs';
import cx from '../cx';
@@ -9,12 +9,15 @@ import './style.css';
import styles from './MiniRepl.module.css';
import { Icon } from './Icon';
export function MiniRepl({ tune, defaultSynth, hideOutsideView = false, theme }) {
const { code, setCode, pattern, activateCode, error, cycle, dirty, togglePlay } = useRepl({
export function MiniRepl({ tune, defaultSynth, hideOutsideView = false, theme, init }) {
const { code, setCode, pattern, activateCode, evaluateOnly, error, cycle, dirty, togglePlay } = useRepl({
tune,
defaultSynth,
autolink: false,
});
useEffect(() => {
init && evaluateOnly();
}, [tune, init]);
const [view, setView] = useState();
const [ref, isVisible] = useInView({
threshold: 0.01,
+8 -3
View File
@@ -100,16 +100,16 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw: onDrawP
});
const activateCode = useCallback(
async (_code = code) => {
async (_code = code, evaluateOnly = false) => {
if (activeCode && !dirty) {
setError(undefined);
cycle.start();
!evaluateOnly && cycle.start();
return;
}
try {
setPending(true);
const parsed = await evaluate(_code);
cycle.start();
!evaluateOnly && cycle.start();
broadcast({ type: 'start', from: id });
setPattern(() => parsed.pattern);
if (autolink) {
@@ -142,6 +142,10 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw: onDrawP
}
};
const evaluateOnly = () => {
activateCode(code, true);
};
useEffect(() => {
return () => cycle.stop();
}, []);
@@ -159,6 +163,7 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw: onDrawP
togglePlay,
setActiveCode,
activateCode,
evaluateOnly,
activeCode,
pushLog,
hash,