Faça a janela do navegador piscar na barra de tarefas

Como faço o navegador de um usuário piscar / piscar / realçar 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 imediatamente, mesmo que esteja usando outro aplicativo no momento.

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

isso não fará com que o botão da barra de tarefas pisque mudando de cor, mas o título piscará e desligará até que movam o mouse. Isso deve funcionar em várias plataformas, e mesmo que eles apenas o tenham 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;
        }
    };
}());

Atualização : você pode querer olhar usando notificações HTML5 .

Eu fiz um plugin jQuery com o propósito 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 piscar deve parar quando a janela / guia fica em foco, 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 olhar para o código-fonte (existem alguns bugs peculiares e casos extremos que você precisa contornar ao fazer o título piscando, se quiser oferecer suporte total a todos os principais navegadores).

Minha resposta da "interface do usuário" é: Tem certeza de que seus usuários querem que seus navegadores pisquem ou você acha que é 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 você tiver certeza de que deseja fazer isso dessa forma, use uma caixa de alerta javascript. É isso que o Google Agenda faz para lembretes de eventos, e provavelmente eles pensaram muito nisso.

Uma página da web realmente não é o melhor meio para alertas de necessidade de saber. Se você estiver projetando algo parecido com "ZOMG, os servidores estão fora do ar!" alertas, e-mails automatizados ou mensagens SMS para as pessoas certas podem resolver o problema.

Supostamente, você pode fazer isso no Windows com o rosnado para a API Javascript do 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 de NotificationAPI:

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

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

                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 

A única maneira de pensar em fazer isso é fazer algo como alertar ('você tem uma nova mensagem') quando a mensagem for recebida. Isso fará a barra de tarefas piscar 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 que o GMail usa e mostrar o número de mensagens no título da página?

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

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

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

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 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 uma nova mensagem chega.

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 adiciona um ícone de notificação e pode fazer pop-ups sofisticados ou em balão ou o que quer que seja, quando receber novas mensagens.

Isso não é muito difícil e tenho certeza que se você perguntar ASSIM 'como faço para mostrar um ícone da bandeja' e 'como faço para fazer notificações pop-up', você receberá algumas respostas excelentes :-)

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

function blinkTab() {
        const browserTitle = document.title;
        let timeoutId;
        let message = 'My New Title';

        const stopBlinking = () => {
            document.title = browserTitle;
            clearInterval(timeoutId);
        };

        const startBlinking = () => {
            document.title = document.title  === message ? browserTitle : message;
        };

        function registerEvents() {
            window.addEventListener("focus", function(event) { 
                stopBlinking();
            });

            window.addEventListener("blur", function(event) {
                const timeoutId = setInterval(startBlinking, 500);
            });
        };

        registerEvents();
    };


    blinkTab();