cambiar el color del pincel

Esta es mi versión. Lo único es que lo realicé con dobleclick (pantalla.ondblclick).

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

<script>
    var pantalla = document.querySelector('canvas');
    var pincel = pantalla.getContext('2d');
    var colores = ["red", "green", "blue"];
    pincel.fillStyle = 'grey';
    pincel.fillRect(0, 0, 600, 400);


        function dibujarPaletaColores(){        
        var y = 0;
        var i= 0;

        for (var x=0 ; x < 150; x= x+50){           

        pincel.fillStyle = colores[i++];
        pincel.fillRect(x,y,50,50); 
        pincel.strokeStyle = "black";
        pincel.strokeRect(x,y,50,50);
        }
    }
        //funcion que cambia el color del pincel segun la posición de X,Y
        function cambiarColorPincel(evento){
        var color = 'blue';
        var x = evento.pageX - pantalla.offsetLeft;
        var y = evento.pageY - pantalla.offsetTop;

        if (((x >= 0) && (x <=50)) && (y<=51) )             
        {
             deshabilitarDibujar();
          color = pincel.fillStyle = 'red';
          console.log("1");
          return color;
        }
        if (((x >= 51) && (x <=100))  && (y<=51) )             
        {
             deshabilitarDibujar();
            console.log("2"); 
            color = pincel.fillStyle = 'green';
            return color;
        }
        if (((x >= 101) && (x <=150)) && (y<=51))             
        {
             deshabilitarDibujar();
             console.log("3");
           color =  pincel.fillStyle = 'blue';
           return color;
        }
    }
    //dibuja la paleta de colores al inicio
    dibujarPaletaColores()

    var puedoDibujar = false;
    //dibuja cuando no estas sobre la paleta de colores
    //si pasas por ahi se detiene
    function dibujarCirculo(evento) {
        if(puedoDibujar) {
            //recibe el retorno de la funcion cambiarColorPincel
            var colorete = cambiarColorPincel(evento);
            var x = evento.pageX - pantalla.offsetLeft;
            var y = evento.pageY - pantalla.offsetTop;            
            pincel.fillStyle = colorete;
            pincel.beginPath();
            pincel.arc(x, y, 5, 0, 2 * 3.14);
            pincel.fill();
        }
    }
    //cuando se mueve el mouse y el boton
    //esta presionado dibuja.
    pantalla.onmousemove = dibujarCirculo;
    //funcion que habilita el dibujar
    function habilitarDibujar() {
        puedoDibujar = true;
    }
    //funcion que deshabilita el dibujar
    function deshabilitarDibujar() {
        puedoDibujar = false;
    }
    //al dar doble click con el mouse en la paleta de colores
    //cambia el color del pincel
    pantalla.ondblclick = habilitarDibujar;
    //cuando esta presionado el boton del mouse dibuja
    pantalla.onmousedown = habilitarDibujar;
    ////cuando no esta presionado el boton del mouse dibuja
    pantalla.onmouseup = deshabilitarDibujar;

</script>