From d6e53b63337c0289e060aecdfce70eb3e88ab34d Mon Sep 17 00:00:00 2001
From: maxluli <moi@MonPc.localdomain>
Date: Tue, 20 Sep 2022 07:22:23 +0200
Subject: [PATCH] added final touches (for now) to the main page

---
 index.html | 99 +++++++++++++++++++++++++++++++++++++++---------------
 1 file changed, 71 insertions(+), 28 deletions(-)
diff --git a/index.html b/index.html
index c972725..d15bb59 100644
--- a/index.html
+++ b/index.html
@@ -21,17 +21,32 @@
     <link rel="icon" type="image/x-icon" href="assets/img/Icon.ico">
 </head>
 
-<body id="main"> 
+<body id="main">
     <div class="d-grid gap-2 text-center">
-        <div class=""><h1>Tinder for weird furries</h1></div>
-        <div class=""><h2>Home</h2></div>
+        <div class="">
+            <h1>Tinder for weird furries</h1>
+        </div>
+        <div class="">
+            <h2>Home</h2>
+        </div>
+    </div>
+    <div class="container">
+        <div class="card p-2 text-center">
+            <div class="card-body">
+                Ceci est une publicité</br>
+                <!-- Elle devrait me rapporter enormément d'argent</br>-->
+            </div>
+        </div>
     </div>
     <div class="container">
         <div class="card p-2">
-            <img id="pokemonImage" style="image-rendering: pixelated;" src="https://www.pokewiki.de/images/thumb/d/dd/Sugimori_132.png/250px-Sugimori_132.png" class="card-img-top" style="" alt="...">
+            <img id="pokemonImage" style="image-rendering: pixelated;"
+                src="https://www.pokewiki.de/images/thumb/d/dd/Sugimori_132.png/250px-Sugimori_132.png"
+                class="card-img-top" style="" alt="...">
             <div class="card-body">
-                <h4 class="card-title" id="pokemonName">Ditto</h4><h4 class="card-title" id="pokemonAge">21</h4>
-                <p class="card-text">I like Ice Cream</p>
+                <h4 class="card-title" id="pokemonName">Ditto</h4>
+                <h4 class="card-title" id="pokemonAge">21</h4>
+                <p class="card-text" id="pokemonDescription">I like Ice Cream</p>
                 <div class="row">
                     <div class="btn col-4" id="nopeButton">
                         <div class="text-center">
@@ -54,13 +69,19 @@
 
         <div class="row fixed-bottom">
             <div class="btn col-4 btn-light">
-                <a href="likes.html" style="text-decoration:none;color:black"><h3>Liked</h3></a>
+                <a href="likes.html" style="text-decoration:none;color:black">
+                    <h3>Liked</h3>
+                </a>
             </div>
             <div class="btn col-4 btn-light">
-                <a href="index.html" style="text-decoration:none;color:black"><h3>Home</h3></a>
+                <a href="index.html" style="text-decoration:none;color:black">
+                    <h3>Home</h3>
+                </a>
             </div>
             <div class="btn col-4 btn-light">
-                <a href="favorites.html" style="text-decoration:none;color:black"><h3>Favorites</h3></a>
+                <a href="favorites.html" style="text-decoration:none;color:black">
+                    <h3>Favorites</h3>
+                </a>
             </div>
         </div>
     </div>
@@ -68,33 +89,55 @@
 </body>
 <script>
     "use strict";
-    document.getElementById('main').onload = function(){
+    document.getElementById('main').onload = function () {
         //We will need to load an image from the pokeAPI with his description and a random name/age
-        let pokeApiResponse;
-        fetch("https://pokeapi.co/api/v2/pokemon/"+Math.floor(Math.random() * 905))
-        .then((response) => {
-            pokeApiResponse = response.json()
-            .then((data)=>{
-                //console.log(data);
-                document.getElementById("pokemonName").innerHTML = data.name;
-                document.getElementById("pokemonImage").src = data.sprites.front_shiny;
+        fetch("https://pokeapi.co/api/v2/pokemon/" + Math.floor(Math.random() * 905))
+            .then((response) => {
+                response.json()
+                    .then((pokemonData) => {
+                        fetch("https://tomatebanane.ch/api/pokename/random")
+                            .then((response) => {
+                                response.json()
+                                    .then((randomName) => {
+                                        fetch("https://pokeapi.co/api/v2/pokemon-species/" + pokemonData.id)
+                                            .then((response) => {
+                                                response.json()
+                                                    .then((pokemonInfo) => {
+                                                        console.log(pokemonData.id);
+                                                        document.getElementById("pokemonName").innerHTML = randomName[0].name;
+                                                        document.getElementById("pokemonImage").src = pokemonData.sprites.front_shiny;
+                                                        document.getElementById("pokemonAge").innerHTML = Math.floor(Math.random() * (65 - 18)) + 18;
+                                                        console.log(pokemonInfo.flavor_text_entries[0]);
+                                                        document.getElementById("pokemonDescription").innerHTML = pokemonInfo.flavor_text_entries[0].flavor_text;
+                                                    })
+                                            }).catch((response) => {
+                                                alert("Bouhouuuuu could not get any further infos on that dumbass");
+                                            })
+                                    })
+                                    .catch((response => {
+                                        alert("Bouhouuu i cant convert a response into json");
+                                    }))
+                            }).catch((response) => {
+                                alert("Could not get the magnificien datas from Zanardi's API");
+                            })
+                    })
+                    .catch(data => {
+                        alert("Bouhouuuu I cant convert a response to json");
+                    });
+            })
+            .catch(response => {
+                alert("This could use a error handler but for now lets just say that there was an problem trying to get the infos from pokeAPI");
             })
-            .catch(data => {
-                alert("Bouhouuuu I cant convert a response to text");
-            });
-        })
-        .catch(response =>{
-            alert("This could use a error handler but for now lets just say that there was an problem trying to get the infos from pokeAPI");
-        })
     }
-    document.getElementById('likeButton').onclick = function(){
+    document.getElementById('likeButton').onclick = function () {
         alert("You want to like");
     };
-    document.getElementById('nopeButton').onclick = function(){
+    document.getElementById('nopeButton').onclick = function () {
         alert("You want to nope");
     }
-    document.getElementById('favoriteButton').onclick = function(){
+    document.getElementById('favoriteButton').onclick = function () {
         alert("You want to fav");
     }
 </script>
+
 </html>
\ No newline at end of file
