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
810
Lions and tigers and handling user capabilities
theophani
1
650
What about the CSSOM?
theophani
3
460
Cutting the fat
theophani
4
580
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
CSC509 Lecture 12
javiergs
PRO
0
160
Compose 1.7のTextFieldはPOBox Plusで日本語変換できない
tomoya0x00
0
200
Arm移行タイムアタック
qnighy
0
340
macOS でできる リアルタイム動画像処理
biacco42
9
2.4k
Make Impossible States Impossibleを 意識してReactのPropsを設計しよう
ikumatadokoro
0
280
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
1
100
Less waste, more joy, and a lot more green: How Quarkus makes Java better
hollycummins
0
100
Jakarta EE meets AI
ivargrimstad
0
200
よくできたテンプレート言語として TypeScript + JSX を利用する試み / Using TypeScript + JSX outside of Web Frontend #TSKaigiKansai
izumin5210
6
1.8k
Flutterを言い訳にしない!アプリの使い心地改善テクニック5選🔥
kno3a87
1
210
みんなでプロポーザルを書いてみた
yuriko1211
0
280
シェーダーで魅せるMapLibreの動的ラスタータイル
satoshi7190
1
480
Featured
See All Featured
Building Adaptive Systems
keathley
38
2.3k
KATA
mclloyd
29
14k
Why You Should Never Use an ORM
jnunemaker
PRO
54
9.1k
We Have a Design System, Now What?
morganepeng
50
7.2k
Scaling GitHub
holman
458
140k
The Language of Interfaces
destraynor
154
24k
Designing on Purpose - Digital PM Summit 2013
jponch
115
7k
Thoughts on Productivity
jonyablonski
67
4.3k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
How STYLIGHT went responsive
nonsquared
95
5.2k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
Mobile First: as difficult as doing things right
swwweet
222
8.9k
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