I am creating a Chrome extension and I am using the Webkit notifications API. I need to show a link in the notification, but the problem is that now Webkit HTML notifications are deprecated, so I only can use notifications with a simple message. I mean, one year ago I could have created a Wbkit HTML notification and include the "a" element, but now I can't.
Is there a way to show a link in a Webkit notification? Thanks.
To make a webkit notification a link, do this (I'm using jQuery for events just because it's easier):
var notification = window.webkitNotifications.createNotification(
"http://www.google.com/images/logo.png", // icon url - can be relative
"Google", // notification title
"is the best search engine. Click to find out more" // notification body text
);
// Show the notification, I'm assuming notifications are supported and allowed
notification.show();
jQuery(notification).click(function(){
window.location = "http://www.google.com";
});
Yes, you can show, check this code as a reference.
manifest.json
Registered background page and permissions needed for notifications
{
"name": "Notification with Link",
"description": "http://stackoverflow.com/questions/14731996/how-to-include-a-link-in-a-webkit-notification",
"manifest_version": 2,
"version": "1",
"permissions": [
"notifications"
],
"background": {
"scripts": [
"background.js"
]
}
}
background.js
Created a HTML Notification
// create a HTML notification:
var notification = webkitNotifications.createHTMLNotification(
'notification.html' // html url - can be relative
);
// Then show the notification.
notification.show();
notification.html
Added script tag to avoid CSP
<html>
<head>
<script src="notification.js"></script>
</head>
<body>
<a id="click" href="http://www.google.co.in/">Click Me</a>
</body>
</html>
notification.js
Just pointed a notification for click, can be used for extending any functionality.
document.addEventListener("DOMContentLoaded", function () {
document.getElementById("click").addEventListener("click", function () {
console.log("Clicked");
});
});
References