Criando uma aplicação em segundo plano com Cordova no Intel XDK

As aplicações em segundo plano as vezes são necessárias para notificar o usuários das ações do aplicativo, ou, auxiliar o próprio usuário em alguma tarefa.

O Cordova nativo não possui nenhum plugin para este fim em dispositivos Android, mas existem plugins desenvolvidos por terceiros que complementam o Cordova. Um dos mais simples de se usar pode ser encontrado no GitHub: https://github.com/katzer/cordova-plugin-background-mode

Preparando o projeto

1. Inicie seu projeto no Intel XDK.
2. Adicione o plugin; Vá nas propriedades do projeto, localize o Pugin Management, clique em Add Plugins to this Project.
3. Na janela do Plugin Explorer, clique na opção Third-Party Plugins, selecion Git Repo e informe a URL do plugin que iremos utilizar, veja imagem;
4. Clique em Add Plugin.

Entendo o uso do plugin

Conforme a documentação do plugin disponível no GIT, o uso do plugin é bem simples;

document.addEventListener('deviceready', function () 
{
    cordova.plugins.backgroundMode.enable();
    alert('cordova.plugins.backgroundMode está ativado'); 
}, false);

Dentro das chaves colocaremos o código que desejarmos.

No entanto, este exemplo, embora funcional não é suficiente para atender as aplicações mais comuns que dependem de processos em segundo plano. Normalmente precisamos rodar os códigos dentro de intervalos de tempo. Para trabalhar com intervalos de tempo o JS possui o objeto setInterval bastando acrescentá-lo na função de segundo plano conforme exemplo da própria documentação.

 <script>
    document.addEventListener('deviceready', function () 
    {
      alert('Estou vivo!');
      cordova.plugins.backgroundMode.enable();
      setInterval(function(){ alert("Olá"); }, 3000);
    }, false);
 </script>

Importante: Seu projeto não deve ter o botão Sair.

AutoStart Plugin

Se o aplicativo possui funções para executar em segundo plano, devemos então colocá-lo para iniciar junto com o Android. Adicione o plugin a seguir em sua aplicação: https://github.com/ToniKorin/cordova-plugin-autostart

Para iniciar o plugin, acrescente o seguinte código dentro da  função document.addEventListener(), ficando assim;

<script>
    document.addEventListener('deviceready', function () 
    {
      alert('Estou vivo!');
      cordova.plugins.autoStart.enable(); //inicializa junto com o Android
      cordova.plugins.backgroundMode.enable();
      setInterval(function(){ alert("Olá"); }, 3000); //intervalo de 3 segundos!
    }, false);
</script>

O plugin irá acrescentar seu aplicativo na lista de serviços do Android, exceto nas versões mais antigas ou com dispositivos que possuam aplicativos que bloqueiam o acesso aos serviços do Android.

Problemas conhecidos

1. É muito provável que estes códigos deve-se repetir em todas as suas páginas HTML para que seja realmente eficaz. Recomendo que crie um arquivo .js contendo este código, desta forma você otimiza seu projeto.
2. Se você mudar o projeto de computador, você terá que adicionar os plugins novamente.

Testando o projeto

O teste do projeto só irá ter resultados com a instalação do APK, provavelmente pelo fato dos plugins não serem nativos. Instale o APK no seu dispositivo ou emulador BlueStacks.

Na próxima aula veremos como fazer notificações push usando o serviço de notificações do Google, até lá.