Web component for using the notifications API.
[ This description is mirrored from README.md at github.com/jifalops/app-notifications on 2019-05-22 ]
app-notifications
Web component for using the notifications API.
Installation
bower install --save app-notifications
Usage
- Give it an
id
and call theshow()
method. - Pass event handlers to
show()
or as attributes likeon-show="..."
.
Demo
<app-notifications id="notifications"></app-notifications>
Title:<br/>
<input id="title" value="title"/><br/>
Options:<br/>
<textarea id="options" rows="3" cols="30">
{"tag": "app", "body": "body", "icon": "demo/icon.png"}
</textarea><br/>
Duration (ms):<br/>
<input id="duration" value="0"/><br/>
<button onclick="_showNotification();">Show Notification</button>
Last event: <span id="feedback"></span>
<script>
var notifications = document.getElementById('notifications');
var title = document.getElementById('title');
var options = document.getElementById('options');
var duration = document.getElementById('duration');
var feedback = document.getElementById('feedback');
_showNotification = function() {
notifications.show(
title.value,
JSON.parse(options.value),
duration.value,
function(e, n) { feedback.innerHTML = 'Notification shown'; },
function(e, n) { feedback.innerHTML = 'Notification clicked'; },
function(e, n) { feedback.innerHTML = 'Notification closed'; },
function(e, n) { feedback.innerHTML = 'Notification error'; });
}
</script>
Full demo: webcomponents.org | github.
API: webcomponents.org | github.
Contributing
- Fork it on Github.
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -am 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request
License
Install
Framework Support
Browser Compatibility
Install with
Run the above Bower command in your project folder.
If you have any issues installing, please
contact the author.
Release notes - Version 1.0.0
Dependencies
- polymer#^2.0.0