[Proyecto] Cambiar de color con click derecho.

Hola compañeros. Les comparto como hice el código del ejercicio de cambiar el color del circulo dando click derecho. No fue como el que hizo el profesor ya que el del profesor fue mucho más sencillo y el resultado fue el mismo. Me sorprendió como el profesor lo hizo de sencillo comparado con todo lo que hice de código para que funcionara igual. Solamente espero algún día llegar a ese nivel de lógica que me permita siempre tomar el camino más corto para llegar al resultado. Un cordial saludo a todos.

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

<script>

    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");
    pincel.fillStyle = "grey";
    pincel.fillRect(0, 0, 600, 400);

    function dibujarCirculo(evento) {
        var x = evento.pageX - pantalla.offsetLeft;
        var y = evento.pageY - pantalla.offsetTop;

        pincel.fillStyle = color;
        pincel.beginPath();
        pincel.arc(x, y, 10, 0, 2 * 3.14);
        pincel.fill();
        console.log(x + "," + y);
    }

    pantalla.onclick = dibujarCirculo;

    function alterarColor() {

        var colores = ["blue", "red", "green", "black", "yellow", "pink", "white"];

        if (contador < colores.length) {
            color = colores[contador];
            contador++; 
        } else {
            contador = 0;
            color = colores[contador];
            contador++;
        }
        return false;
    }
    var contador = 1;
    var color = "blue";

    pantalla.oncontextmenu = alterarColor;

</script>