Chromium Blog: Rich Notifications in Chrome

Chromium Blog

News and developments from the open source browser project

App notifications send immediate alerts to users about important events as they happen. Chrome and Chrome OS already support basic web notifications, but rich notifications for Chrome packaged apps and extensions can enable users to act directly on these notifications and show rich content like lists and images. For those in beta channel, notifications now live in a center that is outside the browser, which allows them to receive notifications even when the browser is not open. Rich notifications are available in the latest beta channel builds on Windows, dev channel builds on ChromeOS, and will be coming to Mac OS X and Linux soon.
You can trigger a rich notification by calling the create method under the chrome.notifications module:

chrome.notifications.create(

‘id1’,{

type: ‘basic’,

iconUrl: ‘image1.png’,

title: ‘Althe Frazon’,

message: ‘Hi, what's going on tonight?’,

buttons: [{ title: ‘Call’,

iconUrl: ‘call.png’},

{ title: ‘Send Email’,

iconUrl: ‘email.png’}],

priority: 0},

function() { /* Error checking goes here */}

);

Apart from the basic notification type shown above, you can use other formats like image to show a preview of an image within the notification or list to coalesce multiple notifications from your app into a single one. For example, a mail app could show multiple unread emails within a single notification using the list type. You can also specify different priorities for notifications that determine how long they stay on the screen before moving into the notification center where they continue to live until dismissed by the app or user.

The notification center holds all current notifications and can be pulled up at any time from the launcher on ChromeOS or the system tray on Windows. Users can view and clear all of their notifications in the center, and also access settings to control which apps, extensions and websites can send them notifications.

Notification Center on Windows

Notification Center on ChromeOS

You can get started with rich notifications in your app or extension by trying out the Notify Test App and taking a look at the documentation on the Chrome developer site. We’d love your feedback so feel free to ask a question on Stack Overflow, start a discussion on our mailing list, or file a bug on our issue tracker. Posted by Justin DeWitt, Software Engineer and Notifications Knight