dara-j

アサブロのランキングを取得してみたり

Mashupediaで、JSONPで指定URLのソースを取得できるWebサービス「Webページ取得JSONP」が紹介されていたので、なんとなくアサブロのランキングを取得するライブラリを作ってみた。例によって、要prototype.jsで、ライセンスはNYSL。

ソース

こんな感じ。

var AsabloRanking = {
	callback : function(source) {
		var result = {};
		var dateMatch = /<div class="left">([\d\/]+)/g.exec( source );
		if( dateMatch ) result.date = dateMatch[1];
		
		var reg = /<div class="no(\d+)">.*?(<div class="ranking-([^"]+)"><\/div>\s*)?<a class="blogtitle" href="([^"]+)">([^<]+)<\/a>/;
		result.ranking = source.match( new RegExp( reg.source, "g" ) ).map( function(data) {
			var match = reg.exec( data );
			return match ? 
			{
				rank : Number( match[1] ),
				title : match[5],
				url : match[4],
				updown : match[3] || "top3"
			} : null;
		} );
		
		this.result = result;
		this.requesting = false;
	},
	request : function(callback) {
		this.requesting = true;
		this.result = null;
		
		var node = document.createElement("script");
		node.src =[
			"http://www.yoshimeux.com/wiss/HttpResponse.ashx",
			"?url=",
			encodeURIComponent("http://dir.asablo.jp/blog/ranking/"),
			"&callback=AsabloRanking.callback&charset=utf-8"
		].join("");
		
		var _self = this;
		
		document.getElementsByTagName("head")[0].appendChild( node );
		
		setTimeout( function() {
			if( _self.requesting ) {
				setTimeout( arguments.callee, 10 );
				return;
			}
			
			callback( _self.result );
		}, 0 );
	}
}

ダウンロードはこちら。

使い方

結構シンプルで、AsabloRanking.requestメソッドにコールバックを指定するだけ。コールバックには

{
	date : "2007/10/07",
	ranking : [
		{
			rank : 1,
			title : "いちばんのブログ",
			url : "http://～",
			updown : "top3"
		},
		:
		:
	]
}

ルートにある「date」は現在確認可能なランキング対象日付の文字列。 rankingはArrayで、各要素は、

• rank - 順位（1～100）
• title - ブログタイトル
• url - ブログURL
• updown - 順位の変動状況（前日比）

updownは以下のように定義。

• top3 - トップ3
• nochange - 変動なし
• up1、up2 - 上昇。up1が変動量が大きい
• down1、down2 - 下落。down1が変動量が大きい

サンプル

button#get_ranking_071008とdiv#ranking_071008を設置したとして、こんな感じで使ってみる。

$("get_ranking_071008").onclick = function() {
	// updownプロパティの値の変換テーブル
	var updowns = {
		top3 : "☆",
		up1 : "<b>↑</b>",
		up2 : "↑",
		down1 : "<b>↓</b>",
		down2 : "↓",
		nochange : "→"
	};
	
	var target = $("ranking_071008");
	target.innerHTML = "ランキング取得中...";
	
	AsabloRanking.request( function(result) {
		target.innerHTML = "<h3>" + result.date + "</h3>";
		
		result.ranking.each( function(rank) {
			var item = document.createElement("div");
			item.innerHTML = [
				"<div>",
				"<b>" + rank.rank + "</b>",
				" " + updowns[ rank.updown ] + " ",
				"<a href=\"" + rank.url + "\">" + rank.title + "</a>",
				"</div>"
			].join("");
			target.appendChild( item );
		} );
	} );
}

で、こんな感じになる。

なんてものを作ってはみたが

ほとんど需要なかろうて...