当前访客身份:游客 [ 登录 | 加入 OSCHINA ]

代码分享

当前位置:
代码分享 » JavaScript  » 其他
分享到: 
收藏 +0
2
支持chrome Firefox 没有做太多的测试

已测试通过:
chrome 31.0.1650.57 m
Firefox 25.0.1

以后有空继续完善 或者做成插件

使用方法:
打开开源中国首页,
拷贝代码到控制台 运行
注意授权
必须保持这个页面一直开着
标签: Chrome Firefox

代码片段(2) [全屏查看所有代码]

1. [图片] TM截图20131202154847.png    

2. [代码]代码     跳至 [2] [全屏预览]

AUTO_CLOSE_DELAY_SECONDS = 5;//自动隐藏时间 秒

/*兼容Firefox 这个标准是不是没订下来 差别大了点*/
if (!("webkitNotifications" in window)) {
      if (("Notification" in window)){
        window.webkitNotifications = window.Notification
        window.webkitNotifications.checkPermission = function(){
          switch (window.webkitNotifications.permission)
        {
        case "granted":
          return 0;
        case "denied":
          return 2;
        case "default":
          return 1;
        }
        return 2;
      }
      window.webkitNotifications.createNotification = function(var1,var2,var3){
        return new Notification(var2,{icon:var1,body:var3});
      }
    }else{
      alert("你的浏览器不兼容啊");
    }
}
/*添加授权按钮*/
if(window.webkitNotifications.checkPermission() != 0){
  $("#tweet_error_msg").html('您还没有授权通知:<input type="button" value="点击授权" onclick="Permission();" >').show();
}
function Permission(){
  switch (window.webkitNotifications.checkPermission())
  {
  case 0:
    $("#tweet_error_msg").hide().text("");
    break;
  case 1:
    $("#tweet_error_msg input").val("看上面点允许");
    window.webkitNotifications.requestPermission(function(){
      if(window.webkitNotifications.checkPermission()==0){$("#tweet_error_msg").hide().text("")
      }else{
        $("#tweet_error_msg input").val("点击授权");
      };
    });
    break;
  case 2:
    alert("浏览器被手动设为拒绝!");
    break;
  }
}
/*(╯▔皿▔)╯ 有一大波丧失正在靠近 ㄟ(▔皿▔ㄟ)*/
function notify(e){
    if (window.webkitNotifications) {
        if (window.webkitNotifications.checkPermission() == 0) {
            var popup = window.webkitNotifications.createNotification(e.icon, e.title, e.body);
            console.log(popup);
            popup.onclick = function(){
              if(e.url)window.open(e.url,"_blank");
            }
            popup.ondisplay = function(event) {
                setTimeout(function() {
                    event.currentTarget.cancel();
                }, AUTO_CLOSE_DELAY_SECONDS * 1000);
            }
            if (("show" in popup)){
              popup.show();
            }
        } else {
            window.webkitNotifications.requestPermission();
            return;
        }
    }
}
/*重新声明动弹刷新函数*/
function check_new_log(){
  notifylock =!g_last_id;
  var url = "/widgets/check-top-log?last=" + g_last_id;
  ajax_get(url, function(result){
    var logs = $(result).siblings();
    var log_count = logs.size();
    var first = $(result).first();
    if(log_count == 0 && first!=null && first.length>0)
      log_count = 1;
    if(log_count > 0){
      g_last_id = logs.first().attr('log');
      if(log_count == 5)
        $('.TopTweets').empty();
      else
        $('.TopTweets li').eq(5-1-log_count).nextAll().remove();
      $('.TopTweets').prepend(result);
      /*以下是我添加的*/
      if(!notifylock){
        $result = $(result).filter("li");
        for (var i=0;i<$result.length;i++)
        {
          notify({
            "url":($($result[i]).find(".time a").attr("href")),
            "icon":($($result[i]).find(".portrait img").attr("src")).replace("_50","_100"),
            "title":"OSC - "+$($result[i]).find(".user a").text(),
            "body":$($result[i]).find(".log").text()
          })
        }
      }
      /**/
    }
  });
}
timer(check_new_log,10000)


开源中国-程序员在线工具:Git代码托管 API文档大全(120+) JS在线编辑演示 二维码 更多»

发表评论 回到顶部 网友评论(16)

  • 1楼:万里谁能驯 发表于 2013-12-02 17:53 回复此评论
    火狐没效果
  • 2楼:oxsicn 发表于 2013-12-02 17:59 回复此评论

    引用来自“朱李”的评论

    火狐没效果
    恩 有空解决一下火狐 上班抽空写的
  • 3楼:巴林的狗尾草 发表于 2013-12-02 18:49 回复此评论
    Cool
  • 4楼:oxsicn 发表于 2013-12-02 20:12 回复此评论
    @朱李 @巴林的狗尾草
    已经解决Firefox 兼容问题
  • 5楼:oxsicn 发表于 2013-12-02 20:14 回复此评论
  • 6楼:dreamers 发表于 2013-12-02 20:29 回复此评论
    IE6好像不行。。。
  • 7楼:loyal 发表于 2013-12-02 20:41 回复此评论
  • 8楼:亓斌哥哥 发表于 2013-12-02 20:47 回复此评论
    我的IE5 测试不行
  • 9楼:铂金小白 发表于 2013-12-03 04:59 回复此评论
    IE4 测试不行
  • 10楼:oxsicn 发表于 2013-12-03 08:07 回复此评论
  • 11楼:苏生不惑 发表于 2013-12-03 21:16 回复此评论
    真牛
  • 12楼:伟子啊 发表于 2013-12-05 13:01 回复此评论
    ....现在浏览器都还不是很乐意加入这个通知效果
  • 13楼:oxsicn 发表于 2013-12-05 13:06 回复此评论

    引用来自“伟子啊”的评论

    ....现在浏览器都还不是很乐意加入这个通知效果
    此话怎讲?
  • 14楼:伟子啊 发表于 2013-12-05 13:09 回复此评论

    引用来自“鑫酱”的评论

    引用来自“伟子啊”的评论

    ....现在浏览器都还不是很乐意加入这个通知效果
    此话怎讲?
    这个暂时只有WEBKIT支持了啊,这个还不是HTML5的规范,所以其他浏览器都没准备加入这个接口
  • 15楼:oxsicn 发表于 2013-12-05 13:12 回复此评论

    引用来自“伟子啊”的评论

    引用来自“鑫酱”的评论

    引用来自“伟子啊”的评论

    ....现在浏览器都还不是很乐意加入这个通知效果
    此话怎讲?
    这个暂时只有WEBKIT支持了啊,这个还不是HTML5的规范,所以其他浏览器都没准备加入这个接口
    http://www.w3.org/TR/notifications/ 火狐也有这个接口
  • 16楼:ming300 发表于 2014-02-17 09:22 回复此评论
    chrome32 貌似无法执行
    firefox好用
开源从代码分享开始 分享代码
oxsicn的其它代码 全部(11)...