/
test.html
75 lines (59 loc) · 2.05 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
<!doctype html>
<html>
<head>
<title>Sound test</title>
</head>
<body>
<script>
var isPlaying = false;
var sourceNode = null;
var theBuffer = null;
var audioContext = new webkitAudioContext;
var request = new XMLHttpRequest();
request.open("GET", "sounds/drums.ogg", true);
request.responseType = "arraybuffer";
request.onload = function() {
audioContext.decodeAudioData( request.response, function(buffer) {
theBuffer = buffer;
} );
}
request.send();
function togglePlayback() {
var now = audioContext.currentTime;
if (isPlaying) {
//stop playing and return
sourceNode.playbackRate.cancelScheduledValues( now );
sourceNode.playbackRate.setValueAtTime( sourceNode.playbackRate.value, now );
// sourceNode.playbackRate.setTargetValueAtTime( 0.001, now, .3 );
sourceNode.playbackRate.linearRampToValueAtTime( 0.001, now+1 );
sourceNode.noteOff( now + 2 );
sourceNode = null;
isPlaying = false;
return "play";
}
sourceNode = audioContext.createBufferSource();
sourceNode.buffer = theBuffer;
sourceNode.loop = true;
sourceNode.playbackRate.setValueAtTime( 0.001, now );
// sourceNode.playbackRate.setTargetValueAtTime( 1.0, now, .3 );
sourceNode.playbackRate.linearRampToValueAtTime( 1.0, now+1 );
this.currentPlaybackRate = 1.0;
sourceNode.connect( audioContext.destination );
sourceNode.noteOn( now );
this.sourceNode = sourceNode;
this.isPlaying = true;
return "stop";
}
var mediaNode;
window.onload= function () {
mediaNode = audioContext.createMediaElementSource(document.getElementById('media_element'));
mediaNode.connect( audioContext.destination );
}
</script>
<button onclick="this.innerText = togglePlayback()">start</button>
<button onclick="if (sourceNode) { sourceNode.connect( audioContext.destination ); }">add connection</button>
<audio controls="controls" id='media_element'>
<source src="http://petervandernoord.nl/patchwork_js/audio/flim.mp3" type="audio/mp3" />
</audio>
</body>
</html>