Projeto JOGO POKEMON (parte 2) Alteração da API e inicio do código.
Fala pessoa, quem não conhece o projeto no fim do post tem os links que explica sobre a ideia.
No andar do projeto as coisas mudam, e a primeira coisa que mudei é que não vou mais usar a api https://pokeapi.co/. Isso porque não tem todas informações que preciso na listagem dos pokemons, sendo assim tive tive uma outra ideia que já coloquei em prática e funcionou.
Nesse jogo terei apenas os pokemons da primeira geração, sendo assim encontrei esse site que possui todas as informaçoes que preciso:
https://pokemondb.net/pokedex/stats/gen1
Ai foi simples, fiz um script para estrair os dados da tabela e criar um objeto. Depois apenas joguei no console e salvei como json, eeeeeee bimba, tenho todos os dados que preciso.
Aqui vai o código que joguei no console para extrair os dados (vou explicar para os iniciantes):
//Na imagem veja que os pokemons estão em uma tabela
//sendo assim pego uso o queryselector para pegar
//todas as linhas da tabela
let linha = document.querySelectorAll('table tr')
//crie uma variavel que irá armazenar a lista dos pokemons
let listaPokemons = []
//fiz o loop para navegar por cada linha da tabela
//comecei do 1 pois a primeira linha é o cabeçalho e não me interessa
for (let index = 1; index < linha.length; index++) {
//crio um objeto pokemon que será adicionado na lista
pokemon = {
//Aqui é simples, cada td é uma coluna começando do zero
//ai é só saber contar rsrs
numero: linha[index].querySelectorAll('td')[0].textContent,
nome: linha[index].querySelectorAll('td')[1].textContent,
tipo: linha[index].querySelectorAll('td')[2].textContent.split(' '),
vida: linha[index].querySelectorAll('td')[4].textContent,
ataque: linha[index].querySelectorAll('td')[5].textContent,
defesa: linha[index].querySelectorAll('td')[6].textContent,
velocidade: linha[index].querySelectorAll('td')[9].textContent
};
//adiciono o objeto na minha lista
listaPokemons.push(pokemon)
}
//mando para o console, ai só dar um botão direito e copiar objeto
//criar um arquivo .json e colar.
console.log(listaPokemons)
Agora ao invés de consumir direto da API vou consumir desse arquivo que já está do jeitinho que preciso, e como informações do pokemon nunca mudam não tem problema eu ter isso estático.
Já comecei e está listando os dados no HTML (como disse em outros posts, comece feio e depois arrume)
Próximo passo é criar o botão para selecionar o pokemon, fazer a maquina selecionar um aleatório e começar e abrir a tela de batalha.
https://www.tabnews.com.br/saraiva/projeto-jogo-pokemon-parte-1-documentando-do-que-sera-feito
https://www.tabnews.com.br/saraiva/projeto-jogo-pokemon-apresentacao