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
1
190
WebAudio
GET EXCITED AND PLAY!!
Tiffany Conroy
October 01, 2012
Tweet
Share
More Decks by Tiffany Conroy
See All by Tiffany Conroy
Beautiful Authentication: Tear down the barbed wire
theophani
3
860
Lions and tigers and handling user capabilities
theophani
1
720
What about the CSSOM?
theophani
3
540
Cutting the fat
theophani
4
620
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.8k
Other Decks in Programming
See All in Programming
「コードは上から下へ読むのが一番」と思った時に、思い出してほしい話
panda728
PRO
39
26k
フルサイクルエンジニアリングをAI Agentで全自動化したい 〜構想と現在地〜
kamina_zzz
0
350
ThorVG Viewer In VS Code
nors
0
660
実は歴史的なアップデートだと思う AWS Interconnect - multicloud
maroon1st
0
310
CSC307 Lecture 01
javiergs
PRO
0
660
2年のAppleウォレットパス開発の振り返り
muno92
PRO
0
180
GoLab2025 Recap
kuro_kurorrr
0
2.7k
Patterns of Patterns
denyspoltorak
0
420
実はマルチモーダルだった。ブラウザの組み込みAI🧠でWebの未来を感じてみよう #jsfes #gemini
n0bisuke2
3
1.4k
20251212 AI 時代的 Legacy Code 營救術 2025 WebConf
mouson
0
240
dchart: charts from deck markup
ajstarks
3
940
Navigation 3: 적응형 UI를 위한 앱 탐색
fornewid
1
530
Featured
See All Featured
Making the Leap to Tech Lead
cromwellryan
135
9.7k
Navigating Weather and Climate Data
rabernat
0
66
Impact Scores and Hybrid Strategies: The future of link building
tamaranovitovic
0
180
VelocityConf: Rendering Performance Case Studies
addyosmani
333
24k
The World Runs on Bad Software
bkeepers
PRO
72
12k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
5.1k
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
akashhashmi
0
230
Fireside Chat
paigeccino
41
3.8k
More Than Pixels: Becoming A User Experience Designer
marktimemedia
2
280
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
1
100
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
140
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