Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
WebAudio
Search
Tiffany Conroy
October 01, 2012
Programming
210
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
890
Lions and tigers and handling user capabilities
theophani
1
780
What about the CSSOM?
theophani
3
610
Cutting the fat
theophani
4
660
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
AI-Powered Domain-Driven Design
ziobrando
0
410
Kawaiicon: Kubernetes, it's no longer cool, but let's secure it anyway!
barnbarn
0
120
Goコンパイラを作ってGoをもっと理解する / Build a Go compiler to better understand Go
ikura_hamu
0
130
作れる、でも消せるか?──安全に「枯らして消す」機能削除術 / Drain, Then Delete
chobishiba
3
1.4k
Spec-Driven Development - Why Vaadin Is the Perfect Fit
simas
PRO
0
240
作れるエンジニアから、価値を届けるエンジニアへ
ryunakayama
1
240
Crash Auto Pipelines
veronikapj
1
390
クラウドエージェントは、 何がそんなに便利なのか / what makes cloud agents so useful
rkaga
5
800
React Native에 현대적인 빌드 도구 더하기: Rollipop 구현기
leegeunhyeok
0
180
はじめてのPLATEAU
nokonoko1203
1
610
Python Lambdaにおけるテストしやすい設計とAI支援の活用 / Designing Testable Python Lambda Functions with AI
kitano_yuichi
1
300
エージェントを使い続けるためのメタワーク / Meta-work for keeping using the agent
rkaga
6
2.2k
Featured
See All Featured
How to Ace a Technical Interview
jacobian
280
24k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
3.1k
End of SEO as We Know It (SMX Advanced Version)
ipullrank
3
4.5k
A designer walks into a library…
pauljervisheath
211
25k
Skip the Path - Find Your Career Trail
mkilby
1
290
Exploring anti-patterns in Rails
aemeredith
4
560
Producing Creativity
orderedlist
PRO
348
41k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
uxyall
1
3.8k
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
610
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
350
How Software Deployment tools have changed in the past 20 years
geshan
3
35k
Tips & Tricks on How to Get Your First Job In Tech
honzajavorek
1
830
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