Essa é a versão 2.0 do aplicativo que eu desenvolvi para memorizar os dois sistemas de escrita mais básicos da língua japonesa. Em relação a versão anterior se observam duas mudanças significativas:
Na versão 1.0, sempre que uma nova coluna de letras era selecionada ou desselecionada, uma nova carta era sorteada automaticamente. Isso não acontece mais, não se tratava de um bug. Fiz a mudança apenas por achar que é mais elegante dessa forma.
Agora o usuário pode escolher dois modos de seleção de colunas. Um onde apenas uma coluna pode ser selecionada por vez, e outro onde pode-se selecionar várias colunas. Com isso, quando se está estudando várias colunas diferentes e na sequencia se quer estudar uma nova individualmente, não é mais preciso desmarcar as colunas que já estavam selecionadas.
Esse projeto é a resolução de um desafio proposto na aula 49 do curso de javascript do canal do youtube cfb cursos. Mais um que entra para lista do "teria sido mais simples, se eu não fosse tão surtado perfeccionista". Mas tudo bem, afinal não existem muitas coisas melhores para se fazer além de digitar e ler código. Em compensação, existem muitas coisa piores.
No sistema RGB as cores são formadas a partir da combinação de três cores base, são elas R (vermelho), G (verde) e B (azul). Cada uma dessas cores pode receber valores que vão de 0 até 255, quanto maior o valor, maior é a intensidade da cor. Para se obter a cor vermelho, por exemplo, devemos escrever rgb(255,0,0). Aqui o valor referente ao vermelho está no máximo e os valores referentes a verde e azul estão zerados. Podemos obter variações desse vermelho aumentando um pouco a intensidade das outras cores e/ou diminuindo a intensidade do vermelho, e é isso que essa aplicação se propõe a fazer.
Para uma explicação mais detalhada sobre como funciona o sistema RGB, recomendo esse vídeo do canal CFB Cursos no youtube.
Nessa aplicação, o usuário escolhe uma cor através da TAG . Após isso, o script cria variações dessa cor, hora mudando a intensidade de apenas uma cor base, hora mudando a intensidade de duas cores base, e por fim mudando a intensidade das três cores base. Também existe uma área onde o usuário pode fazer alguns testes, mudando as cores e a opacidade do background de alguns elementos.
Foi particularmente difícil para mim bolar uma lógica onde em um momento apenas uma cor base variasse, e em outro duas e em outro as três. Mas no fim a persistência venceu a frustração.
Em JavaScript, números aleatórios são gerados através da função Math.random(), nesse post faremos algumas observações e demonstrações acerca da mesma, para um maior entendimento peço que o leitor sempre copie e teste o código gerado abaixo.
Para começar nossos trabalhos, atribuiremos o número aleatório gerado pela função a uma variável e em seguida a mostraremos no console.
var numeroAleatorio = Math.random();
console.log(numeroAleatorio);
A função Math.random() sempre retorna um número entre 0 e 0.999999999999... (que na prática é 1). O que resulta em muitas casas decimais, e pouca praticidade. Podemos melhorar as coisas utilizando a a função Math.round() que arredonda o número passado como parâmetro. Com o código abaixo exibiremos no console tanto o número "puro" quanto o número arredondado.
var numeroAleatorio = Math.random();
console.log("Numero Original: " + numeroAleatorio + " | Número arredondado: " + Math.round(numeroAleatorio));
Agora, afim de obter vários números colocaremos o código acima dentro de um loop for.
var numeroAleatorio;
for(var x = 0; x < 10; x++){
numeroAleatorio = Math.random();
console.log("Numero Original: " + numeroAleatorio + " | Número arredondado: " + Math.round(numeroAleatorio));
}
O que temos é um festival de zeros e ums. Isso acontece porque primeiro a função Math.random() gera um número entre 0 e 0.999999999999... e em seguida a função Math.round() o arredonda seguindo a seguinte lógica. Se o número gerado estiver mais próximo de 0 que de 1 ele é arredondado para 0, senão ele é arredondado para 1.
Para obter números em um intervalo maior devemos utilizar a função Math.random() em conjunto com algumas operações aritméticas. No código abaixo multiplicaremos o número gerado por 10.
var numeroAleatorio;
for(var x = 0; x < 100; x++){
numeroAleatorio = Math.random();
console.log("Numero Original: " + numeroAleatorio + " | Número multiplicado pro 10: " + (numeroAleatorio * 10) + " | Número multiplicado por 10 e arredondado: " + Math.round(numeroAleatorio * 10));
}
Vou pegar o primeiro número que foi gerado para mim e explicar o resultado do código:
Primeiro a função Math.random() gerou o número 0.9140966973810001
Este número foi multiplicado por 10 resultando em 9.14096697381
Por fim esse número foi arredondado seguindo a lógica de "se está mais perto de 9 que de 10 ele é arredondado para 9 senão ele é arredondado para 10". Nesse caso o resultado foi 9.
Podemos simplificar o código utilizando a função Math.round() e a multiplicação por 10 logo na atribuição da variável
var numeroAleatorio;
for(var x = 0; x < 100; x++){
numeroAleatorio = Math.Round(Math.random() * 10);
console.log(numeroAleatorio);
}
O código acima já retorna o valor final do número, que sempre será um número entre 0 e 10.
Podemos obter números entre 0 e qualquer número positivo utilizando a mesma lógica, apenas mudando o valor pelo qual o Math.random() será multiplicado.
var numeroAleatorio;
for(var x = 0; x < 100; x++){
numeroAleatorio = Math.Round(Math.random() * 5);
console.log(numeroAleatorio);
}
Com o código acima sempre obteremos números entre 0 e 5.
Se quisermos obter números a partir de um intervalo exato, entre 8 e 10 por exemplo. Devemos seguir a foŕmula abaixo
Math.round(numero do limite inferior + Math.random() * (numero do limite superior - numero do limite inferior))
O Código para gerar números entre 8 e 10 seria o seguinte:
var numeroAleatorio;
for(var x = 0; x < 100; x++){
numeroAleatorio = Math.round(8 + Math.random() * (10 - 8));
console.log(numeroAleatorio);
}
No código acima temos a mesma lógica já apresentada anteriormente, de que podemos obter números de um intervalo entre 0 e qualquer número positivo apenas multiplicando o math.random() por esse número. Nesse caso, obteremos sempre números entre 0 e 2, pois Math.random() * 2 sempre irá gerar números dentro desse intervalo, após isso o número gerado será somado com 8, o que garante que o menor número do intervalo sempre seja 8. Por fim, o número é arredondado com a função Math.round().
Seguindo as premissas mostradas acima criei uma aplicação onde o usuário entra com dois números e em seguida gera um número aleatório dentro do intervalo entre esses dois números.
Ao se iniciar os estudos em língua japonesa, o primeiro passo deve ser aprender os dois sistemas de escrita mais básicos do idioma, sendo eles o Hiragana e o Katakana. Esse programa tem como objetivo ajudar o estudante nessa tarefa.
A dinâmica do programa é inspirada no Anki.Não por acaso eu o apelidei de Mini Anki.Um outro famoso programa muito utilizado no estudo de idiomas. Primeiro é mostrada a letra e após um determinado tempo é mostrado o som que ela representa. O usuário pode escolher quais colunas de letras estudar e também mudar a velocidade em que o som da letra é revelado.
Para mais detalhes sobre como funciona a escrita da língua japonesa recomendo o vídeo abaixo, do canal do youtube 123 japonês.
Com bastante atraso, afinal é muito fácil se perder e gastar todo o tempo com coisas inúteis enquanto a vida passa, eu trago a versão 2.0 do timer / despertador feito com javascript.
Novidades
O código javascipt está muito melhor estruturado e repleto de comentários, o que dá um norte para quem quiser se aventurar por ele.
Além do som de alarme padrão, o usuário agora tem a possibilidade de escolher que uma janela no navegador seja aberta, com uma url definida por ele.
As preferências do usuário agora são salvas com localStorage.
Reproduzir determinado arquivo de áudio após um período de tempo estabelecido pelo usuário. A primeira vista parece um projeto simples, e de fato o é. Porém ao mesmo tempo é tão repleto de minúcias - e quanto mais surtada perfeccionista é a pessoa mais minúcias vão aparecer - que pode até acarretar graves dores de cabeça ao programador. Ok, com graves dores de cabeça eu já estou bastante acostumado...
Ter desenvolvido o projeto de forma desorganizada, num sentido de que eu não pré estabeleci todas as suas funcionalidades e fui programando de uma forma "intuitiva" seguindo a ideia de que "conforme forem aparecendo problemas eu os resolvo" e "conforme forem aparecendo novas ideias eu as implemento" certamente aumentou o seu grau de dificuldade. Dito isso, convém aqui compartilhar uma dica que o programador português João Ribeiro deu em seu canal no youtube:
Entre mortos e feridos o script parece estar funcionando sem bugs. Porém como eu sou cheio de bugs, por mais que a máquina sempre dispare o alarme na horário correto, nunca resisto à tentação de parar o despertador e voltar a dormir. Talvez seja o caso mexer mais no código e trocar o som do alarme por algo mais estimulante...
Enfim, para os que quiserem mexer no código ou para aqueles que simplesmente estão precisando de um despertador vou colocar abaixo o link para o download.
Assim como eu, esse blog está nascendo de forma muito prematura. Mas diferente de mim, o nascimento desse espaço foi planejado. Há muito eu vislumbrava publicar conteúdo escrito na internet, porém só pretendia fazê-lo quando me sentisse pronto para tal. Bom, eu não estou pronto, muito longe disso... Casado com a dor física e tendo a inercia como amante, essa é minha atual situação. E já estou nessa há bastante tempo. Não sei se já disse mas minha amante é a inerc... Ah, sim! Eu já disse...
O caminho que eu percorri até esse estado foi pavimentado por fatores genéticos e ambientais, - provavelmente ter nascido muito prematuro tenha sido um deles - tendo a achar que o pacote de vícios e virtudes que eu recebi veio meio desregulado... De qualquer forma, tenho vivencia e imaginação o bastante para saber que as coisas poderiam ser muito piores. Uso esse primeiro post como uma forma de quebrar o ciclo infinito de falhas e erros no qual estou inserido. Não vou conseguir mudar as coisas num curto prazo, mas me comprometo que o eu de amanha será melhor que o eu de hoje.