Deixo de pressionar o mouse e ele continua desenhando.

Pessoal, eu não consigo entender o porquê do meu programa não parar de desenhar quando eu deixo de pressionar o botão do mouse. Podem dar uma olhada para mim por favor?

<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 cor=["blue", "red", "green"];
    var corAtual=0
    var r =10
    var desenha= false

    function desenhaCirculo(evento) {

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

        //Click com o shift
        if(evento.shiftKey && r<40){
            r= r+10
        }
        if(evento.altKey&& r>10){
            r=r-5
        }

        //Click e cor do click
        if(desenha)
        pincel.fillStyle =cor[corAtual];
        pincel.beginPath();
        pincel.arc(x, y, r, 0, 2 * 3.14);
        pincel.fill();
        console.log(x + ',' + y);
    }

    //Mudança de cor do click
    function mudarCor() {

        if (corAtual==2){

            corAtual= 0

            return corAtual;
        }
        else
        corAtual++
    }
    //habilitar o desenhar
    function desenhar() {
        desenha= true
        return desenha
    }
    //desabilitar o desenhar
    function pararDesenhar() {
        desenha= false
        return desenha
    }

    //Chamamento das funções

    tela.onmousemove = desenhaCirculo;
    tela.onmousedown= desenhar;
    tela.onmouseup= pararDesenhar; 
    tela.oncontextmenu = mudarCor;

</script>