1
resposta

Jogo do alvo - Aula 05 - Alert não funciona

Há algum erro na minha função dispara, mas não consigo encontrar o que é. Depois de muito tempo tentando, desisti do meu próprio código e copiei o código que estava na transcrição da aula e não resolveu. Meu alert não aparece por nada nesse mundo.

P.S.: Meu código está um pouco diferente do código do professor pois tento sempre fazer o meu mesmo ao invés de copiar da transcrição.

<meta charset = "UTF-8">

<canvas width = 600, height = 400></canvas>

<script>

    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2d');
    var raio = 10;
    var xAleatorio;
    var yAleatorio;


    function desenhaAlvo(x, y){

        pincel.fillStyle = 'red';
        pincel.beginPath();
        pincel.arc(x, y, raio + 20, 0, 2 * Math.PI);
        pincel.fill();

        pincel.fillStyle = 'white';
        pincel.beginPath();
        pincel.arc(x, y, raio + 10, 0, 2 * Math.PI);
        pincel.fill();

        pincel.fillStyle = 'red';
        pincel.beginPath();
        pincel.arc(x, y, raio, 0, 2 * Math.PI);
        pincel.fill();

    }

    function limpaTela(){

        pincel.clearRect(0, 0, 600, 400);

    }

    function sorteiaPosicao(maximo){

        return Math.floor(Math.random() * maximo);

    }

    function atualizaTela(){
        limpaTela();
        var xAleatorio = sorteiaPosicao(570);
        var yAleatorio = sorteiaPosicao(370);
        desenhaAlvo(xAleatorio, yAleatorio);
    }

    setInterval(atualizaTela, 4000);

    function dispara(evento) {

        var x = evento.pageX - tela.offsetLeft;
        var y = evento.pageY - tela.offsetTop;

        if((x > xAleatorio - raio)
            && (x < xAleatorio + raio)
            && (y > yAleatorio - raio)
            && (y < yAleatorio + raio)) {

            alert('Acertou, miserávi!');
        }

    }

    tela.onclick = dispara;

</script>
1 resposta

Olá! Tudo bem?

Eu acredito que isso está acontecendo, porque dentro da função atualizaTela, você declarou xAleatorio e yAleatório então essas variáveis estão como locais, e a função dispara não consegue acessá-las, como você já havia declarado x e y aleatório lá no começo, basta tirar o 'var' de dentro da função atualizaTela, assim, as variáveis globais recebem as coordenadas e serão as mesmas que a função dispara vai comparar.

Espero ter ajudado. Fico à disposição :)