ひよっこ。

I want to…

SNBinderを試すなど

Posted by hikaruworld : 2011 2月 4

ちょっと仕事でJSのテンプレートエンジンが欲しくなって、探していたら、
Life is beautifulの方がSNBinderを出していたので、
ちょっと触ってみてた。

詳細は本人が言及されているリンクが詳しい。

んで、いくつかハマったことを。

SNBinder.bind_rowsetで色々書きだしていたんだけど、
配列の書き出し方がわからず困った。

indexは$(index)でいけるみたいなんだけど(README参照)、

$(index) will be replaced by the index (in case or bind_rowset)

サーバからは配列で送ってしまったので、そもそもkeyがない。
# いや、それJSONの仕様的におかしいだろと言われるのは重々承知です、はい。

実際どうやってるんだろうなぁとソースを見てたら、192行目辺り(ver0.53)にevalしているコードを発見。

        compile: function(htm) {
            var _templatize = function(htm) {
                return '"' + htm.replace(/\"/g, "'")
                                .replace(/[\r\n]/g, " ")
                                .replace(/\$\(index\)/g, '"+index+"')
                                .replace(/\$\(\.([a-z0-9_\.]*)\)/gi, '"+SNBinder.escape(""+row.$1)+"')
                                .replace(/\$\(\_([a-z0-9_\.]*)\)/gi, '"+row.$1+"')
                                +'"';
            }; // "
            var _func;
            eval("_func = function(row, index) { return (" + _templatize(htm) + "); };");
            return _func;
        },

なるほど、テンプレートの変数をここで置換しているらしいですね。
内部ではrowで行数を持ちまわってぽいのでちょっと修正してみた。

        compile: function(htm) {
            var _templatize = function(htm) {
                return '"' + htm.replace(/\"/g, "'")
                                .replace(/[\r\n]/g, " ")
                                .replace(/\$\(row\.\)/g, '"+SNBinder.escape(""+row)+"')
                                .replace(/\$\(row\)/g, '"+row+"')
                                .replace(/\$\(index\)/g, '"+index+"')
                                .replace(/\$\(\.([a-z0-9_\.]*)\)/gi, '"+SNBinder.escape(""+row.$1)+"')
                                .replace(/\$\(\_([a-z0-9_\.]*)\)/gi, '"+row.$1+"')
                                +'"';
            }; // "
            var _func;
            eval("_func = function(row, index) { return (" + _templatize(htm) + "); };");
            return _func;
        },

うまくいったっぽい。あんまり細かくは試してないけども。
escapeは制御したかったので、.は後ろ付で。

あと、SNBinder.ajaxしたら、Acceptが*/*で送られてて、サーバ側ではじいた自分のコードが
あって、一瞬焦ったりしました。

テンプレートの入れ子とかもしようと試してたんだけど、上手くいかなかった。
やり方まずかったのかもしれないけど、時間切れデス。

キャッシュとログイン周りも確認しておきたいところ。

全体的にシンプルで使いやすいので仕事で使ってみようかなと思ってたりします。

# SNBinderのSNってイニシャルなんだろうか…ちょっと気になる。

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

 
%d人のブロガーが「いいね」をつけました。