isa44.74/mandalorian
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #16 from rasoirnoir/characters

Browse Source 
pagination ok
This commit is contained in:
William Noris 2021-10-20 10:39:12 +02:00 committed by GitHub
commit 326fccc770
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 57 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
scripts/personnages.js
View File

@ -1,4 +1,4 @@
import { api_call,API_URL } from "./util"; import { api_call,API_URL, createPagination } from "./util";
const PERSONNAGES = document.getElementById("resultats"); const PERSONNAGES = document.getElementById("resultats");
@ -20,17 +20,17 @@ console.log('personnage.js loaded');
//api_call(API_URL+"/people", console.log); //api_call(API_URL+"/people", console.log);
fetch(API_URL+"/people") // fetch(API_URL+"/people")
.then(response => { // .then(response => {
return response.json(); // return response.json();
}) // })
.then(jsonResp => { // .then(jsonResp => {
remplissage(jsonResp); // remplissage(jsonResp);
}) // })
.catch(error => { // .catch(error => {
console.log(`Erreur lors de l'appel API : // console.log(`Erreur lors de l'appel API :
${error.message}`); // ${error.message}`);
}); // });
function remplissage(json){ function remplissage(json){
console.log(json.results[0]); console.log(json.results[0]);
@ -47,9 +47,12 @@ fetch(API_URL+"/people")
PERSONNAGES.innerHTML = ''; PERSONNAGES.innerHTML = '';
const PERPAGE = json.results.length; const PERPAGE = json.results.length;
const previousUrl = json.previous;
const nextUrl = json.next;
console.log(previousUrl);
console.log(nextUrl);
for (let i = 0; i < PERPAGE; i++) {
for (let i = 0; i < PERPAGE; i++) {
const urlbirth_year = json.results[i].birth_year; const urlbirth_year = json.results[i].birth_year;
const urleye_colo=json.results[i].eye_colo; const urleye_colo=json.results[i].eye_colo;
const urlgender=json.results[i].gender; const urlgender=json.results[i].gender;
@ -63,7 +66,7 @@ for (let i = 0; i < PERPAGE; i++) {
// const gens = new People(urlbirth_year, urleye_colo, urlgender, urlhair_color, urlmass,urlskin_color); // const gens = new People(urlbirth_year, urleye_colo, urlgender, urlhair_color, urlmass,urlskin_color);
// console.log(gens); // console.log(gens);
//Appel Api pour les planetes : //Appel Api pour les planetes :
PERSONNAGES.innerHTML += PERSONNAGES.innerHTML +=
@ -75,13 +78,21 @@ for (let i = 0; i < PERPAGE; i++) {
<div id=couleurYeux> Couleur des Yeux : ${urleye_colo}</div> <div id=couleurYeux> Couleur des Yeux : ${urleye_colo}</div>
<div id=genre>Genre : ${urlgender}</div> <div id=genre>Genre : ${urlgender}</div>
<div id=couleurCheveux> Couleur des Cheveux : ${urlhair_color} </div> <div id=couleurCheveux> Couleur des Cheveux : ${urlhair_color} </div>
<div id=taille> Taille : ${urlheight}</div>
<div id= poids> Poids du personnage : ${urlmass} kg</div> <div id= poids> Poids du personnage : ${urlmass} kg</div>
<div id= couleurPeau> Couleur de Peau : ${urlskin_color} </div> <div id= couleurPeau> Couleur de Peau : ${urlskin_color} </div>
<div class="2"> Planète de Naissance : ${urlhomeworld}</div> <div class="2"> Planète de Naissance : ${urlhomeworld}</div>
<div class="3"> Film où je suis présent : ${urlfilms}</div> <div class="3"> Film où je suis présent : ${urlfilms}</div>
</div> </div>
</section>`; </section>`;
} }
//Pagination
createPagination(previousUrl, nextUrl, PERSONNAGES, remplissage);
} }
api_call(API_URL + "/people", remplissage);
console.log('personnage.js loaded');

2
scripts/util.js
View File

@ -43,7 +43,7 @@ export const api_call = (url, callback) => {
*/ */
export const createPagination = (prevUrl, nextUrl, elementParent, remplissage) => { export const createPagination = (prevUrl, nextUrl, elementParent, remplissage) => {
console.log("Url précédente : " + prevUrl); console.log("Url précédente : " + prevUrl);
console.group("Url suivante : " + nextUrl); console.log("Url suivante : " + nextUrl);
const currentPage = (prevUrl == null ? parseInt(getPage(nextUrl)) - 1 : parseInt(getPage(prevUrl)) + 1); const currentPage = (prevUrl == null ? parseInt(getPage(nextUrl)) - 1 : parseInt(getPage(prevUrl)) + 1);
console.log("Page courante : " + currentPage); console.log("Page courante : " + currentPage);