Boa noite.
Fiz uso do que foi demostrado nas ultimas aulas desse curso para adicionar funções a um programa dos módulos anteriores, só que a solução ficou muito extensa. Gostaria de saber uma maneira de otimizar a última função desse programa (ou mesmo outras partes que vocês acharem interessante melhorar). Desculpem a falta de espaços no código, mas tive que fazer isso pra conseguir postar aqui no sistema....rs.
Valeu pessoal !
Parte 1 do código :
<meta charset="UTF-8">
<canvas width="750" height="400"></canvas>
<script>
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');
pincel.fillStyle = 'black';
pincel.fillRect(0, 0, 750, 400);
pincel.strokeStyle='black';
pincel.strokeRect(0,0,750,400);
pincel.fillStyle = 'white';
pincel.fillRect(0, 0, 600, 400);
pincel.strokeStyle='black';
pincel.strokeRect(0,0,600,400);
var cores = ['blue', 'red', 'yellow','green','orange','white']
var indiceCorAtual = 0; // começa com blue
var raio = 6;
var incremento = 2;
function desenhaPincel() {
var xi = 675;
var yi = 72;
pincel.fillStyle = cores[indiceCorAtual];
pincel.beginPath();
pincel.arc(xi, yi, raio, 0, 2 * 3.14);
pincel.fill();
}
function desenhaTexto(texto, x , y) {
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');
pincel.font='13px Georgia';
pincel.fillStyle='white';
pincel.fillText(texto, x, y);
}
function opcoesCores(x,y,cor) {
pincel.fillStyle =cor;
pincel.beginPath();
pincel.arc(x,y,10, 0, 2 * 3.14);
pincel.fill();
}
function desenhaMostrador() {
pincel.fillStyle = 'black';
pincel.fillRect(600, 0, 750, 400);
pincel.strokeStyle='black';
pincel.strokeRect(600,0,750,400);
desenhaTexto("COR SELECIONADA", 615, 30);
desenhaTexto("MUDAR DE COR",625,130);
desenhaTexto("Botão direito do Mouse",610,150);
desenhaTexto("ou Toque na Cor",630,170);
//Loop para desenhar cores no mostrador
var x = 622
i = 0
for(var repeticoes = 0; repeticoes < cores.length; repeticoes++) {
opcoesCores(x,195,cores[i]);
x = x + 21;
i++;
}
desenhaTexto("SHIFT + Botão direito", 612,240);
desenhaTexto("AUMENTA O PINCEL",610,260);
desenhaTexto("ALT + Botão direito", 615,300);
desenhaTexto("DIMINUI O PINCEL",613,320);
desenhaTexto("Botão Esquerdo",625,360);
desenhaTexto("DESENHA NA TELA",615,380);
desenhaPincel();
}
desenhaMostrador();