Fallback to pointMatchers when identifying icons for waypoints (closes …

…#106)
mpetazzoni · Feb 21, 2021 · 5ffe543 · 5ffe543
1 parent 9877256
commit 5ffe543
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 31 deletions.
diff --git a/README.md b/README.md
@@ -33,13 +33,13 @@ scripts in your HTML page:
 ```html
 <html>
   <head>
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.3.1/leaflet.css" />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/leaflet.css" />
     <!-- ... -->
   </head>
   <body>
     <!-- ... -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.3.1/leaflet.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-gpx/1.4.0/gpx.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/leaflet.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-gpx/1.5.1/gpx.min.js"></script>
   </body>
 </html>
 ```
@@ -248,7 +248,8 @@ markers_).
 
 Each named point in the GPX track is evaluated against those rules and
 a marker is created with the point's name as label from the first
-matching rule.
+matching rule. This also applies to named waypoints, but keep in mind
+that waypoint icons rules take precedence over point matchers.
 
 ```javascript
 new L.GPX(app.params.gpx_url, {

diff --git a/gpx.js b/gpx.js
@@ -361,57 +361,59 @@ L.GPX = L.FeatureGroup.extend({
             el[i].getAttribute('lon'));
 
         var nameEl = el[i].getElementsByTagName('name');
-        var name = '';
-        if (nameEl.length > 0) {
-          name = nameEl[0].textContent;
-        }
+        var name = nameEl.length > 0 ? nameEl[0].textContent : null;
 
         var descEl = el[i].getElementsByTagName('desc');
-        var desc = '';
-        if (descEl.length > 0) {
-          desc = descEl[0].textContent;
-        }
+        var desc = descEl.length > 0 ? descEl[0].textContent : null;
 
         var symEl = el[i].getElementsByTagName('sym');
-        var symKey = '';
-        if (symEl.length > 0) {
-          symKey = symEl[0].textContent;
-        }
-
+        var symKey = symEl.length > 0 ? symEl[0].textContent : null;
+
         var typeEl = el[i].getElementsByTagName('type');
-        var typeKey = '';
-        if (typeEl.length > 0) {
-          typeKey = typeEl[0].textContent;
-        }
-
+        var typeKey = typeEl.length > 0 ? typeEl[0].textContent : null;
+
         /*
          * Add waypoint marker based on the waypoint symbol key.
          *
          * First look for a configured icon for that symKey. If not found, look
          * for a configured icon URL for that symKey and build an icon from it.
+         * If none of those match, look through the point matchers for a match
+         * on the waypoint's name.
+         *
          * Otherwise, fall back to the default icon if one was configured, or
-         * finally to the default icon URL.
+         * finally to the default icon URL, if one was configured.
          */
         var wptIcons = options.marker_options.wptIcons;
         var wptIconUrls = options.marker_options.wptIconUrls;
         var wptIconsType = options.marker_options.wptIconsType;
         var wptIconTypeUrls = options.marker_options.wptIconTypeUrls;
+        var ptMatchers = options.marker_options.pointMatchers || [];
         var symIcon;
-        if (wptIcons && wptIcons[symKey]) {
+        if (wptIcons && symKey && wptIcons[symKey]) {
           symIcon = wptIcons[symKey];
-        } else if (wptIconsType && wptIconsType[typeKey]){
+        } else if (wptIconsType && typeKey && wptIconsType[typeKey]) {
           symIcon = wptIconsType[typeKey];
-        } else if (wptIconUrls && wptIconUrls[symKey]){
+        } else if (wptIconUrls && symKey && wptIconUrls[symKey]) {
           symIcon = new L.GPXTrackIcon({iconUrl: wptIconUrls[symKey]});
-        } else if (wptIconTypeUrls && wptIconTypeUrls[typeKey]){
-          symIcon = new L.GPXTrackIcon({iconUrl: wptIconTypeUrls[typeKey]});	
+        } else if (wptIconTypeUrls && typeKey && wptIconTypeUrls[typeKey]) {
+          symIcon = new L.GPXTrackIcon({iconUrl: wptIconTypeUrls[typeKey]});
+        } else if (ptMatchers.length > 0) {
+          for (var j = 0; j < ptMatchers.length; j++) {
+            if (ptMatchers[j].regex.test(name)) {
+              symIcon = ptMatchers[j].icon;
+              break;
+            }
+          }
         } else if (wptIcons && wptIcons['']) {
           symIcon = wptIcons[''];
         } else if (wptIconUrls && wptIconUrls['']) {
           symIcon = new L.GPXTrackIcon({iconUrl: wptIconUrls['']});
-        } else {
-          console.log('No icon or icon URL configured for symbol type "' + symKey
-            + '", and no fallback configured; ignoring waypoint.');
+        }
+
+        if (!symIcon) {
+          console.log(
+            'No waypoint icon could be matched for symKey=%s,typeKey=%s,name=%s on waypoint %o',
+            symKey, typeKey, name, el[i]);
           continue;
         }