Dynamic Twitter Favicon

twitter-favicon.user.js

// ==UserScript==
// @name           Twitter Dynamic Icon
// @description    Changes the number on the Twitter favicon to reflect the current date, as per http://remysharp.com/2010/08/24/dynamic-favicons and http://userscripts.org/scripts/show/84382
// @version        1.0
// @author         KennethKufluk
// @namespace      ttp://kenneth.kufluk.com/blog/2010/11/dynamic-twitter-icon-with-greasemonkey-script-in-chrome/
// @require        http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js
// @include        http://twitter.com/*
// @include        https://twitter.com/*
// ==/UserScript==

(twitterLoaded = function() {
  if (document.body.className.match('loading')) {
    setTimeout(twitterLoaded, 5000);
  } else {
    var script = document.createElement("script");
    script.textContent = "(" + updateFavIcon.toString() + ")();";
    document.body.appendChild(script);
  }
})();
var updateFavIcon = function() {
  var canvas = document.createElement('canvas'),
    ctx,
    img = document.createElement('img'),
    link = document.createElement('link'),
    tweetcount = 0,
    head = document.getElementsByTagName('head')[0];
    
  if (canvas.getContext) {
    canvas.height = canvas.width = 16; // set the size
    ctx = canvas.getContext('2d');
    img.src = 'http://twitter.com/favicon.ico';
    
    //called on update to the displayed timeline
    $(document).delegate('div', 'newItemsCountChanged', function(e, tweetcount) {
      ctx.clearRect(0,0,16,16);
      ctx.drawImage(img, 0, 0);
      ctx.font = 'bold 10px "helvetica","Arial",sans-serif';
      ctx.textAlign = 'center';
			if (tweetcount>0) {
				// draw a circle
				ctx.fillStyle = '#FF0000';
				ctx.beginPath();
				ctx.arc(10, 10, 5, 0, Math.PI*2, true); 
				ctx.closePath();
  			ctx.fill();
				// add the number
				ctx.fillStyle = '#F0EEDD';
				if (tweetcount>9) tweetcount = "+";
				ctx.fillText(tweetcount, 10, 13);
	    }
      link.setAttribute('type', 'image/png');
      link.setAttribute('rel', 'shortcut icon');
      link.setAttribute('href', canvas.toDataURL('image/png'));
      head.appendChild(link);
    });
  }
};