Mudando tamanho e cor + alteração de cor com direito

Olhando os tópicos no fórum vi uma solução sobre quando apertar o Shift você conseguir mudar a cor para outra, achei bem bacana e também quis implementar o exercício passado nesse, onde apertando o botão direito você muda as cores.

                <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 cores = ["blue", "black", "yellow"]
                var i = 0;
                function desenhaCirculo(evento) {
                    var x = evento.pageX - tela.offsetLeft;
                    var y = evento.pageY - tela.offsetTop;
                    var raio = 10;
                    console.log(x + "," + y);
                    pincel.fillStyle = cores[i];
                   if(evento.shiftKey) {
                    raio = raio + 20;
                    pincel.fillStyle = "red";
                } 
                    pincel.beginPath();
                    pincel.arc(x, y, raio, 0, 2 * 3.14);
                    pincel.fill();      
                }
                tela.onclick = desenhaCirculo;
                function mudarCor() {
                    i++
                    if ( i >= cores.length){
                        i = 0;
                    }
                    return false;
                }
                tela.oncontextmenu = mudarCor;
            </script>

não é uma pergunta apenas um compartilhamento do código para talvez ajudar alguém com duvida :)