forked from gasman/jsmodplayer
-
Notifications
You must be signed in to change notification settings - Fork 8
/
index.html
128 lines (114 loc) · 4.62 KB
/
index.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
<!DOCTYPE html>
<html>
<head>
<script src="src/modfile.js"></script>
<script src="src/xmfile.js"></script>
<script src="src/modplayer.js"></script>
<style>
p { margin-top: 8px; margin-bottom: 8px}
</style>
<script>
var modPlayer;
var playing = false;
var channels = 2; //stereo
var sampleRate = 44100;
var bufferSize = 8192; // buffer size is no longer multiplied by channels
// because buffers are per-channel
function play() {
status.innerHTML = "Playing (<a href='#' onclick='stop(); return false;'>stop</a>)";
playing = true;
var audioContext = new AudioContext();
var processor = audioContext.createScriptProcessor(bufferSize, 0, 2);
processor.onaudioprocess = function(e) {
var output = {}
var samples = modPlayer.getSamples(bufferSize);
output.left = e.outputBuffer.getChannelData(0);
output.right = e.outputBuffer.getChannelData(1);
for (i=0; i < bufferSize; i++) {
output.left[i] = samples[0][i];
output.right[i] = samples[1][i];
}
}
processor.connect(audioContext.destination);
}
function stop() {
status.innerHTML = "Paused (<a href='#' onclick='play(); return false;'>play</a>)";
playing = false;
}
/* load from harddrive using HTML5 File API */
function loadLocal(file) {
var reader = new FileReader();
reader.onload = (function(theFile) {
return function(e) {
/* actually load mod once we're passed the file data */
theFile = e.target.result; /* get the data string out of the blob object */
var modFile = new ModFile(theFile);
modPlayer = new ModPlayer(modFile, 44100);
console.log(modFile);
play();
document.getElementById('status').innerText = '';
};
})(file);
reader.readAsBinaryString(file);
document.getElementById('status').innerText = '';
}
function loadRemote(path) {
var fetch = new XMLHttpRequest();
fetch.open('GET', path);
fetch.overrideMimeType("text/plain; charset=x-user-defined");
fetch.onreadystatechange = function() {
if(this.readyState == 4 && this.status == 200) {
/* munge response into a binary string */
var t = this.responseText || "" ;
var ff = [];
var mx = t.length;
var scc= String.fromCharCode;
for (var z = 0; z < mx; z++) {
ff[z] = scc(t.charCodeAt(z) & 255);
}
var binString = ff.join("");
var modFile = new ModFile(binString);
modPlayer = new ModPlayer(modFile, 44100);
play();
document.getElementById('status').innerText = '';
}
}
document.getElementById('status').innerText = 'loading...';
fetch.send();
}
</script>
</head>
<body onload="init()">
<h1>JSModPlayer</h1>
<h2>The imaginatively named Javascript .mod player by Gasman</h2>
<p>This is a work in progress - not all effects are implemented yet.</p>
<ul>
<li><a href="javascript:loadRemote('mods/ambpower.mod')">Ambient Power (Vogue / Triton)</a></li>
<li><a href="javascript:loadRemote('mods/dope.mod')">Dope / Onward Ride (Jugi / Complex)</a></li>
<li><a href="javascript:loadRemote('mods/frust.mod')">Mental Frustration (Nugget / Rebels)</a></li>
<li><a href="javascript:loadRemote('mods/mindkick.mod')">Mindkick (Mindfuck / Mentasm)</a></li>
<li><a href="javascript:loadRemote('mods/sundance.mod')">Sundance (Purple Motion / Future Crew)</a></li>
<!-- These are benchmark modules. Not for public consumption....yet :) -->
<!--<li><a href="javascript:loadRemote('mods/ode_to_protracker.mod')">Ode to Protracker (Asle / Sylvain Chipaux)</a></li>-->
<li><a href="javascript:loadRemote('mods/RandomVoice-Monday.mod')">Monday (Edvin Fladen a.k.a "Random Voice")</a></li>
<li>From harddrive: <input type="file" id="input" multiple="true" onchange="loadLocal(this.files[0])"></li>
</ul>
<div id="status">Not started</div>
<h3>Credits</h3>
<p>Original by Gasman.
<a href="http://twitter.com/westdotcodottt">@westdotcodottt</a> -
<a href="http://matt.west.co.tt/">matt.west.co.tt</a> -
<a href="mailto:[email protected]">[email protected]</a> - 22 May 2010
</p>
<p>Forked and improved by
<a href="http://billy.wenge-murphy.com/">Billy Wenge-Murphy</a> -
<a href="http://twitter.com/billywm">@BillyWM</a> -
<a href="mailto:[email protected]">[email protected]</a> - April 2011.<br>
Added local file loading (HTML5 File API), implemented more effects, fixes to playback
</p>
<p>Source code on Github:
<a href="http://github.com/gasman/jsmodplayer">Gasman</a> (original)
<a href="https://github.com/BillyWM/jsmodplayer">BillyWM</a> (fork)
</p>
</body>
</html>