HTML5 e notifiche di sistema

Facebook è uno dei siti più noti che faccia un uso intensivo degli aggiornamenti in tempo reale. Mentre navighiamo, se c'è un aggiornamento da mostrare, il titolo della pagina cambia in "Facebook (1)" e viene mostrata una notifica del tipo "Tizio ha commentato il tuo stato". Finché la finestra del nostro browser è in primo piano queste notifiche riescono a richiamare la nostra attenzione. Ma cosa succede se abbiamo la finestra del browser ridotta a icona e magari stiamo usando qualche altro programma in primo piano? Succede che la notifica parte ma per noi sarà  praticamente impossibile riceverla. Meglio sarebbe se potessimo ricevere delle notifiche come se fossero notifiche di sistema. Scopriamo come fare.

Grazie ad HTML5 abbiamo già  delle API belle e pronte per farlo, il codice è semplice:

function RequestPermission(callback) {
window.webkitNotifications.requestPermission(callback);
}

function showNotification(){
if (window.webkitNotifications.checkPermission() > 0) {
RequestPermission(showNotification);
}
else {
window.webkitNotifications.createNotification("http://.../immagine.png", "Titolo", "Body").show();
}
}

Per mostrare le notifiche basta solo "agganciare" la funzione showNotification() all'evento che desideriamo. Non appena l'evento si verificherà  la funzione showNotiofication() controlla per prima cosa se il sito ha il permesso di inviare notifiche al browser utente, se non fossimo autorizzati allora inviamo all'utente la richiesta di autorizzazione RequestPermission(). Se l'utente accetta la richiesta tutte le notifiche successive verranno mostrate proprio sopra l'orologio di windows, come le altre notifiche di sistema.