Delay

Repeats the sound. The echoes fade by the feedback, each darker than the one before. It is a device: a state, a panel, an engine and tools, each its own file.

Installation

bunnpmpnpmyarn
Copy
pnpm dlx shadcn@latest add @audio-ui/delay

Controls

Panel

The panel draws the echoes the state makes, one line each, fainter as they fade. delayTaps(state, windowMs) returns them. With Sync on, the handle lands on the nearest note value and the Time control is drawn off. With Sync off, the note list is.

Copy
import { DelayPanel } from "@/components/audio-ui/devices/delay/panel";
import { delayDevice } from "@/components/audio-ui/devices/delay/device";

const [state, setState] = useState(() => delayDevice.defaults());

<DelayPanel onValueChange={setState} value={state} />;

Engine

Create it, connect it and update it as for any device: see The engine.

The repeats go round a low-pass filter, so each is darker than the one before. A change of time glides slowly, so the echo bends like a tape instead of clicking, and the feedback stops short of 95 % so it cannot run away. A note longer than the delay can hold (two seconds) is held to that. The 1/8d the block starts on is a dotted eighth at the loop's 100 BPM, 450 ms.