elias/strudel-docker
1
0
Fork 0
mirror of https://github.com/eliasstepanik/strudel-docker.git synced 2026-01-24 20:18:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

highlight only events with onsets

Browse Source
This commit is contained in:
Felix Roos 2022-04-30 11:14:16 +02:00
parent f6d128842a
commit d4607c68f7
1 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
repl/src/useHighlighting.js
View File

@ -2,6 +2,8 @@ import { useEffect } from 'react';
import { setHighlights } from './CodeMirror6'; import { setHighlights } from './CodeMirror6';
import { Tone } from '@strudel.cycles/tone'; import { Tone } from '@strudel.cycles/tone';
let highlights = []; // actively highlighted events
function useHighlighting({ view, pattern, started }) { function useHighlighting({ view, pattern, started }) {
useEffect(() => { useEffect(() => {
if (view) { if (view) {
@ -10,11 +12,10 @@ function useHighlighting({ view, pattern, started }) {
function updateHighlights() { function updateHighlights() {
const audioTime = Tone.getTransport().seconds; const audioTime = Tone.getTransport().seconds;
const span = { begin: audioTime, end: audioTime + 1 / 60 }; highlights = highlights.filter((hap) => hap.whole.end > audioTime); // keep only highlights that are still active
// TODO: remove isActive workaround when query is fixed const haps = pattern.queryArc(audioTime, audioTime + 1 / 60).filter((hap) => hap.hasOnset());
const isActive = (event) => event.whole.end >= span.begin && event.whole.begin <= span.end; highlights = highlights.concat(haps); // add potential new onsets
const events = pattern.queryArc(span.begin, span.end).filter(isActive); view.dispatch({ effects: setHighlights.of(highlights) }); // highlight all still active + new active haps
view.dispatch({ effects: setHighlights.of(events) });
frame = requestAnimationFrame(updateHighlights); frame = requestAnimationFrame(updateHighlights);
} }
@ -22,6 +23,7 @@ function useHighlighting({ view, pattern, started }) {
cancelAnimationFrame(frame); cancelAnimationFrame(frame);
}; };
} else { } else {
highlights = [];
view.dispatch({ effects: setHighlights.of([]) }); view.dispatch({ effects: setHighlights.of([]) });
} }
} }