mi version

hola, buenas. Les dejo mi version, si bien al principio parece un proyecto dificil, cuando te tomas el tiempo para verlo y pensar lo que te piden, te das cuenta que aplicaras muchas cosas de los proyectos que ya realizamos. Espero poder ayudarlo con mi version =).

...

var colores = ["blue", "green", "red"];
    var indiceColor=0;
    var puedoDibujar = false;



    function habilitarDibujar() {

        puedoDibujar = true;
    }

    function deshabilitarDibujar() {

        puedoDibujar = false;
    }

    pantalla.onmousedown = habilitarDibujar;

    pantalla.onmouseup = deshabilitarDibujar;

    function cuadroColor (color, x, lado)
    {
        pincel.fillStyle = color;
        pincel.fillRect (x, 0, lado, lado);
    }

    cuadroColor(colores[2],0,50);
    cuadroColor(colores[1],50,50);
    cuadroColor(colores[0],100,50);

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

        if (y>=0 && y<=50)
        {
            if (x>=0 && x<50) 
            {
                indiceColor=2;
            }
            if (x>50 && x<100) 
            {
                indiceColor=1;
            }
            if (x>100 && x<= 150) 
            {
                indiceColor=0;
            }
        }
    }

    function dibujarCirculo(evento) {

        if(puedoDibujar) {
            var x = evento.pageX - pantalla.offsetLeft;
            var y = evento.pageY - pantalla.offsetTop;
            if (x>150 || y>50) 
            {
                pincel.fillStyle = colores[indiceColor];
                pincel.beginPath();
                pincel.arc(x, y, 5, 0, 2 * 3.14);
                pincel.fill();
            }

        }

    }

    pantalla.onclick = seleccionarColor;
    pantalla.onmousemove = dibujarCirculo;

</script>