Thursday, March 12, 2009

Twitter Stats using Greasemonkey & jQuery

I wrote a simple Greasemonkey script that uses jQuery to read the Following, Followers, and Updates count from your Twitter Home page and displays them in the title of your Firefox tab (as seen in the image to the left).

Since I enjoy using jQuery, I tend to use this script as the starting point for several other of my custom Greasemoney scripts.

You can install the following Greasemonkey script from the userscripts.org website.

// ==UserScript==
// @name           Twitter Stats
// @namespace      http://zi.ma/webdev
// @description    Display your Twitter Stats in the Tab Title
// @include        http://twitter.com/home
// ==/UserScript==

//BEGIN - Load jQueryhttp://is.gd/j6G
var GM_JQ = document.createElement('script');
GM_JQ.src = 'http://jquery.com/src/jquery-latest.js';
GM_JQ.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(GM_JQ);

function GM_wait() {
   if (typeof unsafeWindow.jQuery == 'undefined') { window.setTimeout(GM_wait,100); }
   else { $ = unsafeWindow.jQuery; letsJQuery(); }
}
GM_wait();
//END - Load jQuery http://is.gd/j6G
    
// All your GM code must be inside this function
function letsJQuery() {
   unsafeWindow.console.log('BEGIN letsJQuery'); 

   var followers = $("#follower_count").html();
   var following = $("#following_count").html();
   var updates = $("#update_count").html();
   document.title = 'Twitter / Ing: ' + $.trim(following) + '; Ers: ' + $.trim(followers); 
 
   unsafeWindow.console.log('END letsJQuery');
}

unsafeWindow.alert = function alert(message) {
   //do nothing
}; 

The above script first loads the jQuery framework and then retrieves the Twitter values.

You might notice the use of unsafeWindow.console.log('Your message here...');

I mainly used this to help debug the script.

You can find these messages displayed in your Firebug console.

Once you have installed the script, it could be easily be coupled with the ReloadEvery firefox extension so that you can sit back and watch your stats update to your heart's content :)

3 comments:

  1. Anonymous8:03 PM

    Your current method of injecting jQuery into the page is expensive on bandwidth. It will need to be injected on every page load. Additionally it may reduce the speed at which your script starts up.

    I've found that using @require is more effective as jQuery will only be downloaded on install and you won't need to mess around with the waiting or getting the $ object from the unsafe window.

    Here's an example script that uses that technique to add a Twitter search box to Twitter user pages.

    ReplyDelete
  2. Hi ,
    what is the best way to get the following information with Twitter API without getting Login Credentials for twitterUserA:

    1)suppose I have a user called twitterUserA
    I want to get detailed information for people who are following him and his followers.

    2)so i need Followersname, FollowerID, FollowersFollowerCount,FollowersFollowingCount,followersUpdates#,and other info if possible.


    what is the fastest and best way to get information for a given twitter account without asking for twitter Log in credentials (username and password)


    thanks
    Bally

    ReplyDelete
  3. This is a topic that is near to my heart... Many thanks! Where are your contact details though?

    ReplyDelete