Yahoo! Web Messenger Meets
Category: Blog

This evening I decided to play with a really kewl new app called Fluid. What this app does is allow you to create Site Specific Browsers. One of the first usages which popped into mind was a product I helped develop, Yahoo! Web Messenger. An annoyance of mine with it is that it had to live in a browser tab, something prone to getting closed accidentally, and also didn’t have any decent notifications of new messages when not in focus. Being the perfect candidate for Fluid, IMHO, I set out to give it a shot. In less than an hours time I built a pretty kewl demo and here’s how you can use it too.

  1. First things first, you need to download and install Fluid. You can do this by visiting After installing it, fire up the app.
  2. Second off, we now need to create our SSB instance. For the URL, enter in

    For the name use something like Yahoo! Web.IM or whatever else strikes your fancy. The icon you can download from here. Click create and you are all set.

  3. Next we can fire up the application. It should live inside your applications folder just like any other desktop app. You use Quicksilver right?
  4. Now that the app is running, you can see the normal login screen of Web.IM and if you like, sign in just as a test.
  5. Next comes the real powerful part. We need to create a new “userscript” which will add advanced functionality over what a normal browser experience provides. We do this by clicking on the Userscripts menu and then selecting “New Userscripts…”, or you can use Cmd-Option-N if you are a keyboard shortcut lover like me. Type in a meaningful name, I used WebIM, and then a new script editor opens. Paste the following code into the window replacing what was there already and then save and close the script editor.
    // ==UserScript==
    // @name        WebIM
    // @namespace
    // @description Enables advanced notifications and disables ads
    // @include     *
    // @author      Jeremy Johnstone
    // ==/UserScript==
    (function () {
        if (window.fluid) {
    			// unread is a bit of misnomer, because we clear this
    			// as soon as the window regains focus, not when you
    			// actually read the IM (TODO: telepathy enabled?)
    			var unreadIMCount = 0;
    			// store the state of the user being active
    			var activeState = true;
    			// I don't want ads in my IM client
    			window.showAd = function(locale) { }
    			// When the window regains focus, clear the unread IM count
    			// Also save the state for other functions
    			window.onfocus = function() {
    				activeState = true;
    				unreadIMCount = 0;
    				window.fluid.dockBadge = "";
    			window.onblur = function() {
    				activeState = false;
    			// disabling this turns off the normal new IM
    			// notification (aka the scrolling title message)
    			window.startNotify = function(msg) { }
    			// Here we latch into the advancedNotify which
    			// splits out the yid from the msg separately
    			window.advancedNotify = function(yid, msg) {
    				// We don't want to show growl alerts if the
    				// user is active already
    				if(activeState) return;
    				msg = unescape(msg);
    					title: "New Message from: " + yid,
    					description: msg,
    					priority: 1,
    					sticky: false,
    					identifier: null,
    					onclick: null
    				// Now we increment the unread IM count and then
    				// set the dockBadge to be the number of unseen IMs
    				window.fluid.dockBadge = unreadIMCount;
    			// Instead of blowing away the cookies going to login,
    			// Let's just close the app instead
    			window.exit = function(url) {
    				// seems neither of these work... hmmm..
    				// fluid bug???
  6. Finally, not sure this is needed, but I found it easiest to quit the app and restart it as that way you know for sure your script got loaded right. Probably not needed, but always safer. Also check the Userscripts menu and you should see a menu option for your new script. Make sure there is a check mark next to it. If so, go ahead and sign in as usual.

That’s it! You now have a new Web Messenger client inside it’s own browser tab with the following new features:

  • Growl Notifications for IMs received when the app isn’t in focus
  • Dock Badge updates with the count of unread IMs received
  • No advertising banners shown

My hope is that I can get the author of Fluid to add a couple more improvements which will make it even better as well as hopefully fix what I think is a bug with hide() and terminate() not working. With dock icon bouncing and a separate cookie jar for each application this will be immensely useful, IMHO.

Here’s a little video tutorial taking you through the steps above.



Tags: , ,

9 Responses to “Yahoo! Web Messenger Meets”

  1. [...] Run Yahoo! Messenger for the Web Inside It’s Own Browser Tab. [...]

  2. Adam Dempsey says:

    I’m gonna try that now, thanks, wasn’t sure how to go about setting it up to show the unread IMs etc :)

  3. [...] Visit Jeremy’s blog for more details on how to do this on your own Mac (including the customized code you’ll need for Fluid), or watch the quick video tutorial below: [...]

  4. dt says:

    Followed your instructions but cannot get the Growl notification or unread message count to work. Where should I start looking?

    Growl was updated since you posted this howto, so could that be the issue?

  5. dt says:

    I figured things out. I re-typed your script instead of copy ‘n paste, and that solved my problem. Not sure it is with how your code is on the page, or an issue with copy ‘n paste. The double quotes are not copied correctly.

  6. [...] Yahoo! Web Messenger Meets | Jeremy Johnstone (tags: fluid yahoo im) [...]

  7. maryinnylons says:

    Where did you get your hope is that you can get the author of Fluid to add a couple more improvements which will make it even better as well as hopefully fix what you think is a bug with hide? Is that your final answer?

  8. wayne says:

    ok i am no programmer but coping and pasting should be easy but i cant seem to do that any ideas why not?

  9. [...] Run Yahoo! Messenger for the Web Inside It’s Own Browser Tab. [...]

Leave a Comment

Spam Protection by WP-SpamFree