Web Audio API synthesiser. Pure HTML5 implementation. Compatible with desktop and mobile Chrome/Opera/Firefox/Safari/Edge.
- simple example
- FX example
- WebGL example
- Song library
- Molgav - Web Audio Musical Step Sequencer for melodies exchange
Add link to your page:
<script src="SSSynthesiser.js"></script>Download song data and initialize engine:
var sssynthesiser = null;
var xmlHttpRequest = new XMLHttpRequest();
xmlHttpRequest.open('GET', "http://molgav.nn.ru/x/sviridovtimeforward.molgav", true);
xmlHttpRequest.onload = function () {
var o = JSON.parse(xmlHttpRequest.response);
sssynthesiser = new SSSynthesiser(o);
};
xmlHttpRequest.send();Start play:
sssynthesiser.startPlaySong()Stop play:
sssynthesiser.stopPlaySong();Change instruments's properties:
sssynthesiser.findSampleBySubPath("drums/000/Chaos_128/061_046-046_60_-4600.0_8-34789_32000").volume = 0.25;Control play order:
sssynthesiser.moveToNextPosition = function(){
if((sssynthesiser.currentX == 3 && sssynthesiser.currentY == 2) || sssynthesiser.currentY < 1 || sssynthesiser.currentY >2 ){
sssynthesiser.currentX = 0;
sssynthesiser.currentY = 1;
sssynthesiser.currentPosition = sssynthesiser.findPosition(sssynthesiser.currentX, sssynthesiser.currentY);
return;
}
else{
sssynthesiser.findAndMoveToNextPosition();
}
};Play a instrument:
sssynthesiser.playKey(sssynthesiser.findSampleBySubPath(s),1000,45);Play a drum:
sssynthesiser.playSample(sssynthesiser.findSampleBySubPath(s),2000);Play a chord:
sssynthesiser.playChord(sssynthesiser.findSampleBySubPath(s),2000,[48,52,55,60,64]);Song similar to tracker modules. It should include patterns, positions, binary samples etc. See example of song.
You can use Molgav to create song data or convert your MIDI-files.
- open Molgav
- select menu item 'import from.mid'
- edit song
- select menu item 'save song as'
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent