node page: display GPS coordinates next to toggle button
This commit is contained in:
parent
7c60ebddf5
commit
780fce0fc8
|
@ -13,6 +13,10 @@ body {
|
||||||
line-height: 1.3;
|
line-height: 1.3;
|
||||||
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
|
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
|
||||||
}
|
}
|
||||||
|
.withTextMargins {
|
||||||
|
margin-left: 0.5em;
|
||||||
|
margin-right: 0.5em;
|
||||||
|
}
|
||||||
span.online {
|
span.online {
|
||||||
color: #009ee0;
|
color: #009ee0;
|
||||||
}
|
}
|
||||||
|
|
|
@ -98,6 +98,9 @@ export class NodeView extends View {
|
||||||
if (this.gpsPosition) {
|
if (this.gpsPosition) {
|
||||||
this.updatePosition(this.gpsPosition.latitude, this.gpsPosition.longitude);
|
this.updatePosition(this.gpsPosition.latitude, this.gpsPosition.longitude);
|
||||||
}
|
}
|
||||||
|
else {
|
||||||
|
this.gpsStatusText.innerHTML = "";
|
||||||
|
}
|
||||||
this.btnGPS.innerHTML = 'Start follow position';
|
this.btnGPS.innerHTML = 'Start follow position';
|
||||||
navigator.geolocation.clearWatch(this.editLocationGPS);
|
navigator.geolocation.clearWatch(this.editLocationGPS);
|
||||||
this.editLocationGPS = null;
|
this.editLocationGPS = null;
|
||||||
|
@ -105,10 +108,15 @@ export class NodeView extends View {
|
||||||
}
|
}
|
||||||
|
|
||||||
this.gpsPosition = null;
|
this.gpsPosition = null;
|
||||||
this.btnGPS.innerHTML = 'Following position';
|
this.btnGPS.innerHTML = 'Stop following';
|
||||||
|
this.gpsStatusText.innerHTML = "waiting for location...";
|
||||||
if (navigator.geolocation) {
|
if (navigator.geolocation) {
|
||||||
this.editLocationGPS = navigator.geolocation.watchPosition((position) => {
|
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;
|
this.gpsPosition = position.coords;
|
||||||
const latlng = [position.coords.latitude, position.coords.longitude];
|
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');
|
notify.send('error', 'Browser did not support Location');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
this.gpsStatusText = domlib.newAt(this.el, 'span');
|
||||||
|
this.gpsStatusText.classList.add('withTextMargins');
|
||||||
}
|
}
|
||||||
|
|
||||||
updatePosition (lat, lng) {
|
updatePosition (lat, lng) {
|
||||||
|
|
Loading…
Reference in New Issue