From d8e12b41eeff373b694922053c5a9b6eca614c3f Mon Sep 17 00:00:00 2001
From: Mygod <contact-git@mygod.be>
Date: Sun, 16 Aug 2020 00:30:43 -0400
Subject: [PATCH 1/3] Fix invasion pokestop anchor

---
 src/views/index-js.mustache | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/index-js.mustache b/src/views/index-js.mustache
index c7f2605f..b18d0256 100644
--- a/src/views/index-js.mustache
+++ b/src/views/index-js.mustache
@@ -3773,7 +3773,7 @@ function getPokestopMarkerIcon (pokestop, ts) {
     } else if (activeInvasion) {
         sizeId = 'i0';
         iconSize = getPokestopSize(sizeId);
-        iconAnchor = [iconSize / 2, iconSize];// * 1.567],
+        iconAnchor = [iconSize / 2, iconSize * 1.567];
     } else if (activeLure) {
         sizeId = lureIconId;
         iconSize = getPokestopSize(sizeId);

From 87b9cd69664985f0ed5931350414f2bca2c6a57b Mon Sep 17 00:00:00 2001
From: Mygod <contact-git@mygod.be>
Date: Sun, 16 Aug 2020 00:58:15 -0400
Subject: [PATCH 2/3] Redo all anchoring

---
 src/views/index-js.mustache | 36 ++++++++++++++++--------------------
 1 file changed, 16 insertions(+), 20 deletions(-)

diff --git a/src/views/index-js.mustache b/src/views/index-js.mustache
index b18d0256..81019133 100644
--- a/src/views/index-js.mustache
+++ b/src/views/index-js.mustache
@@ -256,13 +256,13 @@ $(function () {
         iconUrl: availableIconStyles[selectedIconStyle] + '/device/0.png',
         iconSize: [30, 30],
         iconAnchor: [30 / 2, 30 / 2],
-        popupAnchor: [0, 30 * -1.567]
+        popupAnchor: [0, 30 * -.6]
     });
     deviceOfflineIcon = L.icon({
         iconUrl: availableIconStyles[selectedIconStyle] + '/device/1.png',
         iconSize: [30, 30],
         iconAnchor: [30 / 2, 30 / 2],
-        popupAnchor: [0, 30 * -1.567]
+        popupAnchor: [0, 30 * -.6]
     });
     
     $('#filtersModal').on('show.bs.modal', function () {
@@ -3617,7 +3617,7 @@ function getNestMarker (nest, geojson, ts) {
                 iconUrl: '/img/pokemon/1.png',
                 iconSize: [30, 30],
                 iconAnchor: [30 / 2, 30 / 2],
-                popupAnchor:  [0, 30 * -1.567]
+                popupAnchor:  [0, 30 * -.6]
             });
             return L.marker(latlng, {icon: icon});
         },
@@ -3635,7 +3635,7 @@ function getNestMarker (nest, geojson, ts) {
             const icon = L.divIcon({
                 iconSize: [40, 40],
                 iconAnchor: [40 / 2, 40 / 2],
-                popupAnchor: [0, 30 * -1.567],
+                popupAnchor: [0, 40 * -.6],
                 className: 'nest-marker',
                 html: `<center><img src="${availableIconStyles[selectedIconStyle]}/pokemon/${getPokemonIcon(nest.pokemon_id, 0)}" style="width:40px;height:auto; background-color:transparent;"/><br>${typesIcon}</center>`
             });
@@ -3644,7 +3644,7 @@ function getNestMarker (nest, geojson, ts) {
                 iconUrl: '/img/pokemon/' + nest.pokemon_id + '.png',
                 iconSize: [30, 30],
                 iconAnchor: [30 / 2, 30 / 2],
-                popupAnchor:  [0, 30 * -1.567],
+                popupAnchor:  [0, 30 * -.6],
                 shadowUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images/marker-shadow.png',
                 shadowSize:  [41, 41]
             });
@@ -3691,7 +3691,7 @@ function getPokemonMarkerIcon (pokemon, ts) {
     const icon = L.divIcon({
         iconSize: [size, size],
         iconAnchor: [size / 2, size / 2],
-        popupAnchor: [0, -(size / 2)],
+        popupAnchor: [0, size * -.6],
         className: 'pokemon-marker',
         html: `<center><img src="${availableIconStyles[selectedIconStyle]}/pokemon/${pokemonIdString}" style="width:${size}px;height:auto; background-color:transparent; ` +
         (
@@ -3731,7 +3731,7 @@ function getPokestopMarkerIcon (pokestop, ts) {
     let iconHtml = '<span class="text-nowrap text-center">';
     let iconUrl = '';
     let sizeId = '0';
-    let iconAnchor = [];
+    let iconAnchorY = .896;
     const lureIconId = getLureIconId(pokestop.lure_id);
     const activeLure = showPokestops && lureIconId > 0 && pokestop.lure_expire_timestamp >= ts;
     const activeInvasion = showInvasions && pokestop.incident_expire_timestamp >= ts;
@@ -3761,33 +3761,29 @@ function getPokestopMarkerIcon (pokestop, ts) {
         }
         iconHtml += `<img src="${iconUrl}" style="width:${iconSize}px;height:auto; background-color:transparent; display:inline-block; padding:0; margin:0 0 0 0;"/>`;
         iconSize = getQuestSize(rewardString);
-        iconAnchor = [iconSize / 2, iconSize * 1.9];//1.567];
+        iconAnchorY += 1;
     } else {
         iconSize = getPokestopSize(sizeId);
-        iconAnchor = [iconSize / 2, iconSize];// * 1.567];
     }
     if (activeInvasion && activeLure) {
         sizeId = 'i' + lureIconId;
         iconSize = getPokestopSize(sizeId);
-        iconAnchor = [iconSize / 2, iconSize * 1.567];
     } else if (activeInvasion) {
         sizeId = 'i0';
         iconSize = getPokestopSize(sizeId);
-        iconAnchor = [iconSize / 2, iconSize * 1.567];
     } else if (activeLure) {
         sizeId = lureIconId;
         iconSize = getPokestopSize(sizeId);
-        iconAnchor = [iconSize / 2, iconSize];// * 1.567],
     }
     iconHtml += '</span>';
     const icon = L.divIcon({
         iconSize: [iconSize, iconSize],
-        iconAnchor: iconAnchor,
-        popupAnchor: [0, iconSize * -1.567],
+        iconAnchor: [iconSize / 2, iconSize * iconAnchorY],
+        popupAnchor: [0, iconSize * (-.1 - iconAnchorY)],
         className: 'pokestop-marker',
         html: activeInvasion
-            ? `<center>${iconHtml}<img src="${availableIconStyles[selectedIconStyle]}/invasion/${sizeId}_${pokestop.grunt_type}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/><br></center>`
-            : `<center>${iconHtml}<img src="${availableIconStyles[selectedIconStyle]}/pokestop/${sizeId}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/><br></center>`
+            ? `<center>${iconHtml}<img src="${availableIconStyles[selectedIconStyle]}/invasion/${sizeId}_${pokestop.grunt_type}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/></center>`
+            : `<center>${iconHtml}<img src="${availableIconStyles[selectedIconStyle]}/pokestop/${sizeId}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/></center>`
     });
     return icon;
 }
@@ -3887,12 +3883,12 @@ function getGymMarkerIcon (gym, ts) {
     }
     const icon = L.divIcon({
         iconSize: [iconSize, iconSize],
-        iconAnchor: [iconSize / 2, iconSize * 1.567],
-        popupAnchor: [0, iconSize * -1.567], // 0, -20
+        iconAnchor: [iconSize / 2, iconSize * .917],
+        popupAnchor: [0, iconSize * -1],
         className: 'gym-marker',
         html: ignoreGymIcon
-            ? `<center>${iconHtml}<br></center>`
-            : `<center>${iconHtml}<br><img src="${availableIconStyles[selectedIconStyle]}/gym/${gym.team_id}_${size}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/><br></center>`
+            ? `<center>${iconHtml}</center>`
+            : `<center>${iconHtml}<img src="${availableIconStyles[selectedIconStyle]}/gym/${gym.team_id}_${size}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/><br></center>`
     });
     return icon;
 }

From 279ed82c9fdc845bc5aeb260d9df2ca4da6f4e19 Mon Sep 17 00:00:00 2001
From: Mygod <contact-git@mygod.be>
Date: Sun, 16 Aug 2020 20:21:54 -0400
Subject: [PATCH 3/3] Fix stop/gym size again

---
 src/views/index-js.mustache | 78 +++++++++++++++++--------------------
 1 file changed, 36 insertions(+), 42 deletions(-)

diff --git a/src/views/index-js.mustache b/src/views/index-js.mustache
index 81019133..0fa7f6ee 100644
--- a/src/views/index-js.mustache
+++ b/src/views/index-js.mustache
@@ -3727,11 +3727,8 @@ function getPokemonMarker (pokemon, ts) {
 }
 
 function getPokestopMarkerIcon (pokestop, ts) {
-    let iconSize = 30;
-    let iconHtml = '<span class="text-nowrap text-center">';
-    let iconUrl = '';
-    let sizeId = '0';
-    let iconAnchorY = .896;
+    let questSize = 0;
+    let iconHtml = '';
     const lureIconId = getLureIconId(pokestop.lure_id);
     const activeLure = showPokestops && lureIconId > 0 && pokestop.lure_expire_timestamp >= ts;
     const activeInvasion = showInvasions && pokestop.incident_expire_timestamp >= ts;
@@ -3739,6 +3736,7 @@ function getPokestopMarkerIcon (pokestop, ts) {
         const id = pokestop.quest_rewards[0].type;
         const info = pokestop.quest_rewards[0].info;
         let rewardString;
+        let iconUrl;
         if (id === 1 && info !== undefined && info.amount !== undefined) {
             iconUrl = `${availableIconStyles[selectedIconStyle]}/item/-2.png`;
         } else if (id === 2 && info !== undefined && info.amount !== undefined && info.item_id !== undefined) {
@@ -3759,31 +3757,28 @@ function getPokestopMarkerIcon (pokestop, ts) {
                 iconUrl = `${availableIconStyles[selectedIconStyle]}/pokemon/${getPokemonIcon(info.pokemon_id, 0)}`;
             }
         }
-        iconHtml += `<img src="${iconUrl}" style="width:${iconSize}px;height:auto; background-color:transparent; display:inline-block; padding:0; margin:0 0 0 0;"/>`;
-        iconSize = getQuestSize(rewardString);
-        iconAnchorY += 1;
-    } else {
-        iconSize = getPokestopSize(sizeId);
+        questSize = getQuestSize(rewardString);
+        iconHtml += `<img src="${iconUrl}" style="width:${questSize}px;height:${questSize}px; background-color:transparent; display:inline-block; padding:0; margin:0 0 0 0;"/><br>`;
     }
+    let sizeId = '0';
     if (activeInvasion && activeLure) {
         sizeId = 'i' + lureIconId;
-        iconSize = getPokestopSize(sizeId);
     } else if (activeInvasion) {
         sizeId = 'i0';
-        iconSize = getPokestopSize(sizeId);
     } else if (activeLure) {
         sizeId = lureIconId;
-        iconSize = getPokestopSize(sizeId);
     }
-    iconHtml += '</span>';
+    const stopSize = getPokestopSize(sizeId);
+    const iconWidth = Math.max(questSize, stopSize);
+    const iconAnchorY = questSize + stopSize * .896;
     const icon = L.divIcon({
-        iconSize: [iconSize, iconSize],
-        iconAnchor: [iconSize / 2, iconSize * iconAnchorY],
-        popupAnchor: [0, iconSize * (-.1 - iconAnchorY)],
+        iconSize: [iconWidth, questSize + stopSize],
+        iconAnchor: [iconWidth / 2, iconAnchorY],
+        popupAnchor: [0, -8 - iconAnchorY],
         className: 'pokestop-marker',
         html: activeInvasion
-            ? `<center>${iconHtml}<img src="${availableIconStyles[selectedIconStyle]}/invasion/${sizeId}_${pokestop.grunt_type}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/></center>`
-            : `<center>${iconHtml}<img src="${availableIconStyles[selectedIconStyle]}/pokestop/${sizeId}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/></center>`
+            ? `<center>${iconHtml}<img src="${availableIconStyles[selectedIconStyle]}/invasion/${sizeId}_${pokestop.grunt_type}.png" style="width:${stopSize}px;height:${stopSize}px; background-color:transparent;"/></center>`
+            : `<center>${iconHtml}<img src="${availableIconStyles[selectedIconStyle]}/pokestop/${sizeId}.png" style="width:${stopSize}px;height:${stopSize}px; background-color:transparent;"/></center>`
     });
     return icon;
 }
@@ -3852,43 +3847,42 @@ function getGymMarkerIcon (gym, ts) {
     }
 
     const raidLevel = gym.raid_level;
-    let iconSize;
+    let raidSize = 0;
     let iconHtml = '';
-    let ignoreGymIcon = false;
     if (gym.raid_battle_timestamp <= ts && gym.raid_end_timestamp >= ts && showRaids && parseInt(gym.raid_level) > 0) {
         if (gym.raid_pokemon_id !== 0 && gym.raid_pokemon_id !== null) {
             // Raid Boss
-            iconSize = getRaidSize('p' + gym.raid_pokemon_id);
-            iconHtml = `<img src="${availableIconStyles[selectedIconStyle]}/pokemon/${getPokemonIcon(gym.raid_pokemon_id, gym.raid_pokemon_form)}" style="width:${iconSize}px;height:auto; background-color:transparent;"/>`;
+            raidSize = getRaidSize('p' + gym.raid_pokemon_id);
+            iconHtml = `<img src="${availableIconStyles[selectedIconStyle]}/pokemon/${getPokemonIcon(gym.raid_pokemon_id, gym.raid_pokemon_form)}" style="width:${raidSize}px;height:${raidSize}px; background-color:transparent;"/><br>`;
         } else {
             // Egg
-            iconSize = getRaidSize('l' + raidLevel);
-            iconHtml = `<img src="${availableIconStyles[selectedIconStyle]}/unknown_egg/${raidLevel}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/>`;
+            raidSize = getRaidSize('l' + raidLevel);
+            iconHtml = `<img src="${availableIconStyles[selectedIconStyle]}/unknown_egg/${raidLevel}.png" style="width:${raidSize}px;height:${raidSize}px; background-color:transparent;"/><br>`;
         }
     } else if (gym.raid_end_timestamp >= ts && parseInt(gym.raid_level) > 0 && showRaids) {
         // Egg
-        iconSize = getRaidSize('l' + raidLevel);
-        iconHtml = `<img src="${availableIconStyles[selectedIconStyle]}/egg/${raidLevel}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/>`;
+        raidSize = getRaidSize('l' + raidLevel);
+        iconHtml = `<img src="${availableIconStyles[selectedIconStyle]}/egg/${raidLevel}.png" style="width:${raidSize}px;height:${raidSize}px; background-color:transparent;"/><br>`;
+    }
+    // Gym
+    let gymSize;
+    if (gym.in_battle) {
+        // Gym Battle
+        gymSize = 55; //Set Larger Size For Battle
+        iconHtml += `<img src="${availableIconStyles[selectedIconStyle]}/battle/${gym.team_id}_${size}.png" style="width:${gymSize}px;height:${gymSize}px; background-color:transparent;"/>`;
     } else {
         // Gym
-        if (gym.in_battle) {
-            // Gym Battle
-            iconSize = 55; //Set Larger Size For Battle
-            iconHtml = `<img src="${availableIconStyles[selectedIconStyle]}/battle/${gym.team_id}_${size}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/>`;
-            ignoreGymIcon = true;
-        } else {
-            // Gym
-            iconSize = getGymSize(gym.team_id);
-        }
+        gymSize = getGymSize(gym.team_id);
+        iconHtml += `<img src="${availableIconStyles[selectedIconStyle]}/gym/${gym.team_id}_${size}.png" style="width:${gymSize}px;height:${gymSize}px; background-color:transparent;"/>`;
     }
+    const iconWidth = Math.max(raidSize, gymSize);
+    const iconAnchorY = raidSize + gymSize * .917;
     const icon = L.divIcon({
-        iconSize: [iconSize, iconSize],
-        iconAnchor: [iconSize / 2, iconSize * .917],
-        popupAnchor: [0, iconSize * -1],
+        iconSize: [iconWidth, raidSize + gymSize],
+        iconAnchor: [iconWidth / 2, iconAnchorY],
+        popupAnchor: [0, -8 - iconAnchorY],
         className: 'gym-marker',
-        html: ignoreGymIcon
-            ? `<center>${iconHtml}</center>`
-            : `<center>${iconHtml}<img src="${availableIconStyles[selectedIconStyle]}/gym/${gym.team_id}_${size}.png" style="width:${iconSize}px;height:auto; background-color:transparent;"/><br></center>`
+        html: `<center>${iconHtml}</center>`
     });
     return icon;
 }