Hatena::Groupsubtech

NaN days

ブログを移転しています。最新の記事は motemen.hatenablog.com へどうぞ

2013-02-15

jQuery のメソッドチェーン呼び出しのコードを簡単に生成できる Perl モジュールを書きました

| 13:25 | jQuery のメソッドチェーン呼び出しのコードを簡単に生成できる Perl モジュールを書きました - NaN days を含むブックマーク はてなブックマーク - jQuery のメソッドチェーン呼び出しのコードを簡単に生成できる Perl モジュールを書きました - NaN days

PhantomJS 1.8 のリリースで まっとうな方法で Perl から PhantomJS の操作ができるようになった おかげで 去年の YAPC::Asia 2012 で発表した Wight はめでたくオワコン化しました……。だけれど Wight のオマケで作っていたモジュールは便利なので、別に分けてみました。

GitHub - motemen/String-jQuery: Easy generating of jQuery expressions by Perl codes in similar form

SYNOPSIS にある通りですが、このモジュールがエクスポートする jQuery() という関数を起点にして、JavaScriptjQuery を使うようにしてメソッドチェーンを繋ぎ、最後に文字列化すると JavaScript における jQueryAPI 呼び出しとして使える式が得られます。Perl のコード中に文字列で JS を埋め込むよりは読みやすいはず……です。

以下の例を見るのが分かりやすいと思います。.'length' あたりがポイントですね( ╹◡╹)

jQuery();                           # => 'jQuery()'
jQuery('a');                        # => 'jQuery("a")'
jQuery(\'document');                # => 'jQuery(document)'
jQuery('a')->text();                # => 'jQuery("a").text()'
jQuery('a')->text('xxx');           # => 'jQuery("a").text("xxx")'
jQuery('a')->click(sub { e => 'return false' });
                                    # => 'jQuery("a").click(function (e) { return false })'
jQuery('a').'length';               # => 'jQuery("a").length'
jQuery->ajax({ method => 'POST' }); # => 'jQuery.ajax({"method:"POST"})'

Selenium::Remote::Driver を使うにしても、ページ内要素の調査を行うのに jQuery は便利だと思います(このモジュールが jQuery の埋め込みを行うわけではありません)。

my $result = $driver->execute_javascript(
    'return ' . jQuery('#content a')->attr('href')
);

似たようなモジュールには HTML::JQuery というのがありますが、こちらは script 要素全体を出力するもののようです。

2013-02-08

Kyoto.js #5 で日本の連休についての発表をしました #kyotojs

| 13:31 | Kyoto.js #5 で日本の連休についての発表をしました #kyotojs - NaN days を含むブックマーク はてなブックマーク - Kyoto.js #5 で日本の連休についての発表をしました #kyotojs - NaN days

先日開催された Kyoto.js #5 で LT をしてきました。

次の連休

今後1年間の3連休が確認できる 次の連休 というサイトとその実装について紹介しました。クライアントサイド JavaScript のみで動いていて、祝日データの取得には Google Calendar API を使っています。

jquery.partyhard

また、このサイトで使用している自作の jQuery プラグイン jquery.partyhard についての紹介もしました。

使い方は簡単で、以下のようにして呼び出すだけで document.body が PARTY HARD 状態になります。

$(document.body).partyhard();

使用例は http://motemen.github.com/jquery-partyhard/demo.html をご覧ください(ロードに少し時間がかかります、あといまちょっと怖い画像が出てくるかもしれないので http://motemen.github.com/jquery-partyhard/demo.html?cat%20gif で猫を見てもよいです)。

Kyoto.js の感想

隔週で開催されていて、こういったしょうもないことも気軽に紹介できる雰囲気がいいですね。京都近辺にいらっしゃる方は是非顔を出してみては?

発表の中では mechairoi さんの Emacs Lisp から Chrome を操作する拡張 が便利そうかつ面白かったです。