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/.