From d3fca8612c8467e53c20a92a8ca1fe3cf2fe46e1 Mon Sep 17 00:00:00 2001 From: fkloft Date: Mon, 9 Jun 2014 21:08:06 +0200 Subject: [PATCH] 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 | 2 ++ code/oms.js | 25 +++++++++++++++++ plugins/bookmarks-by-zaso.user.js | 6 +++-- plugins/draw-tools.user.js | 11 ++++++++ plugins/player-tracker.user.js | 45 ++++++++++++++++--------------- 5 files changed, 66 insertions(+), 23 deletions(-) create mode 100644 code/oms.js diff --git a/code/boot.js b/code/boot.js index e3d1dffb..eb2cadc3 100644 --- a/code/boot.js +++ b/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) {} diff --git a/code/oms.js b/code/oms.js new file mode 100644 index 00000000..7f89cd3d --- /dev/null +++ b/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(); + }); +} + diff --git a/plugins/bookmarks-by-zaso.user.js b/plugins/bookmarks-by-zaso.user.js index 89eda9e9..6ecbab3d 100644 --- a/plugins/bookmarks-by-zaso.user.js +++ b/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); @@ -1182,4 +1184,4 @@ // PLUGIN END ////////////////////////////////////////////////////////// -@@PLUGINEND@@ \ No newline at end of file +@@PLUGINEND@@ diff --git a/plugins/draw-tools.user.js b/plugins/draw-tools.user.js index e36bb718..2dd68fe8 100644 --- a/plugins/draw-tools.user.js +++ b/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) { diff --git a/plugins/player-tracker.user.js b/plugins/player-tracker.user.js index 685b86f7..30e57589 100644 --- a/plugins/player-tracker.user.js +++ b/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();