Skip to content

Commit 4c0e860

Browse files
dl9rdzdl9rdz
committed
v1.0.4
1 parent 31584d2 commit 4c0e860

File tree

3 files changed

+67
-41
lines changed

3 files changed

+67
-41
lines changed

‎www/css/index.css‎

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,9 @@ html, body {
106106
padding: 0px;
107107
float: right;
108108
}
109+
.infomax {
110+
width: 99%;
111+
}
109112

110113
.tawhiridiv {
111114
background-color: #ecfedf;
@@ -166,7 +169,7 @@ html, body {
166169
font-size: 5vw;
167170
}
168171
.infocontentl3 {
169-
font-size: 6vw;
172+
font-size: 5.5vw;
170173
}
171174
.infocontentl4 {
172175
font-size: 5vw;
@@ -245,6 +248,13 @@ html, body {
245248
right: 0;
246249
}
247250

251+
.leaflet-control-container .leaflet-control-topcenter {
252+
position: absolute;
253+
top: 0;
254+
left: 0;
255+
right: 0;
256+
}
257+
248258

249259
/* Portrait layout (default) */
250260
.app {
@@ -317,3 +327,12 @@ h1 {
317327
background-image:linear-gradient(to bottom, #585858 0%, #1B1B1B 51%);
318328
}
319329
}
330+
331+
.leaflet-container .leaflet-control-mouseposition {
332+
background-color: rgba(255, 255, 255, 0.7);
333+
box-shadow: 0 0 5px #bbb;
334+
padding: 0 2px;
335+
margin:0;
336+
color: #333;
337+
font: 11px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
338+
}

‎www/index.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@
4646
<script src="https://cdn.jsdelivr.net/npm/leaflet-easybutton@2/src/easy-button.js"></script>
4747
-->
4848
<script src="js/easy-button.js"></script>
49+
<script src="js/L.Control.MousePosition.js"></script>
4950

5051
<title>rdzSondyGO V1.0.4</title>
5152
</head>

‎www/js/index.js‎

Lines changed: 46 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -38,14 +38,17 @@ var infobox = null;
3838
var checkMark = "&#x2714;";
3939
var crossMark = "&#x274C;";
4040

41-
// add "bottom center" to leaflet
41+
// add "top center" and "bottom center" to leaflet
4242
(function (L) {
4343
L.Map.prototype._initControlPos = function(_initControlPos) {
4444
return function() {
4545
_initControlPos.apply(this, arguments); // original function
4646
this._controlCorners['bottomcenter'] = L.DomUtil.create('div', 'leaflet-bottom leaflet-center',
4747
L.DomUtil.create('div', 'leaflet-control-bottomcenter', this._controlContainer)
4848
);
49+
this._controlCorners['topcenter'] = L.DomUtil.create('div', 'leaflet-top leaflet-center',
50+
L.DomUtil.create('div', 'leaflet-control-topcenter', this._controlContainer)
51+
);
4952
};
5053
} (L.Map.prototype._initControlPos);
5154
}(L, this, document));
@@ -106,7 +109,7 @@ function onDeviceReady() {
106109
"OpenCycleMap": tfcycle,
107110
"OpenTopoMap" : opentopo,
108111
"Sat": sat,
109-
"Hybdir": hybrid
112+
"Sat/Hybrid": hybrid
110113
<!-- 'Offline': offline -->
111114
};
112115

@@ -158,7 +161,7 @@ function onDeviceReady() {
158161
tawhiriContent.appendChild(infoContent);
159162
this._tawhiriBody = tawhiriBody;
160163
this._infoCloseButton = infoCloseButton;
161-
//this._showContent();
164+
this._hideContent();
162165

163166
L.DomEvent.disableClickPropagation(tawhiriContainer);
164167
L.DomEvent.on(infoCloseButton, 'click', L.DomEvent.stop);
@@ -181,7 +184,7 @@ function onDeviceReady() {
181184
})
182185
tawhiriCtl = new TawhiriCtl();
183186
tawhiriCtl.addTo(map);
184-
187+
185188

186189
var Infobox = L.Control.extend({
187190
options: { position: 'bottomcenter' },
@@ -223,6 +226,8 @@ function onDeviceReady() {
223226
*/
224227
this._icd = 0;
225228
this._layout = 0;
229+
this._gpsHeading = 0;
230+
this._gpsHeadingGood = false;
226231
return infoContainer;
227232
},
228233
toggle: function() {
@@ -236,9 +241,9 @@ function onDeviceReady() {
236241
if(obj.type == null) obj.type = "RS41"; // TODO fix in plugin
237242
distance = "";
238243
distance = L.latLng(obj).distanceTo(L.latLng(mypos))
239-
if(distance>9999) { distance = distance.toFixed(0); }
240-
else { distance = distance.toFixed(1); }
241-
distance = "d=" + distance + "m";
244+
if(distance>9999) { distance = "d=" + (0.001*distance).toFixed(1) + "km"; }
245+
else if (distance>99) { distance = "d=" + distance.toFixed(0) + "m"; }
246+
else { distance = "d=" + distance.toFixed(1) + "m"; }
242247
sym = "<span class=\"lifenessinfo\">&#x2B24; </span>";
243248
l1 = "<table class=\"infotable\"><tr><td class=\"infotd\">" + sym + obj.type + "</td><td class=\"infotdr\">" + obj.ser + "</td></tr></table>";
244249
// normal layout
@@ -258,12 +263,12 @@ function onDeviceReady() {
258263
'<rect visible=0 id="imgCompDir" x="46" y="12" width="8" height="16" transform="rotate(' + (this._icd) + ',50,60)"/>' +
259264
'<line id="imgToSonde" x1="50" y1="60" x2="50" y2="20" stroke="#f00" stroke-width="2" marker-end="url(#arrowhead)" transform="rotate('
260265
+ b + ',50,60)" />' +
261-
'<circle id="imgMoveDir" cx="50" cy="20" r="5" stroke="black" stroke-width="1" fill="lightgray" /> ' +
266+
'<circle id="imgMoveDir" cx="50" cy="20" r="5" stroke="black" stroke-width="1" fill="' + (this._gpsHeadingGood?"yellow":"lightgray") + '" transform="rotate(' + this._gpsHeading + ',50,60)"/> ' +
262267
'</svg> ';
263-
l2 += '</td><td class="infotd">';
264-
l2 += 'd=' + distance + '<br>';
268+
l2 += '</td><td class="infotd infomax">';
269+
l2 += distance + '<br>';
265270
l2 += '<span class="infocontentl3">'+ obj.alt.toFixed(0) + "m "+obj.vs+'m/s </span><br>';
266-
l2 += (obj.hs*3.6).toFixed(1)+'km/h<br>';
271+
l2 += '<span class="infocontentl3">'+ (obj.hs*3.6).toFixed(1)+' km/h</span><br>';
267272
l2 += 'RSSI: '+ -0.5*obj.rssi + '</td></tr></table>'
268273
l3 = "";
269274
l4 = "";
@@ -309,20 +314,21 @@ function onDeviceReady() {
309314
icd.setAttribute("transform","rotate(" + infobox._icd + ",50,60)");
310315
},
311316
_updateMypos: function(obj) {
312-
this._gpsHeading = obj.dir;
317+
if(obj.dir>0) { this._gpsHeading = obj.dir; this._gpsHeadingGood = true; } else { this._gpsHeadingGood = false; }
313318
console.log("update GPS dir: "+obj.dir);
314319
if(this._contentShown && this._layout==1) {
315320
var imd = document.getElementById("imgMoveDir");
316321
if(!imd) return;
317-
if(this._gpsHeading == 0) {
322+
if(this._gpsHeadingGood == false) {
318323
imd.setAttribute("fill", "lightgray");
324+
imd.setAttribute("transform", "rotate(" + this._gpsHeading + ",50,60)");
319325
} else {
320326
imd.setAttribute("fill", "yellow");
321327
imd.setAttribute("transform", "rotate(" + this._gpsHeading + ",50,60)");
322328
}
323329
if(obj.hdop<0) { // GPS fix lost
324330
} else {
325-
var p0 = L.latLng(myPos);
331+
var p0 = L.latLng(mypos);
326332
var p1 = L.latLng(obj);
327333
var b = p0.bearingTo(p1);
328334
var d = p0.distanceTo(p1);
@@ -358,7 +364,7 @@ function onDeviceReady() {
358364
ttgourl: "http://192.168.42.1",
359365
states: [{ stateName: 'offline',
360366
icon: '<span class="ttgostatus">' + crossMark + '</span>'
361-
, onClick: function(btn, map) { btn.state('online'); }
367+
, onClick: function(btn, map) { /* just for testing btn.state('online');*/ }
362368
},
363369
{ stateName: 'online',
364370
icon: '<span style="color: transparent; text-shadow: 0 0 0 #009900; font-size:15pt" class="ttgostatus">' + checkMark + '</span>',
@@ -380,6 +386,8 @@ function onDeviceReady() {
380386
ttgoStatus.addTo(map);
381387

382388
// '<span class="ttgosttus">&#9989;</span>', )
389+
L.control.mousePosition({position: 'bottomleft', emptyString: ''}).addTo(map);
390+
383391

384392
ballonIcon = L.icon({
385393
iconUrl: "img/ballon.png",
@@ -407,10 +415,17 @@ function onDeviceReady() {
407415
update( {res: 0, validId: 1, validPos: 127, id: "A1234567", lat: 48, lon: 13, alt: 10000, vs: 10, hs: 30, rssi: -90, rxStat: "||||||||||||....", type: "RS41", freq: "400.000", afc: "+1.2", ser: "A1234567"} );
408416
var g = localStorage.getItem('lastgps');
409417
if(g) { mypos = JSON.parse( g ); }
410-
//TODO: hackish, not elegant
411-
mypos.hdop = 25;
412-
updateMypos(mypos);
413418
mypos.hdop = -1;
419+
420+
// create mypos marker
421+
myposMarker = new L.marker(mypos, {
422+
contextmenu: true,
423+
contextmenuItems: [{
424+
text: "Zoom to location",
425+
callback: function(e) { b=new L.LatLngBounds([myposMarker.getLatLng()]); map.fitBounds(b, {maxZoom: 16}); }
426+
}]
427+
});
428+
myposMarker.addTo(map);
414429
updateMypos(mypos);
415430

416431
document.addEventListener("pause", onPause);
@@ -460,7 +475,7 @@ function formatParams(params) {
460475
}
461476

462477
// borrowed from wetterson.de/karte .....
463-
function calc_drag(drag,alt){
478+
function calc_drag(drag,alt,desc){
464479
if (alt < 1000 ){
465480
drag = drag * 1;
466481
} else if (alt < 2000){
@@ -482,7 +497,7 @@ function calc_drag(drag,alt){
482497
dragfak = (( alt - 10000 )* ( 0.3 - 0.55) / ( 20000 - 10000)) + 0.55;
483498
drag = drag * dragfak;
484499
} else {
485-
drag = 5;
500+
drag = desc;
486501
}
487502
return drag;
488503
}
@@ -530,7 +545,7 @@ function getPrediction(refobj) {
530545
tParams["ascent_rate"] = usecurrent ? vs : asc;
531546
tParams["burst_altitude"] = burst;
532547
} else {
533-
tParams["descent_rate"] = usecurrent ? calc_drag( -vs, refobj.obj.alt ) : desc;
548+
tParams["descent_rate"] = usecurrent ? calc_drag( -vs, refobj.obj.alt, desc ) : desc;
534549
}
535550
const xhr = new XMLHttpRequest();
536551
const url = TAWHIRI + formatParams(tParams);
@@ -577,7 +592,7 @@ function getPrediction(refobj) {
577592
var popup = '<div class="pop-header"><img src="img/landing.png"><h4> Landing Point </h4></div>' +
578593
'<strong>Time: ' + lastpt.datetime + '</strong><br/>' +
579594
'<strong>(' + new Date(lastpt.datetime).toTimeString().split(" (")[0] + ')</strong><br/>' +
580-
'<p> Altitude: ' + lastpt.altitude.toFixed(2) + ' m'+
595+
'<p> Altitude: ' + lastpt.altitude.toFixed(1) + ' m'+
581596
'</br>Asc. Rate: ' + tParams["ascent_rate"].toFixed(2) + ' m/s'+
582597
'</br>Burst: ' + tParams["burst_altitude"] + ' m'+
583598
'</br>Desc. Rate: ' + tParams["descent_rate"].toFixed(2) + ' m/s</p>' +
@@ -615,20 +630,8 @@ function updateMypos(obj) {
615630
}
616631
mypos = obj;
617632
var pos = [obj.lat, obj.lon];
618-
if(myposMarker == null) {
619-
// create marker
620-
myposMarker = new L.marker(pos, {
621-
contextmenu: true,
622-
contextmenuItems: [{
623-
text: "Zoom to location",
624-
callback: function(e) { b=new L.LatLngBounds([myposMarker.getLatLng()]); map.fitBounds(b, {maxZoom: 16}); }
625-
}]
626-
});
627-
myposMarker.addTo(map);
628-
} else {
629-
myposMarker.setLatLng(pos);
630-
myposMarker.update();
631-
}
633+
myposMarker.setLatLng(pos);
634+
myposMarker.update();
632635
if(myposMarker.hdop) {
633636
myposMarker.hdopCircle.setLatLng(pos)
634637
if(obj.hdop != myposMarker.hdop) {
@@ -637,8 +640,8 @@ function updateMypos(obj) {
637640
}
638641
} else {
639642
if(obj.hdop) {
640-
myposMarker.hdop = obj.hdop;
641643
myposMarker.hdopCircle = L.circle(pos, {radius: obj.hdop, dashArray: "2 2" }).addTo(map);
644+
myposMarker.hdop = obj.hdop;
642645
}
643646
}
644647
}
@@ -647,10 +650,10 @@ var lastMsgTS = 0;
647650

648651
function periodicStatusCheck() {
649652
now = new Date();
650-
if( lastMsgTS && (now-lastMsgTS) > 5000 ) {
653+
if( lastMsgTS && (now-lastMsgTS) > 10000 ) {
651654
// handle connection broken (if still connnected)
652655
//alert("Closing conn: "+now+" vs "+lastMsgTS);
653-
console.log("no data for 5 seconds, closing connection to rdzTTGOsonde");
656+
console.log("no data for 10 seconds, closing connection to rdzTTGOsonde");
654657
lastMsgTS = 0;
655658
RdzWx.closeconn("", function(){});
656659
}
@@ -666,6 +669,7 @@ function update(obj) {
666669
if(obj.msgtype == "ttgostatus") {
667670
ttgoStatus.ttgourl = 'http://' + obj.ip;
668671
ttgoStatus.state(obj.state)
672+
if(obj.state=="offline") { infobox.setStatus(1); }
669673
}
670674
if(obj.msgtype == "gps") {
671675
updateMypos(obj);
@@ -676,6 +680,7 @@ function update(obj) {
676680

677681
// position update
678682
//console.log("Pos update: "+JSON.stringify(obj));
683+
if(obj.egmdiff && obj.alt) { obj.alt -= obj.egmdiff; }
679684
infobox.setContent(obj);
680685
infobox.setStatus(obj.res);
681686
var isValidPos = true
@@ -692,6 +697,7 @@ function update(obj) {
692697
marker = createNewMarker(obj);
693698
updateMarkerTooltip(marker, obj);
694699
markers[obj.id] = marker;
700+
lastMarker = marker
695701
} else {
696702
console.log("pos update: No valid update: "+JSON.stringify(obj));
697703
}
@@ -712,7 +718,7 @@ function update(obj) {
712718
updateMarkerTooltip(marker, obj);
713719
}
714720
function updateMarkerTooltip(marker, obj) {
715-
var tt = '<div class="tooltip-container">' + obj.id + '<div class="text-speed tooltip-container">' + obj.alt + 'm '+ obj.vs +'m/s ' + (obj.hs*3.6).toFixed(1) + 'km/h </div></div>';
721+
var tt = '<div class="tooltip-container">' + obj.id + '<div class="text-speed tooltip-container">' + obj.alt.toFixed(1) + 'm '+ obj.vs +'m/s ' + (obj.hs*3.6).toFixed(1) + 'km/h </div></div>';
716722
marker.tt.setContent(tt);
717723
marker.setLatLng( new L.LatLng(obj.lat, obj.lon));
718724
marker.obj = obj;

0 commit comments

Comments
 (0)