Reverb

Puts the sound in a room. 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/reverb

Controls

Panel

The panel draws the level of the tail falling in dB, from the end of the pre-delay to -60 dB. reverbDecay(state) is the curve it draws, and reverbImpulse(sampleRate, state) makes the impulse response of the room.

Copy
import { ReverbPanel } from "@/components/audio-ui/devices/reverb/panel";
import { reverbDevice } from "@/components/audio-ui/devices/reverb/device";

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

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

Engine

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

The room is a convolver fed an impulse response made from the decay and the damping. A convolver cannot change its impulse without a click, so the engine has two and cross-fades: a new room is built in the idle one, at most every 120 ms while a control moves.