最近TopHatenarというブログランキングシステムを知りまして、良く見かけるあのグラフは個人開発者が作ったサービスだったのかと驚きました。TopHatenarを知ってからは、新しいブログを見つける度にランキングを調べるのが癖になっているわけですが、毎回TopHatenarのページに行って調べていたのでは効率が悪いので、Firefoxのプラグイン(拡張機能)を作ってみました。
TopHatenar1
TopHatenar2
Googleページランクを表示するLivePageRankと同じ要領で、ステータスバーに今開いているページのTopHatenarスコアを表示します。上側のバーが購読者数、下がブックマーク数を示しています。マウスオーバーで詳細な数値を表示、クリックでTopHatenarのページへジャンプします。各バーのメモリは10段階で、対象となる数値の常用対数値を2倍した値を使用しています。例えばブックマーク数が100件だと、2 * log(100) = 4になります。名前はLivePageRankを真似てLiveTopHatenarにしました。
インストールはAddons For Firefoxから。ソースコードはgithubから。
やっている事は本当に単純で、focusイベントが発行される度に、現在のページに対する情報を取得して、バーの画像を差し替えているだけです。大枠は以下です。
// main class var TopHatenar = { setScore: function() { // TopHatenar.comから現在のページに対するスコアを取得してアイコンを設定 } }; window.addEventListener("focus", function() { TopHatenar.setScore(); }, true);
どうかなと思っているのは、TopHatenarのスクレイピング処理部分です。良い方法が見つからなかったので、行ごとに分割して特定の文字列をフラグにして正規表現でデータを抜いていますが、少しでもTopHatenar.comのHTMLが変更されると動かなくなるので、XPath等の代替手段が見つかり次第差し替えたいです。
_parseText: function(text) { var result = {}; var lines = text.split(/\n/); var bookmarkFlag = false; for (var i = 0; i < lines.length; i++) { var line = lines[i]; line = line.replace(/(^\s*)|(\s*$)/g, ""); // trim if (line.substring(0, 4) == "購読者:") { result["subscribers"] = line.match(/購読者:\s*(\d+)\s*/)[1]; } else if (line == "ブックマーク:") { result["bookmarks"] = lines[i + 1].match(/<a [^>]+>\s*(\d+)\s*<img /)[1]; bookmarkFlag = true; } else if (line.substring(0, 3) == "全体で") { var rank = lines[i + 1].match(/<b [^/>]+>(\d+)(\d+) } } }
ちょっと作りが汚いですが、TopHatenarのユーザの方は良かったら使って下さいませ。
インストールはAddons For Firefoxから！ソースコードはgithubから(２回目)。
関連する記事
タグ: firefox, tophatenar
