node page: display GPS coordinates next to toggle button

This commit is contained in:
Oliver Gerlich 2018-07-16 19:02:11 +02:00
parent 7c60ebddf5
commit 780fce0fc8
2 changed files with 16 additions and 2 deletions

View File

@ -13,6 +13,10 @@ body {
line-height: 1.3;
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}
.withTextMargins {
margin-left: 0.5em;
margin-right: 0.5em;
}
span.online {
color: #009ee0;
}

View File

@ -98,6 +98,9 @@ export class NodeView extends View {
if (this.gpsPosition) {
this.updatePosition(this.gpsPosition.latitude, this.gpsPosition.longitude);
}
else {
this.gpsStatusText.innerHTML = "";
}
this.btnGPS.innerHTML = 'Start follow position';
navigator.geolocation.clearWatch(this.editLocationGPS);
this.editLocationGPS = null;
@ -105,10 +108,15 @@ export class NodeView extends View {
}
this.gpsPosition = null;
this.btnGPS.innerHTML = 'Following position';
this.btnGPS.innerHTML = 'Stop following';
this.gpsStatusText.innerHTML = "waiting for location...";
if (navigator.geolocation) {
this.editLocationGPS = navigator.geolocation.watchPosition((position) => {
this.btnGPS.innerHTML = 'Stop following';
this.gpsStatusText.innerHTML = "GPS location at " +
new Date(position.timestamp).toLocaleTimeString() + ": " +
position.coords.latitude.toFixed(5) + " / " +
position.coords.longitude.toFixed(5);
this.gpsPosition = position.coords;
const latlng = [position.coords.latitude, position.coords.longitude];
@ -132,6 +140,8 @@ export class NodeView extends View {
notify.send('error', 'Browser did not support Location');
}
});
this.gpsStatusText = domlib.newAt(this.el, 'span');
this.gpsStatusText.classList.add('withTextMargins');
}
updatePosition (lat, lng) {