Disciplina

Olá Bruno, tudo por aí ?

Gostaria de pedir desculpas pela demora em obter um retorno!

Sobre seu código, ele está muito bom, contudo ele possui alguns erros que o impedem de funcionar da forma que o exercício pede, sendo eles:

• O primeiro é bem sutil sendo o parâmetro desenha = true logo no começo, com ele o jogo já começa desenhando, portanto ele deve começar como desenha = false;

• O outro é que as function´s não possuem nome:

function()  {
    desenha = true
}

• Os comandos de controle da leitura de ações do mouse também estão atribuídas diretamente antes do inicio das function´s:

tela.onmousemove = function(evento)

tela.onmousedown = function()

tela.onmouseup = function()

• Também existe um erro bem pequeno em seu código, ele é quase imperceptível, mas que gera um erro enorme no funcionamento, que é a presença de um ponto e vírgula (;), após o if(desenha) que deveria estar dentro da function denhaCirculo():

if(desenha); {

• Outro erro que percebi também é que tem duas function´s inseridas uma dentro da outra, dessa forma:

function()  {
  desenha = true

  function()  {
     desenha = true
     }
    }

• OBS: Na frente delas também tinha os parâmetros tela.onmousedown e tela.onmouseup, dessa forma:

tela.onmousedown = function()  {
   desenha = true
tela.onmouseup = function()  {
   desenha = true
}
}

E isso estava contribuindo para o erro!

• E por fim o ultimo erro é que as duas function´s mencionadas acima estavam gerando o parâmetro desenha = true, quando uma deveria estar gerando desenha = true, e a outra desenha = false dessa forma:

function()  {
  desenha = true

}
function()  {
  desenha = false
}

Agora vou postar abaixo o código completo corrigido e sem erros pronto para uso:

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

<script>
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');

pincel.fillStyle = 'grey';
pincel.fillRect(0, 0, 600, 400);

var desenha = false;

function desenhaCirculo(evento)  {

    if(desenha)  {

    var x = evento.pageX - tela.offsetLeft;
    var y = evento.pageY - tela.offsetTop;
    pincel.fillStyle = 'blue';
    pincel.beginPath();
    pincel.arc(x, y, 10, 0, 2 * 3.14);
    pincel.fill();

    }

}

tela.onmousemove = desenhaCirculo;

function habilitarDesenhar()  {
     desenha = true
 }

function desabilitarDesenhar()  {
     desenha = false
 }

tela.onmousedown = habilitarDesenhar;
tela.onmouseup = desabilitarDesenhar;

</script>

• A construção desse código está na seção “ver opinião do instrutor” dessa aula aqui: Desenhando com o mouse

No geral era isso, caso tenha dúvidas sobre algum desses erros e o porque deles gerar um erro é só perguntar, estarei totalmente disposto á explicar!

Continue de dedicando aos estudos pois assim você vai muito mais longe, pois você tem MUITO potencial para crescer!

Estou ansioso para ver o seu desenvolvimento ;)

Um grande abraço e bons estudos!