俺用 delicious ページ修正した。

結構前に作ったやつなのだが、使えなくなってたので作り直した。

http://loumo.jp/prog/bookmark.html

delicious の各ユーザのページってタグが縦長に伸びて非常に見にくかったり、ページ遷移するのが嫌だったのでそれに対応した。Firefox のアドオン入れればいいといえばそうなんだけど、自分のPC以外から見たりする場合もあるのであると便利かなーとか。

作りは単純。delicious の API を叩いて json を取得しているだけです。jQuery 使えばらくちん。以下 jabascript部分のソース

var deliciousTagPopUp = function() {
	$("#tagList ul li a").click(function() {
		var a = $(this);
		var tag = a.text();
		var offset = a.offset();
		$.getJSON(
			'http://feeds.delicious.com/feeds/json/jklryo/' + tag + '?callback=?',
			function(data, status) {
				if ($('#tagEntry').size() == 0) {
					$('body').append($('<div/>').attr('id', 'tagEntry'));
				}
				$('#tagEntry').empty('#tagEntry')
					.css({'top':offset.top + a.height() + 2,'left':offset.left/2,'display':'block'})
					.append($('<p/>').append($('<a/>').attr('href','http://delicious.com/jklryo/'+tag).append("jklryo's " + tag + ' Bookmarks')))
					.append($('<ul/>'))
					.click(function(){});
				$.each(data, function(i, item) {
					$('<li/>').append($('<a/>').attr('href', item.u).append(item.d)).appendTo('#tagEntry ul');
				});
			}
		);
		return false;
	});
	$('body').click(function(){$('#tagEntry').remove()});
};
$(document).ready(function(){
	$.getJSON('http://feeds.delicious.com/v2/json/jklryo?callback=?',
		function(json){
			var html = '<ul>';
			for (i=0; i<json.length; i++) {
				html += '<li><a href="'+json[i].u+'">'+json[i].d+'</a></li>';
			}
			html += '</ul>';
			$('#newEntry').html(html);
		}
	);
	$.getJSON('http://feeds.delicious.com/v2/json/tags/jklryo?callback=?',
		function(json){
			var html = '<ul>';
			for (i in json) {
				html += '<li><a href="http://delicious.com/jklryo/'+i+'">'+i+'</a></li>';
			}
			html += '</ul>';
			$('#tagList').html(html);
			deliciousTagPopUp();
		}
	);
});