From b53b1d6bdd59ee2c3beb80b8d4896553549f23ac Mon Sep 17 00:00:00 2001
From: user <user@X270.localdomain>
Date: Tue, 13 Oct 2020 01:56:45 +0200
Subject: [PATCH] added map to curl.php

---
 website/curl.php | 58 ++++++++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 56 insertions(+), 2 deletions(-)
diff --git a/website/curl.php b/website/curl.php
index 7756daa..3689ed3 100644
--- a/website/curl.php
+++ b/website/curl.php
@@ -1,6 +1,7 @@
 <?php
 // Notes
 // The api key from Scooty's app/account: iPtAHWdOVLEtgkaymXoMHVVg
+// Below is the static html to generate the map, it can also be done more dynamically using https://github.com/LuminFire/leaflet-php  but that might be overkill
 
 
 // array of scooters
@@ -10,10 +11,21 @@ $scooters = array(
 'https://opencoil.show/test-json.php?scooterID=2'
 ); 
 
-// for each
-echo callAPI($scooters[0]);
+// for each scooter in array get the json (TODO, for each, safe to file/database?)
+$getJSON = callAPI($scooters[0]);
 
 
+// decode JSON data to PHP associative array
+$arr = json_decode($getJSON, true);
+// access values from the associative array
+$lat = $arr["data"]["attributes"]["lat"];  // get lattitude
+$lng = $arr["data"]["attributes"]["lng"];  // get longitude
+$lst = $arr["data"]["attributes"]["lastLocationUpdate"];  // get time of last position
+
+// construct lat/lon for use in leafet
+$pos = $lat.', '.$lng;
+
+// TODO save json to file?...mmm one big one? seperate ones, timestamped ones?
 
 
 
@@ -26,6 +38,14 @@ echo callAPI($scooters[0]);
 
 // Custom functions
 
+function checkModified($file, $expiration){ //check if file is older than expiration time 
+
+}
+
+function parseJSON(){
+
+}
+
 function callAPI($url){
         $curl = curl_init($url);
         curl_setopt($curl, CURLOPT_FAILONERROR, true);
@@ -47,3 +67,37 @@ function callAPI($url){
 
 
 ?>
+
+
+<html>
+    <head>
+        <meta charset="utf-8">
+        <link rel="stylesheet" type="text/css" href="https://unpkg.com/leaflet@1.3.3/dist/leaflet.css">
+        <script src='https://unpkg.com/leaflet@1.3.3/dist/leaflet.js'></script>
+        <style>
+            #map {
+                height: 500px
+            }
+        </style>
+    </head>
+<body>
+    <div id="map"></div>
+    <script>
+        var map = L.map('map').setView([52.516190, 13.377693], 13);
+
+        var Stamen_Toner = L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner/{z}/{x}/{y}.{ext}', {
+        attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> &mdash; Map data &copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
+        subdomains: 'abcd',
+        minZoom: 0,
+        maxZoom: 20,
+        ext: 'png'
+        });
+        map.addLayer(Stamen_Toner);
+
+        L.marker([<?php echo $pos; ?>]).addTo(map)
+          .bindPopup('Last updated <?php echo $lst; ?>')
+          .openPopup();
+    </script>
+</body>
+</html>
+
