このボタンをクリックするたびにポップアップを1つ表示します。ポップアップは自動で閉じるように実装しています。
一度に表示されるポップアップはモニタのサイズによって決まっています。その数以上のポップアップはディスプレイの外に待機する形になります。
(function(){
// ChromeのNotificationsをW3CのWeb Notifications http://dev.w3.org/2006/webapi/WebNotifications/publish/ に準拠させる
// 注意:あくまで執筆時点の仕様です。最新の仕様とは異なる可能性があります。
if (typeof webkitNotifications === 'undefined') return;
if (typeof webkitNotifications.PERMISSION_ALLOWED === 'undefined'){
webkitNotifications.PERMISSION_ALLOWED = 0;
webkitNotifications.PERMISSION_NOT_ALLOWED = 1;
webkitNotifications.PERMISSION_DENIED = 2;
}
if (typeof webkitNotifications.permissionLevel === 'undefined') {
webkitNotifications.__defineGetter__('permissionLevel',function(){
return this.checkPermission();
});
webkitNotifications.__defineSetter__('permissionLevel',function(){
});
}
if (!webkitNotifications.createWebNotification) {
webkitNotifications.createWebNotification = webkitNotifications.createHTMLNotification;
}
function showNotification(icon, title, message) {
// 許可をチェック
if (webkitNotifications.permissionLevel === webkitNotifications.PERMISSION_ALLOWED) {
var notification = webkitNotifications.createNotification('GoogleChromeLogo.png', 'Notificationサンプル', 'デスクトップにポップアップを表示します。3秒後に自動で閉じるように設定されています');
notification.ondisplay = function(){
// 表示されてから3秒後に自動で閉じる
setTimeout(function(){
notification.cancel();
},3000);
};
notification.show();
document.getElementById("closeNotificationButton").onclick = function() {
// 通知ウィンドウを閉じる
notification.cancel();
};
} else {
// ユーザに許可を得る
webkitNotifications.requestPermission(function() {
if (webkitNotifications.permissionLevel === webkitNotifications.PERMISSION_ALLOWED) {
showNotification(icon, title, message);
}
});
}
}
document.getElementById('notification').onclick = showNotification;
})();