An HTML5 multitrack player, using plain old audio and video elements.
It is
- working with arbitrary HTML5 media sources (including non-buffered sources)
- free and open source
- browser-based (HTML/Javascript/CSS)
This repo is very much in development.
In your HTML page, you add multiple <audio>
or <video>
elements, each represeting a track (with typically with a left and right channel). The playback of the tracks is then controlled as ensemble.
:todo:
Synchronized playback control is achieved using the various events available on HTML5 media elements.
The modern Web Audio API is intentionally not used, although it's still possible to create subsequent audio graphs using the MediaElementAudioSourceNode with the controlled audio or video elements.
The buffered audio sources (with the AudioBufferSourceNode) are avoided to allow the use of arbitrary online or offline media sources, even when the sources are cross-origin with regard the set CORS headers.
There are already many existing web-based multitrack players, but none tick all requirements from above:
- Soundtrap is commercial
- Helios audio mixer has no synchronisation and seems very involved
- Mixjs needs a build step with precompiled set of resources
- Multitrack Player by David Hulme requires local files
- Waveform Playlist requires buffered sources
- The HTMLMediaElement: mediaGroup property, which facilitated synchronous playback, has been deprecated and removed with the Media Controller feature.