petamoriken / PxtoneJS

Play Pxtone Collage files in Web Audio API.

Demo

PxtoneJS Demo
※ JavaScript は ES6 で書いており、 Babel を使って ES5 のコードにトランスパイルして実行しています。そのままブラウザにコードを移してもおそらく動きませんので注意してください。

Install & Require

PxtoneJS releases と pxtnDecoder releases から Pxtone.js と pxtnDecoder.js を適当な場所に保存して

<script src="DEST/TO/Pxtone.js"></script>
<script src="DEST/TO/pxtnDecoder.js"></script>

としてください。
デコーダーを Web Worker として使う場合（推奨）は

<script src="DEST/TO/Pxtone.js"></script>
<script>
	var pxtnDecoder = new Worker("DEST/TO/pxtnDecoder.js");
</script>

としてください。

Initialize

以下のように初期化します。

var pxtone = new Pxtone();
pxtone.decoder = pxtnDecoder;

How to Use

ブラウザ上で Pxtone Collage ファイルを再生するには、XMLHttpRequest や Fetch API, File API などで Pxtone Collage Project ファイル（拡張子 .ptcop）か Pxtone Tune ファイル（拡張子 .pttune) の ArrayBuffer を取得する必要があります。仮に arrayBuffer という変数に得た Pxtone Collage ファイル の ArrayBuffer を入れた場合、以下のようにして AudioBuffer を得ることが出来ます。

var ctx = new (window.AudioContext || window.webkitAudioContext)();
pxtone.decodePxtoneData(ctx, arrayBuffer).then(function(obj) {
  var audioBuffer = obj.buffer;
  var data = obj.data;
});

得た AudioBuffer を再生するには AudioBufferSourceNode を使います。詳しくは MDN の Web Audio APIの利用 や AudioContext.createBufferSource() を参考にしてください。

API

AudioBuffer を作る

• Pxtone#decodeNoiseData(ctx: AudioContext, buffer: ArrayBuffer, channel: number = 2, sampleRate: number = null, bitsPerSample: number = 16): Promise<{buffer: AudioBuffer, data: null}>

  • Pxtone Noise ファイル（拡張子 .ptnoise）を AudioBuffer に変換します。
  • channel は 1, 2 の値を、bitsPerSample は 8, 16 の値のみ取ります。
  • sampleRate は 11025, 22050, 44100, null の値のみ取ります。null のときは第一引数の ctx のプロパティである ctx.sampleRate の値を使います。ただし、それが 11025, 22050, 44100 のいずれでもない場合は 44100 とします。

• Pxtone#decodePxtoneData(ctx: AudioContext, buffer: ArrayBuffer, channel: number = 2, sampleRate: number = null, bitsPerSample: number = 16): Promise<{buffer: AudioBuffer, data: Object}>

  • Pxtone Collage Project ファイル（拡張子 .ptcop）と Pxtone Tune ファイル（拡張子 .pttune）を AudioBuffer に変換します。

  • channel は 1, 2 の値を、bitsPerSample は 8, 16 の値のみ取ります。

  • sampleRate は 11025, 22050, 44100, null の値のみ取ります。null のときは第一引数の ctx のプロパティである ctx.sampleRate の値を使います。ただし、それが 11025, 22050, 44100 のいずれでもない場合は 44100 とします。

  • Pxtone#decodeNoiseData とは違い、返り値の Promise は data: Object を持ちます。data: Object は以下の様なプロパティを持ちます。

    • title: string: ファイルが持つタイトルの文字列です。
    • comment: string: ファイルが持つコメントの文字列です。
    • loopStart: number: ループ初めの位置です（Web Audio API の AudioBufferSourceNode に与えて使います） 。
    • loopEnd: number: ループ終わり位置です（Web Audio API の AudioBufferSourceNode に与えて使います）。

Wave の ArrayBuffer を作る

• Pxtone#decodeNoise(buffer: ArrayBuffer, channel: number = 2, sampleRate: number = null, bitsPerSample: number = 16): Promise<{buffer: ArrayBuffer, data: null}>

  • Pxtone Noise ファイル（拡張子 .ptnoise）を Wave の ArrayBuffer に変換します。
  • 引数については Pxtone#decodeNoiseData と同じです。ただし sampleRate が null のときは 44100 として扱います。

• Pxtone#decodePxtone(buffer: ArrayBuffer, channel: number = 2, sampleRate: number = null, bitsPerSample: number = 16): Promise<{buffer: ArrayBuffer, data: Object}>

  • Pxtone Collage Project ファイル（拡張子 .ptcop）と Pxtone Tune ファイル（拡張子 .pttune）を Wave の ArrayBuffer に変換します。
  • 引数については Pxtone#decodePxtoneData と同じです。ただし sampleRate が null のときは 44100 として扱います。

License & Dependencies

under MIT License.

Support

何か問題が起きた場合は issues に投稿してください。
また簡単な使い方の質問などは @printf_moriken に気軽にどうぞ。