Pergunta

Como faço para que o navegador de um usuário pisque/pisque/destaque na barra de tarefas usando JavaScript?Por exemplo, se eu fizer uma solicitação AJAX a cada 10 segundos para ver se o usuário tem alguma mensagem nova no servidor, quero que o usuário saiba disso imediatamente, mesmo que esteja usando outra aplicação no momento.

Editar:Esses usuários querem se distrair quando chega uma nova mensagem.

Foi útil?

Solução

isso não fará com que o botão da barra de tarefas pisque em cores variáveis, mas o título piscará até que o mouse seja movido.Isso deve funcionar em várias plataformas, mesmo que eles estejam em uma guia diferente.

newExcitingAlerts = (function () {
    var oldTitle = document.title;
    var msg = "New!";
    var timeoutId;
    var blink = function() { document.title = document.title == msg ? ' ' : msg; };
    var clear = function() {
        clearInterval(timeoutId);
        document.title = oldTitle;
        window.onmousemove = null;
        timeoutId = null;
    };
    return function () {
        if (!timeoutId) {
            timeoutId = setInterval(blink, 1000);
            window.onmousemove = clear;
        }
    };
}());

Atualizar:Você pode querer usar Notificações HTML5.

Outras dicas

Eu fiz um Plug-in jQuery com a finalidade de piscar mensagens de notificação na barra de título do navegador.Você pode especificar diferentes opções, como intervalo de intermitência, duração, se o intermitência deve parar quando a janela/guia for focada, etc.O plugin funciona no Firefox, Chrome, Safari, IE6, IE7 e IE8.

Aqui está um exemplo de como usá-lo:

$.titleAlert("New mail!", {
    requireBlur:true,
    stopOnFocus:true,
    interval:600
});

Se você não estiver usando jQuery, você ainda pode querer dar uma olhada no Código fonte (existem alguns bugs peculiares e casos extremos que você precisa solucionar ao piscar o título se quiser oferecer suporte total a todos os principais navegadores).

Supostamente você pode fazer isso no Windows com a API javascript growl for windows:

http://ajaxian.com/archives/growls-for-windows-and-a-web-notification-api

Seus usuários terão que instalar o growl.

Eventualmente, isso fará parte do Google Gears, na forma da NotificationAPI:

http://code.google.com/p/gears/wiki/NotificationAPI

Portanto, eu recomendaria usar a abordagem de rosnado por enquanto, recorrendo às atualizações do título da janela, se possível, e já planejando tentativas de usar a API de notificação do Gears, para quando ela eventualmente estiver disponível.

Minha resposta da "interface do usuário" é:Tem certeza seus usuários querem que seus navegadores pisquem ou fazem você pensa é isso que eles querem?Se fosse eu quem usasse o seu software, sei que ficaria chateado se esses alertas acontecessem com muita frequência e atrapalhassem meu caminho.

Se tiver certeza de que deseja fazer desta forma, use uma caixa de alerta javascript.Isso é o que o Google Agenda faz com os lembretes de eventos, e eles provavelmente pensaram um pouco nisso.

Uma página da web realmente não é o melhor meio para alertas de necessidade de conhecimento.Se você está projetando algo parecido com "Zomg, os servidores estão baixos!" Alertas, e-mails automatizados ou mensagens SMS para as pessoas certas podem fazer o truque.

A única maneira que consigo pensar em fazer isso é algo como alert('you have a new message') quando a mensagem for recebida.Isso fará com que a barra de tarefas pisque se a janela estiver minimizada, mas também abrirá uma caixa de diálogo, o que você pode não querer.

Por que não adotar a abordagem usada pelo GMail e mostrar o número de mensagens no título da página?

Às vezes, os usuários não querem se distrair quando chega uma nova mensagem.

                var oldTitle = document.title;
                var msg = "New Popup!";
                var timeoutId = false;

                var blink = function() {
                    document.title = document.title == msg ? oldTitle : msg;//Modify Title in case a popup

                    if(document.hasFocus())//Stop blinking and restore the Application Title
                    {
                        document.title = oldTitle;
                        clearInterval(timeoutId);
                    }                       
                };

                if (!timeoutId) {
                    timeoutId = setInterval(blink, 500);//Initiate the Blink Call
                };//Blink logic 

Você pode tentar window.focus() - mas pode ser irritante se a tela mudar

você pode alterar o título da página da web a cada nova mensagem para alertar o usuário.Fiz isso para um cliente de bate-papo do navegador e a maioria dos usuários achou que funcionou bem.

document.title = "[user] hello world";

AFAIK, não há uma boa maneira de fazer isso com consistência.Eu estava escrevendo um cliente de mensagens instantâneas baseado na Web apenas para o IE.Acabamos usando window.focus(), que funciona na maioria das vezes.Às vezes, isso fará com que a janela roube o foco do aplicativo em primeiro plano, o que pode ser muito irritante.

Esses usuários querem se distrair quando chega uma nova mensagem.

Parece que você está escrevendo um aplicativo para um projeto interno da empresa.

Você pode querer investigar a criação de um pequeno aplicativo do Windows em .net que adicione um ícone de notificação e possa fazer pop-ups sofisticados ou pop-ups de balão ou qualquer outra coisa, quando receberem novas mensagens.

Isso não é muito difícil e tenho certeza que se você perguntar 'como faço para mostrar um ícone na bandeja' e 'como faço para exibir notificações pop-up', você obterá ótimas respostas :-)

Para constar, tenho certeza de que (além de usar uma caixa de diálogo de alerta/prompt) você não pode atualizar a barra de tarefas em JS, pois isso é muito específico do Windows e JS realmente não funciona assim.Você pode usar alguns controles ActiveX do Windows específicos do IE, mas então você inflige o IE aos seus usuários pobres.Não faça isso :-(

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top