[1.2.5] #10 text Letzer Datenempfang is too long when scrollbar is there and #11 set textsize for every zoomlevel

Lora-Map/Properties/AssemblyInfo.cs

@@ -10,7 +10,7 @@ using System.Runtime.InteropServices;
 [assembly: AssemblyConfiguration("")]
 [assembly: AssemblyCompany("Fraunhofer FIT")]
 [assembly: AssemblyProduct("Lora-Map")]
-[assembly: AssemblyCopyright("Copyright ©  2018 - 28.04.2019")]
+[assembly: AssemblyCopyright("Copyright ©  2018 - 29.04.2019")]
 [assembly: AssemblyTrademark("Fraunhofer FIT, BlubbFish")]
 [assembly: AssemblyCulture("")]
 [assembly: NeutralResourcesLanguage("de-DE")]
@@ -33,8 +33,8 @@ using System.Runtime.InteropServices;
 // Sie können alle Werte angeben oder Standardwerte für die Build- und Revisionsnummern verwenden,
 // übernehmen, indem Sie "*" eingeben:
 // [assembly: AssemblyVersion("1.0.*")]
-[assembly: AssemblyVersion("1.2.4")]
+[assembly: AssemblyVersion("1.2.5")]
-[assembly: AssemblyFileVersion("1.2.4")]
+[assembly: AssemblyFileVersion("1.2.5")]
 
 /*
 * 1.1.1 Add Debian package config
@@ -49,4 +49,5 @@ using System.Runtime.InteropServices;
 * 1.2.2 Bugfix, if only recieve panic packet with gps data, update the marker on the map also
 * 1.2.3 #9 display polygons and marker on the map
 * 1.2.4 Can draw Textmarkers on the Map, use MGRS (UTM) on the Map
+* 1.2.5 #10 text Letzer Datenempfang is too long when scrollbar is there and #11 set textsize for every zoomlevel
 */

Lora-Map/resources/admin/js/menu.js

@@ -266,7 +266,7 @@ var ExImport = {
   ParseJson: function (jsonnames, jsongeo) {
     html = "<div id='eximport'><div class='title'>Ex- und Import der Einstellungen</div>";
     html += "<div class='names'>names.json (Namen und Icons)<br/><textarea id='ex_names'></textarea> <img src='../icons/general/save.png' onclick='ExImport.SaveNames()' class='pointer'></div>";
-    html += "<div class='names'>geo.json (Layer on the MAP)<br/><textarea id='ex_geo'></textarea> <img src='../icons/general/save.png' onclick='ExImport.SaveGeo()' class='pointer'></div>";
+    html += "<div class='names'>geo.json (Layer on the MAP) <a href='https://mapbox.github.io/togeojson/'>Kml Konverter</a><br/><textarea id='ex_geo'></textarea> <img src='../icons/general/save.png' onclick='ExImport.SaveGeo()' class='pointer'></div>";
     html += "</div>";
     document.getElementById("content").innerHTML = html;
     document.getElementById("ex_names").value = jsonnames;

Lora-Map/resources/css/global.css

@@ -12,7 +12,7 @@
 }
 #bigmap .leaflet-map-pane .leaflet-marker-pane .snumber-icon {
   font-weight: bold;
-  font-size: 9px;
+  font-size: 5px;
 }
 #bigmap .leaflet-map-pane .leaflet-marker-pane .coord-icon {
   font-size: 13px;

Lora-Map/resources/js/map.js

@@ -76,7 +76,8 @@ function GetGeoLayer() {
             var snumbericon = L.marker(latlng, {
               icon: new L.DivIcon({
                 className: "snumber-icon",
-                html: geoJsonPoint.properties["name"]
+                html: geoJsonPoint.properties["name"],
+                iconSize: [8, 8]
               })
             });
             SpecialMarkers.push(snumbericon);
@@ -103,46 +104,81 @@ function GetGeoLayer() {
 
 mymap.on('zoomend', function () {
   var currentZoom = mymap.getZoom();
-  if (currentZoom < 16) {
+  if (currentZoom < 14) {
     SpecialMarkers.forEach(function (elem, index) {
       if (elem.feature.properties["description"] === "snumber") {
-        elem._icon.style.fontSize = "1px";
+        elem._icon.style.fontSize = "0px";
+        elem._icon.style.marginLeft = "0px";
+        elem._icon.style.marginTop = "0px";
       }
       if (elem.feature.properties["description"] === "coord") {
-        elem._icon.style.fontSize = "1px";
+        elem._icon.style.fontSize = "0px";
       }
     });
-  } else if (currentZoom < 16) {
+  } else if (currentZoom == 14) {
+    SpecialMarkers.forEach(function (elem, index) {
+      if (elem.feature.properties["description"] === "snumber") {
+        elem._icon.style.fontSize = "0px";
+        elem._icon.style.marginLeft = "0px";
+        elem._icon.style.marginTop = "0px";
+      }
+      if (elem.feature.properties["description"] === "coord") {
+        elem._icon.style.fontSize = "6px";
+      }
+    });
+  } else if (currentZoom == 15) {
+    SpecialMarkers.forEach(function (elem, index) {
+      if (elem.feature.properties["description"] === "snumber") {
+        elem._icon.style.fontSize = "0px";
+        elem._icon.style.marginLeft = "0px";
+        elem._icon.style.marginTop = "0px";
+      }
+      if (elem.feature.properties["description"] === "coord") {
+        elem._icon.style.fontSize = "9px";
+      }
+    });
+  } else if (currentZoom == 16) {
     SpecialMarkers.forEach(function (elem, index) {
       if (elem.feature.properties["description"] === "snumber") {
         elem._icon.style.fontSize = "5px";
+        elem._icon.style.marginLeft = "-4px";
+        elem._icon.style.marginTop = "-4px";
       }
       if (elem.feature.properties["description"] === "coord") {
-        elem._icon.style.fontSize = "8px";
+        elem._icon.style.fontSize = "13px";
       }
     });
-  } else if (currentZoom < 17) {
+  } else if (currentZoom == 17) {
+    SpecialMarkers.forEach(function (elem, index) {
+      if (elem.feature.properties["description"] === "snumber") {
+        elem._icon.style.fontSize = "5px";
+        elem._icon.style.marginLeft = "-4px";
+        elem._icon.style.marginTop = "-4px";
+      }
+      if (elem.feature.properties["description"] === "coord") {
+        elem._icon.style.fontSize = "16px";
+      }
+    });
+  } else if (currentZoom == 18) {
     SpecialMarkers.forEach(function (elem, index) {
       if (elem.feature.properties["description"] === "snumber") {
         elem._icon.style.fontSize = "8px";
+        elem._icon.style.marginLeft = "-5px";
+        elem._icon.style.marginTop = "-6px";
       }
       if (elem.feature.properties["description"] === "coord") {
-        elem._icon.style.fontSize = "12px";
+        elem._icon.style.fontSize = "25px";
       }
     });
-  } else if (currentZoom < 18) {
+  } else if (currentZoom == 19) {
     SpecialMarkers.forEach(function (elem, index) {
-      if (elem.feature.properties["description"] === "coord") {
+      if (elem.feature.properties["description"] === "snumber") {
         elem._icon.style.fontSize = "14px";
+        elem._icon.style.marginLeft = "-8px";
+        elem._icon.style.marginTop = "-11px";
       }
-    });
-  } else {
-    SpecialMarkers.forEach(function (elem, index) {
       if (elem.feature.properties["description"] === "coord") {
-        elem._icon.style.fontSize = "17px";
+        elem._icon.style.fontSize = "45px";
-      }
-      if (elem.feature.properties["description"] === "snumber") {
-        elem._icon.style.fontSize = "12px";
       }
     });
   }

Lora-Map/resources/js/menu.js

@@ -93,7 +93,7 @@ function updateOverviewElement(positionItem, id) {
     document.getElementById("overview-gps-id-" + id).innerText = "kein GPS-Empfang";
     document.getElementById("overview-gps-id-" + id).style.color = "red";
   }
-  document.getElementById("overview-update-id-" + id).innerText = "Letzter Datenempfang: vor " + timeCalculation(positionItem["Recievedtime"], "difftext");
+  document.getElementById("overview-update-id-" + id).innerText = "Letzte Werte: vor " + timeCalculation(positionItem["Recievedtime"], "difftext");
   if (positionItem['Icon'] === null) {
     var icon = document.getElementById("overview-icon-id-" + id);
     if (icon.children[0].hasAttribute("data")) {
@@ -126,7 +126,7 @@ function createOverviewElement(positionItem, id) {
     "<span class=\"akku\"><img id=\"overview-akkuimg-id-" + id + "\" src=\"icons/akku/" + positionItem["Batterysimple"] + "-4.png\"></span>" +
     "</div>";
   divItem.innerHTML += "<div class=\"line2\" style=\"color: red;\" id=\"overview-gps-id-" + id + "\">kein GPS-Empfang</div>";
-  divItem.innerHTML += "<div class=\"line3\" id=\"overview-update-id-" + id + "\">Letzter Datenempfang: vor " + timeCalculation(positionItem["Recievedtime"], "difftext") + "</div>";
+  divItem.innerHTML += "<div class=\"line3\" id=\"overview-update-id-" + id + "\">Letzte Werte: vor " + timeCalculation(positionItem["Recievedtime"], "difftext") + "</div>";
   return divItem;
 }