Gravatar in Gmail (Update)

Posted by jon on Jan 25, 2010

A while back I wrote a Greasemonkey script to add Gravatars to Gmail. Unfortunately it broke after an update from Gmail and had a few issues I didn’t like.

I recently had a chance to go back through the script though and update it. It now uses jQuery, works with the current Gmail structure, and loads Gravatars for all open messages (the last one didn’t). It’s not perfect though. It will not yet load Gravatars if you click to open a collapsed message in a conversation (only the expanded messages upon first opening will have the Gravatar images loaded). It works pretty well otherwise, though, and it’s nice to see faces with my emails again.

I’ve got a screen shot below if you want to see what it looks like. If you’d like to get the script for yourself, I’ve posted it here. Just install Greasemonkey, click the link, and choose “install” when the popup comes up. Enjoy.

Screenshot of Gravatar in Gmail


Posted in Code, Javascript | 3 Comments »
Tags: , ,

Add a custom url shortener to Firefox

Posted by jon on Nov 30, 2009

I recently wrote a post about why I made my own url shortener. I’m now porting some of my common uses over to use this new shortener (keep life simple, right?). The first thing I wanted to address was adding an option to the right-click menu to shorten whatever page I was currently viewing and copy it to the clipboard. The easiest way I found to do this was to modify an existing Firefox addon called Shorten URL. It works particularly well because it already supports a TON of shortening services and adding new ones is a breeze. So how do you do it?

  1. First, download the extension.
  2. Next, find your Firefox profile folder.
  3. In your profile folder, find and open the “extensions/ShortenURL@loucypher/defaults/preferences” folder.
  4. You should then find a file named shortenURL_prefs.js – open it in any text editor.
  5. You should see two large blocks of similar lines repeating – find the last one in the first block (as of writing this it is pref("extensions.shortenURL.name.145", "w3t.org"); and add a new line below it (incrementing the number) and swap out the name w/ whatever you want to reference your url shortener as. (in my case pref("extensions.shortenURL.name.146", "jfox.in");
  6. Continue to the end of the file and you should find a matching url line pref("extensions.shortenURL.145", "http://w3t.org/?module=ShortURL&file=Add&mode=API&url=");. Add a new line below this one incrementing the number again (to match the one in the last step) and adding the url of the page to submit a url to shorten (the url will be appended to the end). For example: pref("extensions.shortenURL.146", "http://jfox.in/make-tiny.php?url="); (note the example here won’t actually work because my shortener is private).
  7. Save the file and restart Firefox. Now go to Tools->Add-ons, find ShortenURL in the list and select “preferences”. You should now be able to find your custom shortener in the list using the name you provided above (in my case jfox.in). Select your preference and enjoy!

A quick trailing note: This all assumes that your shortener has an interface that allows a url to be passed as a GET parameter and returns the shortened url in plain text as a result of that request. This is straight forward to implement, but worth mentioning. You should now be able to shorten simply by right-clicking and selecting the “Shorten this page URL” option (which will also copy the short url to your clipboard and put it in the location bar). Enjoy!


Posted in Code, General | 5 Comments »
Tags: , ,

My own short URLs

Posted by jon on Nov 1, 2009

A little while ago I setup my own short URL service on http://jfox.in. I already know there are tons of free services that already do this and there are even a few open source alternatives of projects aimed at this kind of thing…so why then did I decide to write my own? There are actually a couple reasons:

Anyone that is code savvy and is considering doing this – whatever your reasons – I definitely recommend doing it. It was simple and something I enjoyed, and it gives me the control I want in such a simple application. Not every problem makes sense to roll your own solution for, but this is one that does in my mind since it’s so simple.

I honestly wouldn’t be surprised if we see more web services offering their own custom URLs. It allows a bit more brand recognition and all the control issues I mention above. It also seems that short URL services aren’t going away anytime soon.

Do you have any thoughts on the merits of short URL services? Have you written your own or considered doing so?


Posted in Code, General | 5 Comments »
Tags: , ,

Lorem Ipsum Post Generator WordPress Plugin

Posted by jon on Aug 30, 2009

I’m constantly working with test blogs for IntenseDebate. Often, I need new posts and/or comments to give me some data to play with while testing new features, debugging old ones, or just to show something off. Instead of creating endless posts and comments of “testing 123″ and “another random test post”, I decided to throw together a quick WordPress plugin that will generate the posts for me using Lorem Ipsum text. It has a couple options, mainly the number of posts to create, a min and max number of paragraphs per post, and a min and max number of comments per post. I find it really useful for generating some test content quickly. I’ve posted a screenshot below. It’s nothing beautiful, but I thought it might be useful to someone else out there. I’ve posted the plugin here if you want to check it out.
Screenshot of the Lorem Ipsum Post Generate Plugin


Posted in Code, php | 1 Comment »
Tags: , , ,

Internet Explorer and the innerHTML Property

Posted by jon on May 21, 2009

Recently while helping a friend deal with the joys of cross-browser JavaScript when working with widgets, I was reminded of a painful quirk in how Intenert Explorer handles the innerHTML property of DOM elements in some cases.  In particular, DOM elements that are part of a table, or are a child to a table (no matter how many levels deep), can’t have the innerHTML property set at run time.  Doing so produces a completely unhelpful error message and crashes the rendering engine.  This is not only true for tables, but unfortunately happens with several other HTML elements in regard to Internet Explorer.

So, how does one get around this unfortunate problem?  Well, the best method I’ve found is to set the innerHTML property when the element is not yet attached to the DOM or is attached in a “safe” place (usually at the BODY tag).  To make this process simpler, I generalized this into a function that creates a new DOM node of the same type, preserves any attributes I care about, sets the innerHTML property, and replaces the original node in the DOM with this new node having the desired innerHTML.  Here’s the function for reference:

function replace_html(el, html) {
	if( el ) {
                var oldEl = (typeof el === "string" ? document.getElementById(el) : el);
                var newEl = document.createElement(oldEl.nodeName);

                // Preserve any properties we care about (id and class in this example)
                newEl.id = oldEl.id;
                newEl.className = oldEl.className;

                //set the new HTML and insert back into the DOM
                newEl.innerHTML = html;
                if(oldEl.parentNode)
        	        oldEl.parentNode.replaceChild(newEl, oldEl);
                else
		        oldEl.innerHTML = html;

                //return a reference to the new element in case we need it
                return newEl;
	}
};

Hopefully this function will help someone out there work around this problem a little faster than I originally did.


Posted in Code, Javascript | 39 Comments »
Tags: , , ,

Gravatar in Gmail

Posted by jon on Mar 14, 2009

UPDATE: I’ve posted a new version of this script here. The version on this page no longer works.

Earlier today I hacked together another GreaseMonkey script. This one adds a Gravatar of the person the email was from to Gmail when reading an individual message. It’s inspired by the Thunderbird integration I read about here a while back. Here’s a screenshot of it for a better understanding of what it does:
Gravatar in Gmail

It’s really just a prototype honestly, but it was far enough along to make me happy for now. A couple of limitations I’d like to correct some day (if I ever get around to it) would be to modify it to work with multiple open messages and to only display the image if the email address actually has a gravatar (currently it just displays the default gravatar image in this case). It would also be nice to clean up how the image is added to the email – currently it’s a long dom navigation. I’ve posted the script here if anyone is interested in giving it a try (or updating it). Also, if you didn’t already know about it (because I didn’t) the Gmail team has built a nice little API for people developing GreaseMonkey scripts.

As always, feedback welcome.


Posted in Code, Javascript | 20 Comments »
Tags: , ,

Twitter Throttle

Posted by jon on Mar 7, 2009

One of my biggest pet peeves on Twitter is when people I follow slam Twitter with a bunch of tweets in a short time. Maybe I’m the only one, but it’s definitely the #1 reason I stop following people. I don’t want a single user completely taking over my Twitter page…

With this in mind, I decided to write a GreaseMonkey script today to address the problem. I call it Twitter Throttle, and what it does is hides (and groups if they’re in a row) tweets when a user has more than one tweet on my screen at the same time. It will then also add however many older tweets are needed to have the correct total viewable on the page. So, for example, if there are 5 tweets that are hidden (because the user that made the tweet has already made a tweet that is currently being displayed) then it will pull in the 5 previous tweets that are by users not yet represented on your page. This effectively ensures that if there are 20 items on the page there will be at least 20 different users on the page as well. Here’s a screenshot of what it looks like in use:

twitter-throttle-screen1

Clicking on the links will display the tweets in case you still want to read them. I’ve posted the script here if anyone is interested. Be sure to set your twitter username and password in the script (used in the API call to add in older tweets to fill in for the hidden ones). Let me know if you have any feedback.


Posted in Code, Javascript | 26 Comments »
Tags: , ,

Ubiquity: Compete Stats

Posted by jon on Jan 26, 2009

I wrote yet another command for Ubiquity. This one allows you to do a search on Compete for the site you’re currently on. Simply subscribe to the command here to add it to your command list.

Once you’ve got the command installed you can check a sites stats by opening Ubiquity (CTRL+SPACE) and typing “compete”. You can also add “mv” for monthly page views or “uv” for unique visitors. If neither is specified it will default to Compete’s default (uniques). Hopefully someone else will find it useful.

Feedback welcome.


Posted in Code, Javascript | 18 Comments »
Tags: ,

Ubiquity: Twitter Search

Posted by jon on Jan 18, 2009

I recently wrote another command for Ubiquity. This one allows you to do a Twitter search. Simply subscribe to the command here to add it to your command list.

Once you’ve got the command installed you can perform a Twitter search by simply opening Ubiquity (CTRL+SPACE) and typing “twitter-search [search term(s)]“. Another simple one, but it saves me a little time and maybe someone else will find it useful.

Let me know what you think.


Posted in Code, Javascript | 2 Comments »
Tags: , ,

Ubiquity: PHP function lookup

Posted by jon on Sep 22, 2008

So I guess I’m getting into this Ubiquity thing a bit. I’ve created another one to lookup php functions on php.net. Simply subscribe to the command here to add it to your command list.

Once you’ve got the command installed you can lookup PHP functions by simply opening Ubiquity (CTRL+SPACE) and typing “php [function]“. This one was pretty simple to do, but very useful already. I look up syntax for PHP functions several times a day and saving my “Google step” is really nice.

Let me know what you think.


Posted in Code, Javascript, php | 5 Comments »
Tags: , ,