Não entendo em que lugar do código está especificado que o incremento no array (=mudança de cor) se dá mediante o clique no botão direito do mouse...
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Não entendo em que lugar do código está especificado que o incremento no array (=mudança de cor) se dá mediante o clique no botão direito do mouse...
O código do professor na aula 'trocando de cor' (https://cursos.alura.com.br/course/logica-programacao-pratica-com-desenho-animacoes-em-jogo/task/21745) é este:
<canvas width="600" height="400"></canvas>
<script>
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');
pincel.fillStyle = 'grey';
pincel.fillRect(0, 0, 600, 400);
var cores = ['blue', 'red', 'green']
var indiceCorAtual = 0; // começa com blue
function desenhaCirculo(evento) {
var x = evento.pageX - tela.offsetLeft;
var y = evento.pageY - tela.offsetTop;
pincel.fillStyle = cores[indiceCorAtual];
pincel.beginPath();
pincel.arc(x, y, 10, 0, 2 * 3.14);
pincel.fill();
console.log(x + ',' + y);
}
tela.onclick = desenhaCirculo;
function mudaCor() {
indiceCorAtual++;
if(indiceCorAtual >= cores.length) {
indiceCorAtual = 0; // volta para a primeira cor, azul
}
return false; // para não exibir o menu padrão do canvas
}
tela.oncontextmenu = mudaCor;
</script>A variável 'cores' tem 3 valores, com índices 0, 1 e 2.
Ao clicar com o botão direito do mouse, executa-se a instrução 'oncontextmenu'. Esta, por sua vez, aciona a 'function' mudaCor, que incrementa o contador 'indiceCorAtual' em mais um.
Se este valor de indiceCorAtual chegar a 3, é zerado. Ou seja, a cada clique com a direita, indiceCorAtual variará de 0 a 2.
Este índice é o que será usado ao clicar com o botão esquerdo (onclick), que invoca a 'function' desenhaCirculo, que usará este indiceCorAtual para definir qual das 3 cores utilizar.
dessa forma foi bem mais simples, fui comparar com a minha antes de ver a do instrutor e essa foi bem mais clean. Obrigado!