Born Neet

既に、

忍者ブログでVicunaのNinja（shino.Vicuna） - 変更履歴
shino.Vicunaが本家に紹介されました！のコメント欄

に書いていますが、
わりと大きなミスだったので、このブログでもアナウンスしておきます。

公開から約4ヶ月（！）もの間、[あなた用のCSSを作成]が全く機能していませんでした。

これは、css内の

http://file.bornneet.blog.shinobi.jp/

を全て

http://file.あなたのID.blog.shinobi.jp/

に置換することで、
画像をそれぞれのユーザの領域から読み込むようにするものだったのですが、

正規表現にgフラグを付加し忘れるという単純ミスを犯してしまっていたため、
1つ目のURLしか置換されないという事態に陥っていました。

急いで修正しておいたので今は正常に動作していると思います…。
申し訳ありませんでしたm(_ _)m

こんな状態だったにも関わらず使ってくれていた皆さんの懐の大きさに感謝です！

今後はこのようなことがないように…するつもりです。

また何かありましたら遠慮なくご指摘ください。
それでは！

[Thanks]

※ この不具合はゆーいちさんに教えていただきました。
　　ありがとうございます、助かりました。

[追記]

[2008/07/06 23:25]

誤字を訂正。
http://file.bornneet.blog.shinobi.js/になってました（笑）
JavaScriptのしすぎ…？ならむしろ喜ばしいなぁ！

っというわけで、TwitterからWassrに乗り換えてみました。

まぁTwitter自体全然使ってないですけどねー。
（そもそもSNSっていうかコミュニケーションが苦手っていう…）

で、せっかくAPIも公開されてることなので、今までTwitterの発言を表示してた部分にWassrの発言を表示するようにしました。

興味のある人はどうぞー。

[html, css]

今回は（面倒なので）html、cssに変更を加えないのがテーマ（？）だったため、

<div id="twitter_div"><dl><dt><a href="http://wassr.jp/user/tnantoka/" id="twitter-link"><img src="http://file.blog.bornneet.com/wassr_bubble_logo.png" alt="Wassr: Do you follow me?" /></a></dt><dd><ul id="twitter_update_list"></ul></dd></dl></div>

と、ほぼ前のままでOKです。
（画像とリンクをWassrにしただけ。cssは変更なし）

[js]

WassrはJSONPに対応してるので、

<script type="text/javascript" stc="http://api.wassr.jp/statuses/show.json?id=tnantoka&amp;callback=wassrCallback"></script>

とかやれば、

wassrCallback([{
	"link":"http://wassr.jp/user/tnantoka/statuses/e6wr6C1Ebz",
	"epoch":1215324666,
	"user_login_id":"tnantoka",
	"areacode":null,
	"rid":"e6wr6C1Ebz",
	"photo_url":null,
	"reply_message":null,
	"photo_thumbnail_url":null,
	"reply_user_nick":null,
	"html":"テスト",
	"reply_status_url":null,
	"text":"テスト",
	"user":{"screen_name":"t*"},
	"slurl":null,
	"areaname":null
}]);

ってな感じに、発言のオブジェクトをコールバック関数に渡して呼び出してくれます。

あとはTwitterのjs等を参考に、

function wassrCallback(wassrs) {
	document.getElementById('twitter_update_list').innerHTML = '<li><span>'+wassrs[0].text+'</span> <a style="font-size:85%" href="'+wassrs[0].link+'">'+parseEpoch(wassrs[0].epoch)+'</a></li>' + '<li style="text-align: right; margin-top: 5px; font-size: 85%;"><a href="http://twitter.com/tnantoka">Twitter\u306F\u3053\u3061\u3089</a></li>';
}

function parseEpoch(epoch) {
	var pass = new Date / 1000 - epoch;
	var s;
	if (pass < 60) {
		s = 'less than a minute ago';
	} else if (pass < (60 * 2)) {
		s = 'about a minute ago';
	} else if (pass < (60 * 60)) {
		s = 'about ' + parseInt(pass / 60) + ' minutes ago';
	} else if (pass < (120 * 60)) {
		s = 'about an hour ago';
	} else if (pass < (24 * 60 * 60)) {
		s = 'about ' + parseInt(pass / (60 * 60)) + ' hours ago';
	} else if (pass < (48 * 60 * 60)) {
		s = '1 day ago';
	} else {
		s = parseInt(pass / (24 * 60 * 60)) + ' days ago';
	}
	return s;
}

みたいな関数を用意しておけばいいだけです。
（画像、js、htmlをTwitterのバッジからそのまま流用しちゃってるので、一応Twitterへのリンクを入れておきました^^）

[まとめ]

以上でーす。
テストとか全然してないので不具合とかあったらごめんなさい(>_<)