Desktop Notifications
Chrome 4では，
拡張からDesktop Notificationsを使用するためには，
図1 Desktop Notificationsによる通知
まず，
Sample Notifyのmanifest.
{
"description": "Sample Notify",
"name": "Sample Notify",
"background_page": "background.html",
"browser_action": {
"default_title": "Show Notification",
"default_icon": "icon.png"
},
"version": "0.0.3",
"permissions": [
"notifications"
]
}続いて，
Sample NotifyのBackground Page
<!DOCTYPE html>
<html>
<head>
<script>
var list = [
'chrome-extension://' + location.host + '/note.html',
'http://www.google.co.jp/'
];
var notify = webkitNotifications;
chrome.browserAction.onClicked.addListener(function(tab){
var url = list.shift();
if (url) {
var note = notify.createHTMLNotification(url);
//or notify.createNotification(iconUrl,title,body);
note.show();
}
});
chrome.extension.onRequest.addListener(function(res){
console.log(res);
});
</script>
</head>
<body>
</body>
</html>note.
note.
<button onclick="chrome.extension.sendRequest('click');">
button
</button>最後に，
ウェブサイトからのNotificationsの利用
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>webkitNotifications sample</title>
<body>
<button id="requestPermission">デスクトップへの通知</button>
<script>
document.querySelector('#requestPermission').
addEventListener('click',function(){
var n, wn = webkitNotifications;
wn.requestPermission(function(){
n = wn.createNotification('icon.png','title','body');
n.show();
});
},false);
</script>
</body>
</html>なお，
まとめ
今回はWeb StorageとJSON関連のチップスに，
