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
160
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
800
Lions and tigers and handling user capabilities
theophani
1
650
What about the CSSOM?
theophani
3
450
Cutting the fat
theophani
4
570
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.7k
Other Decks in Programming
See All in Programming
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
inesmontani
PRO
3
1.2k
pytest プラグインを開発して DRY に自動テストを書こう
inuatsu
2
260
PHPを書く理由、PHPを書いていて良い理由 / Reasons to write PHP and why it is good to write PHP
seike460
PRO
5
460
5年分のツケを一気に払った話
soogie
3
1.3k
標準ライブラリの動向とイテレータのパフォーマンス
makki_d
3
200
2024-10-01 dev2next - Observability for Modern JVM Applications
jonatan_ivanov
0
110
ACES Meet におけるリリース作業改善の取り組み
fukucheee
0
130
コードレビューと私の過去と未来
jxmtst
0
260
App Router 悲喜交々
quramy
7
380
ECS向けのドリフト検知機構を実装してみた
tkikuc
0
280
文化が生産性を作る
jimpei
3
560
実践Dash - 手を抜きながら本気で作るデータApplicationの基本と応用 / Dash for Python and Baseball
shinyorke
2
260
Featured
See All Featured
Typedesign – Prime Four
hannesfritz
39
2.3k
Adopting Sorbet at Scale
ufuk
73
9k
Designing with Data
zakiwarfel
98
5.1k
Automating Front-end Workflow
addyosmani
1365
200k
Stop Working from a Prison Cell
hatefulcrawdad
267
20k
How to name files
jennybc
77
99k
A Tale of Four Properties
chriscoyier
156
22k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.2k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
41
9.2k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
355
29k
Product Roadmaps are Hard
iamctodd
PRO
48
10k
Facilitating Awesome Meetings
lara
49
6k
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