jQuery(2) - Twitter APIをいじる

このBlogのTwitter部分もブログパーツから下記サイトを参考に変更してみた。
http://tutorialzine.com/2009/10/jquery-twitter-ticker/
認証なしなので自分のtweetしか表示されない。
他人のTweetも表示できるようにするためにServersMan VPSをプロキシにしようかなと考えている。
少しだけjQueryも使ってみた。というかサンプルが使っているからだけなんだけど。

<script language="javascript" type="text/javascript">
<!--
$(function() {
var fileref = document.createElement('script');
fileref.setAttribute("type", "text/javascript");
fileref.setAttribute(
"src",
"http://twitter.com/statuses/user_timeline/sfpgmr.json?page=1&callback=twitter_status");
document.getElementsByTagName("head")[0].appendChild(fileref);
;
});
function twitter_status(json) {
var container = $('#tl');
container.html('');
var c = '<div style="font-size:18pt;font-weight:bold"><a href="http://twitter.com/sfpgmr" target="_blank"><img src="http://twitter-badges.s3.amazonaws.com/t_small-b.png"/> Twitter</div><div><img src="' + json[0].user.profile_image_url + '" alt="SFPGMR" /></a>';
$(json).each(function(el) {
c += '    <div>\
<div style="font-size:7pt;">'
+ formatTwitString(this.text)
+ '<br/>(' + relativeTime(this.created_at) +')<br/>-----</div>\
</div>';
});
c += '</div>';
container.append(c);
}
function formatTwitString(str)
{
str=' '+str;
str = str.replace(/((ftp|https|http?):\/\/([-\w\.]+)+(:\d+)?(\/([\w/_\.]*(\?\S+)?)?)?)/gm,'<a href="$1" target="_blank">$1</a>');
str = str.replace(/([^\w])\@([\w\-]+)/gm,'$1@<a href="http://twitter.com/$2" target="_blank">$2</a>');
str = str.replace(/([^\w])\#([\w\-]+)/gm,'$1<a href="http://twitter.com/search?q=%23$2" target="_blank">#$2</a>');
return str;
}
function relativeTime(pastTime)
{
var origStamp = Date.parse(pastTime);
var curDate = new Date();
var currentStamp = curDate.getTime();
var difference = parseInt((currentStamp - origStamp)/1000);
if(difference < 0) return false;
if(difference <= 5)                return "たった今";
if(difference <= 20)            return "ちょっと前";
if(difference <= 60)            return "1分前";
if(difference < 3600)            return parseInt(difference/60)+" 分前";
if(difference <= 1.5*3600)         return "1時間ほど前";
if(difference < 23.5*3600)        return Math.round(difference/3600)+" 時間前";
if(difference < 1.5*24*3600)    return "1日前";
var dateArr = pastTime.split(' ');
return dateArr[4].replace(/\:\d+$/,'')+' '+dateArr[2]+' '+dateArr[1]+(dateArr[3]!=curDate.getFullYear()?' '+dateArr[3]:'');
}
// -->
</script>
<div id="tl"></div>

Web制作の現場で使う jQueryデザイン入門 (WEB PROFESSIONAL)

posted with amazlet at 10.07.19

西畑 一馬
アスキー・メディアワークス
売り上げランキング: 51533

Amazon.co.jp で詳細を見る