ember-flash-messages
v1.0.0
Published
Adds API-like functionality for rendering and managing flash messages in your Ember CLI apps
Downloads
34
Maintainers
Readme
Ember Flash Messages
Ember Flash Messages (ember-flash-messages
) adds API-like functionality to your Ember CLI app for rendering and managing flash messages.
The primary goal of this addon is to manage functionality in your JS whilst getting out of the way for styling and templating, allowing you to match your styleguide and mockups precisely.
Stylesheets for a basic flash message layout may be optionally imported.
Contents
Examples
Simple JS usage in any route, component, controller, or view:
// app/controllers/index.js
export default Ember.Controller.extend({
afterSomeEvent: function() {
this.flashMessage('success', 'Content saved!');
},
});
Firing an action when the message is clicked:
// app/components/index.js
export default Ember.Component.extend({
actions: {
undo(message) {
console.log(message);
}
}
afterSomeEvent: function() {
this.flashMessage({
type: 'warning',
action: 'undo', // Run when message is
content: '<strong>Click here</strong> to cancel', // Pass HTML
duration: 5000, // Milliseconds to show the message for
});
},
});
Adding as a standalone component in a template:
{{#flash-message type='some-event'}}
Welcome to your new account!. {{#link-to 'tutorial'}}Click here to repeat the tutorial{{/link-to}}.
{{/flash-message}}
Showing a message in perpetuity:
// app/routes/index.js
export default Ember.Route.extend({
afterSomeEvent: function() {
this.flashMessage({
type: 'success',
content: 'This will show forever!',
duration: 0, // Pass zero duration
});
},
});
Installation
Users of older version of Ember (e.g. 1.10) should use release v0.5.2
.
ember install ember-flash-messages
Now add the flash message queue to your template. Usually this is the application template.
{{flash-message-queue}}
Documentation
Documentation including installation, usage, and customizable options is available in the wiki.
Issues
If you have any issues or feature requests, please open an issue or submit a PR.
Development
git clone https://github.com/sir-dunxalot/ember-flash-messages.git
cd ember-flash-messages
ember install
ember s
Tests can be run with ember test
or by navigating to the /tests
route.
Working on wiki documentation:
You can edit the documentation directly on Github - it's a wiki!