Work in progress Fledgetone is still being built, so things may change or break.

Tools Drop pad effects

Drop pad effects

Download fledgetone-drop-effects.zip (36 KB) README.md

Part of Fledgetone (https://fledgetone.com), © Martin Swanson, GPL-3.0-or-later. Source code: https://github.com/martinmswanson-cmd/fledgetone

The effects of Fledgetone's Drop pad, for any web page or browser game: what a DJ does to a whole mix with a finger, held for as long as you hold it, in time with the music.

EffectWhat it does
StutterRepeats the 16th note that was playing when you pressed
FilterSweeps the sound down to a muffle over a bar, and back up when you let go
Tape stopSlows the sound to a halt over a beat, like a tape machine switched off
CrushMakes it gritty and lo-fi
GateChops it into 16th notes
EchoThrows what's playing into a dotted-8th echo that rings on after you let go

Several can be on at once. Every change glides over a few milliseconds, so nothing clicks, and none of them makes the sound louder than it was (apart from the echo's tail).

What's in this zip

FileWhat it is
drop-effects.jsThe helper you import (main thread)
drop-processor.jsIts AudioWorklet processor
drop-fx.jsThe effects themselves as a plain JavaScript module (createDropKernel), for use without Web Audio, for example to process a buffer
drop-fx.tsThe same in TypeScript, as written
index.htmlAn example: a simple beat and a pad for each effect
LICENSEThe GNU General Public License, version 3

Try it

Serve this folder and open index.html (AudioWorklets don't run from a file:// page):

npx serve

Use it

import { createDropEffects } from './drop-effects.js';

const context = new AudioContext();
const drop = await createDropEffects(context, { tempo: 128 });
yourMusic.connect(drop.input);
drop.connect(context.destination);

pad.onpointerdown = () => drop.on('Stutter');
pad.onpointerup = () => drop.off('Stutter');
CallWhat it does
createDropEffects(context, options?)Makes the effects. Options: tempo (BPM, 120 if left out) or sixteenth (seconds), processorUrl
input, connect(node), disconnect()Send the music into input; connect the output onwards. node is the AudioWorkletNode itself
on(fx, time?)Turn an effect on. fx is its name ('Stutter', 'Filter', 'Tape stop', 'Crush', 'Gate', 'Echo') or number (0 to 5). time is on the audio clock, now if left out
off(fx, time?)Let go of it
cancel(time?)Let go of everything and forget what was due after time (for a stop or a jump)
setTempo(bpm), setSixteenth(seconds)The music's tempo; effects turned on after this keep time with it
effectsThe effects' names
dispose()Stop it for good

For effects on the beat, give on the time of the next 16th note of your music rather than now.

Without Web Audio

drop-fx.js exports createDropKernel(sampleRate), the same code the processor runs. Tell it when effects start and stop in samples, then process stereo blocks:

import { createDropKernel } from './drop-fx.js';

const kernel = createDropKernel(48000);
const sixteenth = 48000 * 15 / 120;            // samples in a 16th note at 120 BPM
kernel.on(0, 48000, sixteenth);                // Stutter on at 1 second
kernel.off(0, 96000);                          // off at 2 seconds
kernel.process(left, right, left, right, left.length, 0);   // in place, from sample 0

Licence

These files are free software under the GNU General Public License, version 3 or (at your choice) any later version: GPL-3.0-or-later. The full text is in LICENSE. In plain words:

This is a summary to help you; the licence text in LICENSE is what counts. Questions or concerns: email martin@twobirdsworkshop.com.