feature(underground): Add an Underground module for the main screen (p…

…okeclicker#5119) * Added underground mine and daily trades to a separate module Added a % cleared to the mine for QoL * Added underground module settings * Energy restores displayed next to each other instead of below * Removed the clear % and added partially discovered items Also added that to the Underground modal * Smaller daily trades Allow mine and daily trades to collapse separately * Bomb hover will be displayed to the right by default so it does not block the partially discovered text * Added Survey and Skip to the module options Disabled Skip when no attempts are available, both on the module and the modal Survey on the module will trigger the correct tooltip * No longer save partially found items observable, just calculate it just after loading a saved mine * Fixes canAccess evaluate on the data-bind --------- Co-authored-by: Danial <[email protected]>
DraKay · Feb 29, 2024 · 76f7d00 · 76f7d00
1 parent d6d9103
commit 76f7d00
Show file tree

Hide file tree

Showing 7 changed files with 164 additions and 18 deletions.
diff --git a/src/components/settingsModal.html b/src/components/settingsModal.html
@@ -67,6 +67,14 @@ <h5 class="modal-title">Settings</h5>
                                 <tr data-bind="template: { name: 'MultipleChoiceSettingTemplate', data: Settings.getSetting('berryDexMode')}"></tr>
                                 <tr data-bind="template: { name: 'MultipleChoiceSettingTemplate', data: Settings.getSetting('sizeUnits')}"></tr>
                             </tbody>
+                            <thead>
+                                <tr><th colspan="2">Underground</th></tr>
+                            </thead>
+                            <tbody>
+                                <tr data-bind="template: { name: 'BooleanSettingTemplate', data: Settings.getSetting('showUndergroundModule')}"></tr>
+                                <tr data-bind="template: { name: 'BooleanSettingTemplate', data: Settings.getSetting('showUndergroundModuleMineControls')}"></tr>
+                                <tr data-bind="template: { name: 'BooleanSettingTemplate', data: Settings.getSetting('showUndergroundModuleDailyTrades')}"></tr>
+                            </tbody>
                             <thead>
                                 <tr><th colspan="2">Other</th></tr>
                             </thead>

diff --git a/src/components/shortcutsContainer.html b/src/components/shortcutsContainer.html
@@ -5,7 +5,7 @@
     <div id="shortcutsBody" class="card-body show p-0">
       <table class="table table-sm m-0">
         <tbody>
-          <tr data-bind="visible: App.game.underground.canAccess">
+          <tr data-bind="visible: App.game.underground.canAccess() && !Settings.getSetting('showUndergroundModule').observableValue()">
             <td class="p-0">
               <button class="btn btn-block btn-primary m-0" onclick="App.game.underground.openUndergroundModal()">
                   Underground

diff --git a/src/components/underground.html b/src/components/underground.html
@@ -46,14 +46,10 @@
                     <div id="mineBody" class="container" style="margin:auto">
                     </div>
                     <div class='row no-gutters'>
-                        <button class='col-12 col-md-4 btn btn-primary' onClick='Mine.toolSelected(Mine.Tool.Hammer)'
-                        data-bind="tooltip: {title: 'Hammer will mine 1 layer of all 9 tiles in a chosen 3x3 area.', trigger: 'hover', placement: 'top', boundary: 'window'}">Hammer (<knockout data-bind="text: Underground.HAMMER_ENERGY"></knockout> energy)</button>
-                        <button class='col-12 col-md-4 btn btn-info' onClick='Mine.toolSelected(Mine.Tool.Chisel)'
-                        data-bind="tooltip: {title: 'Chisel will mine 2 layers on a single chosen tile.', trigger: 'hover', placement: 'top', boundary: 'window'}">Chisel (<knockout data-bind="text: Underground.CHISEL_ENERGY"></knockout> energy)</button>
-                        <button class="col-12 col-md-4 btn btn-secondary"
+                        <div class="col-12"
                             id="mine-survey-result"
                             data-bind="
-                                text: Mine.itemsFound() + ' / ' + Mine.itemsBuried() + ' items found' ,
+                                text: 'Treasures found: ' + Mine.itemsFound() + ' / ' + Mine.itemsBuried() + ', Partially discovered: ' + (Mine.itemsFound() + Mine.itemsPartiallyFound()),
                                 tooltip: {
                                     title: () =>
                                         Mine.surveyResult() || 'Conduct a Survey to get more details',
@@ -63,17 +59,21 @@
                                         html: true,
                                 }"
                             >
-                        </button>
+                        </div>
+                        <button class='col-12 col-md-4 btn btn-primary' onClick='Mine.toolSelected(Mine.Tool.Hammer)'
+                        data-bind="tooltip: {title: 'Hammer will mine 1 layer of all 9 tiles in a chosen 3x3 area.', trigger: 'hover', placement: 'top', boundary: 'window'}">Hammer (<knockout data-bind="text: Underground.HAMMER_ENERGY"></knockout> energy)</button>
+                        <button class='col-12 col-md-4 btn btn-info' onClick='Mine.toolSelected(Mine.Tool.Chisel)'
+                        data-bind="tooltip: {title: 'Chisel will mine 2 layers on a single chosen tile.', trigger: 'hover', placement: 'top', boundary: 'window'}">Chisel (<knockout data-bind="text: Underground.CHISEL_ENERGY"></knockout> energy)</button>
                         <button class='col-12 col-md-4 btn btn-success'
                                 onClick='Mine.survey(); $(this).tooltip("hide")'
                                 data-bind="disable: Mine.surveyResult() ? true : false, tooltip: {title: `Survey gives you information about the items to be found on this layer. It also fully damages ${App.game.underground.getSurvey_Efficiency()} (cleared or uncleared) random tile${App.game.underground.getSurvey_Efficiency() > 1 ? 's' : ''}.`, trigger: 'hover', placement: 'bottom', boundary: 'window'}">
                             Survey (<knockout data-bind="text: App.game.underground.getSurvey_Cost()"></knockout> energy)
                         </button>
                         <!-- FIX NUMBER-->
-                        <button class='col-12 col-md-4 btn btn-warning' onClick='Mine.bomb()'
+                        <button class='col-12 col-md-6 btn btn-warning' onClick='Mine.bomb()'
                         data-bind="tooltip: {title: `Bomb will mine 2 layers of ${App.game.underground.getBombEfficiency()} (cleared or uncleared) random tiles.`, trigger: 'hover', placement: 'bottom', boundary: 'window'}">Bomb (<knockout data-bind="text: Underground.BOMB_ENERGY"></knockout> energy)</button>
-                        <button class='col-12 col-md-4 btn btn-danger' onClick='Mine.skipLayer(true)'
-                        data-bind="tooltip: {title: `Skips the current layer. Fully mine a layer to recover one Skip.`, trigger: 'hover', placement: 'bottom', boundary: 'window'}">Skip (<knockout data-bind="text: `${Mine.skipsRemaining()} / ${Mine.maxSkips}`"></knockout>)</button>
+                        <button class='col-12 col-md-6 btn btn-danger' onClick='Mine.skipLayer(true)'
+                        data-bind="disable: Mine.skipsRemaining() > 0 ? false : true, tooltip: {title: `Skips the current layer. Fully mine a layer to recover one Skip.`, trigger: 'hover', placement: 'bottom', boundary: 'window'}">Skip (<knockout data-bind="text: `${Mine.skipsRemaining()} / ${Mine.maxSkips}`"></knockout>)</button>
                     </div>
                 </div>
                 <div id="treasures" class="tab-pane fade">

diff --git a/src/components/undergroundDisplay.html b/src/components/undergroundDisplay.html
@@ -0,0 +1,103 @@
+<div id="undergroundDisplay" class="card sortable border-secondary mb-3" data-bind="visible: App.game.underground.canAccess() && Settings.getSetting('showUndergroundModule').observableValue(), if: Settings.getSetting('showUndergroundModule').observableValue()">
+    <div class="card-header p-0" data-toggle="collapse" href="#undergroundCard">
+        <span>Underground</span>
+    </div>
+    <button class="btn btn-sm btn-primary" style="position: absolute; right: 0px; top: 0px; width: auto; height: 41px;" onclick="App.game.underground.openUndergroundModal()">
+        View
+    </button>
+
+    <div id="undergroundCard" class="card-body p-0 show">
+        <div>
+            <div class='progress' style="height: 25px;">
+                <div class='progress-bar bg-warning' role='progressbar'
+                     aria-valuemin='0' aria-valuemax='100'
+                     data-bind="style: { width: (Math.floor(App.game.underground.energy)/App.game.underground.getMaxEnergy()*100).toFixed(2) + '%' }">
+                    <span data-bind="text: 'Energy: ' + Math.floor(App.game.underground.energy) + ' / ' + App.game.underground.getMaxEnergy() + (Math.floor(App.game.underground.energy) < App.game.underground.getMaxEnergy() ? ' (' + Underground.energyTick() + 's)' : '')"></span>
+                </div>
+            </div>
+
+            <div class="container">
+                <div class="row">
+                    <div id="mine-display-survey-result" class="col" data-bind="tooltip: {
+                                                                                    title: () =>
+                                                                                        Mine.surveyResult() || 'Conduct a Survey to get more details',
+                                                                                        trigger: 'hover',
+                                                                                        placement: 'top',
+                                                                                        boundary: 'window',
+                                                                                        html: true,
+                                                                                }">
+                        <div data-bind="text: 'Treasures found: ' + Mine.itemsFound() + ' / ' + Mine.itemsBuried()"></div>
+                        <div data-bind="text: 'Partially discovered: ' + (Mine.itemsFound() + Mine.itemsPartiallyFound())"></div>
+                    </div>
+                </div>
+
+                <!-- ko if: Settings.getSetting('showUndergroundModuleMineControls').observableValue() -->
+                <div class="row" data-bind="foreach: ['SmallRestore','MediumRestore','LargeRestore']">
+                    <button class="col btn btn-secondary p-0" data-bind="
+                                    click: function(){ ItemList[$data].use();},
+                                    css: { disabled: player._itemList[$data]() <= 0},
+                                    tooltip: {
+                                        title: () => `+${App.game.underground.calculateItemEffect(GameConstants.EnergyRestoreSize[$data])} energy`,
+                                        trigger: 'hover',
+                                        placement: 'top',
+                                        boundary: 'window',
+                                        html: true,
+                                    }">
+                        <img style="width: 32px;" data-bind="attr: { src: ItemList[$data].image }"><br/>
+                        <span style="line-height: 1;" data-bind="text: GameHelper.formatAmount(player._itemList[$data]())">(?)</span>
+                    </button>
+                </div>
+
+                <div class="row">
+                    <button class='col btn btn-warning' onClick='Mine.bomb(); $(this).tooltip("hide")' data-bind="tooltip: {title: `Bomb will mine 2 layers of ${App.game.underground.getBombEfficiency()} (cleared or uncleared) random tiles.<br/>(${Underground.BOMB_ENERGY} energy)`, html: true, trigger: 'hover', placement: 'bottom', boundary: 'window'}">Bomb</button>
+                    <button class='col btn btn-success'
+                            onClick='Mine.survey("#mine-display-survey-result"); $(this).tooltip("hide")'
+                            data-bind="disable: Mine.surveyResult() ? true : false, tooltip: {title: `Survey gives you information about the items to be found on this layer. It also fully damages ${App.game.underground.getSurvey_Efficiency()} (cleared or uncleared) random tile${App.game.underground.getSurvey_Efficiency() > 1 ? 's' : ''}.<br/>(${App.game.underground.getSurvey_Cost()} energy)`, html: true, trigger: 'hover', placement: 'bottom', boundary: 'window'}">
+                        Survey
+                    </button>
+                    <button class='col btn btn-danger' onClick='Mine.skipLayer(true)'
+                            data-bind="disable: Mine.skipsRemaining() > 0 ? false : true, tooltip: {title: `Skips the current layer. Fully mine a layer to recover one Skip.<br/>(${Mine.skipsRemaining()} / ${Mine.maxSkips} attempts)`, html: true, trigger: 'hover', placement: 'bottom', boundary: 'window'}">Skip</button>
+                </div>
+                <!-- /ko -->
+            </div>
+        </div>
+    </div>
+
+    <!-- ko if: Settings.getSetting('showUndergroundModuleDailyTrades').observableValue() -->
+    <div  class="card-header p-0" data-toggle="collapse" href="#undergroundDailyTradesCard">
+        <span>Daily trades</span>
+    </div>
+
+    <div id="undergroundDailyTradesCard" class="table-responsive show">
+        <table class="table table-sm table-hover table-striped m-0 text-left">
+            <thead>
+            </thead>
+            <tbody>
+            <!-- ko foreach: DailyDeal.list -->
+            <tr data-bind="tooltip: {
+                            title: () => `${$data.amount1} ${$data.item1.name} → ${$data.amount2} ${$data.item2.name}`,
+                            trigger: 'hover',
+                            placement: 'top',
+                            boundary: 'window',
+                            html: true,
+                        }">
+                <td class="text-center vertical-middle">
+                    <span style="line-height: 1;" data-bind="text: `${$data.amount1} ×`"></span>
+                </td>
+                <td class='text-center vertical-middle'>
+                    <img class='mineInventoryItem' data-bind='attr: {src: $data.item1.image }'>
+                </td>
+                <td class='text-center vertical-middle'>→</td>
+                <td class="text-center vertical-middle">
+                    <span style="line-height: 1;" data-bind="text: `${$data.amount2} ×`"></span>
+                </td>
+                <td class='text-center vertical-middle'>
+                    <img class='mineInventoryItem' data-bind='attr: {src: $data.item2.image }'>
+                </td>
+            </tr>
+            <!-- /ko -->
+            </tbody>
+        </table>
+    </div>
+    <!-- /ko -->
+</div>
diff --git a/src/index.html b/src/index.html
@@ -421,6 +421,9 @@ <h2 class="pageItemFooter" style="display: block; font-size: 1rem;">
                     <!-- Farm -->
                     @import "farmDisplay.html"
 
+                    <!-- Underground -->
+                    @import "undergroundDisplay.html"
+
                     <!-- Shortcuts Menu -->
                     @import "shortcutsContainer.html"
                 </div>

diff --git a/src/modules/settings/index.ts b/src/modules/settings/index.ts
@@ -124,6 +124,9 @@ Settings.add(new Setting<string>('sizeUnits', 'Berry size units',
         new SettingOption('Centimeters', 'cm'),
     ],
     'cm'));
+Settings.add(new BooleanSetting('showUndergroundModule', 'Show Underground module on main screen', true));
+Settings.add(new BooleanSetting('showUndergroundModuleMineControls', 'Show Underground module mine controls', true));
+Settings.add(new BooleanSetting('showUndergroundModuleDailyTrades', 'Show Underground module daily trades', false));
 Settings.add(new BooleanSetting('currencyMainDisplayReduced', 'Shorten currency amount shown on main screen', false));
 Settings.add(new BooleanSetting('currencyMainDisplayExtended', 'Show Diamonds, Farm Points, Battle Points, and Contest Tokens on main screen', false));
 Settings.add(new BooleanSetting('confirmLeaveDungeon', 'Confirm before leaving dungeons', false));