Get users' attention when browser is minimized (cross-browser desktop notifications?)

Sologoub picture Sologoub · Oct 21, 2011 · Viewed 9.7k times · Source

I'm working on a browser-based application that needs to be able to get users' attention when the user receives an incoming event, such as a message, even if the user has minimized the browser.

Searching gave me some good results, but nothing cross-browser or firefox-specific. I need to be able to support IE 7+ and FF 3.6+ (specific to the user base).

Here are the things I've looked at:

So far, we used a simple javascript alert to get the tray icon to flash, but that created an extra click in trying to respond to the notification (total of 3 clicks now, or a 33% degradation). Users are expected to do this 20-50 times a day, so it will get really annoying really quickly.

Based on an example provided on Microsoft developers network, I made this simple prototype that worked well for IE, but it's IE-specific and will not work in other browsers:

<HTML>
<HEAD>
<TITLE>Popup Example</TITLE>
<SCRIPT LANGUAGE="JScript">
function timeMsg()
{
    var t=setTimeout("ButtonClick()",5000);
}

var oPopup = window.createPopup();

function ButtonClick()
{
    var oPopBody = oPopup.document.body;
    var myHeight = (window.screen.availHeight - 125);
    var myWidth = (window.screen.availWidth - 350);

    oPopBody.style.backgroundColor = "red";
    oPopBody.style.border = "solid black 1px";
    oPopBody.innerHTML = "Click outside <B>popup</B> to close.";
    oPopup.show(myWidth, myHeight, 300, 75);
}
</SCRIPT>
</HEAD>
<BODY>
<BUTTON onclick="timeMsg()">Display alert in 5 seconds</BUTTON>
</BODY>
</HTML>

Any suggestions on how to make this experience better without using an executable installed locally are greatly appreciated!

Answer

Sologoub picture Sologoub · Oct 27, 2011

We ended up just going with Google Chrome Desktop Notifications and asking our clients to either user Chrome or Chrome Frame within IE. Notifications are augmented by playing a sound as an alert.

Here's the documentation on it: http://code.google.com/chrome/extensions/notifications.html