change parsing of names.json

make marker visible in menu.js

Lora-Map/Model/Botclient.cs

@@ -61,9 +61,15 @@ namespace Fraunhofer.Fit.IoT.LoraMap.Model {
       if(marker.ContainsKey(id)) {
         if(marker[id].ContainsKey("name") && marker[id]["name"].IsString) {
           this.Name = (String)marker[id]["name"];
+        } else {
+          this.Name = id;
         }
-        if(marker[id].ContainsKey("icon") && marker[id]["icon"].IsString) {
+        if(marker[id].ContainsKey("marker.svg") && marker[id]["marker.svg"].IsObject) {
+          this.Icon = Marker.ParseMarkerConfig(marker[id]["marker.svg"], this.Name);
+        } else if(marker[id].ContainsKey("icon") && marker[id]["icon"].IsString) {
           this.Icon = (String)marker[id]["icon"];
+        } else {
+          this.Icon = null;
         }
       } else {
         this.Name = id;

Lora-Map/Model/Marker.cs

@@ -1,6 +1,7 @@
 using System;
 using System.IO;
 using System.Xml;
+using LitJson;
 
 namespace Fraunhofer.Fit.IoT.LoraMap.Model
 {
@@ -12,6 +13,27 @@ namespace Fraunhofer.Fit.IoT.LoraMap.Model
       this.ParseParams(hash);
     }
 
+    public static String ParseMarkerConfig(JsonData json, String name) {
+      String ret = "icons/marker/Marker.svg";
+      if(json.ContainsKey("person") && json["person"].IsObject) {
+        ret += "?icon=person";
+        if(json["person"].ContainsKey("org") && json["person"]["org"].IsString) {
+          ret += "&person-org=" + (String)json["person"]["org"];
+        }
+        if(json["person"].ContainsKey("funct") && json["person"]["funct"].IsString) {
+          ret += "&person-funct=" + (String)json["person"]["funct"];
+        }
+        if(json["person"].ContainsKey("rang") && json["person"]["rang"].IsString) {
+          ret += "&person-rang=" + (String)json["person"]["rang"];
+        }
+        if(json["person"].ContainsKey("text") && json["person"]["text"].IsString) {
+          ret += "&person-text=" + (String)json["person"]["text"];
+        }
+      }
+      ret += (ret.Contains("?")) ? "&name=" + name : "?name=" + name;
+      return ret;
+    }
+
     private void ParseParams(String hash) {
       String[] parts = hash.Split('&');
       foreach(String part in parts) {
@@ -24,8 +46,30 @@ namespace Fraunhofer.Fit.IoT.LoraMap.Model
                 xmlname.Item(0).InnerText = keyvalue[1];
               }
               break;
+            case "marker-bg":
+              if(keyvalue[1].ToLower() == "hidden") {
+                XmlNodeList markerbg = this.svg.DocumentElement.SelectNodes("//*[local-name()='defs'][@id='global-def']");
+                if(markerbg.Count == 1) {
+                  markerbg[0].InnerXml += "<style type=\"text/css\">#marker-bg {display: none;}#marker-name {display: none;}</style>";
+                }
+                XmlNodeList root = this.svg.DocumentElement.SelectNodes("//*[local-name()='svg']");
+                if(root.Count == 1) {
+                  foreach(XmlAttribute item in root[0].Attributes) {
+                    if(item.Name.ToLower() == "height") {
+                      item.Value = "38px";
+                    }
+                    if(item.Name.ToLower() == "width") {
+                      item.Value = "40px";
+                    }
+                    if(item.Name.ToLower() == "viewbox") {
+                      item.Value = "8 35 70 100";
+                    }
+                  }
+                }
+              }
+              break;
             case "icon":
-              if(keyvalue[1] == "person") {
+              if(keyvalue[1].ToLower() == "person") {
                 XmlNodeList xmlicon = this.svg.DocumentElement.SelectNodes("//*[local-name()='defs'][@id='global-def']");
                 if (xmlicon.Count == 1) {
                   xmlicon.Item(0).InnerXml += "<style type=\"text/css\">#marker-icon #person { display: inline; }</style>";

Lora-Map/names.json

@@ -1,10 +1,24 @@
 {
   "A": {
     "name": "26/91",
-    "icon": "icons/marker/Marker.svg?name=26/91&icon=person&person-org=thw&person-funct=fueh&person-rang=zug&person-text=TZ"
+    "marker.svg": {
+      "person": {
+        "org": "thw",
+        "funct": "fueh",
+        "rang": "zug",
+        "text": "TZ"
+      }
+    }
   },
   "C": {
     "name": "27/92",
-    "icon": "icons/marker/Marker.svg?name=27/92&icon=person&person-org=thw&person-funct=fueh&person-rang=trupp&person-text=B1"
+    "marker.svg": {
+      "person": {
+        "org": "thw",
+        "funct": "fueh",
+        "rang": "trupp",
+        "text": "B1"
+      }
+    }
   }
 }

Lora-Map/resources/icons/marker/Marker.svg

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 
-<svg width="86mm" height="121.25mm" viewBox="0 0 86 121.25" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:xlink="http://www.w3.org/1999/xlink">
+<svg width="86mm" height="121.25mm" viewBox="0 0 86 121.25" preserveAspectRatio="xMinYMin slice" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:xlink="http://www.w3.org/1999/xlink">
     <defs id="global-def">
         <style type="text/css">
             @font-face {

Lora-Map/resources/js/menu.js

@@ -69,9 +69,17 @@ function updateStatus() {
       divItem.appendChild(spanColor);
       var spanIcon = document.createElement("span");
       spanIcon.className = "icon";
-      var imgIcon = document.createElement("img");
+      if (markeritem['Icon'] !== null) {
-      imgIcon.src = "icons/marker/map-marker.png";
+        var objectIcon = document.createElement("object");
-      spanIcon.appendChild(imgIcon);
+        objectIcon.data = markeritem['Icon'] + "&marker-bg=hidden";
+        objectIcon.type = "image/svg+xml";
+        //<object data="'+markeritem['Icon']+'" type="image/svg+xml" style="height:80px; width:56px;"></object>
+        spanIcon.appendChild(objectIcon);
+      } else {
+        var imgIcon = document.createElement("img");
+        imgIcon.src = "icons/marker/map-marker.png";
+        spanIcon.appendChild(imgIcon)
+      }
       divItem.appendChild(spanIcon);
       var divLine1 = document.createElement("div");
       divLine1.className = "line1";