[Proyecto] Cambiando de color

cambiando entre tres colores o uno aleatorio (yo y mi creatividad loca)

    <canvas width="600" height="600" ></canvas>
    <script type="text/javascript">
        var pantalla = document.querySelector ("canvas");
        var pincel = pantalla.getContext("2d");
        var nombraColor = 0;
        pincel.fillStyle = "lightgrey";
        pincel.fillRect (0,0,600,600);

        function dibujarCirculo (evento){
            var y = evento.pageY - pantalla.offsetTop; //pos y
            var x = evento.pageX - pantalla.offsetLeft; //pos x
            let mcolor;
            if (nombraColor == 0) { mcolor = "red"; }
            if (nombraColor == 1) { mcolor = "green"; }
            if (nombraColor == 2) { mcolor = "blue"; }
            if (nombraColor == 3) {  
                let colr = Math.floor(Math.random()*255);
                let colg = Math.floor(Math.random()*255);
                let colb = Math.floor(Math.random()*255);
                mcolor = "rgb("+colr+","+colg+","+colb+")";
            }
            pincel.fillStyle = mcolor;
            pincel.beginPath();
            pincel.arc (x,y,10,0,2*Math.PI);
            pincel.fill();
        }

        function alterarColor() {
            if (nombraColor < 3) {
                nombraColor++;
            } else {
                nombraColor = 0;
            }
        }

        pantalla.oncontextmenu = alterarColor;
        pantalla.onclick = dibujarCirculo;
            </script>