Move OverlappingMarkerSpiderfier from player-tracker to core. Implement for bookmarks and draw tools

(Markers added to OMS shouldn't use the "click" event but "spiderfiedclick")

code/boot.js

@@ -560,6 +560,7 @@ function boot() {
   window.setupStyles();
   window.setupDialogs();
   window.setupMap();
+  window.setupOMS();
   window.setupGeosearch();
   window.setupRedeem();
   window.setupLargeImagePreview();
@@ -657,6 +658,7 @@ try { console.log('Loading included JS now'); } catch(e) {}
 // contains the default Ingress map style.
 @@INCLUDERAW:external/Google.js@@
 @@INCLUDERAW:external/autolink.js@@
+@@INCLUDERAW:external/oms.min.js@@
 
 try { console.log('done loading included JS'); } catch(e) {}
 

code/oms.js

@@ -0,0 +1,25 @@
+/*
+OMS doesn't cancel the original click event, so the topmost marker will get a click event while spiderfying.
+Also, OMS only supports a global callback for all managed markers. Therefore, we will use a custom event that gets fired
+for each marker.
+*/
+
+window.setupOMS = function() {
+  window.oms = new OverlappingMarkerSpiderfier(map, {
+    keepSpiderfied: true,
+    legWeight: 3.5,
+    legColors: {
+      usual: '#FFFF00',
+      highlighted: '#FF0000'
+    }
+  });
+
+  window.oms.addListener('click', function(marker) {
+    map.closePopup();
+    marker.fireEvent('spiderfiedclick', {target: marker});
+  });
+  window.oms.addListener('spiderfy', function(markers) {
+    map.closePopup();
+  });
+}
+

plugins/bookmarks-by-zaso.user.js

@@ -1018,7 +1018,9 @@
         iconSize: [30,40]
       })
     });
-    star.on('click', function() { renderPortalDetails(guid); });
+    window.oms.addMarker(star);
+    star.on('remove', function() { window.oms.removeMarker(star); });
+    star.on('spiderfiedclick', function() { renderPortalDetails(guid); });
 
     window.plugin.bookmarks.starLayers[guid] = star;
     star.addTo(window.plugin.bookmarks.starLayerGroup);

plugins/draw-tools.user.js

@@ -258,6 +258,10 @@ window.plugin.drawTools.import = function(data) {
         var extraMarkerOpt = {};
         if (item.color) extraMarkerOpt.icon = window.plugin.drawTools.getMarkerIcon(item.color);
         layer = L.marker(item.latLng, L.extend({},window.plugin.drawTools.markerOptions,extraMarkerOpt));
+        window.oms.addMarker(layer);
+        layer.on('remove', function() {
+          window.oms.removeMarker(layer);
+        });
         break;
       default:
         console.warn('unknown layer type "'+item.type+'" when loading draw tools layer');
@@ -425,6 +429,13 @@ window.plugin.drawTools.boot = function() {
     var layer=e.layer;
     window.plugin.drawTools.drawnItems.addLayer(layer);
     window.plugin.drawTools.save();
+
+    if(layer instanceof L.Marker) {
+      window.oms.addMarker(layer);
+      layer.on('remove', function() {
+        window.oms.removeMarker(layer);
+      });
+    }
   });
 
   map.on('draw:deleted', function(e) {

plugins/player-tracker.user.js

@@ -27,10 +27,6 @@ window.PLAYER_TRACKER_LINE_COLOUR = '#FF00FD';
 window.plugin.playerTracker = function() {};
 
 window.plugin.playerTracker.setup = function() {
-  try { console.log('Loading OverlappingMarkerSpiderfier JS now'); } catch(e) {}
-  @@INCLUDERAW:external/oms.min.js@@
-  try { console.log('done loading OverlappingMarkerSpiderfier JS'); } catch(e) {}
-
   var iconEnlImage = '@@INCLUDEIMAGE:images/marker-green.png@@';
   var iconEnlRetImage = '@@INCLUDEIMAGE:images/marker-green-2x.png@@';
   var iconResImage = '@@INCLUDEIMAGE:images/marker-blue.png@@';
@@ -62,22 +58,8 @@ window.plugin.playerTracker.setup = function() {
       });
     }
   });
-  plugin.playerTracker.oms = new OverlappingMarkerSpiderfier(map, {keepSpiderfied: true, legWeight: 3.5});
-  plugin.playerTracker.oms.legColors = {'usual': '#FFFF00', 'highlighted': '#FF0000'};
-
-  var playerPopup = new L.Popup({offset: L.point([1,-34])});
-  plugin.playerTracker.oms.addListener('click', function(player) {
-    window.renderPortalDetails(player.options.referenceToPortal);
-    if (player.options.desc) {
-      playerPopup.setContent(player.options.desc);
-      playerPopup.setLatLng(player.getLatLng());
-      map.openPopup(playerPopup);
-    }
-  });
-  plugin.playerTracker.oms.addListener('spiderfy', function(markers) {
-    map.closePopup();
-  });
 
+  plugin.playerTracker.playerPopup = new L.Popup({offset: L.point([1,-34])});
 
   addHook('publicChatDataAvailable', window.plugin.playerTracker.handleData);
 
@@ -91,6 +73,16 @@ window.plugin.playerTracker.setup = function() {
 
 window.plugin.playerTracker.stored = {};
 
+plugin.playerTracker.onClickListener = function(event) {
+  var marker = event.target;
+  window.renderPortalDetails(marker.options.referenceToPortal);
+  if (marker.options.desc) {
+    plugin.playerTracker.playerPopup.setContent(marker.options.desc);
+    plugin.playerTracker.playerPopup.setLatLng(marker.getLatLng());
+    map.openPopup(plugin.playerTracker.playerPopup);
+  }
+};
+
 // force close all open tooltips before markers are cleared
 window.plugin.playerTracker.closeIconTooltips = function() {
     plugin.playerTracker.drawnTracesRes.eachLayer(function(layer) {
@@ -371,6 +363,8 @@ window.plugin.playerTracker.drawData = function() {
 // as per OverlappingMarkerSpiderfier docs, click events (popups, etc) must be handled via it rather than the standard
 // marker click events. so store the popup text in the options, then display it in the oms click handler
     var m = L.marker(gllfe(last), {icon: icon, referenceToPortal: closestPortal, opacity: absOpacity, desc: popup, title: tooltip});
+    m.addEventListener('spiderfiedclick', plugin.playerTracker.onClickListener);
+
 //    m.bindPopup(title);
 
     if (tooltip) {
@@ -379,7 +373,7 @@ window.plugin.playerTracker.drawData = function() {
     }
 
     m.addTo(playerData.team === 'RESISTANCE' ? plugin.playerTracker.drawnTracesRes : plugin.playerTracker.drawnTracesEnl);
-    plugin.playerTracker.oms.addMarker(m);
+    window.oms.addMarker(m);
 
     // jQueryUI doesn’t automatically notice the new markers
     if (!isTouchDev) {
@@ -426,7 +420,16 @@ window.plugin.playerTracker.handleData = function(data) {
   plugin.playerTracker.discardOldData();
   plugin.playerTracker.processNewData(data);
   if (!window.isTouchDevice()) plugin.playerTracker.closeIconTooltips();
-  plugin.playerTracker.oms.clearMarkers();
+
+  plugin.playerTracker.drawnTracesEnl.eachLayer(function(feature) {
+    if(feature instanceof L.Marker)
+      window.oms.removeMarker(feature);
+  });
+  plugin.playerTracker.drawnTracesRes.eachLayer(function(feature) {
+    if(feature instanceof L.Marker)
+      window.oms.removeMarker(feature);
+  });
+
   plugin.playerTracker.drawnTracesEnl.clearLayers();
   plugin.playerTracker.drawnTracesRes.clearLayers();
   plugin.playerTracker.drawData();