Change MSN chat status icon

Question

I'm using this tip to integrate MSN Messenger to my Website: http://en.kioskea.net/faq/3987-integrate-msn-chat-on-your-website-or-blog It shows an icon with the current MSN status (online, away and so on). I want to change these images. Is it possible?

Answer 1

I made a snafu answering this the first time:

Going here:

http://messenger.services.live.com/users/[email protected]/presenceimage?mkt=en-GB

will redirect you to:

http://www.wlmessenger.net/static/img/presence/Offline.gif

which makes detecting the status a whole lot easier!

I missed that.

---

I looked here:

http://settings.messenger.live.com/Applications/CreateHtml.aspx

I picked the Status Icon option, and was given code like this:

<a target="_blank" href="http://settings.messenger.live.com/Conversation/[email protected]&mkt=en-GB">
    <img style="border-style: none;"
     src="http://messenger.services.live.com/users/[email protected]/presenceimage?mkt=en-GB"
     width="16" height="16" />
</a>

The path to the image remains the same no matter what your status.

There is no way to change the image based on which status is returned in the image with pure HTML/CSS/JS (afaik). (even after I realised it redirects)

I can think of a technique to do it, but it's not easy and it's not too hard, but you'll have to use a server side language such as PHP or ASP.NET.

You would change that code to something like this:

<a target="_blank" href="http://settings.messenger.live.com/Conversation/[email protected]&mkt=en-GB">
    <img style="border-style: none;" 
     src="proxyMyMsnImage.php"
     width="16" height="16" />
</a>

proxyMyMsnImage.php would do the following things:

• Does a HEAD request (or GET, if that doesn't work) on the image (http://messenger.services.live.com/users/[email protected]/presenceimage?mkt=en-GB)
• Depending on which image you're redirected to (for example Offline.gif), you send your own version of that status image, along with the correct mime type, for example image/gif.
• You could cache the results of this, and only update it if at least X time has passed (say, 2 minutes).

Figuring out how to detect which status image you were sent is the most difficult part now really easy.