feat: Make it possible to subtract ability cost from pool points

index.html

@@ -392,33 +392,12 @@
                 </div>
                 <div class="box">
                     <h2>Use Ability</h2>
-                    <select id="inp-ability-selector">
-                        <option>Custom</option>
-                        <option data-pool="might" data-cost="3">Golem Grip</option>
-                    </select>
                     <span id="dsp-ability-pool" class="warn">No pool selected!</span>
                     <strong>Initial cost</strong> <input type="number" id="inp-ability-cost" min-value="0" value="0">
                     <strong>Effort used</strong> <input type="number" id="inp-ability-effort" min-value="0" value="0">
                     <span id="dsp-ability-cost"></span>
                     <button id="btn-ability-do">Do it!</button>
                 </div>
-                <div class="box">
-                    <h2>Do a Task</h2>
-                    Training
-                    <select>
-                        <option>Inability</option>
-                        <option selected>Practised</option>
-                        <option>Trained</option>
-                        <option>Specialised</option>
-                    </select>
-                    Effort <input type="number">
-                    <button>Roll!</button>
-                    <button>Do it!</button>
-                </div>
-                <div class="box">
-                    <h2>Take Damage</h2>
-                    <input type="number"><button>Ouch!</button>
-                </div>
             </div>
         </div>
         <script>
@@ -433,6 +412,7 @@
          const btnCreateCharacter = document.getElementById("btn-create-character");
          const btnNoCharCreateCharacter = document.getElementById("btn-no-char-create-character");
          const btnSaveCharacter = document.getElementById("btn-save-character");
+         const btnAbilityDo = document.getElementById("btn-ability-do");
 
          const inpCharacterRoster = document.getElementById("inp-character-roster");
          const inpCampaignName = document.getElementById("inp-campaign-name");
@@ -456,8 +436,6 @@
          };
          const inpAbilityCost = document.getElementById("inp-ability-cost");
          const inpAbilityEffort = document.getElementById("inp-ability-effort");
-         const abilityRoller = document.getElementById("roll-ability");
-         const abilityCostDisplay = document.getElementById("ability-cost-display");
 
          const dspAbilityPool = document.getElementById("dsp-ability-pool");
          const dspAbilityCost = document.getElementById("dsp-ability-cost");
@@ -662,8 +640,6 @@
              return String(str).charAt(0).toUpperCase() + String(str).slice(1);
          };
 
-         const d20 = () => Math.floor(Math.random() * 20) + 1;
-
          const getSelectedPool = () => {
              var currentPoolSelector = document.querySelector("input[name=pool-selector]:checked");
 
@@ -740,11 +716,23 @@
          };
 
          const subtractPoolPoints = () => {
+             var currentPool = getSelectedPool();
              var abilityCost = calculateAbilityCost();
+             var poolValue = Number(inpPoolValue[currentPool].value);
 
              if (abilityCost === null) return;
 
              updateAbilityCostDisplay();
+
+             if (poolValue < abilityCost) {
+                 alert("You cannot affort to use this ability now.");
+
+                 return;
+             }
+
+             inpPoolValue[currentPool].value = poolValue - abilityCost;
+
+             updateAbilityCostDisplay();
          };
 
          document.addEventListener(
@@ -792,41 +780,6 @@
                  updateAbilityCostDisplay();
              },
          );
-
-         abilitySelector.addEventListener(
-             "change",
-             (evt) => {
-                 var selectedOption = evt.target.selectedOptions[0];
-
-                 if (selectedOption.dataset.pool !== null) {
-                     var poolChooser = poolChoices[selectedOption.dataset.pool];
-                     poolChooser.checked = true;
-                     abilityInitialCost.value = Number(selectedOption.dataset.cost);
-                 }
-             },
-         );
-
-         abilityInitialCost.addEventListener("input", updateAbilityCost);
-
-         var abilityEffortChecking = false;
-
-         abilityEffort.addEventListener(
-             "input",
-             (evt) => {
-                 if (abilityEffortChecking) return;
-
-                 abilityEffortChecking = true;
-
-                 if (evt.target.value < 0) {
-                     evt.target.value = 0;
-                 } else if (evt.target.value >= inputMaxEffort.value) {
-                     evt.target.value = maxEffort.value;
-                 }
-
-                 updateAbilityCost();
-                 abilityEffortChecking = false;
-             },
-         );
         </script>
     </body>
 </html>