pnpm dlx shadcn@latest add @audio-ui/use-loudest
import { useLoudest } from "@/hooks/use-loudest";| Files | hooks/use-loudest.ts |
|---|---|
| Depends on | Nothing |
| npm | @audio-ui/gl |
| Used by | clip-panel |
| Export | Kind | What it is |
|---|---|---|
useLoudest | function | The loudest sample of a recording, 0 to 1: what a waveform drawn on the GPU is scaled by, so a quiet recording still fills its lane. |
Usage
A waveform drawn on the GPU by WaveformLane shows true amplitude, scaled by the recording's loudest sample so a quiet recording still fills its lane. useLoudest reads it from the recording's samples ({ frames, read }), a chunk of a million frames at a time with a frame between them, so a long recording does not hold the page. A recording streamed from a file that gives its leaves is read from them instead, without reading its samples. Given the recording's channels too, it is the loudest of them, which the mix never passes, so a waveform drawn a row a channel fits its rows. It is null until it is read, and the host draws the canvas waveform from the peaks meanwhile.
import { useLoudest } from "@/hooks/use-loudest";
const loudest = useLoudest(samples, channels); // 0 to 1, or null while it is read