首页 > 其他 > 详细

播放提示音+页面右下角提示框

时间:2019-04-29 17:44:03      阅读:126      评论:0      收藏:0      [点我收藏+]
<script>
window.onload = function() {
    suportNotify()
}
// 判断浏览器是否支持Web Notifications API
function suportNotify() {
    if (window.Notification) {
        // 支持
        console.log("支持" + "Web Notifications API");
        // 如果支持Web Notifications API,再判断浏览器是否支持弹出实例
        //showMess()
    } else {
        // 不支持
        alert("不支持 Web Notifications API");
    }
}

// 判断浏览器是否支持弹出实例
function showMess(messAge,priority) {
    var imagePath;
    if(priority<=2){//警告
        imagePath="${ctx}/pages/resourceperformance/images/blue.png";
    }else if(priority>2&&priority<=4){//严重
        imagePath="${ctx}/pages/resourceperformance/images/blue2.png";
    }else{//灾难
        imagePath="${ctx}/pages/resourceperformance/images/red.png";
    }
    
    // 如果支持window.Notification 并且 许可不是拒绝状态
    if (window.Notification && Notification.permission !== "denied") {
        // Notification.requestPermission这是一个静态方法,作用就是让浏览器出现是否允许通知的提示
        Notification.requestPermission(function(status) {
            // 如果状态是同意
            if (status === "granted") {
                var m = new Notification(收到告警信息, {
                    body : messAge,
                    icon:imagePath
                });
                m.onclick = function() {// 点击当前消息提示框后,跳转到当前页面
                    alert("原则上应该跳到告警页");
                }
            } else {
                alert(当前浏览器不支持弹出消息)
            }
        });
    }
}

function playAudio(priority){
    if(priority<=2){//警告
        $("#playMusic").append("<audio  autoplay=‘autoplay‘  src=‘${ctx}/common/audio/8378.wav‘ type=‘audio/wav‘></audio>");
    }else if(priority>2&&priority<=4){//严重
        $("#playMusic").append("<audio  autoplay=‘autoplay‘  src=‘${ctx}/common/audio/6178.wav‘ type=‘audio/wav‘></audio>");
    }else{//灾难
        $("#playMusic").append("<audio autoplay=‘autoplay‘  src=‘${ctx}/common/audio/5906.wav‘ type=‘audio/wav‘></audio>");
    }
}
$(function(){
    flushAlert();
    setInterval("flushAlert()",30000);
    setInterval("cleanAudio()",70000);
})

function cleanAudio(){
    $("#playMusic").empty();//清空声音标签
}
function flushAlert(){
    $.post("${ctx}/alarm/getAlert.do",function(date){
        for (var k = 0; k < date.length; k++) {
            console.info(date[k]);
            var messInfo="是否知悉";
            messInfo+=date[k].acknowledged;
            messInfo+="\n告警状态:\t"+date[k].alarmStatus;
            messInfo+="\n告警信息:\t"+date[k].description;
            messInfo+="\n最后触发时间:\t"+date[k].eventClock;
            messInfo+="\n所在群组:\t"+date[k].groupsName;
            messInfo+="\n主机名称:\t"+date[k].hostName;
            messInfo+="\n主机IP:\t"+date[k].hostip;
            messInfo+="\n最后修改:\t"+date[k].lastchange;
            messInfo+="\n告警级别:\t"+date[k].priority;
            messInfo+="\n告警级别:\t"+date[k].priority;
            showMess(messInfo,date[k].priority);
            playAudio(date[k].priority);
        }
        $("audio").each(function(i,music){//防止浏览器屏蔽播放
            console.info(music);
             if (music.paused) { //判读是否播放 
                 //console.log(music.paused);
                 music.paused=false;
                 music.play(); //没有就播放 
             }  
        });
    });
}
</script>
<%
    UserSession userSession = (UserSession)session.getAttribute(AppConst.USER_SESSION_ID);
    if(userSession == null){
        userSession = new UserSession();
    }
%>
<div id="playMusic"></div>

 

<script>window.onload = function() {suportNotify()}// 判断浏览器是否支持Web Notifications APIfunction suportNotify() {if (window.Notification) {// 支持console.log("支持" + "Web Notifications API");// 如果支持Web Notifications API,再判断浏览器是否支持弹出实例//showMess()} else {// 不支持alert("不支持 Web Notifications API");}}
// 判断浏览器是否支持弹出实例function showMess(messAge,priority) {var imagePath;if(priority<=2){//警告imagePath="${ctx}/pages/resourceperformance/images/blue.png";}else if(priority>2&&priority<=4){//严重imagePath="${ctx}/pages/resourceperformance/images/blue2.png";}else{//灾难imagePath="${ctx}/pages/resourceperformance/images/red.png";}// 如果支持window.Notification 并且 许可不是拒绝状态if (window.Notification && Notification.permission !== "denied") {// Notification.requestPermission这是一个静态方法,作用就是让浏览器出现是否允许通知的提示Notification.requestPermission(function(status) {// 如果状态是同意if (status === "granted") {var m = new Notification(‘收到告警信息‘, {body : messAge,icon:imagePath});m.onclick = function() {// 点击当前消息提示框后,跳转到当前页面alert("原则上应该跳到告警页");}} else {alert(‘当前浏览器不支持弹出消息‘)}});}}
function playAudio(priority){if(priority<=2){//警告$("#playMusic").append("<audio  autoplay=‘autoplay‘  src=‘${ctx}/common/audio/8378.wav‘ type=‘audio/wav‘></audio>");}else if(priority>2&&priority<=4){//严重$("#playMusic").append("<audio  autoplay=‘autoplay‘  src=‘${ctx}/common/audio/6178.wav‘ type=‘audio/wav‘></audio>");}else{//灾难$("#playMusic").append("<audio autoplay=‘autoplay‘  src=‘${ctx}/common/audio/5906.wav‘ type=‘audio/wav‘></audio>");}}$(function(){flushAlert();setInterval("flushAlert()",30000);setInterval("cleanAudio()",70000);})
function cleanAudio(){$("#playMusic").empty();//清空声音标签}function flushAlert(){$.post("${ctx}/alarm/getAlert.do",function(date){for (var k = 0; k < date.length; k++) {console.info(date[k]);var messInfo="是否知悉";messInfo+=date[k].acknowledged;messInfo+="\n告警状态:\t"+date[k].alarmStatus;messInfo+="\n告警信息:\t"+date[k].description;messInfo+="\n最后触发时间:\t"+date[k].eventClock;messInfo+="\n所在群组:\t"+date[k].groupsName;messInfo+="\n主机名称:\t"+date[k].hostName;messInfo+="\n主机IP:\t"+date[k].hostip;messInfo+="\n最后修改:\t"+date[k].lastchange;messInfo+="\n告警级别:\t"+date[k].priority;messInfo+="\n告警级别:\t"+date[k].priority;showMess(messInfo,date[k].priority);playAudio(date[k].priority);}$("audio").each(function(i,music){//防止浏览器屏蔽播放console.info(music); if (music.paused) { //判读是否播放  //console.log(music.paused);             music.paused=false;             music.play(); //没有就播放          }  });});}</script><%UserSession userSession = (UserSession)session.getAttribute(AppConst.USER_SESSION_ID);if(userSession == null){userSession = new UserSession();}%><div id="playMusic"></div>

播放提示音+页面右下角提示框

原文:https://www.cnblogs.com/zhanchaohan/p/10791364.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!