merge evaluator and scheduler hooks + use getTime
This commit is contained in:
parent
2172d1a767
commit
9497c99e9e
4 changed files with 57 additions and 63 deletions
|
|
@ -1,36 +0,0 @@
|
|||
import { useRef, useState, useCallback, useEffect } from 'react';
|
||||
import { evaluate as _evaluate } from '@strudel.cycles/eval';
|
||||
|
||||
function useEvaluator({ code, evalOnMount = true }) {
|
||||
const [error, setError] = useState();
|
||||
const [activeCode, setActiveCode] = useState(code);
|
||||
const [pattern, setPattern] = useState();
|
||||
const isDirty = code !== activeCode;
|
||||
|
||||
const evaluate = useCallback(async () => {
|
||||
if (!code) {
|
||||
console.log('no code..');
|
||||
return;
|
||||
}
|
||||
try {
|
||||
// TODO: let user inject custom eval function?
|
||||
const { pattern: _pattern } = await _evaluate(code);
|
||||
setActiveCode(code);
|
||||
setPattern(_pattern);
|
||||
setError();
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
console.warn('eval error', err);
|
||||
}
|
||||
}, [code, scheduler]);
|
||||
const inited = useRef();
|
||||
useEffect(() => {
|
||||
if (!inited.current && evalOnMount) {
|
||||
inited.current = true;
|
||||
evaluate();
|
||||
}
|
||||
}, [evaluate, evalOnMount]);
|
||||
return { error, evaluate, activeCode, pattern, isDirty };
|
||||
}
|
||||
|
||||
export default useEvaluator;
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
import { Scheduler } from '@strudel.cycles/core';
|
||||
import { useEffect, useMemo, useState } from 'react';
|
||||
|
||||
function useScheduler(pattern, defaultOutput, interval = 0.1) {
|
||||
const [error, setError] = useState();
|
||||
// TODO: how / when to remove schedulerError?
|
||||
const scheduler = useMemo(
|
||||
() => new Scheduler({ interval, onTrigger: defaultOutput, onError: setError }),
|
||||
[defaultOutput, interval],
|
||||
);
|
||||
useEffect(() => {
|
||||
// console.log('pattern', pattern);
|
||||
pattern && scheduler?.setPattern(pattern);
|
||||
}, [pattern, scheduler]);
|
||||
return { error, scheduler };
|
||||
}
|
||||
|
||||
export default useScheduler;
|
||||
44
packages/react/src/hooks/useStrudel.mjs
Normal file
44
packages/react/src/hooks/useStrudel.mjs
Normal file
|
|
@ -0,0 +1,44 @@
|
|||
import { Scheduler } from '@strudel.cycles/core';
|
||||
import { useRef, useCallback, useEffect, useMemo, useState } from 'react';
|
||||
import { evaluate as _evaluate } from '@strudel.cycles/eval';
|
||||
|
||||
function useStrudel({ defaultOutput, interval, getTime, code, evalOnMount = true }) {
|
||||
// scheduler
|
||||
const [schedulerError, setSchedulerError] = useState();
|
||||
const [evalError, setEvalError] = useState();
|
||||
const [activeCode, setActiveCode] = useState(code);
|
||||
const isDirty = code !== activeCode;
|
||||
// TODO: how / when to remove schedulerError?
|
||||
const scheduler = useMemo(
|
||||
() => new Scheduler({ interval, onTrigger: defaultOutput, onError: setSchedulerError, getTime }),
|
||||
[defaultOutput, interval],
|
||||
);
|
||||
const evaluate = useCallback(async () => {
|
||||
if (!code) {
|
||||
console.log('no code..');
|
||||
return;
|
||||
}
|
||||
try {
|
||||
// TODO: let user inject custom eval function?
|
||||
const { pattern } = await _evaluate(code);
|
||||
setActiveCode(code);
|
||||
scheduler?.setPattern(pattern);
|
||||
setEvalError();
|
||||
} catch (err) {
|
||||
setEvalError(err);
|
||||
console.warn('eval error', err);
|
||||
}
|
||||
}, [code, scheduler]);
|
||||
|
||||
const inited = useRef();
|
||||
useEffect(() => {
|
||||
if (!inited.current && evalOnMount) {
|
||||
inited.current = true;
|
||||
evaluate();
|
||||
}
|
||||
}, [evaluate, evalOnMount]);
|
||||
|
||||
return { schedulerError, scheduler, evalError, evaluate, activeCode, isDirty };
|
||||
}
|
||||
|
||||
export default useStrudel;
|
||||
Loading…
Add table
Add a link
Reference in a new issue