[Bug] Voz não funciona corretamente

Olá, Morrison!

Pelo que você descreveu, parece que há uma inconsistência na execução da função de síntese de voz no seu jogo. Isso pode ser causado por vários fatores, como problemas de carregamento do script, condições de corrida (quando múltiplas partes do código estão tentando executar ao mesmo tempo e o resultado depende da ordem em que são concluídas), ou até mesmo limitações do navegador ou do dispositivo.

A mensagem de aviso que você viu no console indica que a função speechSynthesis.speak() foi usada sem a ativação do usuário, o que não é mais suportado. Isso significa que você precisa garantir que a síntese de voz seja acionada por uma ação do usuário, como um clique em um botão, para evitar que o navegador bloqueie a reprodução do som.

Aqui estão algumas sugestões para tentar resolver o problema:

1. Certifique-se de que a função de síntese de voz seja chamada em resposta a uma ação do usuário. Por exemplo, você pode ter um botão que, quando clicado, inicia o jogo e também a síntese de voz.

2. Verifique se o código que inicia a síntese de voz não está sendo bloqueado por condições de corrida. Se você estiver usando promessas ou funções assíncronas, certifique-se de que elas estejam sendo resolvidas corretamente antes de chamar a síntese de voz.

3. Teste o seu jogo em diferentes navegadores e dispositivos para ver se o problema persiste. Isso pode ajudar a identificar se é um problema específico de um navegador ou plataforma.

4. Revise o código para garantir que não há múltiplas chamadas à função de síntese de voz que possam estar interferindo umas com as outras.

Espero que essas sugestões ajudem a resolver o problema com a voz no seu jogo. Se precisar de mais assistência, não hesite em mandar aqui no fórum. Espero ter ajudado e bons estudos!

Em relação a isso, prefiro manter do jeito que ensinaram nos vídeos, que no caso seria para clicar no botão "Allow" para a ativação da voz

Em relação a isso aqui, verifiquei e me parece estar tudo certo.

Testei em todos os navegadores e em 3 celulares diferentes e o problema da voz continua.

Revisei o código e não percebi nenhuma múltipla chamada à função de síntese de voz.

Você poderia analisar todo o código, por favor?

app.js:

let listaDeNumerosSorteados = []; let numeroLimite = 50; let numeroSecreto = gerarNumeroAleatorio(); let tentativas = 1;

function exibirTextoNaTela(tag, texto) { let campo = document.querySelector(tag); campo.innerHTML = texto; responsiveVoice.speak(texto, 'Brazilian Portuguese Female', {rate:1.2}); }

function exibirMensagemInicial() { exibirTextoNaTela('h1', 'Jogo do número secreto'); exibirTextoNaTela('p', 'Escolha um número entre 1 e 50'); }

exibirMensagemInicial();

function verificarChute() { let chute = document.querySelector('input').value;

if (chute == numeroSecreto) { 
    exibirTextoNaTela('h1', 'Acertou!');
    let palavraTentativa = tentativas > 1 ? 'tentativas' : 'tentativa';
    let mensagemTentativas = `Você descobriu o número secreto com ${tentativas} ${palavraTentativa}!`;
    exibirTextoNaTela('p', mensagemTentativas);
    document.getElementById('reiniciar').removeAttribute('disabled');
} else {
    if (chute > numeroSecreto) {
        exibirTextoNaTela('p', 'O número secreto é menor');
    } else {
        exibirTextoNaTela('p', 'O número secreto é maior');
    }
    tentativas++;
    limparCampo();
}

}

function gerarNumeroAleatorio() { let numeroEscolhido = parseInt(Math.random() * numeroLimite + 1); let quantidadeDeElementosNaLista = listaDeNumerosSorteados.length;

if (quantidadeDeElementosNaLista == numeroLimite) {
    listaDeNumerosSorteados = [];
}
if (listaDeNumerosSorteados.includes(numeroEscolhido)) {
    return gerarNumeroAleatorio();
} else {
    listaDeNumerosSorteados.push(numeroEscolhido);
    console.log(listaDeNumerosSorteados)
    return numeroEscolhido;
}

}

function limparCampo() { chute = document.querySelector('input'); chute.value = ''; }

function reiniciarJogo() { numeroSecreto = gerarNumeroAleatorio(); limparCampo(); tentativas = 1; exibirMensagemInicial(); document.getElementById('reiniciar').setAttribute('disabled', true) }

index.html:

<div class="container">
    <div class="container__conteudo">
        <div class="container__informacoes">
            <div class="container__texto">
                <h1>Adivinhe o <span class="container__texto-azul">numero secreto</span></h1>
                <p class="texto__paragrafo">Escolha um número entre 1 a 50</p>
            </div>
            <input type="number" min="1" max="10" class="container__input">
            <div class="chute container__botoes">
                <button onclick="verificarChute()" class="container__botao">Chutar</button>
                <button onclick="reiniciarJogo()" id="reiniciar" class="container__botao" disabled>Novo jogo</button>
            </div>
        </div>
        <img src="./img/ia.png" alt="Uma pessoa olhando para a esquerda" class="container__imagem-pessoa" />
    </div>
</div>




<script src="app.js" defer></script>