hacklab/strudel
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

build react pkg

Browse source
This commit is contained in:
Felix Roos 2022-08-23 21:23:44 +02:00
parent ec4cfe6f86
commit acafcc9888
2 changed files with 24 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

4
packages/react/dist/index.cjs.js vendored
View file

File diff suppressed because one or more lines are too long

38
packages/react/dist/index.es.js vendored
View file

@ -401,10 +401,9 @@ function cx(...classes) {
return classes.filter(Boolean).join(' '); return classes.filter(Boolean).join(' ');
} }
let highlights = []; // actively highlighted events function useHighlighting({ view, pattern, active, getTime }) {
let lastEnd; const highlights = useRef([]);
const lastEnd = useRef();
function useHighlighting({ view, pattern, active }) {
useEffect(() => { useEffect(() => {
if (view) { if (view) {
if (pattern && active) { if (pattern && active) {
@ -412,16 +411,16 @@ function useHighlighting({ view, pattern, active }) {
function updateHighlights() { function updateHighlights() {
try { try {
const audioTime = Tone.getTransport().seconds; const audioTime = getTime();
// force min framerate of 10 fps => fixes crash on tab refocus, where lastEnd could be far away // force min framerate of 10 fps => fixes crash on tab refocus, where lastEnd could be far away
// see https://github.com/tidalcycles/strudel/issues/108 // see https://github.com/tidalcycles/strudel/issues/108
const begin = Math.max(lastEnd || audioTime, audioTime - 1 / 10); const begin = Math.max(lastEnd.current || audioTime, audioTime - 1 / 10);
const span = [begin, audioTime + 1 / 60]; const span = [begin, audioTime + 1 / 60];
lastEnd = audioTime + 1 / 60; lastEnd.current = audioTime + 1 / 60;
highlights = highlights.filter((hap) => hap.whole.end > audioTime); // keep only highlights that are still active highlights.current = highlights.current.filter((hap) => hap.whole.end > audioTime); // keep only highlights that are still active
const haps = pattern.queryArc(...span).filter((hap) => hap.hasOnset()); const haps = pattern.queryArc(...span).filter((hap) => hap.hasOnset());
highlights = highlights.concat(haps); // add potential new onsets highlights.current = highlights.current.concat(haps); // add potential new onsets
view.dispatch({ effects: setHighlights.of(highlights) }); // highlight all still active + new active haps view.dispatch({ effects: setHighlights.of(highlights.current) }); // highlight all still active + new active haps
} catch (err) { } catch (err) {
// console.log('error in updateHighlights', err); // console.log('error in updateHighlights', err);
view.dispatch({ effects: setHighlights.of([]) }); view.dispatch({ effects: setHighlights.of([]) });
@ -433,7 +432,7 @@ function useHighlighting({ view, pattern, active }) {
cancelAnimationFrame(frame); cancelAnimationFrame(frame);
}; };
} else { } else {
highlights = []; highlights.current = [];
view.dispatch({ effects: setHighlights.of([]) }); view.dispatch({ effects: setHighlights.of([]) });
} }
} }
@ -505,7 +504,12 @@ function MiniRepl({ tune, defaultSynth, hideOutsideView = false, theme, init, on
} }
return isVisible || wasVisible.current; return isVisible || wasVisible.current;
}, [isVisible, hideOutsideView]); }, [isVisible, hideOutsideView]);
useHighlighting({ view, pattern, active: cycle.started && !activeCode?.includes("strudel disable-highlighting") }); useHighlighting({
view,
pattern,
active: cycle.started && !activeCode?.includes("strudel disable-highlighting"),
getTime: () => Tone.getTransport().seconds
});
useLayoutEffect(() => { useLayoutEffect(() => {
if (enableKeyboard) { if (enableKeyboard) {
const handleKeyPress = async (e) => { const handleKeyPress = async (e) => {
@ -552,11 +556,12 @@ function MiniRepl({ tune, defaultSynth, hideOutsideView = false, theme, init, on
}))); })));
} }
function useStrudel({ defaultOutput, interval, getTime, code, evalOnMount = true }) { function useStrudel({ defaultOutput, interval, getTime, code, evalOnMount = false }) {
// scheduler // scheduler
const [schedulerError, setSchedulerError] = useState(); const [schedulerError, setSchedulerError] = useState();
const [evalError, setEvalError] = useState(); const [evalError, setEvalError] = useState();
const [activeCode, setActiveCode] = useState(code); const [activeCode, setActiveCode] = useState(code);
const [pattern, setPattern] = useState();
const isDirty = code !== activeCode; const isDirty = code !== activeCode;
// TODO: how / when to remove schedulerError? // TODO: how / when to remove schedulerError?
const scheduler = useMemo( const scheduler = useMemo(
@ -570,9 +575,10 @@ function useStrudel({ defaultOutput, interval, getTime, code, evalOnMount = true
} }
try { try {
// TODO: let user inject custom eval function? // TODO: let user inject custom eval function?
const { pattern } = await evaluate(code); const { pattern: _pattern } = await evaluate(code);
setActiveCode(code); setActiveCode(code);
scheduler?.setPattern(pattern); scheduler?.setPattern(_pattern);
setPattern(_pattern);
setEvalError(); setEvalError();
} catch (err) { } catch (err) {
setEvalError(err); setEvalError(err);
@ -588,7 +594,7 @@ function useStrudel({ defaultOutput, interval, getTime, code, evalOnMount = true
} }
}, [evaluate$1, evalOnMount]); }, [evaluate$1, evalOnMount]);
return { schedulerError, scheduler, evalError, evaluate: evaluate$1, activeCode, isDirty }; return { schedulerError, scheduler, evalError, evaluate: evaluate$1, activeCode, isDirty, pattern };
} }
// set active pattern on ctrl+enter // set active pattern on ctrl+enter