FirefoxOSで音を使ってみる

1,117 views

Published on

"関西Firefox OS勉強会 3rd GIG"のLT資料です。
http://atnd.org/events/41743

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,117
On SlideShare
0
From Embeds
0
Number of Embeds
13
Actions
Shares
0
Downloads
3
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

FirefoxOSで音を使ってみる

  1. 1. FirefoxOSで 音を使ってみる 2013/08/31 河野 聡 13年9月2日月曜日
  2. 2. 自己紹介 河 野 聡 @esperia09 R e : K a y o - S y s t e m 趣味: プログラム、作曲、絵描いたりとか 13年9月2日月曜日
  3. 3. ふぉくすけあざます! 13年9月2日月曜日
  4. 4. でもLT何しよう… 13年9月2日月曜日
  5. 5. \はっ/ 13年9月2日月曜日
  6. 6. 以前LT用に作ったアプリ http://sequentic.appspot.com/ 13年9月2日月曜日
  7. 7. これをFirefoxOS上でも 動かしたい! 13年9月2日月曜日
  8. 8. とりあえず、HTML5で 音を扱うAPIを再調査した 13年9月2日月曜日
  9. 9. 音を扱うHTML5 API •Web Audio API • Googleが提案 • ↑先ほどのアプリはこちらを使ってます •Audio Data API • Mozillaが提案 • ↑非推奨・削除予定 13年9月2日月曜日
  10. 10. Web Audio API • サポートブラウザ • Chrome 10 (2011-03-08) • Safari 6 (2012-07-25) • Opera 15.0 (2013-07-02) • Firefox 23.0 (2013-08-06) • (IEは未サポート) 13年9月2日月曜日
  11. 11. Web Audio API • サポートブラウザ • Chrome 10 (2011-03-08) • Safari 6 (2012-07-25) • Opera 15.0 (2013-07-02) • Firefox 23.0 (2013-08-06) • (IEは未サポート) つい最近!! 13年9月2日月曜日
  12. 12. Audio Data API • サポートブラウザ • Firefox 4.0 (2011-03-02) 13年9月2日月曜日
  13. 13. 肝心のFirefoxOSは…? 13年9月2日月曜日
  14. 14. http://www.slideshare.net/dynamis/firefox-os-updates-201308 13年9月2日月曜日
  15. 15. Firefox ver ≒ Gecko ver https://developer.mozilla.org/ja/docs/Mozilla/Gecko/Versions 13年9月2日月曜日
  16. 16. •Firefox 18 ≒ Gecko 18 •Web Audio API (>= Firefox 23) •→今はまだ使えない! 13年9月2日月曜日
  17. 17. (́・ω・`) 13年9月2日月曜日
  18. 18. だがしかし 13年9月2日月曜日
  19. 19. http://www.slideshare.net/dynamis/firefox-os-updates-201308 13年9月2日月曜日
  20. 20. http://forum.xda-developers.com/showthread.php?t=2388237 既に1.2ビルドされてたり 13年9月2日月曜日
  21. 21. もうすぐ使えるように なる!! 13年9月2日月曜日
  22. 22. ++ 13年9月2日月曜日
  23. 23. 現状での選択肢 • Web Audio APIがサポートされるまで 待つ • Audio Data APIを使えなくなること 覚悟で使う 13年9月2日月曜日
  24. 24. <audio> 忘れられてね? 13年9月2日月曜日
  25. 25. 現状での選択肢 • Web Audio APIがサポートされるまで 待つ • Audio Data APIを使えなくなること 覚悟で使う • <audio>要素を利用する 13年9月2日月曜日
  26. 26. 現状でも音が 鳴らせないわけじゃない 13年9月2日月曜日
  27. 27. 音楽を鳴らす <audio src="src/music.ogg" controls></audio> 13年9月2日月曜日
  28. 28. こんな感じ 13年9月2日月曜日
  29. 29. JavaScriptで制御可能 <body> <audio src="src/music.ogg" id="audio-main" controls></ audio> <button id="btn-play">Play</button> <button id="btn-stop">Stop</button> <script type="text/javascript"> var audio = document.getElementById('audio-main'); //var audio = new Audio('src/music.ogg'); document.getElementById('btn-play') .addEventListener('click', function(e) { audio.play(); }, false); document.getElementById('btn-stop') .addEventListener('click', function(e) { audio.pause(); }, false); </script> </body> 13年9月2日月曜日
  30. 30. デモ 13年9月2日月曜日
  31. 31. ご清聴ありがとうございました 13年9月2日月曜日

×