Pot.js 1.19 and PotLite.js 1.36 released.
Pot.js 1.19 と PotLite.js 1.36 リリースしました。
Pot.base64Decode() で Pot.base64URLEncode() したのもデコード可能に
Pot.alphanumSort() に添字の指定可能なコールバック関数を引数に指定できるよう追加
Pot.isTypedArray() と Pot.isArrayBufferoid() を実装
ArrayBuffer と DataView をクロスブラウザにミックスしたような Pot.ArrayBufferoid の実装
文字コード変換関数 Pot.convertEncodingToUnicode() の実装 (Thanks haxe)
WebKitBlobBuilder が自動文字コード判別できないのを Fix
Pot.Base64 で Typed Array も扱えるよう改訂
Pot.Crypt で Typed Array も扱えるよう改訂
Pot.Signal で FileReader によるエラーが発生するのを修正
Pot.ArrayBufferoid から Array, String, Blob に変換するのを最適化
Pot.UTF8 と Pot.ArrayBufferoid でサロゲートペアの問題を修正 (Thanks kefir_)
Pot.DropFile に 'readAs', 'onProgress', 'onProgressFile' オプション/イベントを追加
Pot.DropFile のオプションのイベントコールバック関数に渡る引数を変更
Pot.DropFile でテキストかどうか判別するのを改善
Pot.toCharCode() を実装 (Pot.Text)
Pot.isBlob() と Pot.isFileReader() を実装
Pot.Deferred コールバック内で FileReader を返すと結果ファイルが次のチェインに渡るよう改訂
Added ogg in Pot.MimeType.
Improved compatibility with Pot.base64Decode() and Pot.base64URLEncode().
Added Pot.alphanumSort() callback argument to specify object property.
Added Pot.isTypedArray() and Pot.isArrayBufferoid() in Core.
Implemented Pot.ArrayBufferoid.
Added Pot.convertEncodingToUnicode().
Fixed: WebKitBlobBuilder cannot detect encoding automatically.
Improved Pot.Base64 to treat Typed Array.
Added support for specify Array (Typed Array) argument with Crypt functions.
Added Pot.isArrayBuffer() function in Core.
Fixed exception by FileReader in Pot.Signal.
Optimized Pot.ArrayBufferoid conversion functions.
Fixes the surrogate pair range bug in Pot.UTF8 and Pot.ArrayBufferoid reported by kefir_.
Added "readAs", "onProgress" and "onProgressFile" event options in Pot.DropFile.
Changed DropFile.prototype.on* event callback arguments in Pot.DropFile.
Fixed the text mode detection in Pot.DropFile.
Added Pot.toCharCode() function in Pot.Text.
Added Pot.isBlob() and Pot.isFileReader() function in Core.
Improved Pot.Deferred can replies if an instance of FileReader returned in callback.
大きな(?)変更点は Pot.DropFile のイベント関数の引数が変わったことです。
var dropFile = new Pot.DropFile(elem, { onLoadImage : function(data, name, size, type) {}, onLoadText : function(data, name, size, type) {}, onLoadUnknown : function(data, name, size, type) {}, // こうだったのが↓の引数になりました onLoadImage : function(data, fileinfo) { var name = fileinfo.name; var size = fileinfo.size; var type = fileinfo.type; }, onLoadText : function(data, fileinfo) { // 上と同じ }, onLoadUnknown : function(data, fileinfo) { // 上と同じ }, // そして実装された進歩時のイベント onProgress : function(percent) { // 複数ファイルがドロップされた時も含めて // ファイル全部に対する読み込み状況のパーセンテージ console.log(percent + '%'); }, onProgressFile : function(percent, fileinfo) { // ファイル 1つに対する読み込み状況のパーセンテージ console.log(fileinfo.name + ': ' + percent + '%'); }, // ドロップされたファイルの読み込む形式が指定できるようになりました readAs : 'arraybuffer' // - readAs : // - 'text' : テキストとして読み込みます (readAsText) // - 'binary' : バイナリとして読み込みます (readAsBinaryString) // - 'arraybuffer' : ArrayBufferとして読み込みます (readAsArrayBuffer) // - 'datauri' : DataURIとして読み込みます (readAsDataURL) // - null : テキストファイルは 'text'、それ以外は 'datauri' で読み込みます (デフォルト) });
この変更は リファレンス も更新してあります。 Pot.DropFile の 動作サンプル
そして、主な実装は Pot.ArrayBufferoid です。
ArrayBufferoid は、ArrayBuffer (Typed Array) の変換器を中心として
DataView の機能も兼ねたストリームに適したオブジェクト/コンストラクタです。
Array.prototype も持っててちょっとカオスに混ぜてますが、
クロスブラウザに使えるようにしたのが目的です。
まだリファレンスが作れてない (2012-05-13 現在) ので、ソースコードまたは JSDoc を参照ください。
var buffer = new Pot.ArrayBufferoid(); var i = 0; // 配列のように値を埋めたり buffer[i++] = 255; buffer[i++] = 254; // Array.prototype.push を使ってみたり buffer.push(253); buffer.push(252); // DataView がない環境でも使えるように Pot.debug(buffer.getUint16(0, true)); // 65279 // length は size() を使います Pot.debug('buffer.length = ' + buffer.size()); // 4 // Typed Array に変換 (ない環境は Array になる) var arrayBuffer = buffer.toArrayBuffer(); var uint8Array = buffer.toUint8Array(); // ストリームな使い方 buffer.seek(0); var data1 = buffer.read(1); Pot.debug(data1[0]); // 255 Pot.debug(buffer.tell()); // 1 var data2 = buffer.read(2); Pot.debug(data2); // [254, 253] buffer.seek(0); buffer.write([100, 101]); Pot.debug(buffer); // [100, 101, 253, 252]
でもやっぱり Typed Array を使うような場合は速度を重視すると思います。
その場合、直接 Uint8Array などを扱ったほうが速いです。
ArrayBufferoid はクロスブラウザなバッファとして扱うと楽になってます。
// 変換用に利用したり var uint8array = Pot.ArrayBufferoid.toUint8Array([0x61, 0x62, 0x63]); // コピー時に利用したり var copy = Pot.ArrayBufferoid.copyBuffer(uint8array); // 文字列に変換したり var binary = Pot.ArrayBufferoid.bufferToBinary(copy); Pot.debug(binary); // 'abc' // 巨大な配列を var view = new Pot.ArrrayBufferoid(1000000).toUint8Array(); for (var i = 0; i < 1000000; i++) { view[i] = 0x61; } // 非同期で負荷をかけずに変換したり Pot.ArrayBufferoid.bufferToBinary.deferred(view).then(function(res) { Pot.debug(res); // 'aaaaaaaaaaa...' }); // UTF-16 文字列から UTF-8 Buffer に変換したり戻したり var s = 'hogeほげ'; var buffer = Pot.ArrayBufferoid.stringToBuffer(s); var string = Pot.ArrayBufferoid.bufferToString(buffer); Pot.debug(buffer); // buffer: // [104, 111, 103, 101, 227, 129, 187, 227, 129, 146] Pot.debug(s === string); // true
といった時に役立てると思います。
そして、個人的に楽になった改善点は
Pot.Deferred のコールバック関数内で FileReader インスタンスを返すと
ファイル読み込みが完了してから次のチェインが実行され、
結果に読み込んだファイルが渡るようになりました。
Pot.Deferred.begin(function() { // readAsTextの例 var reader = new FileReader(); var bb = new Pot.System.BlobBuilder(); bb.append('hoge'); reader.readAsText(bb.getBlob()); // readerを返すと結果が次のチェインで取得できる return reader; }).then(function(res) { // 結果は FileReader の onload の event.target.result Pot.debug(res); // 'hoge' }).rescue(function(err) { // エラー時 (FileReader の onerror) alert(err); });
onload, onloadend 等を設定していても同じに動作します。
Deferred と相性いいイベントの関係だと楽でいいですね!