Estou tentando fazer com que cada quadrado fique de uma cor, adicionando uma variável (c), um for dentro de um for e incremento de c. Criei então dois conjuntos, pares e impares, mas a impressão é que as condições dos if nunca são satisfeitas pois sempre imprime o que esta no else. Eu sei que a variável c está sendo incrementada pois ela imprime a quantidade de quadrados que aparecem no canvas, mas não consigo entender pq esses quadrados não estão um de cada cor.
function desenhaQuadrado(x, y, cor) {
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');
pincel.fillStyle = cor;
pincel.fillRect(x, y, 50, 50);
pincel.strokeStyle = "rgb(50,0,100)";
pincel.strokeRect(x, y, 50, 50);
}
var c = 0;
var cor = "yellow";
var pares = [2,4,6,8,10,12,14,16,18,20];
var impares = [1,3,5,7,9,11,13,15,17,19,];
for(var x=0; x<600; x = x + 50){
for(var y = 0 ; y< 400; y = y + 50){
c++;
if(c == pares){
cor = "blue";
}
if(c == impares){
cor = "red";
}
else{
cor = "green";
}
desenhaQuadrado(x, y, cor);
}
}
document.write(c);
</script>
