-4

Estou desenvolvendo um projeto de um site e estou com dificuldade de criar um "cronômetro".

Preciso que funcione da seguinte maneira:

  • O usuário recarrega o crédito (EX: 4 reais = 2 horas);

  • Os tempos disponíveis são: 1,2,3 horas;

  • Após recarregar, o usuário vai em uma outra página e aperta um botão que faz o contador de tempo começar, contando os segundos subtraindo.

Existem alguns contadores prontos como o Countdown Timer, porém ele só funciona colocando uma data futura (EX: Nov 5, 2017 15:37:25) o que não me atende, já que preciso de valores fixos.

4
  • Não é só pegar a data/hora_atual + x e usar como data futura? x é o número de horas que você precisa acrescentar à hora atual. 30/10/2017 às 16:51
  • @luigi-azevedo em perguntas futuras, vou sugerir que faça melhor uso de acentuação e pontuação e que faça perguntas com a sua dúvida de forma bem clara, incluindo informações pertinentes (ex: código). Não é o objetivo do site fornecer soluções prontas ou fazer um trabalho para você e sim tirar dúvidas conceituais e ajudar em seções problemáticas de um código dado (você é o programador!). E não se esqueça de sempre verificar por perguntas repetidas - sua dúvida pode ter sido a de outro. Fazendo isso, você ajuda a contribuir com a comunidade e evita de receber negativações em suas perguntas.
    – José
    30/10/2017 às 17:30
  • @José Está foi minha primeira participação no site e acredito que minha pergunta se enquadra no site de acordo com o StackOverflow(Specific programming problems). Eu não pedi que fizessem o meu trabalho, afinal eu já fiz todo site, porém estou com dificuldade nesta parte especifica. Sobre incluir o código na pergunta, isso não é possível, pois o que eu tenho é um Countdown genérico, que não acrescentaria a questão. 31/10/2017 às 0:59
  • @LuigiAzevedo o aviso foi por que sua pergunta, por ser a primeira que faz, entra automaticamente em análise de usuários mais antigos. É de praxe dar o aviso ao verificar tudo OK. Então não é por que ela não se encaixa exatamente no site, certo? Mas como não estava muito bem estruturada e a pergunta não estava explicitamente clara, alguns usuários negativaram, chamando a atenção da moderação. Assim, o Victor editou sua pergunta para ficar mais nos padrões para que sirva aos resultados de busca e ajude outros usuários e visitantes. De qualquer modo, bem vindo e pergunte mesmo!
    – José
    31/10/2017 às 2:47

2 Respostas 2

1

Acredito que o EasyTimer.js vai te atender. Ele é simplesmente um cronômetro que pode trabalhar decrementando ou incrementando. Também funciona com disparo de eventos.

A licença é MIT, o que é favorável. E conta com diversos exemplos na própria página. Não é difícil usar.

Exemplo para uso de contagem regressiva:

JavaScript:

var timer = new Timer();

timer.start({countdown: true, startValues: {seconds: 30}});
$('#countdownExample .values').html(timer.getTimeValues().toString());

timer.addEventListener('secondsUpdated', function (e) {
    $('#countdownExample .values').html(timer.getTimeValues().toString()); 
});

timer.addEventListener('targetAchieved', function (e) {
    $('#countdownExample .values').html('FIM!'); 
});

HTML:

<div id="countdownExample">
    <div class="values"></div>
</div>

Veja mais detalhes na página do EasyTimer.js no GitHub.Há mais exemplos de uso.

2
  • 1
    Muito obrigado! Vou tentar sua sugestão. 31/10/2017 às 0:53
  • @LuigiAzevedo se solucionar seu problema, peço que marque a resposta como aceita! Assim quem tiver o mesmo problema passa a ter uma referência - bem como ganho pontos para serem usados no site.
    – José
    31/10/2017 às 2:42
1

Acho que sua pergunta está um pouco vaga pois não deixa claro como você quer controlar isso, se apenas em lado cliente ou se por exemplo estará salvando em algum banco.

Mas você pode salvar a data do start no banco, bem como o tempo que ele comprou em créditos. Por experiência própria eu acho essa solução deselegante, prefiro que você faça todos os cálculos antes e guarde no banco por exemplo um ID da sessão ou o ID do usuário, e a hora limite de liberação.

Exemplificando:

Hora do clique no botão: 30/10/2017 14:58:00

O seu usuário comprou 4 reais = 2 horas.

Você salvará no banco que o usuário em questão está liberado para acessar o sistema:

Até 30/10/2017 16:58:00.

Na hora de renderizar qualquer coisa você apenas confere se a data atual da requisição é <= a data de liberação.

Espero ter ajudado.

0

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .