change(statistics): Move gender-specific statistics to a hover tooltip (pokeclicker#5921)

Co-authored-by: CypherX <cypherx00@gmail.com>

Author: wormania

src/components/statisticsModal.html

@@ -39,6 +39,25 @@ <h5 class="modal-title">Statistics</h5>
                                 <td class="text-left tight text-muted" data-bind="text: App.game.statistics[$data]().toLocaleString('en-US')">-</td>
                             </tr>
                             <!-- /ko -->
+                            <!-- ko foreach: App.game.statistics.genderStatisticGroups -->
+                            <tr>
+                                <td class="text-left" data-bind="text: GameConstants.camelCaseToString($data[0])">-</td>
+                                <td class="text-left tight text-muted"
+                                    data-bind="tooltip: {
+                                        title: `Male: ${App.game.statistics[$data[1]]().toLocaleString('en-US')}
+                                            <br/>
+                                            Female: ${App.game.statistics[$data[2]]().toLocaleString('en-US')}
+                                            <br/>
+                                            Genderless: ${App.game.statistics[$data[3]]().toLocaleString('en-US')}`,
+                                        html: true,
+                                        trigger: 'hover',
+                                        placement: 'top',
+                                        boundary: 'window'
+                                    },
+                                    text: App.game.statistics[$data[0]]().toLocaleString('en-US')">
+                                </td>
+                            </tr>
+                            <!-- /ko -->
                             </tbody>
                         </table>
                     </div>

src/modules/DataStore/StatisticStore/index.ts

@@ -168,50 +168,8 @@ export default class Statistics implements Saveable {
         'totalFarmPoints',
         'totalBattlePoints',
         'totalContestTokens',
-        'totalPokemonCaptured',
-        'totalPokemonDefeated',
-        'totalPokemonEncountered',
-        'totalPokemonHatched',
-        'totalShinyPokemonCaptured',
-        'totalShinyPokemonDefeated',
-        'totalShinyPokemonEncountered',
-        'totalShinyPokemonHatched',
-        'totalMalePokemonCaptured',
-        'totalMalePokemonDefeated',
-        'totalMalePokemonEncountered',
-        'totalMalePokemonHatched',
-        'totalFemalePokemonCaptured',
-        'totalFemalePokemonDefeated',
-        'totalFemalePokemonEncountered',
-        'totalFemalePokemonHatched',
-        'totalGenderlessPokemonCaptured',
-        'totalGenderlessPokemonDefeated',
-        'totalGenderlessPokemonEncountered',
-        'totalGenderlessPokemonHatched',
-        'totalShinyMalePokemonCaptured',
-        'totalShinyMalePokemonDefeated',
-        'totalShinyMalePokemonEncountered',
-        'totalShinyMalePokemonHatched',
-        'totalShinyFemalePokemonCaptured',
-        'totalShinyFemalePokemonDefeated',
-        'totalShinyFemalePokemonEncountered',
-        'totalShinyFemalePokemonHatched',
-        'totalShinyGenderlessPokemonCaptured',
-        'totalShinyGenderlessPokemonDefeated',
-        'totalShinyGenderlessPokemonEncountered',
-        'totalShinyGenderlessPokemonHatched',
-        'totalShadowPokemonCaptured',
-        'totalShadowPokemonDefeated',
-        'totalShadowMalePokemonCaptured',
-        'totalShadowMalePokemonDefeated',
-        'totalShadowFemalePokemonCaptured',
-        'totalShadowFemalePokemonDefeated',
-        'totalShadowGenderlessPokemonCaptured',
-        'totalShadowGenderlessPokemonDefeated',
-        'totalShinyTrainerPokemonSeen',
         'undergroundItemsFound',
         'undergroundLayersMined',
-        'undergroundLayersFullyMined',
         'undergroundTrades',
         'totalManualHarvests',
         'totalBerriesHarvested',
@@ -234,6 +192,12 @@ export default class Statistics implements Saveable {
         'safariStepsTaken',
         'safariItemsObtained',
     ];
+
+    hiddenObservables = [
+        'totalShinyTrainerPokemonSeen',
+        'undergroundLayersFullyMined',
+    ];
+
     arrayObservables = [
         'gymsDefeated',
         'dungeonsCleared',
@@ -273,8 +237,35 @@ export default class Statistics implements Saveable {
         'routeKills',
     ];
 
+    statisticGenders = ['', 'Male', 'Female', 'Genderless'];
+
+    baseGenderObservables = [
+        'total{{GENDER}}PokemonCaptured',
+        'total{{GENDER}}PokemonDefeated',
+        'total{{GENDER}}PokemonEncountered',
+        'total{{GENDER}}PokemonHatched',
+        'totalShiny{{GENDER}}PokemonCaptured',
+        'totalShiny{{GENDER}}PokemonDefeated',
+        'totalShiny{{GENDER}}PokemonEncountered',
+        'totalShiny{{GENDER}}PokemonHatched',
+        'totalShadow{{GENDER}}PokemonCaptured',
+        'totalShadow{{GENDER}}PokemonDefeated',
+    ];
+
+    genderStatisticGroups = this.baseGenderObservables.map((observableString) => {
+        return this.statisticGenders.map((gender) => {
+            return observableString.replace('{{GENDER}}', gender);
+        });
+    });
+
+    genderObservables = this.genderStatisticGroups.flat();
+
     constructor() {
-        this.observables.forEach((prop) => {
+        [].concat(
+            this.observables,
+            this.hiddenObservables,
+            this.genderObservables,
+        ).forEach((prop) => {
             this[prop] = ko.observable<number>(0).extend({ numeric: 0 });
         });
 
@@ -394,6 +385,8 @@ export default class Statistics implements Saveable {
         // process all of them together
         [].concat(
             this.observables,
+            this.hiddenObservables,
+            this.genderObservables,
             this.arrayObservables,
             this.objectObservables,
             this.autogeneratedObservables,
@@ -407,7 +400,11 @@ export default class Statistics implements Saveable {
             return;
         }
 
-        this.observables.forEach((prop) => { this[prop](json[prop] || 0); });
+        [].concat(
+            this.observables,
+            this.hiddenObservables,
+            this.genderObservables,
+        ).forEach((prop) => { this[prop](json[prop] || 0); });
 
         this.arrayObservables.forEach((array) => {
             json[array]?.forEach((el, index) => {