mandalorian/scripts/planets.js

58 lines
1.7 KiB
JavaScript
Raw Normal View History

import { api_call, API_URL, createPagination } from "./util";
2021-10-18 15:32:20 +00:00
2021-10-19 07:47:51 +00:00
2021-10-19 15:35:05 +00:00
const planetes = document.getElementById("resultats");
2021-10-18 15:32:20 +00:00
2021-10-19 13:23:08 +00:00
2021-10-19 14:04:18 +00:00
function remplissage(results) {
2021-10-19 08:31:51 +00:00
planetes.innerHTML = "";
2021-10-19 08:31:51 +00:00
const previousUrl = results.previous;
const nextUrl = results.next;
const tabResults = results.results;
2021-10-19 14:04:18 +00:00
for (resultPlanet of tabResults) {
2021-10-19 08:31:51 +00:00
const nom = resultPlanet.name;
const diametre = resultPlanet.diameter;
const climate = resultPlanet.climate;
const terrain = resultPlanet.terrain;
const population = resultPlanet.population;
const tabResidents = resultPlanet.residents;
2021-10-19 09:52:12 +00:00
//Problème de requêtes asyncrones
// let tabResidents = [];
// for(index in resultPlanet.residents){
// api_call(resultPlanet.residents[index], (jsonresp)=>{
// console.log(jsonresp.name);
// });
// }
// console.log(`${nom} - résidents : ${resultPlanet.residents}`);
// console.log(`nom des résidents : ${tabResidents}`);
const tabFilms = resultPlanet.films;
2021-10-19 08:31:51 +00:00
2021-10-19 14:04:18 +00:00
planetes.innerHTML +=
`<section class="resultat">
<h1 class="titreAccordeon">${nom}</h1>
<div class="accordeon">
<div class="1">
<p>${terrain}</p>
<p>${climate}</p>
<p>${diametre}Km</p>
</div>
<div class="2">${tabResidents}</div>
<div class="3">${tabFilms}</div>
</div>
</section>`;
2021-10-19 08:31:51 +00:00
}
2021-10-19 07:47:51 +00:00
//Pagination
createPagination(previousUrl, nextUrl, planetes, remplissage);
2021-10-19 13:23:08 +00:00
}
2021-10-19 13:23:08 +00:00
api_call(API_URL + "/planets", remplissage);
2021-10-19 15:35:05 +00:00
console.log('planet.js loaded');