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
170
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
840
Lions and tigers and handling user capabilities
theophani
1
690
What about the CSSOM?
theophani
3
510
Cutting the fat
theophani
4
600
When to use Ajax and when to reload
theophani
6
1.8k
Version Control All The Codes
theophani
12
1.2k
Design Processes, Not Interfaces
theophani
5
1.8k
Other Decks in Programming
See All in Programming
Use Perl as Better Shell Script
karupanerura
0
690
Passkeys for Java Developers
ynojima
3
850
UPDATEがシステムを複雑にする? イミュータブルデータモデルのすすめ
shimomura
1
530
エラーって何種類あるの?
kajitack
5
140
Perlで痩せる
yuukis
1
680
機械学習って何? 5分で解説頑張ってみる
kuroneko2828
0
200
セキュリティマネジャー廃止とクラウドネイティブ型サンドボックス活用
kazumura
1
170
Prism.parseで 300本以上あるエンドポイントに 接続できる権限の一覧表を作ってみた
hatsu38
1
110
AWS CDKの推しポイント 〜CloudFormationと比較してみた〜
akihisaikeda
3
220
ReadMoreTextView
fornewid
1
360
複数アプリケーションを育てていくための共通化戦略
irof
10
3.8k
Cursor Meetup Tokyo ゲノミクスとCursor: 進化と制約のあいだ
koido
2
980
Featured
See All Featured
Optimising Largest Contentful Paint
csswizardry
37
3.3k
Designing for humans not robots
tammielis
253
25k
For a Future-Friendly Web
brad_frost
179
9.8k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.1k
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
Balancing Empowerment & Direction
lara
1
290
Music & Morning Musume
bryan
46
6.6k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Six Lessons from altMBA
skipperchong
28
3.8k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
45
7.3k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
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