ember-frost-notifier

Dependencies

Health

Security

Ember Observer score

A service and component for managing application notifications

• Installation
• API
• Examples
• Contributing

Installation

ember install ember-frost-notifier

API

ember-frost-notifier registers the notifier service which can be injected into your controllers and routes to add and remove notifications. You must have only one {{frost-notifier}} in your application template to display these notifications.

Methods

addNotification

Adds a single notification to the list. Takes a single parameter options and returns the notification object.

NotificationOption:

Name	Type	Description
message	String	Message to display
details	Object	details to pass to onDetailsClick
onDetailsClick	Function	callback for when the details is clicked
type	String	type of notification (success, info, warning, error)
autoClear	Boolean	whether to dismiss notification automatically
clearDuration	Number	time in ms to dismiss if autoCleared

removeNotification

Removes a single notification from the list. Takes the instance of the notification

clearAll

Removes all notifications.

Examples

In your application/template.hbs:

{{frost-notifier}}
{{outlet}}

In your controller:

import Ember from 'ember'
 
export default Ember.Controller.extend({
    notifier: Ember.inject.service('notifier'),
    actions: {
        showNotification () {
            this.get('notifier').addNotification({
                message: 'Something terribly bad happened',
                details: 'It was bad. It was really really bad!',
                onDetailsClick (details) {
                    console.log(details)
                },
                type: 'error',
                autoClear: false,
            })
        }
    }
})

You can also close over the context of a component to send actions, such as:

onDetailsClick: (details) => {
  this.send('someAction', details)
}

Testing with ember-hook

This addon has been optimized for use with ember-hook. You can set a hook name on your notifier template. This will allow you to access the internal notifier content for testing.

Available hooks

• Top level - <hook-name>-notification-wrapper
• Notifier content - <hook-name>-notification-wrapper-content
• Notifier content message - <hook-name>-notification-wrapper-content-message
• Notifier content details - <hook-name>-notification-wrapper-content-details
• Notifier close icon - <hook-name>-notification-wrapper-close-icon

Contributing

This following outlines the details of collaborating on this Ember addon:

Installation

• git clone this repository
• npm install
• bower install

Running

• ember server
• Visit your app at http://localhost:4200.

Running Tests

• npm test (Runs ember try:testall to test your addon against multiple Ember versions)
• ember test
• ember test --server

Building

• ember build

For more information on using ember-cli, visit http://www.ember-cli.com/.