xNode Pastebin
New List Find
Post Details
HTML5 Audio Test (Enverex on 2012-03-18-11:22:05)
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
##### (test.js) THE JS FILE
var audio = document.createElement("audio");

audio.addEventListener('timeupdate', function(){
	progbar = audio.currentTime;
	proglen = audio.duration;
	progress = (progbar / proglen) * 100;
	$('#player-progress').width(progbar + '%');
}, false);

audio.addEventListener('progress', function() {
	if(audio.duration && audio.buffered.end(0)) {
		progload = (audio.buffered.end(0) / audio.duration) * 100;
		$('#player-loaded').width(progload + '%');
		console.log('Loaded: ' + progload);
	}
}, false);

$(document).ready(function() {
	audio.src = 'http://topaz:88/tmp/10446-high.ogg';
	audio.type = 'audio/ogg';
	audio.play();
});



##### (test.html) THE HTML FILE
<html><body>
	<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'></script>
	<script type='text/javascript' script src='test.js'></script>
	<div id='player-loaded' style='height: 5px; background-color: red;'></div>
	<div id='player-progress' style='height: 5px; background-color: blue;'></div>
</body></html>