Ben
Ben

Reputation: 188

Display most recent Tweets from User (last 20 or so)

I have a web site at http://www.urbanvision.org.uk/, we have a Twitter feed on the right. This twitter feed is present for most of the web site.

We are encountering a problem where when we haven't tweeted within the last three days or so no tweets are displayed. Though we plan to tweet more and more is there a way we can alter the code below to just show the last 20 or so tweets.

I know Twitter has it's own limits but if I am truly honest find it all a little too confusing to understand.

Current JS Code:

var tweetUsers = ['urbanvision_uk'];
var buildString = "";

    $(document).ready(function(){

        $('#twitter-ticker').slideDown('slow');

        for(var i=0;i<tweetUsers.length;i++)
        {
            if(i!=0) buildString+='+OR+';
            buildString+='from:'+tweetUsers[i];
        }

        var fileref = document.createElement('script');

        fileref.setAttribute("type","text/javascript");
        fileref.setAttribute("src", "http://search.twitter.com/search.json?q="+buildString+"&callback=TweetTick&rpp=50");

        document.getElementsByTagName("head")[0].appendChild(fileref);

    });

    function TweetTick(ob)
    {
        var container=$('#tweet-container');
        container.html('');

        $(ob.results).each(function(el){

            var str = ' <div class="tweet">\
                        <div class="avatar"><a href="http://twitter.com/'+this.from_user+'" target="_blank"><img src="'+this.profile_image_url+'" alt="'+this.from_user+'" /></a></div>\
                        <div class="user"><a href="http://twitter.com/'+this.from_user+'" target="_blank">'+this.from_user+'</a></div>\
                        <div class="time">'+relativeTime(this.created_at)+'</div>\
                        <div class="txt">'+formatTwitString(this.text)+'</div>\
                        </div>';

            container.append(str);

        });

        container.jScrollPane();
    }

    function formatTwitString(str)
    {
        str=' '+str;
        str = str.replace(/((ftp|https?):\/\/([-\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 "Just now";
        if(difference <= 20)            return "Seconds ago";
        if(difference <= 60)            return "A minute ago";
        if(difference < 3600)           return parseInt(difference/60)+" minutes ago";
        if(difference <= 1.5*3600)      return "One hour ago";
        if(difference < 23.5*3600)      return Math.round(difference/3600)+" hours ago";
        if(difference < 1.5*24*3600)    return "One day ago";
        if(difference < 1.5*48*3600)    return "Two days ago";
        if(difference < 1.5*720*3600)   return "Over a month ago";

        var dateArr = pastTime.split(' ');
        return dateArr[4].replace(/\:\d+$/,'')+' '+dateArr[2]+' '+dateArr[1]+(dateArr[3]!=curDate.getFullYear()?' '+dateArr[3]:'');
    }

It would also be cool if we could bring in retweets and mentions too.

As always, any help would be greatly appreciated.

Upvotes: 0

Views: 977

Answers (1)

Emanuel Kluge
Emanuel Kluge

Reputation: 705

for convinience i would reccomend to use the official twitter-widget and customize it. here's a good article describing the issue: http://www.1stwebdesigner.com/css/customize-twitter-search-widgets/

Upvotes: 1

Related Questions