From 25da1396321cf9eb66cc4b7bd3ce3390a379f793 Mon Sep 17 00:00:00 2001
From: Ait Lamine Ilias <aitlaminilias@gmail.com>
Date: Wed, 26 Mar 2025 16:24:45 +0100
Subject: [PATCH] feat: ajout du filtrage
---
index.html | 34 ++++++++++++++++++++++++++++++++--
1 file changed, 32 insertions(+), 2 deletions(-)
diff --git a/index.html b/index.html
index 2c25362..e656cdd 100644
--- a/index.html
+++ b/index.html
@@ -7,9 +7,18 @@
</head>
<body>
<h1>Pokémon List</h1>
+ <button id="no-filter-button">Montrer tout</button>
+ <button id="filter-button">Filter Pokémon plus lourd que 3kg </button>
+ <button id="filter-button2">Filter Pokémon de tails inférieure à 1m</button>
+
<ul id="pokemon-list"></ul>
+
<script>
+ const filterButton = document.getElementById("filter-button");
+ const filterButton2 = document.getElementById("filter-button2");
+ const noFilterButton = document.getElementById("no-filter-button");
+
const baseApiUrl = "https://pokeapi.co/api/v2/pokemon"
/**
@@ -28,7 +37,7 @@
request().then( (data)=> {
let pokemons = [];
for (let i=0; i < data.length; ++i) {
- pokemons.push({"name":data[i].name, "weight": data[i].weight, "height": data[i].height});
+ pokemons.push({"name":data[i].name, "weight": data[i].weight/10, "height": data[i].height/10});
}
callback(pokemons);
});
@@ -44,9 +53,30 @@
listElement.appendChild(li);
});
}
-
// Fetch and display Pokémon
fetchPokemonList(displayPokemons, 318);
+
+ /**
+ * Filter Pokémon with weight > 3kg and height < 1m
+ */
+ function filterPokemons() {
+ fetchPokemonList((pokemons) => {
+ const filteredPokemons = pokemons.filter(pokemon => pokemon.weight > 3 );
+ displayPokemons(filteredPokemons);
+ }, 318); // Fetch 318 Pokémon
+ }
+ function filterPokemons2() {
+ fetchPokemonList((pokemons) => {
+ const filteredPokemons = pokemons.filter(pokemon => pokemon.height < 1 );
+ displayPokemons(filteredPokemons);
+ }, 318); // Fetch 318 Pokémon
+ }
+ // Filter and display Pokémon when button is clicked
+ filterButton.addEventListener("click", filterPokemons);
+ filterButton2.addEventListener("click", filterPokemons2);
+ noFilterButton.addEventListener("click", () => {
+ fetchPokemonList(displayPokemons, 318);
+ });
</script>
</body>
</html>
\ No newline at end of file
--
GitLab