The Twitter API allows you to access tweets, profile information and more. It has a couple of return types of data, I will be using the JSON format. If you are accessing the tweets that belong to a profile you don’t need authentication unless they are protected. In the documentation it will tell you if authentication is required to access certain data.
I will show you how to create your own Twitter Feed using the Twitter API and JQuery $.getJson() method. I have also added in some other functions to, for the date to convert it to “real time”. Instead of giving a time stamp it now can say, “a minute ago” or “1 hour ago” or “ 1 day ago” and so forth. Find text links and actually turn them into click-able links which open in a new window. The $.getJson() _method first parameter takes the resource URL and the second parameter is a callback function with the data object, which I have called _tweetdata. _The first call is to collect data about the user profile. In the query string you see the parameter _screen_name _this is where you enter your user name and the _callback parameter is required so that we can use the callback function.
Since the data is returned in a JSON object you essentially have a range of properties. The properties that I choose to get are screen name [screen_name], number of followers [followers_count] and the total number of tweets [statuses_count]. There is a range of other properties returned like the user icon, background image, profile colours and more - check out the _user / show _Twitter api to all.
Then in the next line is a function called getTweets(); this function is called to append the Tweets. The reason it is called in the _$.getJson() _method is because if they were both called in the document ready at the same time they could append the profile and tweets in different orders. In this case it is made sure the profile is at the top.
The getTweets function works in the same way, except it queries the user_timeline. Insert the screen name and use the count parameter to limit the number of tweets returned. The $.each() method is used to loop through the array returned much like a for loop. The first parameter is the JSON object (tweetData) and then the callback function uses i to count the number of loops and the tweet stores each array item. We use the properties text which gets a tweet, the location and created_at which gets the time of the tweet. The tweets are concatenated into one string variable and then appended to the HTML element.
- getTimezoneOffset() which is returns the clients machine time difference but not including DST.
- getTime() this returns the dates in microseconds.
The tweet date with the offset added on and the current date is converted to microseconds. The difference is calculated and converted back to seconds by dividing by 1000. Then we run the value against some conditions and check if its less than a minute ago or hour ago and so on.
This script has now been further developed check out, Create a twitter feed using JSON.