Your SlideShare is downloading. ×
realtime audio on ze web @ hhjs
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

realtime audio on ze web @ hhjs

1,281
views

Published on

A brief overview of current direct audio APIs in modern browsers and what to build with it.

A brief overview of current direct audio APIs in modern browsers and what to build with it.

Published in: Technology

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,281
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
2
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. realtime audio on ze web APIs, Demos, Anwendungen Jan Krutisch <jan.krutisch@mindmatters.de> für #hhjs, 21.Februar 2011Montag, 21. Februar 2011
  • 2. Moi.Montag, 21. Februar 2011
  • 3. Realtime audio?Montag, 21. Februar 2011
  • 4. In/OutMontag, 21. Februar 2011
  • 5. Status Quo.Montag, 21. Februar 2011
  • 6. nada.Montag, 21. Februar 2011
  • 7. flash.Montag, 21. Februar 2011
  • 8. horizont.Montag, 21. Februar 2011
  • 9. Montag, 21. Februar 2011
  • 10. Audio Data APIMontag, 21. Februar 2011
  • 11. <audio/>Montag, 21. Februar 2011
  • 12. 10 betaMontag, 21. Februar 2011
  • 13. Montag, 21. Februar 2011
  • 14. Montag, 21. Februar 2011
  • 15. Montag, 21. Februar 2011
  • 16. Web Audio APIMontag, 21. Februar 2011
  • 17. AudioContextMontag, 21. Februar 2011
  • 18. Das wars.Montag, 21. Februar 2011
  • 19. Ja, sorry, ey.Montag, 21. Februar 2011
  • 20. Code, or it didn‘t happenMontag, 21. Februar 2011
  • 21. <!DOCTYPE html> <html> <head> <title>JavaScript Audio Write Example</title> </head> <body> <input type="text" size="4" id="freq" value="440"><label for="hz">Hz</label> <button onclick="start()">play</button> <button onclick="stop()">stop</button> <script type="text/javascript"> function AudioDataDestination(sampleRate, readFn) { // Initialize the audio output. var audio = new Audio(); audio.mozSetup(1, sampleRate); var currentWritePosition = 0; var prebufferSize = sampleRate / 2; // buffer 500ms var tail = null; // The function called with regular interval to populate // the audio output buffer. setInterval(function() { var written; // Check if some data was not written in previous attempts. if(tail) { written = audio.mozWriteAudio(tail); currentWritePosition += written; if(written < tail.length) { // Not all the data was written, saving the tail... tail = tail.slice(written); return; // ... and exit the function. } tail = null; } // Check if we need add some data to the audio output. var currentPosition = audio.mozCurrentSampleOffset(); var available = currentPosition + prebufferSize - currentWritePosition; if(available > 0) { // Request some sound data from the callback function. var soundData = new Float32Array(available); readFn(soundData); // Writting the data. written = audio.mozWriteAudio(soundData); if(written < soundData.length) { // Not all the data was written, saving the tail. tail = soundData.slice(written); } currentWritePosition += written; } }, 100); } // Control and generate the sound. var frequency = 0, currentSoundSample; var sampleRate = 44100; function requestSoundData(soundData) { if (!frequency) { return; // no sound selected } var k = 2* Math.PI * frequency / sampleRate; for (var i=0, size=soundData.length; i<size; i++) { soundData[i] = Math.sin(k * currentSoundSample++); } } var audioDestination = new AudioDataDestination(sampleRate, requestSoundData); function start() { currentSoundSample = 0; frequency = parseFloat(document.getElementById("freq").value); } function stop() { frequency = 0; } </script>Montag, 21. Februar 2011
  • 22. [...] var audio = new Audio(); audio.mozSetup(1, sampleRate); [...] written = audio.mozWriteAudio(tail); [...]Montag, 21. Februar 2011
  • 23. https://wiki.mozilla.org/Audio_Data_API#Writing_AudioMontag, 21. Februar 2011
  • 24. context = new webkitAudioContext(); var jsNode = context.createJavaScriptNode(8192, 0, 2); jsNode.connect(context.destination); jsNode.onaudioprocess = requestSoundData;Montag, 21. Februar 2011
  • 25. AnwendungenMontag, 21. Februar 2011
  • 26. MusikMontag, 21. Februar 2011
  • 27. SpieleMontag, 21. Februar 2011
  • 28. ( Build and they will come )Montag, 21. Februar 2011
  • 29. Meine kleine EckeMontag, 21. Februar 2011
  • 30. http://webloop.pixelpoke.deMontag, 21. Februar 2011
  • 31. http://github.com/halfbyte/soundbridge.jsMontag, 21. Februar 2011
  • 32. soundbridge = SoundBridge(2, 44100, ..); [...] soundbridge.setCallback(calc); soundbridge.play(); }, 1000);Montag, 21. Februar 2011