From 2cab4f71f95fef782fafbeda763992eccf05465e Mon Sep 17 00:00:00 2001 From: fkloft Date: Mon, 19 Jan 2015 22:35:01 +0100 Subject: [PATCH] [player-tracker] don't select portal when clicking the marker; instead, make portal names in popup clickable --- plugins/player-tracker.css | 7 +++ plugins/player-tracker.user.js | 112 ++++++++++++++++++++++++--------- 2 files changed, 89 insertions(+), 30 deletions(-) create mode 100644 plugins/player-tracker.css diff --git a/plugins/player-tracker.css b/plugins/player-tracker.css new file mode 100644 index 00000000..21f79bf0 --- /dev/null +++ b/plugins/player-tracker.css @@ -0,0 +1,7 @@ +.plugin-player-tracker-popup a { + color: inherit; + text-decoration: underline; + text-decoration-style: dashed; + -moz-text-decoration-style: dashed; + -webkit-text-decoration-style: dashed; +} diff --git a/plugins/player-tracker.user.js b/plugins/player-tracker.user.js index cf67baed..496b330a 100644 --- a/plugins/player-tracker.user.js +++ b/plugins/player-tracker.user.js @@ -76,9 +76,6 @@ window.plugin.playerTracker.stored = {}; plugin.playerTracker.onClickListener = function(event) { var marker = event.target; - var ll = marker.options.referenceToPortal.split(","); - window.selectPortalByLatLng(ll[0]/1E6, ll[1]/1E6); - if (marker.options.desc) { plugin.playerTracker.playerPopup.setContent(marker.options.desc); plugin.playerTracker.playerPopup.setLatLng(marker.getLatLng()); @@ -308,44 +305,73 @@ window.plugin.playerTracker.drawData = function() { var tooltip = isTouchDev ? '' : (playerData.nick+', '+ago(last.time, now)+' ago'); // popup for marker - var cssClass = playerData.team === 'RESISTANCE' ? 'res' : 'enl'; - var popup = '' + playerData.nick + ''; + var popup = $('
') + .addClass('plugin-player-tracker-popup'); + $('') + .addClass('nickname ' + (playerData.team === 'RESISTANCE' ? 'res' : 'enl')) + .css('font-weight', 'bold') + .text(playerData.nick) + .appendTo(popup); if(window.plugin.guessPlayerLevels !== undefined && window.plugin.guessPlayerLevels.fetchLevelDetailsByPlayer !== undefined) { function getLevel(lvl) { - return ''+lvl+''; + return $('') + .css({ + padding: '4px', + color: 'white', + backgroundColor: COLORS_LVL[lvl], + }) + .text(lvl); } - popup += ''; + + var level = $('') + .css({'font-weight': 'bold', 'margin-left': '10px'}) + .appendTo(popup); var playerLevelDetails = window.plugin.guessPlayerLevels.fetchLevelDetailsByPlayer(plrname); if(playerLevelDetails.min == 8) { - popup += 'Level ' + getLevel(8); + level + .text('Level ') + .append(getLevel(8)); } else { - popup += 'Min level: ' + getLevel(playerLevelDetails.min); + level + .text('Min level ') + .append(getLevel(playerLevelDetails.min)); if(playerLevelDetails.min != playerLevelDetails.guessed) - popup += ', guessed level: ' + getLevel(playerLevelDetails.guessed); + level + .append(document.createTextNode(', guessed level: ')) + .append(getLevel(playerLevelDetails.guessed)); } - - popup += ''; } - - popup += '
' - + ago(last.time, now) + ' ago
' - + window.chat.getChatPortalName(last); + + popup + .append('
') + .append(document.createTextNode(ago(last.time, now))) + .append('
') + .append(plugin.playerTracker.getPortalLink(last)); + // show previous data in popup if(evtsLength >= 2) { - popup += '
 
previous locations:
' - + ''; + popup + .append('
') + .append('
') + .append(document.createTextNode('previous locations:')) + .append('
'); + + var table = $('
') + .appendTo(popup) + .css('border-spacing', '0'); + for(var i = evtsLength - 2; i >= 0 && i >= evtsLength - 10; i--) { + var ev = playerData.events[i]; + $('') + .append($('' - + '' - + ''; - } - if(evtsLength >= 2) - popup += '
') + .text(ago(ev.time, now) + ' ago')) + .append($('') + .append(plugin.playerTracker.getPortalLink(ev))) + .appendTo(table); + } } - for(var i = evtsLength - 2; i >= 0 && i >= evtsLength - 10; i--) { - var ev = playerData.events[i]; - popup += '
' + ago(ev.time, now) + 'ago' + window.chat.getChatPortalName(ev) + '
'; // calculate the closest portal to the player var eventPortal = [] @@ -369,12 +395,12 @@ window.plugin.playerTracker.drawData = function() { // marker itself var icon = playerData.team === 'RESISTANCE' ? new plugin.playerTracker.iconRes() : new plugin.playerTracker.iconEnl(); -// 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}); + // 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[0], title: tooltip}); m.addEventListener('spiderfiedclick', plugin.playerTracker.onClickListener); -// m.bindPopup(title); + // m.bindPopup(title); if (tooltip) { // ensure tooltips are closed, sometimes they linger @@ -423,6 +449,30 @@ window.plugin.playerTracker.drawData = function() { }); } +window.plugin.playerTracker.getPortalLink = function(data) { + var position = data.latlngs[0]; + var ll = position.join(','); + return $('') + .addClass('text-overflow-ellipsis') + .css('max-width', '15em') + .text(window.chat.getChatPortalName(data)) + .prop({ + title: window.chat.getChatPortalName(data), + href: '/intel?ll=' + ll + '&pll=' + ll, + }) + .click(function(event) { + window.selectPortalByLatLng(position); + event.preventDefault(); + return false; + }) + .dblclick(function(event) { + map.setView(position, 17) + window.selectPortalByLatLng(position); + event.preventDefault(); + return false; + }); +} + window.plugin.playerTracker.handleData = function(data) { if(window.map.getZoom() < window.PLAYER_TRACKER_MIN_ZOOM) return; @@ -480,6 +530,8 @@ window.plugin.playerTracker.onGeoSearch = function(search) { } window.plugin.playerTracker.setupUserSearch = function() { + $('