The goal is to redesign notifications to address various issues with them and provide a unified action/notification area for them.
Issues with current notification bars
- Pushes content down
- Hangs around on the same domain
- Visual distraction
- Once dismissed, they cannot reappear
- Cannot show multiple notifications at once
- Spoofing is possible since notification bar appears within the content so it can be faked
- Action taken on a bar cannot easily be canceled/undone
Design
A new button will provide access to all of the notifications. The notifications will drop down from it. Following the notifications, static actions will follow after a separator.
Each notification will have:
- large icon on the left
- question
- button for affirmative action
- menu of alternative actions (optional)
- display mode to determine what to show when the notification is added (see #Initial_Notification_View)
If multiple notifications occur at once, they will overlap stack.
Initial Notification View
How the notification will appear when it is first created depends on the mode:
- Silent - add the notification to the menu without distracting the user (used mainly for adding undo actions)
- Icon - Display the icon in a small bubble hanging from the button. Clicking on the icon will display the full menu. The icon bubble will fade out after a few seconds.
- Full - Display the notification question and actions in a bubble hanging from the toolbar button. Dismissed when an action is taken on the notification or the focus on the notification is lost (ie. clicking onto the content of the webpage).
If multiple notifications of the same type are added, display them at the same time. If the types are not the same, display all of the first type together, followed by the next type, and repeat if necessary (if new notifications come in after the first were dismissed).
Menu View
After a notification is dismissed, it will be available in a menu accessed by clicking on the toolbar button.
Meetings
Notification Uses
Examples taken from existing notification bars and dialogs:
- Password manager
- Popup blocker
- Offline storage
- Geolocation
- Firefox updates
- Extension updates
- ...
Static Actions
Putting static actions in the doorhanger has been put on hold
Possible static actions:
- Default Options
- Save
- Extension examples
- Share
- Tweet
- Inspect
Bugs
- bug 398776 - want mechanism for site-specific notification
Sub-tasks
- Decide where in the UI, the notifications will be displayed from
- Create dropdown buttons
- Make panel UI on Windows/Linux like on Mac OS (rounded corners, transparency, & point on top)
- Change callers to use doorhangers instead of notifications bars