Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Função reinicia jogo retorna -1 no tempo de jogo

Quando clicko no botão para reiniciar o jogo ele retorna o valor 5 a string, até ai tudo bem, porém , quando click no campo de novo ele não conta regressivamente, pula direto para -1 e bloqueia meu campo.

Obs: Organizo meu código de maneira diferente dos exercicios.

//variáveis globais
var qtdPalavras = $("#quantidade-palavras");
var tempoRestante = $("#tempo-digitacao").text();
var frase = $(".frase");
var campoDigitacao = $(".campo-digitacao");
var caractersDigitados = $("#caracteres-digitados");
var palavrasDigitadas = $("#palavras-digitadas");
var btnReiniciar = $("#btn-reiniciar");
var tempoInicial = $("#tempo-digitacao").text();

//Fim

$(function(){
    informacoesDaFrase();
    inicializaContadores();
    tempoDeJogo();
    $("#btn-reiniciar").click(reiniciaJogo);
});


function informacoesDaFrase() {
    frase = frase.text();
    var palavrasDaFrase = frase.split(" ");
    qtdPalavras.text(palavrasDaFrase.length);
}

function tempoDeJogo() {

    campoDigitacao.one("focus", function() {
        var cronometroID = setInterval(function() {
            tempoRestante--;
            $("#tempo-digitacao").text(tempoRestante);

            if(tempoRestante < 1){
                clearInterval(cronometroID);
                campoDigitacao.attr("disabled", true);
            }
        }, 1000);
    });
}

function inicializaContadores(){
    campoDigitacao.on("input", function() {
        var conteudo = campoDigitacao.val();
        var qtdPalavras = conteudo.split(/\S+/).length -1;
        palavrasDigitadas.text(qtdPalavras);
        caractersDigitados.text(conteudo.length);
    });
}

function reiniciaJogo() {

        campoDigitacao.attr("disabled", false);
        campoDigitacao.val("");
        caractersDigitados.text("0");
        palavrasDigitadas.text("0");
        $("#tempo-digitacao").text(tempoInicial);
        tempoDeJogo();
}
<main>
        <section>
            <!--Frase para digitar -->
            <p class="frase">Joãozinho gosta muito de passear, joãozinho passeia todo dia de manha, maria lhe acompanha pois gosta de passear</p>

             <ul class="informacoes">
                <li><span id="quantidade-palavras">0</span> palavras</li>
                <li><span id="tempo-digitacao">5</span> segundos</li>
            </ul>

            <!--Campo de Digitação-->
            <textarea class="campo-digitacao" rows="8" cols="40"></textarea>

            <button id="btn-reiniciar">Reinicie o jogo</button>

            <ul>
                <li><span id="caracteres-digitados">0</span> caracteres</li>
                <li><span id="palavras-digitadas">0</span> palavras</li>
            </ul>
        </section>
    </main>
    <script src="js/jquery.js" ></script>
    <script src="js/main.js" ></script>
1 resposta
solução!

Olá Leonardo,

Eu consegui resolver o problema adicionando a instrução

tempoRestante = 5;

na reiniciaJogo

function reiniciaJogo() {

        campoDigitacao.attr("disabled", false);
        campoDigitacao.val("");
        caractersDigitados.text("0");
        palavrasDigitadas.text("0");
        $("#tempo-digitacao").text(tempoInicial);
        tempoDeJogo();
        tempoRestante = 5;
}

Só dá uma conferida se não ficou alguma instrução desse tipo no código, talvez não é a melhor solução essa que eu fiz, mas pode ser que ela te dê uma dica do que está faltando.

Espero ter ajudado.