Tone.js is a framework for creating interactive music in the browser. It provides advanced scheduling capabilities, synths and effects, and intuitive musical abstractions built on top of the Web Audio API.
triggerAttackRelease is a combination of two methods:
triggerAttack when the amplitude is rising (for example from a ‘key down’ or ‘note on’ event), and
triggerRelease is when the amplitude is going back to 0 (‘key up’ / ‘note off’).
The first argument to
triggerAttackRelease is the frequency which can either be a number (like
440) or as “pitch-octave” notation (like
The second argument is the duration that the note is held. This value can either be in seconds, or as a tempo-relative value.
The third (optional) argument is when the note should be scheduled to play. With no argument, the note plays immediately, but it can also be scheduled to play anytime in the future.
Web Audio has advanced, sample accurate scheduling capabilities. The AudioContext time, which is the reference clock that Web Audio uses to schedule events, starts at 0 when the page (or iframe) loads and counts up in seconds.
The third argument of
triggerAttackRelease is when along the AudioContext time the note should play. It can be used to schedule events in the future.
Tone.js abstracts away the AudioContext time. Instead of defining all values in seconds, any method which takes time as an argument can accept a number or a string. For example
"4n" is a quarter-note,
"8t" is an eighth-note triplet, and
"1m" is one measure. These values can even be composed into expressions.
Read more about Time encodings.
Instead of scheduling relative when the page load (AudioContext time = 0) like the examples above, Tone.js provides the Tone.Transport which allows events to be scheduled along a seekable, restartable and editable timeline.
One-time and repeated events can be scheduled relative to the Transport’s position (instead of just the AudioContext time) using
scheduleRepeat. The Transport will invoke the scheduled callback and return the precise AudioContext time of the scheduled event.
Unlike the AudioContext, the Transport can be looped, stopped and restarted.
The Transport is the master timekeeper, allowing for application-wide synchronization of sources, signals and events along a shared timeline. Time expressions (like
"2:0") are evaluated against the Transport’s BPM which can be set like this:
Tone.Transport.bpm.value = 120.
Tone.js provides even higher-level abstractions for scheduling events. Tone.Loop is a simple way to create a looped callback that can be scheduled to start, stop and repeat along the Tone.Transport.
Tone.Part allows you to schedule an array of events which can be started, stopped, and looped along the Transport.
All of the Tone.Event classes also allow you to adjust the playbackRate separate from the Transport’s bpm. This can create some interesting phasing.
Pass in JSON settings for any of the Tone.js instruments, effects and components to set their values. The synths and effects are capable of a diverse range of sounds.
All instruments are monophonic (one voice) but can be made polyphonic when the constructor is passed in as the second argument to Tone.PolySynth. Tone.PolySynth creates multiple instances of an instrument and manages the voice allocations.
In the above examples, the synthesizer was always connected directly to the master output, but the output of the synth could also be routed through one (or more) effects before going to the speakers.
Tone has a few basic audio sources like Tone.Oscillator which has sine, square, triangle, and sawtooth waveforms, a buffer player (Tone.Player), a noise generator (Tone.Noise), a few additional oscillator types (pwm, pulse, fat, fm) and external audio input (when WebRTC is supported).
Like the underlying Web Audio API, Tone.js is built with audio-rate signal control over nearly everything. This is a powerful feature which allows for sample-accurate synchronization and scheduling of parameters.