Eu estou seguindo os exercícios do curso com o mesmo programa, tentando fazer um paint mesmo. Ou seja, eu quero que ele só desenhe quando o mouse estiver pressionado (que é o que o exercício pede), quero poder mudar de cor com o botão direito e mudar o raio com ctrl e shift. Antes desse exercício tudo funcionava normalmente, agora o que eu não consegui foi implementar isso de só desenhar quando o botão do mouse estiver pressionado. Eu comparei o meu com o código do instrutor e com relação á parte do exercício parece estar tudo exatamente igual, só que depois que eu coloquei a parte do desenha ou naoDesenha ,mouseup e mousedown, ele simplesmente parou de funcionar de forma que não dá para desenhar mais nada, com botão pressionado ou sem. Eu queria saber como fazer esse código funcionar com todas essas funções (mudar cor, tamanho e só desenhar enquanto eu clicar).

<canvas id="tela" width="1500" height="750"></canvas>

<script>

    var tela = document.querySelector("#tela");
    var pincel = tela.getContext("2d");

    pincel.fillStyle = "gray";
    pincel.fillRect(0, 0, 1500, 750);

    var cores = ["blue","red","yellow"];
    var indiceCorAtual = 0;
    var raio = 5;
    var incremento = 5;
    var desenha = false;

    function desenhaCirculo(evento) {
        if (desenha) {
            var x = evento.pageX - tela.offsetLeft;
            var y = evento.pageY - tela.offsetTop;
            pincel.fillStyle = cores[indiceCorAtual];
            if (evento.shiftKey && raio <= 30) {
                raio = raio + incremento;
            } else if (evento.ctrlKey && raio >5) {
                raio = raio - incremento;
            }
            pincel.beginPath();
            pincel.arc(x, y, raio, 0, 2*Math.PI);
            pincel.fill();
        }
        console.log(x + ", " + y);
    }

    tela.onmousemove = desenhaCirculo;

    function mudaCor() {
        indiceCorAtual++;
        if(indiceCorAtual >= cores.length) {
            indiceCorAtual = 0;
        }
        return false;
       }

    function desenha() {
        desenha = true;
    }
    function naoDesenha() {
        desenha = false;
    }

       tela.oncontextmenu = mudaCor;
    tela.onmousedown = desenha;
    tela.onmouseup = naoDesenha;

</script>