Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
WebAudio
Search
Tiffany Conroy
October 01, 2012
Programming
200
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
WebAudio
GET EXCITED AND PLAY!!
Tiffany Conroy
October 01, 2012
More Decks by Tiffany Conroy
See All by Tiffany Conroy
Beautiful Authentication: Tear down the barbed wire
theophani
3
870
Lions and tigers and handling user capabilities
theophani
1
750
What about the CSSOM?
theophani
3
590
Cutting the fat
theophani
4
640
When to use Ajax and when to reload
theophani
6
1.8k
Version Control All The Codes
theophani
12
1.3k
Design Processes, Not Interfaces
theophani
5
1.9k
Other Decks in Programming
See All in Programming
Vue × Nuxt × Oxc どこまで使える?実運用の現在地
andpad
0
370
エンジニアと一緒にテストコードの設計と実装を改善した話
mototakatsu
0
260
Snowflake Summitでの新機能 CoCo / CoWork / snowflake-summit-2026-overall-what-new-coco
tatsuhiro
1
220
PHPだって関数型したい 〜できること、できないこと〜 / fp-in-php
jsoizo
0
190
LLMによるContent Moderationの本番運用の裏側と品質担保への挑戦
suikabar
3
840
Generative UI & AI-Assistants for Your Angular Solutions
manfredsteyer
PRO
1
160
【やさしく解説 設計編・中級 #4】ルールの寿命と、システムの年輪
panda728
PRO
2
120
どこまでゆるくて許されるのか
tk3fftk
0
470
AI 輔助遺留系統現代化的經驗分享
jame2408
1
1.2k
「正の参照」と 「負の導出」で組む ハーネスエンジニアリング
cottpan
1
140
Haskell/Servantを通してWebミドルウェアを捉え直す
pizzacat83
1
480
えっ!!コードを読まずに開発を!?
hananouchi
0
190
Featured
See All Featured
The #1 spot is gone: here's how to win anyway
tamaranovitovic
3
1.1k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
360
30k
Automating Front-end Workflow
addyosmani
1370
210k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
28
3.6k
Paper Plane
katiecoart
PRO
2
52k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
460
Making the Leap to Tech Lead
cromwellryan
135
10k
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
4.1k
Speed Design
sergeychernyshev
33
1.9k
Faster Mobile Websites
deanohume
310
32k
Documentation Writing (for coders)
carmenintech
77
5.4k
For a Future-Friendly Web
brad_frost
183
10k
Transcript
WEBAUDIO
WebAudio != <audio … >
// create new <audio> var audioElement = new Audio();
// create new WebAudio Context var context = new audioContext();
// create new WebAudio Context var context = new webkitAudioContext();
WICKED WEBAUDIO DEMOS http://chromium.googlecode.com/svn/trunk/samples/audio/samples.html
PLAY
audioElement.src = path // check/wait until you can play audioElement.play();
var source = context.createBufferSource(); source.buffer = buffer; source.connect(context.destination); source.noteOn(at); //
PLAY
var source = context.createBufferSource(); source.buffer = buffer; source.connect(context.destination); source.noteOn(at); //
PLAY
var source = context.createBufferSource(); source.buffer = buffer; source.connect(context.destination); source.noteOn(at); //
PLAY
$.ajax({ url: "/path/to/my/sound/file", success: decodeAudioData, requestType: "arraybuffer" });
$.ajax({ url: "/path/to/my/sound/file", success: decodeAudioData, requestType: "arraybuffer" }); NOPE
var request = new XMLHttpRequest(); request.open("GET", "/path/to/sound"); request.responseType = "arraybuffer";
request.onload = decodeAudioData; request.send();
var request = new XMLHttpRequest(); request.open("GET", "/path/to/sound"); request.responseType = "arraybuffer";
request.onload = decodeAudioData; request.send();
var decodeAudioData = function() { context.decodeAudioData( request.response, decodeSuccess); };
var decodeSuccess = function(buffer) { doSomething(buffer); };
var decodeSuccess = function(buffer) { doSomething(buffer); };
var decodeSuccess = function(buffer) { doSomething(buffer); };
I MADE SOME FUNCTIONS github.com/theophani/load-sounds
var loadSound = function(path, callback) { // load the sound
sorta like I showed before };
var loadSounds = function(paths, callback) { // load a bunch
of sounds };
var playSound = function(buffer) { // stuff with source and
context };
Tiffany Conroy github.com/theophani/load-sounds @theophani