Yamasuke 日記

Yamasukeの日記です。コンピュータソフトウェアに関する記事を投稿します。明日から試してみたくなるような+1の記事を心がけます。

SoundJSのメモ

SoundJSの使用メモ

f:id:namaranran:20150309172509p:plain

FxOS上で音を再生するには < audio >タグを使う。サウンド系に特化したライブラリを調べてみたところSoundJSというものがあることがわかった。

他にも色々とありそうだが、SoundJSはCreateJSと呼ばれるライブラリ郡の一部で、他にも画面描画を行うEaselJS, TweenJS,ファイルのプリロードが可能なPreloadJSがある。

マルチプラットフォーム、MITライセンス、商用でも無償で利用可なので、使用するには自由度が高い。

ライブラリ バージョン
EaselJS 0.8.0
TweenJS 0.6.0
SoundJS 0.6.0
PreloadJS 0.6.0

http://code.createjs.com/

バージョンが1.0.0版未満。他のライブラリも含めた一般的な感覚からすると、正式版(1.0.0版)までに変更が発生しそう。。。

鳴音サンプル

鳴らすだけの単純なサンプルコード

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1">
    <script src="https://code.createjs.com/createjs-2014.12.12.min.js"></script>
    <script>
      var soundID = "Thunder";
      function loadSound () {
        createjs.Sound.registerSound("assets/Thunder.ogg", soundID);
      }
      function playSound () {
        createjs.Sound.play(soundID);
      }
    </script>
  </head>
  <h1> SoundJS Test </h1>
  <body onload="loadSound();">
    <button onclick="playSound();" class="playSound">Play Sound</button>
  </body>
</html>

f:id:namaranran:20150309171740p:plain

※FxOSではCSPの関係で、privilegedの権限ならhtml内に直接scriptは書けない。動作させるならばWeb権限の必要あり。

PreloadJSと共に使うことで、実行環境を特に意識せずに単純に記載することができるので、使いやすそう。

音声ファイル含めて下記にアップ済み。

https://github.com/namaranran/soundjs_sandbox/tree/master/soundjs_sample

※音声ファイルはsoundJSのチュートリアルから拝借したやつを使用。

チュートリアル

http://createjs.com/Learn