webaudiofont
Version:
Soundfonts for web. About of 2000 musical instruments. GM MIDI compatible.
50 lines • 1.99 kB
HTML
<html>
<head>
<script src='https://surikov.github.io/webaudiofont/npm/dist/WebAudioFontPlayer.js'></script>
<script src='https://surikov.github.io/webaudiofontdata/sound/0520_Chaos_sf2_file.js'></script>
<script src='https://surikov.github.io/webaudiofontdata/sound/0530_Soul_Ahhs_sf2_file.js'></script>
<script>
var womanPreset=_tone_0530_Soul_Ahhs_sf2_file;
var manPreset=_tone_0520_Chaos_sf2_file;
var AudioContextFunc = window.AudioContext || window.webkitAudioContext;
var audioContext = new AudioContextFunc();
var player=new WebAudioFontPlayer();
var manGain = audioContext.createGain();
manGain.connect(audioContext.destination);
var womanGain = audioContext.createGain();
womanGain.connect(audioContext.destination);
player.loader.decodeAfterLoading(audioContext, '_tone_0530_Soul_Ahhs_sf2_file');
player.loader.decodeAfterLoading(audioContext, '_tone_0520_Chaos_sf2_file');
</script>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<a href="#" onmousedown="player.queueWaveTable(audioContext, manGain, manPreset, 0, 12*4+0, 3);">
<img src="https://surikov.github.io/webaudiofont/img/voiceMan.jpg" width="285" height="214">
</a>
</td>
<td rowspan="2">
<a href="#" onmousedown="player.queueWaveTable(audioContext, womanGain, womanPreset, 0, 12*5+0, 3);">
<img src="https://surikov.github.io/webaudiofont/img/voiceWoman.jpg" width="375" height="456">
</a>
</td>
</tr>
<tr>
<td>
<p>Man volume</p>
<p>
<input type="range" id="maRange" value="1.0" min="0.2" max="1" step=0.2 onchange="manGain.gain.value=this.value;">
</p>
<p>Woman volume</p>
<p>
<input type="range" id="woRange" value="1.0" min="0.2" max="1" step=0.2 onchange="womanGain.gain.value=this.value;">
</p>
</td>
</tr>
</table>
<hr/>
<p><a href="https://surikov.github.io/webaudiofont/">source</a></p>
</body>
</html>