qué errores detectan?
<body>
<canvas width="1200" height="800"></canvas>
<script>
var pantalla = document.querySelector('canvas');
var pincel = pantalla.getContext('2d');
var colores = ["red", "green", "blue", "yellow","lightblue","orange"];
var xCuadrado = 0;
var yCuadrado = 0;
var tamanho = 50;
pincel.fillStyle = 'grey';
pincel.fillRect(0, 0, 1200, 800);
var puedoDibujar = false;
function dibujarCirculo(x,y) {
if(puedoDibujar){
// pincel.fillStyle = 'blue';
pincel.beginPath();
pincel.arc(x, y, 5, 0, 2 * 3.14);
pincel.fill();
}
}
function dibujarCuadrado(x,y,color, tamanho) {
pincel.fillStyle= color;
pincel.fillRect(x,y,tamanho,tamanho);
pincel.strokeStyle = "black";
pincel.strokeRect(x,y,tamanho,tamanho);
}
function dibujarPaleta(colores){
for (let i = 0; i < colores.length; i++) {
dibujarCuadrado(xCuadrado,yCuadrado,colores[i],tamanho);
yCuadrado += 50;
}
}
function selectColor(event){
let x = event.pageX - pantalla.offsetLeft;
let y = event.pageY - pantalla.offsetTop;
for (let i = 0; i < colores.length; i++) {
if((x>0)&&(x<50)&&(y>0 + i*tamanho)&&(y<tamanho + i*tamanho)){
pincel.fillStyle = colores[i];
}
}
// if((x>50)||(y>colores.length*tamanho)){
// pincel.fillStyle = 'blue';
// }
}
function habilitarDibujar() {
puedoDibujar = true;
}
function deshabilitarDibujar() {
puedoDibujar = false;
}
pantalla.onclick = selectColor;
pantalla.onmousedown = habilitarDibujar;
pantalla.onmouseup = deshabilitarDibujar;
dibujarPaleta(colores);
// °°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°
//Función para delimitar el área
function puedeDisenharArea(xCoordenada,yCoordenada){
if ((xCoordenada >= 0) && (xCoordenada < (tamanho+5)) &&
(yCoordenada >=0) && (yCoordenada < (tamanho+5)*colores.length)) {
return false;
} else{
return true;
}
}
function capturarMovimientoDelMouse(evento){
var x = evento.pageX - pantalla.offsetLeft;
var y = evento.pageY - pantalla.offsetTop;
if (puedeDisenharArea(x,y)){
dibujarCirculo(x,y);
}
}
pantalla.onmousemove = capturarMovimientoDelMouse;
</script>
</body>
</html>
