diff options
| author | stuebinm | 2022-01-18 09:43:24 +0100 | 
|---|---|---|
| committer | stuebinm | 2022-01-20 13:19:44 +0100 | 
| commit | 0bcabe1c4b1dd74af233674dfa6c6ec3011ce2c0 (patch) | |
| tree | 5c58943f99245ff7f745f50b46c34ae288c3e503 /assets/ilztal.live/geolocation | |
| parent | db83a406bc6e63289e47ff5d2228c08430832655 (diff) | |
restructuring directories
Diffstat (limited to 'assets/ilztal.live/geolocation')
| -rw-r--r-- | assets/ilztal.live/geolocation/index.html | 179 | ||||
| -rw-r--r-- | assets/ilztal.live/geolocation/mapview.html | 94 | ||||
| -rw-r--r-- | assets/ilztal.live/geolocation/view.html | 77 | 
3 files changed, 0 insertions, 350 deletions
| diff --git a/assets/ilztal.live/geolocation/index.html b/assets/ilztal.live/geolocation/index.html deleted file mode 100644 index 052a9fa..0000000 --- a/assets/ilztal.live/geolocation/index.html +++ /dev/null @@ -1,179 +0,0 @@ -<!doctype html> -<html class="no-js" lang=""> -    <head> -        <meta charset="utf-8"> -        <meta http-equiv="x-ua-compatible" content="ie=edge"> -        <title>geolocation tracker test</title> -        <meta name="description" content=""> -        <meta name="viewport" content="width=device-width, initial-scale=1"> - -        <link rel="apple-touch-icon" href="/apple-touch-icon.png"> -        <!-- Place favicon.ico in the root directory --> - -    </head> -    <body> -        <!--[if lt IE 8]> -            <p class="browserupgrade"> -            You are using an <strong>outdated</strong> browser. Please -            <a href="http://browsehappy.com/">upgrade your browser</a> to improve -            your experience. -            </p> -        <![endif]--> - -        <button id = "initialise">Start Tracking</button><br/> -        <p id = "status"></p> -        <a id = "map-link" target="_blank"></a> - -        <p> -            Latitude: <span id="latitude"></span><br> -            Longitude: <span id="longitude"></span><br> -            Altitude: <span id="altitude"></span><br> -            Accuracy: <span id="accuracy"></span><br> -            Speed: <span id="speed"></span><br> -            Angle: <span id="angle"></span><br> -        </p> - -        <input id="note" placeholder="enter note here"> -        <button id="submit-note">Submit</button> - -        <p> -            <button id="download">Download Log</button> -            <button id="reset">Reset History</button> -        </p> -        <p id="error"></p> -    </body> -    <script> - -     /* TODO: -     /  - how to push things to rocket? (probably just http post for now …) -     /  - how to rate-limit new positions (either count dates, or option in geolocation?) -     /  - how to get closest point on path? -     */ - -     let lat = document.getElementById("latitude"); -     let long = document.getElementById("longitude"); -     let speed = document.getElementById("speed"); -     let acc = document.getElementById("accuracy"); -     let angle = document.getElementById("angle"); -     let alt = document.getElementById("altitude"); - -     let status = document.querySelector('#status'); -     let mapLink = document.querySelector('#map-link'); - -     function resetDisplay () { -         lat.innerText = "-"; -         long.innerText = "-"; -         speed.innerText = "-"; -         acc.innerText = "-"; -         angle.innerText = "-"; -         alt.innerText = "-"; -     } - -     function init() { - -         mapLink.href = ''; -         mapLink.textContent = ''; - -         resetDisplay(); - -         if(!navigator.geolocation) { -             status.textContent = 'Error: Geolocation API is not supported!'; -         } else { -             status.textContent = 'Initialising …'; -             trackPosition(); -         } - -     } -     var errcount = 1; -     var geolog = []; - -     function trackPosition() { -         function success(position) { -             const latitude  = position.coords.latitude; -             const longitude = position.coords.longitude; -             errcount = 0; - -             status.textContent = ''; -             mapLink.href = `https://www.openstreetmap.org/#map=18/${latitude}/${longitude}`; -             mapLink.textContent = `Latitude: ${latitude} °, Longitude: ${longitude} °`; - -             lat.innerText = position.coords.latitude; -             long.innerText = position.coords.longitude; -             alt.innerText = position.coords.altitude; -             acc.innerText = position.coords.accuracy; -             speed.innerText = position.coords.speed; -             angle.innerText = position.coords.heading; - -             document.getElementById("error").innerText = JSON.stringify(position.coords); - -             let datapoint = { -                 timestamp: new Date().toISOString(), -                 data: { -                     latitude: position.coords.latitude, -                     longitude: position.coords.longitude, -                     altitude: position.coords.altitude, -                     accuracy: position.coords.accuracy, -                     altitudeAccuracy: position.coords.altitudeAccuracy, -                     heading: position.coords.heading, -                     speed: position.coords.speed -                 } -             }; - -             geolog.push(datapoint); -             fetch( -                 "https://ilztal.live/geoloc/push", -                 { method: "POST", body: JSON.stringify(datapoint)} -             ).then(() => console.log("pushed position")) -              .catch(e => console.log("some error: ", e)) -         } - -         function error() { -             status.textContent = "("+errcount+") Error: Getting Location failed, retrying …"; -             resetDisplay(); -             errcount += 1; -             setTimeout(trackPosition, 3000); -         } - -         navigator.geolocation.watchPosition(success, error); -     } - -     function downloadHistory () { -         let json = JSON.stringify(geolog); -         let a = document.createElement("a"); -         console.log("attempting download!", geolog); -         a.setAttribute("href", "data:text/plain;charset=utf-8," + encodeURIComponent(json)); -         a.setAttribute("download","history.json"); -         document.body.appendChild(a); -         a.click(); -         document.body.removeChild(a); -     } - -     document.getElementById("initialise").addEventListener('click', init); - -     document.getElementById("submit-note").onclick = (a) => { -         let input = document.getElementById("note"); -         let text = input.value; -         console.log("submitting note:", text); -         geolog.push(text); -         fetch("https://ilztal.live/geoloc/push", -               {method:"POST", body: JSON.stringify({ -                   //ty: "note", -                   timestamp: new Date().toISOString(), -                   data: text -               })} -         ).then(() => input.value = "") -          .catch(e => { -              document.getElementById("error").innerText = "error:" + e; -              console.log("error occurred"); -          }); -     }; - -     document.getElementById("download").onclick = (a) => downloadHistory(); - -     document.getElementById("reset").onclick = (a) => geolog = []; - -    </script> - - -    </body> -</html> diff --git a/assets/ilztal.live/geolocation/mapview.html b/assets/ilztal.live/geolocation/mapview.html deleted file mode 100644 index bb62f62..0000000 --- a/assets/ilztal.live/geolocation/mapview.html +++ /dev/null @@ -1,94 +0,0 @@ -<!doctype html> -<html class="no-js" lang=""> -    <head> -        <meta charset="utf-8"> -        <meta http-equiv="x-ua-compatible" content="ie=edge"> -        <title>Position view</title> -        <meta name="description" content=""> -        <meta name="viewport" content="width=device-width, initial-scale=1"> - -        <link rel="apple-touch-icon" href="/apple-touch-icon.png"> -        <!-- Place favicon.ico in the root directory --> - -        <link rel="stylesheet" href="https://unpkg.com/leaflet@1.5.1/dist/leaflet.css" -              integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ==" -              crossorigin=""/> -        <script src="https://unpkg.com/leaflet@1.5.1/dist/leaflet.js" -                integrity="sha512-GffPMF3RvMeYyc1LWMHtK8EbPv0iNZ8/oTtHPx9/cc2ILxQ+u905qIwdpULaqDkyBKgOaB57QTMg7ztg8Jm2Og==" -                crossorigin=""></script> - -    </head> -    <body> -        <!--[if lt IE 8]> -            <p class="browserupgrade"> -            You are using an <strong>outdated</strong> browser. Please -            <a href="http://browsehappy.com/">upgrade your browser</a> to improve -            your experience. -            </p> -        <![endif]--> - -        <div align="justify"> -          <div id="MapID2" style="height:100vh; margin-left: auto; margin-right:auto; width:80%"></div> -        </div> -        <script> -         var mymap = L.map('MapID2'); -         L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoiZmVsaXg4MTgyOTMiLCJhIjoiY2p6a2h6cjdyMGpicjNvbzlzZ3UwNmloMCJ9.a4t1KM9Gid-q29ultM7HgA', { -             attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>', -             maxZoom: 18, -             id: 'mapbox/streets-v11', -             accessToken: 'pk.eyJ1IjoiZmVsaXg4MTgyOTMiLCJhIjoiY2p6a2h6cjdyMGpicjNvbzlzZ3UwNmloMCJ9.a4t1KM9Gid-q29ultM7HgA' -         }).addTo(mymap); -         var marker = L.marker([0,0]).addTo(mymap); -         marker.bindPopup("Hello Train!"); - -         mymap.setView([0,0], 16); -         function updateMap(pos) { -             if (pos === null) { -                 console.log("no data yet?"); -                 return; -             } -             mymap.setView(pos); -             mymap.scrollWheelZoom.disable(); -             marker.setLatLng(pos); -         } -         updateMap([48.13716,11.57540]); - -         function fetchUpdate () { -             fetch("https://ilztal.live/geoloc/history") -                 .then((data) => { -                     let text = data.text().then(text => { -                         let hist = JSON.parse(text); -                         console.log(hist) - -                         let latlngs = hist.filter(e => e.data.latitude !== undefined).map((e) => [e.data.latitude, e.data.longitude]); - -                         console.log(latlngs); -                         let polyline = L.polyline(latlngs, {color: "red"}).addTo(mymap); - -                         mymap.fitBounds(polyline.getBounds()) - -                         for (idx in hist) { -                             if (hist[idx].data.latitude === undefined) { -                                 console.log(hist[idx].data, idx, 1+parseInt(idx)) -                                 let nidx = 1+parseInt(idx); -                                 if (hist[nidx] !== undefined && hist[nidx].data.latitude !== undefined) { -                                     let marker = L.marker([hist[nidx].data.latitude, hist[nidx].data.longitude]) -                                                   .addTo(mymap); -                                     marker.bindPopup(hist[idx].data); -                                 } -                             } -                         } -                     }); - -                 }) -                 .catch((e) => { -                     console.log("some error!", e); -                     setTimeout(fetchUpdate, 3000); -                 }) -         } - -         fetchUpdate() -        </script> - -    </body> -</html> diff --git a/assets/ilztal.live/geolocation/view.html b/assets/ilztal.live/geolocation/view.html deleted file mode 100644 index 58b4c76..0000000 --- a/assets/ilztal.live/geolocation/view.html +++ /dev/null @@ -1,77 +0,0 @@ -<!doctype html> -<html class="no-js" lang=""> -    <head> -        <meta charset="utf-8"> -        <meta http-equiv="x-ua-compatible" content="ie=edge"> -        <title>Position view</title> -        <meta name="description" content=""> -        <meta name="viewport" content="width=device-width, initial-scale=1"> - -        <link rel="apple-touch-icon" href="/apple-touch-icon.png"> -        <!-- Place favicon.ico in the root directory --> - -        <link rel="stylesheet" href="https://unpkg.com/leaflet@1.5.1/dist/leaflet.css" -              integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ==" -              crossorigin=""/> -        <script src="https://unpkg.com/leaflet@1.5.1/dist/leaflet.js" -                integrity="sha512-GffPMF3RvMeYyc1LWMHtK8EbPv0iNZ8/oTtHPx9/cc2ILxQ+u905qIwdpULaqDkyBKgOaB57QTMg7ztg8Jm2Og==" -                crossorigin=""></script> - -    </head> -    <body> -        <!--[if lt IE 8]> -            <p class="browserupgrade"> -            You are using an <strong>outdated</strong> browser. Please -            <a href="http://browsehappy.com/">upgrade your browser</a> to improve -            your experience. -            </p> -        <![endif]--> - -        <div align="justify"> -          <div id="MapID2" style="height:60vh; margin-left: auto; margin-right:auto; width:80%"></div> -        </div> -        <script> -         var mymap = L.map('MapID2'); -         L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoiZmVsaXg4MTgyOTMiLCJhIjoiY2p6a2h6cjdyMGpicjNvbzlzZ3UwNmloMCJ9.a4t1KM9Gid-q29ultM7HgA', { -             attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>', -             maxZoom: 18, -             id: 'mapbox/streets-v11', -             accessToken: 'pk.eyJ1IjoiZmVsaXg4MTgyOTMiLCJhIjoiY2p6a2h6cjdyMGpicjNvbzlzZ3UwNmloMCJ9.a4t1KM9Gid-q29ultM7HgA' -         }).addTo(mymap); -         var marker = L.marker([0,0]).addTo(mymap); -         marker.bindPopup("Hello Train!"); - -         mymap.setView([0,0], 16); -         function updateMap(pos) { -             if (pos === null) { -                 console.log("no data yet?"); -                 return; -             } -             mymap.setView(pos); -             mymap.scrollWheelZoom.disable(); -             marker.setLatLng(pos); -         } -         updateMap([48.13716,11.57540]); - -         function fetchUpdate () { -             fetch("https://ilztal.live/geoloc/current") -                 .then((data) => { -                     let text = data.text().then(text => { -                         let pos = JSON.parse(text); -                         console.log(pos) -                         updateMap(pos.pos); -                     }); - -                     setTimeout(fetchUpdate, 3000); -                 }) -                 .catch((e) => { -                     console.log("some error!", e); -                     setTimeout(fetchUpdate, 3000); -                 }) -         } - -         fetchUpdate() -        </script> - -    </body> -</html> | 
