-
Notifications
You must be signed in to change notification settings - Fork 23
/
jstest.html
83 lines (80 loc) · 2.88 KB
/
jstest.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<!doctype html>
<html>
<head>
<script src="webaudio-tinysynth.js"></script>
<script>
function loadMidiUrl(){
synth.loadMIDIUrl('ws.mid');
}
function loadMidi(files){
var reader = new FileReader();
reader.onload=(e)=>{
synth.loadMIDI(reader.result);
}
reader.readAsArrayBuffer(files[0]);
}
function playMidi(){
synth.playMIDI();
}
function stopMidi(){
synth.stopMIDI();
}
function SetProgram(p){
synth.send([0xc0,p]);
}
function Init(){
synth=new WebAudioTinySynth({voices:64});
for(var i=0;i<128;++i){
var o=document.createElement("option");
o.innerHTML=synth.getTimbreName(0,i);
document.getElementById("prog").appendChild(o);
}
setInterval(function(){
var st=synth.getPlayStatus();
document.getElementById("status").innerHTML="Play:"+st.play+" Pos:"+st.curTick+"/"+st.maxTick;
},100);
}
function Test(){
var o=synth.getAudioContext().createOscillator();
o.connect(synth.getAudioContext().destination);
o.start(0);
o.stop(synth.getAudioContext().currentTime+1);
console.log(synth)
}
window.onload=Init;
</script>
</head>
<body>
<h1>webaudio-tinysynth : js version test</h1>
This is a simple sample of webaudio-tinysynth (JavaScript library version) page.
<hr/>
<button onclick="Test()">Test audioContext</button>
<hr/>
Load Sample MIDI from URL : <button onclick="loadMidiUrl()">Load (ws.mid)</button><br/>
Load MIDI file from local : <input type="file" onchange="loadMidi(this.files)"/><br/>
<button onclick="playMidi()">Play</button>
<button onclick="stopMidi()">Stop</button>
<div id="status"></div>
<br/><br/>
Loop : <input type="checkbox" onchange="synth.setLoop(this.checked)"/><br/>
MasterVol<br/>
<input type="range" value="50" min="0" max="100" oninput="synth.setMasterVol(this.value/100)"/><br/>
ReverbLev<br/>
<input type="range" value="50" min="0" max="100" oninput="synth.setReverbLev(this.value/100)"/><br/>
<br/><br/>
Quality : <select onchange="synth.setQuality(this.selectedIndex)"><option>Quality=0</option><option selected>Quality=1</option></select>
<br/>
Timbre : <select id="prog" onchange="SetProgram(this.selectedIndex)"></select>
<br/>
<br/>
Play by keys :<br/>
<button onmousedown="synth.send([0x90,60,100])" onmouseup="synth.send([0x80,60,0])">C</button>
<button onmousedown="synth.send([0x90,62,100])" onmouseup="synth.send([0x80,62,0])">D</button>
<button onmousedown="synth.send([0x90,64,100])" onmouseup="synth.send([0x80,64,0])">E</button>
<button onmousedown="synth.send([0x90,65,100])" onmouseup="synth.send([0x80,65,0])">F</button>
<button onmousedown="synth.send([0x90,67,100])" onmouseup="synth.send([0x80,67,0])">G</button>
<button onmousedown="synth.send([0x90,69,100])" onmouseup="synth.send([0x80,69,0])">A</button>
<button onmousedown="synth.send([0x90,71,100])" onmouseup="synth.send([0x80,71,0])">B</button>
<button onmousedown="synth.send([0x90,72,100])" onmouseup="synth.send([0x80,72,0])">C</button>
</body>
</html>