ラベル サンプル の投稿を表示しています。 すべての投稿を表示
ラベル サンプル の投稿を表示しています。 すべての投稿を表示

2013年11月11日

よくある Back to Top ボタンの作成例


ブログとかでページ右下あたりによくある 「Back to Top」 ボタンを作ってみました。

DEMO


ページを開いてスクロールすると、右下に「Back to Top」ボタンが現れます。 ボタンをクリックしてページ上部までスクロールします。 今回は jQuery を使ってみたら、ごくありがちなボタンになってしまいました。 もしかしたら多少クリックしずらいかもしれません。

サンプルコード

※以下はDEMOを簡略化するため多少コード変更しています

HTML:
<div class="back-to-top">Back to Top</div>
JavaScript:
$(function() {
  var backToTop = $('.back-to-top');

  // クリックでページ上部までスクロール
  backToTop.hide().on('click', function() {
    $('html,body').animate({
      scrollTop: 0
    }, 800);
    return false;
  });

  // スクロール位置がページ上部じゃなかったら表示
  $(window).on('scroll', function() {
    if ($(this).scrollTop() < 10) {
      backToTop.hide();
    } else {
      backToTop.show();
    }
  });

});
CSS:
.back-to-top {
  display: none;
  position: fixed;
  bottom: 10px;
  right: 10px;
  width: 100px;
  height: 40px;
  background: rgba(255, 64, 64, 0.7);
  color: rgba(255, 255, 255, 0.9);
  line-height: 3;
  text-align: center;
  font-size: 13px;
  font-weight: bold;
  font-family: verdana, sans-serif;
  cursor: pointer;
  z-index: 9999;
}

.back-to-top:hover {
  background: rgba(255, 16, 16, 0.8);
  color: rgba(255, 255, 64, 0.8);
}
お好みで変更してください。

まとめ

真面目なページに突然こんなんがあったら嬉しくなりそう

/show/ じゃないほうの jsFiddle:

Contact


2012年9月4日

ランレングス法をJavaScriptの正規表現で書いてみた

ランレングス法は、BMP などに使われるデータ圧縮アルゴリズムです

連続したデータが多ければ圧縮率は上がりますが、
そうでない場合、逆にデータ量が増えることもあります
// ランレングス圧縮/解凍
var RunLength = {
  compress : function(s) {
    return s.replace(/([\s\S])\1{0,8}/g, function(a, c) {
      return c + a.length;
    });
  },
  decompress : function(s) {
    return s.replace(/([\s\S])(\d)/g, function(a, c, n) {
      return new Array(++n).join(c);
    });
  }
};



2012年4月24日

JavaScriptで文字コード変換ライブラリ作ってみた

文字コード変換ライブラリを JavaScript で作りました。
文字列ではなく配列 or TypedArray で処理します。

追記

↓動作サンプルを作りました
文字コード変換 動作サンプル

Unicode の変換が可能になりました。
文字コード配列から URLエンコード/デコード が可能になりました。
あと説明とサンプルも少し載せました。。(説明不足でごめんなさい)

こないだの 「JavaScriptだけでzipファイルの解凍 - Unzipper.js」が
SJIS ファイルとかだと表示で文字化けするので、ついつい。。

動作確認は、zip ファイル解凍のデモページでわかると思います。
zip の中に SJIS や EUC-JP のファイル (ファイル名) がある場合でも
UTF-8 表示で化けなければ問題なしです。


↑のデモページを開いて、デスクトップなどから zip ファイルをドロップすると
解凍して結果のテキストを表示します。

※ JavaScript だけで動いていて、どっかのサーバなどに送信したり保存したりしてません


今回はぜんぶ同期で書いちゃったのですが、
バイナリファイルとかが対象だとちょっと重たくなりがち。。
気が向いたら非同期も可能にしてみたいです。

あと、Unzipper.js と同じレポジトリにしちゃったけど
これもできれば別にしたいところ。
追記→ 作りました

使い方:
// <script src="encoding.js"></script>
//
// Encoding というオブジェクトがグローバルに定義されます
// 配列に対して変換または判別します

// 文字コード変換
var utf8Array = new Uint8Array(...) or [...] or Array(...);
var sjisArray = Encoding.convert(utf8Array, 'SJIS', 'UTF8');

// 文字コード自動判別で変換
var sjisArray = Encoding.convert(utf8Array, 'SJIS');
// or  
var sjisArray = Encoding.convert(utf8Array, 'SJIS', 'AUTO');


// 文字コード判別 (戻り値は下の「共通の文字コード値」のいずれか)
var encoding = Encoding.detect(utf8Array);
if (encoding === 'UTF8') {
    alert('UTF8です');
}

// 特定の文字コードかどうか判別
var isSJIS = Encoding.detect(sjisArray, 'SJIS');
if (isSJIS) {
    alert('SJISです');
}

// convert, detect 共通の文字コード値:
//  - 'UTF32'   (detect only)
//  - 'UTF16'   (detect only)
//  - 'BINARY'  (detect only)
//  - 'ASCII'   (detect only)
//  - 'JIS'
//  - 'UTF8'
//  - 'EUCJP'
//  - 'SJIS'
//  - 'UNICODE' (JavaScript Unicode String/Array)
//
// ※ (detect only) は Encoding.detect() でのみ有効 (変換はできない)
// ※ 'UNICODE' は JavaScript の Unicode コード値 (0xFF 以上の数値になりえる)
//

サンプル:
// EUCJPの文字コード配列 (中身は 'こんにちは、ほげ☆ぴよ')
var eucjpArray = [
    164, 179, 164, 243, 164, 203, 164, 193, 164, 207, 161,
    162, 164, 219, 164, 178, 161, 249, 164, 212, 164, 232
];
// UTF-8に変換
var utf8Array = Encoding.convert(eucjpArray, 'UTF8', 'EUCJP');
console.log( utf8Array );
// output: [
//   227, 129, 147, 227, 130, 147, 227, 129, 171,
//   227, 129, 161, 227, 129, 175, 227, 128, 129,
//   227, 129, 187, 227, 129, 146, 226, 152, 134,
//   227, 129, 180, 227, 130, 136
// ]
//   => 'こんにちは、ほげ☆ぴよ'

// ---------------------------------------------
// 文字コード自動判別で変換
//

// SJISの文字コード配列 (中身は 'こんにちは、ほげ☆ぴよ')
var sjisArray = [
    130, 177, 130, 241, 130, 201, 130, 191, 130, 205, 129,
     65, 130, 217, 130, 176, 129, 153, 130, 210, 130, 230
];
// Unicodeに変換
var unicodeArray = Encoding.convert(sjisArray, 'UNICODE', 'AUTO');
// 文字列にして表示
// codeToStringは、文字コード配列を文字列に変換(連結)して返す関数
console.log( Encoding.codeToString(unicodeArray) );
//
// output: 'こんにちは、ほげ☆ぴよ'
//

// ---------------------------------------------
// 文字コードの配列をURLエンコード/デコード
var sjisArray = [
  130, 177, 130, 241, 130, 201, 130, 191, 130, 205, 129,
   65, 130, 217, 130, 176, 129, 153, 130, 210, 130, 230
];
var encoded = Encoding.urlEncode(sjisArray);
console.log(encoded);
// output:
//   '%82%B1%82%F1%82%C9%82%BF%82%CD%81A%82%D9%82%B0%81%99%82%D2%82%E6'

var decoded = Encoding.urlDecode(encoded);
console.log(decoded);
// output: [
//   130, 177, 130, 241, 130, 201, 130, 191, 130, 205, 129,
//    65, 130, 217, 130, 176, 129, 153, 130, 210, 130, 230
// ]

ダウンロード



レポジトリ



その他、なにか問題等あれば
コメントやメールまたは @polygon_planet まで送っていただけるとうれしいです。



2012年4月22日

JavaScriptライブラリ Pot.js 関連リンクまとめ

Pot.js 関連のリンクまとめ

JavaScript ライブラリ Pot.js に関する記事やサンプルの紹介です。
Pot.js は CPU に負荷をかけることなく JavaScript の実行を可能とするユーティリティライブラリです。
MOONGIFT さんの記事 で紹介されたのもあって、せっかくなのでまとめてみました。



Pot.js / PotLite.js

Pot.js は CPU に負荷をかけることなく JavaScript の実行を可能とするユーティリティライブラリです。
PotLite.js は Pot.js の非同期な部分だけを抽出したライトバージョンです。

ダウンロード

マニュアル

その他の情報についてはマニュアル/マニュアルからのリンク から参照ください。

レポジトリ




その他、なにか問題・バグ・感想・指摘などあれば、
コメントやメールまたは @polygon_planet まで送っていただけるとうれしいです。



2012年4月17日

JavaScriptだけでzipファイルの解凍 - Unzipper.js

とつぜん書いてみました。


デモページを開いて、デスクトップなどから zip ファイルをドロップすると
再帰的に解凍して結果のテキストを表示します。

非同期 + Pot.js イテレータ を使って実装したくて作ってみました。
zlib inflate を非同期化しています。
数GB の zip も、CPU 負荷を抑えつつ「応答のないスクリプト」警告なしに解凍できましたが
ブラウザによって、ファイルドロップの時点である程度サイズがあると無効になるようです。

レポジトリ



その他、なにか問題等あれば
コメントやメールまたは @polygon_planet まで送っていただけるとうれしいです。



2012年4月5日

並列処理のWorkerぽいWorkeroid実装。JavaScriptライブラリPot.js 1.17 リリース




Pot.js 1.17 と PotLite.js 1.34 リリースしました。





Web Workers

バックグラウンド処理、並列処理ができる HTML5 API の Web Workers は、
主要なブラウザですでに実装されています。

var worker = new Worker('child.js');
worker.onmessage = function(event) {
    alert(event.data); // 'hogefuga' がアラートされる
};
worker.postMessage('hoge');
child.js
onmessage = function(event) {
    postMessage(event.data + 'fuga');
};
上のような感じで使うのですが、基本的に 'child.js' のようにファイル名を渡さないといけないんです。
なので JavaScript が 2 ファイルになります。

並列で 4 スレッドとか 6 スレッドとかしてたら どんどん増えてファイルの管理がめんどいです。

あと、ブラウザによって動作 (子Worker のスコープ) が若干異なっていて
せっかく並列処理がネイティブにできるのに、なかなか扱いにくいものになってしまってます。

そこで、ネイティブ Worker が利用できたら ネイティブで
なければ Worker エミュレータとして、
クロスブラウザに動作する Workeroid (Pot.Workeroid) を実装しました。

Pot.Workeroid

  • 基本的にネイティブ Worker と同じに並列処理ができる
  • ネイティブ Worker がなければエミュレートする
  • クロスブラウザ
  • 子 Worker スレッドで importScripts しなくても Pot.js が使える
  • エミュレート時でも terminate で中断/終了できる
  • ファイル名だけじゃなく関数オブジェクトを子 Workerとして渡せる

ネイティブの Worker は
子Worker プロセス内では 親 window のライブラリなどが使えません。
importScripts('hoge.js') で読み込まないと使えないのですが、
Pot.Workeroid はデフォルトで Pot.js が利用できます。
なので、Pot.Deferred.forEach などを利用して CPU 負荷を抑えた処理が可能です。

最大の特徴として、
コンストラクタに ファイル名のほか、関数を渡すことが可能なことです。

以下は function で Worker スレッドを生成する例です。

var worker = new Pot.Workeroid(function(data) {
    //                                          
    // このスコープの中が 子Worker スレッド     
    //                                          
    var add = 1;                                
    postMessage(data + add);                    
});

// メッセージを受信した時
worker.onmessage = function(data) {
    alert(data);
};

// エラー時の設定 (任意)
worker.onerror = function(err) {
    alert(err);
};

// 1 を 子 Worker に送信 => 2 が alert される
worker.postMessage(1);

をつけたスコープ内が 子 Worker として別スレッドになります。
子 Worker 空間内は、別ファイルに書いてる気持ちでコーディングするとわかりやすいかもです。
たくさんのスレッド作る場合でも、少しの短いコードでも 別ファイルにしなくて済みます。

これで楽に並列処理ができるとうれしい!


Pot.Workeroid の例を含む詳細は Pot.Workeroid リファレンス から参照できます。

あと、簡単な動作テストを jsFiddle に置いてあります。

更新したところ


Pot.js / PotLite.js

Pot.js は CPU に負荷をかけることなく JavaScript の実行を可能とするユーティリティライブラリです。

PotLite.js は Pot.js の非同期な部分だけを抽出したライトバージョンです。

ダウンロード

マニュアル

その他の情報についてはマニュアル/マニュアルからのリンク から参照ください。

レポジトリ




その他、なにか問題・バグ・感想・指摘などあれば、
コメントやメールまたは @polygon_planet まで送っていただけるとうれしいです。



2012年3月12日

jsFiddleだらけ-JavaScriptライブラリPot.js+PotLite.jsリリースノート



Pot.js 1.15 1.16PotLite.js 1.32 1.33 リリースしました。

2012-03-13 追記:
Pot.js 1.15 と PotLite.js 1.33 はバギーなためアップデートしました。詳細
2012-03-13 時点の最新は Pot.js 1.16PotLite.js 1.34 です。最新にアップデートお願いします。。


このバージョンでは、
  • 文字列処理の高速化
  • 重くなりそうな処理を非同期化
などを適応しました。

文字列処理の高速化

先日、ふと思って String.fromCharCode を呼ばずに
U+0000 - U+FFFF の配列をあらかじめ作成して インデックスに対応させたらどうなのかなって
ベンチマークとってみました。


結果として、String.fromCharCode(c) のような
apply で配列を使わない場合、かなり高速化できました。
メモリ消費も文字列などは気にするほどじゃなかった。
String.fromCharCode.apply(null, [...]); のような場合は逆に遅くなるので
従来通り String.fromCharCode を使用しています。

(この件はあほなミスをしてて@gochoさんにつっこまれて助かりました)

重くなりそうな処理を非同期化

重くなりそうな処理とは、巨大な文字列が渡される可能性のある関数や、
ループ回数が未知の処理などです。

途中で「応答のないスクリプト」警告なんぞ でてしまったらめんどうです。
そういった対処や負荷軽減も含めて 関数オブジェクトに deferred というメソッドを持たせました。

例えば Pot.md5(string); が同期実行に対して
Pot.md5.deferred(string); は、非同期で実行します。


圧縮・解凍

文字列を LZ77 アルゴリズムをベースに圧縮・解凍する
Pot.Archive.AlphamericString も同様に非同期化しています。

その他のサンプル

他にもいくつかテスト用にサンプルがあったので紹介します。



Pot.js / PotLite.js

Pot.js は CPU に負荷をかけることなく JavaScript の実行を可能とするユーティリティライブラリです。

PotLite.js は Pot.js の非同期な部分だけを抽出したライトバージョンです。

ダウンロード

マニュアル

その他の情報についてはマニュアル/マニュアルからのリンク から参照ください。

レポジトリ




その他、なにか問題・バグ・感想・指摘などあれば、
コメントやメールまたは @polygon_planet まで送っていただけるとうれしいです。


2012年2月11日

JavaScript whileループとPot.Deferred.forEverイテレータでCPU使用率を比較-Pot.js+PotLite.jsリリースノート

Pot.js 1.13PotLite.js 1.30 リリースしました。

Pot.js 1.13 と PotLite.js 1.30 では、主に内部ループ処理を大幅に高速化しました。
(そろそろ ChangeLog 作らないとまずいかも…)

あとは、変数宣言とか 例の (function(){}()) とか (結局直してる)
細かい修正などです。

先日、Hacker NewsEcho JS で Pot.js が紹介されました (ありがとうございます)。
でもアクセスが今までの 1000 倍くらいになって、すごいことになってちょっとビビった。
(API サーバのほうは適当に調節しておいたので大丈夫だった。よかった。。)


それで Pot.js の本来の存在意義ですが、

実行環境の CPU に負荷をかけることなく JavaScript が実行できる。

といったことが本来の目的であり、常に追求している目標でもあります。
Deferred が重点にとらわれがちですが、Pot.Deferred はそれの足がかりであり、
Pot.Deferred だけがライブラリの中核ではないので、いろいろ使ってみてください。

新しいデザインのリファレンス

現在、新しいデザインでリファレンスを書き直しています。


前は 全部で 1 ファイルになっちゃってて、どんどん重くなるし更新もやり難くて
どうしようもなかったのですが、今回は 各ページを非同期読み込みにして
英語版と日本語版で見れるようにして、戻るボタンとかも再現したり、がんばってます。

でもまだ作成途中です (2012-02-11 現在)。

ある程度完成したら 本来の /index.html に移動させようと思ってるんですが、
先ほどの Echo JS などが /test-for-new-design/ にリンクしちゃってるもんだから
どうしようかと考え中。(たぶん リダイレクトか、もうこのままでいいか…)。

CPU 比較を実行

jsFiddle のほうで
JavaScript の while ループと、Pot.js の非同期イテレータとで CPU 使用率の比較を書いてみました。
前に書いた Pot.js イテレータと jQuery.each と for ループの CPU 使用率をグラフで比較
と同じ事ですが、実際に実行できます (ただし負荷テストなのでブラウザクラッシュに気をつけてください)。
もっとも最近のブラウザはループでクラッシュしないと思いますが。。

CPU 使用率は、Web ブラウザからの JavaScript では取得できないと思うので、
CPU モニタリングするアプリとか、
なければ Win ならタスクマネージャから「パフォーマンス」→ 「CPU 使用率」
を見ながら実行してみるとわかりやすいと思います。


今回は while 文と Pot.Deferred.forEver の比較ですが、
Pot.js 非同期イテレータは CPU 負荷が一定量に抑えられたループが可能になっていると思います。
ただし、この例のような処理だと実行時間はある程度伸びてしまいます。

実行時間に関しては 速度調整 が可能なので、処理に応じたスピードを選ぶこともできます。
(このへんは今後改善したいです)。

サンプルのソースコード

jsFiddle でも確認できますが、今回使用したサンプルのソースコードです。
ループ処理の部分だけ抽出しています。

JavaScript while ループを使ったソースコード:
// while で同期ループして圧縮
compressSync : function(s) {
    var a = 53300, b, c, d, e, f, g = -1,
        h, i, r = [], x = String.fromCharCode;

    s = new Array(a--).join(' ') + s;
    while ((b = s.substr(a, 256))) {
        for (c = 2, i = b.length; c <= i; ++c) {
            d = s.substring(
                a - 52275,
                a + c - 1
            ).lastIndexOf(b.substring(0, c));
            if (!~d) {
                break;
            }
            e = d;
        }
        if (c === 2 || c === 3 && f === g) {
            f = g;
            h = s.charCodeAt(a++);
            r.push(
                x(h >> 8 & 255),
                x(h & 255)
            );
        } else {
            r.push(
                x((e >> 8 & 255) | 65280),
                x(e & 255),
                x(c - 3)
            );
            a += c - 1;
        }
    }
    return r.join('');
}

Pot.js 非同期イテレータ (今回は Pot.Deferred.forEver) を使ったソースコード:
// Pot.js 非同期イテレータで圧縮
compressAsync : function(s) {
    var a = 53300, b, c, d, e, f, g = -1,
        h, i, r = [], x = String.fromCharCode;

    var deferred = new Pot.Deferred();

    s = new Array(a--).join(' ') + s;

    // whileループを forEver に置き換え
    Pot.Deferred.forEver[SPEED](function() {

        b = s.substr(a, 256);
        if (!b) {
            throw Pot.StopIteration;
        }

        for (c = 2, i = b.length; c <= i; ++c) {
            d = s.substring(
                a - 52275,
                a + c - 1
            ).lastIndexOf(b.substring(0, c));
            if (!~d) {
                break;
            }
            e = d;
        }
        if (c === 2 || c === 3 && f === g) {
            f = g;
            h = s.charCodeAt(a++);
            r.push(
                x(h >> 8 & 255),
                x(h & 255)
            );
        } else {
            r.push(
                x((e >> 8 & 255) | 65280),
                x(e & 255),
                x(c - 3)
            );
            a += c - 1;
        }
    }).then(function() {
        deferred.begin(r.join(''));
    }, function(err) {
        deferred.raise(err);
    });
    return deferred;
}

同期か非同期かの違いがありますが、
単に、メインの while 文を Pot.Deferred.forEver に変えてるだけです。
forEver は、StopIteration が throw されるまで、永久にループする関数です。

あと、この関数は LZ77アルゴリズムによる圧縮関数をJavaScript最短コードで | 圧縮電子精神音楽浮遊構造体 (見れないかも)
で作ったソースコードをちょっとだけ手直ししたものです。
文字列を圧縮解凍します。

Pot.js / PotLite.js

Pot.js は CPU に負荷をかけることなく JavaScript の実行を可能とするユーティリティライブラリです。

PotLite.js は Pot.js の非同期な部分だけを抽出したライトバージョンです。

ダウンロード

マニュアル

マニュアルは上に書いたように 2012-02-11 現在、まだすべてのオブジェクトの解説ができてません。。

その他の情報についてはマニュアル/マニュアルからのリンク から参照ください。

レポジトリ




その他、なにか問題・バグ・感想・指摘などあれば、
コメントやメールまたは @polygon_planet まで送っていただけるとうれしいです。


2012年1月11日

HTML5 File APIでドラッグ&ドロップのサンプル-Pot.js+PotLite.jsリリースノート

Pot.js 1.11PotLite.js 1.28 リリースしました。


主な新機能として、HTML5 の File API を使った
ファイルのドラッグ&ドロップ を扱う Pot.DropFile を実装しました。

Pot.DropFile は FileReader でドロップされたファイルをアップロードしたり
内容やサイズを取得してその場で処理することが可能です。


HTML5 とドラッグ&ドロップイベントをサポートしてるブラウザ (Firefox, GoogleChrome, Safari) で
このブログ内に、デスクトップなどから画像やテキストなどの適当なファイルをドロップしてみてください。

ここにドロップされたファイル内容が表示されます。





ソースコード

このサンプルのソースコードです。
DOM ノードを作成するのにあたって jQuery を使用しています。

HTML のソース:
<div id="dropfile-container"
     style="border-color: #ccc; border-style: dashed; border-width: 1px 0 1px 0; margin: 10px;">
    ここにドロップされたファイル内容が表示されます。
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://api.polygonpla.net/js/pot/1.11/pot.min.js"></script>

JavaScript のソース:
$(function () {

    // ドロップされた結果を表示する div
    var targetId = '#dropfile-container';

    // ドロップ用のパネルを作成
    var panel = $('<div/>').css({
        position        : 'fixed',
        left            : '10%',
        top             : '10%',
        width           : '80%',
        height          : '80%',
        minHeight       : 200,
        background      : '#ff8cd3',
        zIndex          : 9999999,
        display         : 'table',
        textAlign       : 'center',
        WebkitBoxShadow : '1px 1px 10px #333',
        MozBoxShadow    : '1px 1px 10px #333',
        boxShadow       : '1px 1px 10px #333'
    })
    .append(
        $('<div/>')
            .css({
                display       : 'table-cell',
                color         : '#fff',
                fontWeight    : 'bold',
                verticalAlign : 'middle',
                fontSize      : '160%'
            })
            .text('ここにファイルをドロップします')
    )
    .hide()
    .appendTo('body');

    // ファイルの情報を表示する関数
    var showFileInfo = function(name, size, type) {
        $('<div/>')
            .text(name + ' (' + type + ' ' + size + 'bytes)')
            .appendTo(targetId);
    };

    // ----- ここから処理の中心 -----
    // 設定と共にインスタンスを生成
    var dropFile = new Pot.DropFile(panel, {
        // メッセージを表示すべき時
        onShow : function() { panel.show() },
        // メッセージを非表示にすべき時
        onHide : function() { panel.hide() },
        // ドロップ時の処理
        onDrop : function(files) {},
        // 画像がドロップされた時
        onLoadImage : function(data, name, size, type) {
            showFileInfo(name, size, type);
            $('<img/>')
                .attr({src : data})
                .css({maxWidth : 500, maxHeight : 500})
                .appendTo(targetId);
        },
        // テキストがドロップされた時
        onLoadText : function(data, name, size, type) {
            showFileInfo(name, size, type);
            $('<textarea/>')
                .val(data)
                .css({width : '90%', height : 300})
                .appendTo(targetId);
        },
        // 不明なファイルがドロップされた時
        onLoadUnknown : function(data, name, size, type) {
            showFileInfo(name, size, type);
            $('<textarea/>')
                .val(data)
                .css({width : '90%', height : 300})
                .appendTo(targetId);
        },
        // ドロップされたファイルが読み込めた時 (このときアップロードも可能)
        onLoadEnd : function(files) {
            // 今回は未使用
            /*
            this.upload(
                'http://www.example.com/',
                'dropfiles'
            ).then(function(res) {
                alert('finish upload.\nresponse:\n\n' + res.responseText);
            });
            */
        }
    });
});

Pot.js / PotLite.js

Pot.js は非同期イテレータと文字列処理を中心とした JavaScript ライブラリです。

Web ブラウザ上や Node.js 上、 UserScript や XUL 上で動作します。
この例のような DOM や HTML5 File API が含む処理は Node.js などの環境では意味がありませんが
テキスト処理やイテレータなどを利用するメリットがあります。
とくに非同期処理を扱う Deferred オブジェクトにより作業効率が向上すると思います。

PotLite.js は Pot.js の非同期な部分だけを抽出したライトバージョンです。

ダウンロード

マニュアル

マニュアルは 2012-01-11 現在、まだすべてのオブジェクトの解説ができてません。。

その他の情報についてはマニュアルから参照ください。


レポジトリ