javatripping
javatripping

Reputation: 33

Javascript audio (possibly Web Audio) setting exact time

I have two songs, which I both need to play at the EXACT same time (down the the index of the AudioBuffer, which I convert to seconds by dividing by the sample rate), the problem is, executing song1.play(); andsong2.play(); takes ~200ms (using console.time) to execute, which throws off the timing - is there anyway to use the buffer or some JS magic to play them EXACTLY at the same time?

Upvotes: 2

Views: 198

Answers (2)

With web audio, you can specify the starting time of AudioBufferSources:

https://developer.mozilla.org/en-US/docs/Web/API/AudioBufferSourceNode/start

Upvotes: 1

Amir Hossein Baghernezad
Amir Hossein Baghernezad

Reputation: 4085

Ive made a simple page and tested it.

<html>
<head>
<meta charset="utf-8" />
</head>
<body>

<audio id="player1" controls style="width: 400px;">
<source type="audio/mpeg" src="http://127.0.0.1:8080/1.mp3"></source>
</audio>

<audio id="player2" controls style="width: 400px;">
<source type="audio/mpeg" src="http://127.0.0.1:8080/1.mp3"></source>
</audio>

<script>
    var plyr1 = document.getElementById('player1');
    var plyr2 = document.getElementById('player2');
</script>
</body>
</html>

I put plyr1.play(); plyr2.play(); in console (firefox) and hit enter. there is no difference between those sounds! I dont know what the problem is in your case, but you can give plyr1.autoplay = true; plyr2.autoplay = true; a try , which is not a function so as experience says should take less time ;)
aha, if you are using new Audio() you should note that using new keyword causes javascript to go slow. avoid it and use document.createElement('audio') instead.

Upvotes: 0

Related Questions