-
-
Notifications
You must be signed in to change notification settings - Fork 6
/
Copy pathtest.html
141 lines (125 loc) · 4.41 KB
/
test.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
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<!DOCTYPE html>
<html lang=en>
<head>
<title>JZZ.midi.SMF Test</title>
<script src="node_modules/jzz/javascript/JZZ.js"></script>
<script src="node_modules/jzz-synth-tiny/javascript/JZZ.synth.Tiny.js"></script>
<script src="javascript/JZZ.midi.SMF.js"></script>
<script src="node_modules/jzz-gui-player/javascript/JZZ.gui.Player.js"></script>
</head>
<body>
<h1>JZZ.midi.SMF Test</h1>
<p id=player>Please enable JavaScript!</p>
<p id=note style='display:none;'>
<em>NOTE:</em> For better sound quality, you may want to install the
<a target=_blank href=http://jazz-soft.net>Jazz-Plugin</a> and browser extension from
<a target=_blank href=https://chrome.google.com/webstore/detail/jazz-midi/jhdoobfdaejmldnpihidjemjcbpfmbkm>Chrome Web Store</a>
or <a target=_blank href=https://addons.mozilla.org/en-US/firefox/addon/jazz-midi>Mozilla Add-ons</a>
or <a target=_blank href=https://apps.apple.com/us/app/jazz-midi/id1506447231>Apple App Store</a>.
</p><p>
<span>
<button onclick='fromBase64();'>Load from base64</button>
</span><span>
<button onclick="fileClicked();">Load from file</button>
<input type=file id=file style='position:absolute;top:-1000px;' onchange='fromFile();'>
</span><span>
<button onclick='fromURL();'>Load from URL</button>
<input type=text id=url value=test.mid onkeydown='if (event.keyCode == 13) fromURL();'>
</span>
</p><p>
<button onclick="speed(0.5);">Tempo: 50%</button>
<button onclick="speed(1);">Tempo: 100%</button>
<button onclick="speed(2);">Tempo: 200%</button>
</p>
<pre id=log></pre>
<script><!--
var log = document.getElementById('log');
function report(s) { return function() { log.innerHTML = s; }; }
document.getElementById('player').innerHTML = 'Please run <tt style="background-color:#bbf;"><b>npm install</b></tt> to enable this test.';
JZZ.synth.Tiny.register('Web Audio');
document.getElementById('player').innerHTML = '';
document.getElementById('note').style.display = 'block';
JZZ().or(report('Cannot start MIDI engine!')).openMidiOut().or(report('Cannot open MIDI Out!'));
var player = new JZZ.gui.Player({ at: 'player' });
function speed(x) { player.speed(x); }
function clear() {
player.stop();
player.disable();
log.innerHTML = '';
}
function load(data) {
var smf;
try {
smf = new JZZ.MIDI.Clip(data);
}
catch (e) {/**/}
try {
if (!smf) smf = new JZZ.MIDI.SYX(data);
}
catch (e) {/**/}
try {
if (!smf) smf = new JZZ.MIDI.SMF(data);
player.load(smf);
player.play();
}
catch (e) {
report(e)();
}
}
function fileClicked() {
clear();
setTimeout(function() { document.getElementById('file').click(); }, 0);
}
function fromFile() {
if (window.FileReader) {
var reader = new FileReader();
var f = document.getElementById('file').files[0];
reader.onload = function(e) { load(e.target.result); };
reader.readAsArrayBuffer(f);
}
else report('File API is not supported in this browser.')();
}
function fromURL() {
clear();
var url = document.getElementById('url').value;
try {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) { // works in Firefox and Edge
var r = xhttp.responseText;
var data = '';
for (var i = 0; i < r.length; i++) data += String.fromCharCode(r.charCodeAt(i) & 0xff);
load(data);
}
else {
report('XMLHttpRequest error')();
}
}
};
xhttp.overrideMimeType('text/plain; charset=x-user-defined');
xhttp.open('GET', url, true);
xhttp.send();
}
catch (e) {
report('XMLHttpRequest error')();
}
}
var data='\
TVRoZAAAAAYAAQADAGRNVHJrAAAAGgD/AwtMaXR0bGUgTGFtZQD/UQMKLCsA/y8ATVRyawAAAPMA/wMG\
THlyaWNzAP8BGEBUTWFyeSBXYXMgQSBMaXR0bGUgTGFtZWT/AQNcTWFL/wEDcnkgGf8BBHdhcyAy/wEC\
YSAy/wEDbGl0Mv8BBHRsZSAy/wEFbGFtZSxk/wEEL0xpdDL/AQR0bGUgMv8BBWxhbWUsZP8BBC9MaXQy\
/wEEdGxlIDL/AQVsYW1lLGT/AQMvTWFL/wEDcnkgGf8BBHdhcyAy/wECYSAy/wEDbGl0Mv8BBHRsZSAy\
/wEFbGFtZSwy/wEDL0EgMv8BA2xpdDL/AQR0bGUgMv8BBWxhbWUgMv8BBHdhcyAy/wEEc2hlIQD/LwBN\
VHJrAAAA8gD/AwVNdXNpYwDAC2SQQH9LgEBAAJA+fxmAPkAAkDx/MoA8QACQPn8ygD5AAJBAfzKAQEAA\
kEB/MoBAQACQQH9agEBACpA+fzKAPkAAkD5/MoA+QACQPn9agD5ACpBAfzKAQEAAkEN/MoBDQACQQ39a\
gENACpBAf0uAQEAAkD5/GYA+QACQPH8ygDxAAJA+fzKAPkAAkEB/MoBAQACQQH8ygEBAAJBAfzKAQEAZ\
kEB/GYBAQACQPn8ygD5AAJA+fzKAPkAAkEB/MoBAQACQPn8ygD5AAJA8f2RAZABDZABIf1qAPEAAQEAA\
Q0AASEAK/y8A';
function fromBase64() {
clear();
load(JZZ.lib.fromBase64(data));
}
--></script>
</body>
</html>