From 2e8943d994543425ee3d1d7cc00b1f5f37487415 Mon Sep 17 00:00:00 2001
From: maxluli <moi@MonPc.localdomain>
Date: Tue, 20 Sep 2022 09:02:26 +0200
Subject: [PATCH] Added distance calculation

---
 index.html | 50 +++++++++++++++++++++++++++++++++++++++++++++-----
 1 file changed, 45 insertions(+), 5 deletions(-)

diff --git a/index.html b/index.html
index d15bb59..7f63eaf 100644
--- a/index.html
+++ b/index.html
@@ -30,14 +30,15 @@
             <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>-->
+                This definitely is an AD
             </div>
         </div>
     </div>
+    -->
     <div class="container">
         <div class="card p-2">
             <img id="pokemonImage" style="image-rendering: pixelated;"
@@ -45,7 +46,8 @@
                 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>
+                <h5 class="card-title" id="pokemonAge">21</h5>
+                <h5 class="card-title" id="pokemonDistance">35km Away</h5>
                 <p class="card-text" id="pokemonDescription">I like Ice Cream</p>
                 <div class="row">
                     <div class="btn col-4" id="nopeButton">
@@ -106,9 +108,20 @@
                                                         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("pokemonAge").innerHTML = (Math.floor(Math.random() * (65 - 18)) + 18);
                                                         document.getElementById("pokemonDescription").innerHTML = pokemonInfo.flavor_text_entries[0].flavor_text;
+
+                                                        window.navigator.geolocation.getCurrentPosition(function (pos) {
+                                                            console.log(pos);
+                                                            var lat = pos.coords.latitude;
+                                                            var lon = pos.coords.longitude;
+
+                                                            let pokemonLatitude = Math.floor(Math.random() * 180) - 90;
+                                                            let pokemonLongitude = Math.floor(Math.random() * 360) - 180;
+
+                                                            let dist = distance(lon, lat, pokemonLongitude, pokemonLatitude);
+                                                            document.getElementById("pokemonDistance").innerHTML = Math.floor(dist) + " Km away";
+                                                        })
                                                     })
                                             }).catch((response) => {
                                                 alert("Bouhouuuuu could not get any further infos on that dumbass");
@@ -138,6 +151,33 @@
     document.getElementById('favoriteButton').onclick = function () {
         alert("You want to fav");
     }
+
+    // !! THIS METHOD IS NOT MINE, ITS FROM STACK OVERFLOW : https://stackoverflow.com/questions/13840516/how-to-find-my-distance-to-a-known-location-in-javascript
+    function distance(lon1, lat1, lon2, lat2) {
+        var R = 6371; // Radius of the earth in km
+        var dLat = (lat2 - lat1).toRad();  // Javascript functions in radians
+        var dLon = (lon2 - lon1).toRad();
+        var a = Math.sin(dLat / 2) * Math.sin(dLat / 2) +
+            Math.cos(lat1.toRad()) * Math.cos(lat2.toRad()) *
+            Math.sin(dLon / 2) * Math.sin(dLon / 2);
+        var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
+        var d = R * c; // Distance in km
+        return d;
+    }
+
+    /** Converts numeric degrees to radians */
+    if (typeof (Number.prototype.toRad) === "undefined") {
+        Number.prototype.toRad = function () {
+            return this * Math.PI / 180;
+        }
+    }
+
+    window.navigator.geolocation.getCurrentPosition(function (pos) {
+        console.log(pos);
+        console.log(
+            distance(pos.coords.longitude, pos.coords.latitude, 42.37, 71.03)
+        );
+    });
 </script>
 
 </html>
\ No newline at end of file