jQuery Twitter is a lightweight (4KB minified and 1.5KB gzipped) and easy to use jQuery plugin that uses Twitter API to get tweets from a user timeline.
Automatically format links and dates. You can show dates in absolute time (eg.: 04/20/2012 at 10h45) or relative time (eg.: 2 hours ago), taking care of timezone differences.
Dates are easily formatted for a better localization.
Also, tweets are cached with localstorage, so twitter won't bother you with too many requests warnings.
##How to use:
Make sure to include jQuery in your page:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
Include jQuery Twitter:
<script src="js/jquery.twitter.min.js"></script>
HTML markup (just an example, do it your way)
<div class="tweet">
<p></p>
<p></p>
<p></p>
</div>
Initialize jQuery Twitter:
<script>
$(function(){
$.twitter('username', 2, function(data){
$('.tweet').find('p').each(function(i){
data[i] && $(this).html(data[i].text).append('<span>' + data[i].time + '</span>');
});
});
});
</script>
##Callback:
Callback function passes a object as first parameter
function(data){
// data[index].text = Tweet
// data[index].time = Time of tweet formated
// data.length = Number of tweets returned
// data.profile.avatar = User avatar
// data.profile.followers = User followers count
// data.profile.screen_name = User screen name
}
##Usage:
$.twitter(string username[, integer number_of_tweets], function callback[, object { options }]);
##Options:
Option | Default | Type | Description |
timeSpan | true | Boolean | Toggle time format between relative and absolute |
exclude_replies | true | Boolean | Exclude direct replies from response |
time_format | function(day, month, year, hours, minutes){ var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']; return months[month] + ' ' + day + ', ' + year + ' at ' + hours + 'h' + ('0' + minutes).replace(/0(\d\d)|00/, '$1'); } | Function | Date/time format (timeSpan option must be false) |
less_than_a_min | 'less than a minute ago' | String | Less than a minute ago string for localization (only show if timeSpan is true) |
timespan_format | function(time, unity){ var time_units = ['minute', 'hour', 'day']; return time + ' ' + time_units[unity] + (time > 1 ? 's' : '') + ' ago'; } | Function | Date/time format (timeSpan option must be true) |
cache_timeout | 5 | Integer | Time in minutes to keep tweets cached |
##Example:
$(function(){
$.twitter('twitterapi', 3, function(data){
$('.tweet').find('p').each(function(i){
data[i] && $(this).html(data[i].text).prepend('<img src="' + data.profile.avatar + '">').append('<span><a href="' + data[i].link + '" target="_blank">' + data[i].time + '</a></span>');
});
}, {
timeSpan: true,
exclude_replies: true,
time_format: function(day, month, year, hours, minutes){
var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
return months[month] + ' ' + day + ', ' + year + ' at ' + hours + 'h' + ('0' + minutes).replace(/0(\d\d)|00/, '$1');
},
timespan_format: function(time, unity){
var time_units = ['minute', 'hour', 'day'];
return time + ' ' + time_units[unity] + (time > 1 ? 's' : '') + ' ago';
},
less_than_a_min: 'less than a minute ago',
cache_timeout: 5
});
});