$30 off During Our Annual Pro Sale. View Details »
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
WebAudio
Search
Tiffany Conroy
October 01, 2012
Programming
1
180
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
850
Lions and tigers and handling user capabilities
theophani
1
710
What about the CSSOM?
theophani
3
530
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
ゲームの物理 剛体編
fadis
0
320
大体よく分かるscala.collection.immutable.HashMap ~ Compressed Hash-Array Mapped Prefix-tree (CHAMP) ~
matsu_chara
1
210
AIエンジニアリングのご紹介 / Introduction to AI Engineering
rkaga
5
2k
ID管理機能開発の裏側 高速にSaaS連携を実現したチームのAI活用編
atzzcokek
0
210
Building AI Agents with TypeScript #TSKaigiHokuriku
izumin5210
6
1.3k
FluorTracer / RayTracingCamp11
kugimasa
0
220
堅牢なフロントエンドテスト基盤を構築するために行った取り組み
shogo4131
8
2.3k
非同期処理の迷宮を抜ける: 初学者がつまづく構造的な原因
pd1xx
1
700
TUIライブラリつくってみた / i-just-make-TUI-library
kazto
1
360
LLMで複雑な検索条件アセットから脱却する!! 生成的検索インタフェースの設計論
po3rin
2
650
20 years of Symfony, what's next?
fabpot
2
350
エディターってAIで操作できるんだぜ
kis9a
0
700
Featured
See All Featured
Understanding Cognitive Biases in Performance Measurement
bluesmoon
32
2.7k
jQuery: Nuts, Bolts and Bling
dougneiner
65
8.2k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
34
2.5k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.4k
Code Reviewing Like a Champion
maltzj
527
40k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.1k
Build The Right Thing And Hit Your Dates
maggiecrowley
38
3k
Build your cross-platform service in a week with App Engine
jlugia
234
18k
Scaling GitHub
holman
464
140k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
359
30k
Become a Pro
speakerdeck
PRO
31
5.7k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
9
1k
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