Hatena::ブログ(Diary)

橋本詳解 RSSフィード

ここはメモ帳です

http://shokai.org
http://shokai.org/blog/

2011-06-19

[]window.webkitNotifications

chromeで動く

http://dev.shokai.org/test/webkit-notification/

$(function(){
    $('input#notify').click(function(){
        switch(window.webkitNotifications.checkPermission()){
        case 1:
            window.webkitNotifications.requestPermission();
        case 0:
            var notif = window.webkitNotifications.createNotification('shokai.jpg', "title", $('input#message').val());
            notif.ondisplay = function(){
                setTimeout(function(){
                    if(notif.cancel) notif.cancel();
                }, 3000);
            };
            notif.show();
        }
    });
});

firefoxでも拡張いれればgrowlできる http://code.google.com/p/ff-html5notifications/

参考:http://gecko.hp2.jp/2010/04/27/%e3%80%90javascript%e3%80%91webkit%e3%81%ae%e3%83%87%e3%82%b9%e3%82%af%e3%83%88%e3%83%83%e3%83%97%e9%80%9a%e7%9f%a5%e3%81%ae%e3%83%87%e3%83%a2/


requestPermissionはクリックなどのユーザ操作イベントの後でないと動かない、つまりsetIntervalから呼び出してもダメなので、chatなどの新着の表示は

  1. 先にボタンやチェックボックスをクリックさせてpermissionを得る
  2. 新着が来た時にcreateNotificationしてshowする

の順にやらなければならない。

body.clickでも動いたので、実質ユーザが画面をロードして何か操作したらすぐに許可をブラウザ上部に表示させる事ができる

$('body').click(function(){
  if(window.webkitNotifications.checkPermission() == 1){
    window.webkitNotifications.requestPermission();
  }
});

スパム対策のためのダミーです。もし見えても何も入力しないでください
ゲスト


画像認証

トラックバック - http://d.hatena.ne.jp/shokai/20110619/1308469952