-
Notifications
You must be signed in to change notification settings - Fork 6
/
noise.html
129 lines (120 loc) · 4.05 KB
/
noise.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0"/>
<meta name="format-detection" content="telephone=no"/>
<title>8bit风格噪波生成器</title>
</head>
<body>
<h1>8bit风格噪波生成器</h1>
<p>本页面<strong>绝对没有</strong>加载额外的音频资源，不信就捕捉页面的网络请求看~</p>
<p>
<input type="button" id="boom" value="大爆炸"/>
<input type="button" id="bullet" value="子弹"/>
</p>
<script>
(function () {
window.AudioContext = window.AudioContext || window.webkitAudioContext;
var ctx = new AudioContext();
var sampleRate = 44100;
var boomNoise = [
[880, 7422],
[8800, 1354],
[440, 1556],
[2320, 7210],
[3520, 36850],
[880, 7410],
[2320, 7280],
[3520, 36850],
[880, 7410],
[3520, 13184],
[880, 7410],
[2320, 7410]
];
var bulletNoise = [
[7260, 713, 1],
[880, 764, 1],
[880, 764, 1],
[5060, 1450, 0.2],
[0, 746],
[7260, 713, 1],
[880, 764, 1],
[880, 764, 1],
[5060, 1450, 0.2],
[0, 746],
[3740, 2190, 0.3],
[880, 4473, 0.15],
[3520, 2153, 0.15],
[0, 2200],
[4400, 2259, 0.15],
[1760, 2316, 0.05],
[3520, 2053, 0.05, true]
];
function genOneNoise(freq, sampleNum, volume, isFadeOut) {
var i;
var channel = new Float32Array(sampleNum);
if (freq === 0) {
for (i = 0; i < sampleNum; i ++) {
channel[i] = 0;
}
return channel;
}
var res = 1;
var pos = sampleRate / freq;
var nextPos = pos;
volume = (typeof volume === 'number' ? volume : 1);
for (i = 0; i < sampleNum; i ++) {
if (i >= nextPos) {
res = Math.ceil(Math.random() * 2) * 2 - 3;
nextPos += pos;
}
if (isFadeOut) {
channel[i] = res * volume * (1 - i / sampleNum);
} else {
channel[i] = res * volume;
}
}
return channel;
}
function genNoiseBuffer(noiseMsg, volume, isFadeOut) {
var i, j, p;
var sampleNum = 0;
for (i = 0; i < noiseMsg.length; i ++) {
sampleNum += noiseMsg[i][1];
}
var oneNoise;
var buffer = ctx.createBuffer(1, sampleNum, sampleRate);
var noiseSeq = buffer.getChannelData(0);
volume = (typeof volume === 'number' ? volume : 1);
p = 0;
for (i = 0; i < noiseMsg.length; i ++) {
oneNoise = genOneNoise(noiseMsg[i][0], noiseMsg[i][1], noiseMsg[i][2], noiseMsg[i][3]);
for (j = 0; j < oneNoise.length; j ++) {
noiseSeq[p] = oneNoise[j] * volume;
p ++;
}
}
if (isFadeOut) {
for (i = 0; i < noiseSeq.length; i ++) {
noiseSeq[i] = noiseSeq[i] * (1 - i / noiseSeq.length);
}
}
return buffer;
}
document.getElementById('boom').onclick = function () {
var source = ctx.createBufferSource();
source.buffer = genNoiseBuffer(boomNoise, 1, true);
source.connect(ctx.destination);
source.start();
};
document.getElementById('bullet').onclick = function () {
var source = ctx.createBufferSource();
source.buffer = genNoiseBuffer(bulletNoise, 1, false);
source.connect(ctx.destination);
source.start();
};
})();
</script>
</body>
</html>