Improve attack dialog

Limithron-Foundry-VTT · May 9, 2022 · 1230e84 · 1230e84
1 parent 50cd07d
commit 1230e84
Show file tree

Hide file tree

Showing 10 changed files with 189 additions and 26 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,13 @@
+# v0.3.2
+
+- The Tavern should not generate character with an ability lower than -3
+- Improve attack dialog
+
+# v0.3.1
+
+- Improved ammo display
+- Character sheet was not updated after some specific conditions
+
 # v0.3.0
 
 - Add PIRATE BORG Help Dialog

diff --git a/css/pirateborg.css b/css/pirateborg.css
diff --git a/css/pirateborg.css.map b/css/pirateborg.css.map
diff --git a/module/actor/actor.js b/module/actor/actor.js
@@ -275,10 +275,16 @@ export class PBActor extends Actor {
           roll: {
             icon: '<i class="fas fa-dice-d20"></i>',
             label: game.i18n.localize("PB.Roll"),
-            // callback: html => resolve(_createItem(this.actor, html[0].querySelector("form")))
             callback: (html) => this._attackDialogCallback(html),
           },
         },
+        render: (content) => {
+          content.find(".tier-radio").on("change", (event) => {
+            event.preventDefault();
+            const input = $(event.currentTarget);
+            content.find("#targetArmor").val(input.val());
+          });
+        },
         default: "roll",
         close: () => resolve(null),
       }).render(true);
@@ -402,7 +408,7 @@ export class PBActor extends Actor {
       targetArmorRoll,
       weaponTypeKey,
       isFumble,
-      ammoOutcome: useAmmoDamage ? `<h4>${ammo.data.name}</h4><p>${ammo.data.data.description}</p>` : null,
+      ammoOutcome: useAmmoDamage && isHit ? `<h4>${ammo.data.name}</h4><span class="card-description">${ammo.data.data.description}</span>` : null,
     };
     await this._decrementWeaponAmmo(item);
     await this._renderAttackRollCard(rollResult);

diff --git a/module/scvm/scvmfactory.js b/module/scvm/scvmfactory.js
@@ -66,7 +66,8 @@ const rollAbility = (roll, bonus) => {
     async: false,
   });
   const ability = abilityBonus(abilityRoll.total);
-  return bonus ? ability + parseInt(bonus, 10) : ability;
+  const abilityWithBonus = bonus ? ability + parseInt(bonus, 10) : ability;
+  return abilityWithBonus < -3 ? -3 : abilityWithBonus;
 };
 
 export const findItems = async (items) => {

diff --git a/scss/pirateborg/_actor-sheet.scss b/scss/pirateborg/_actor-sheet.scss
@@ -129,7 +129,7 @@
         .weapon-list .item-field {
           &.damage-die {
             text-align: right;
-            width: 60px;
+            width: 40px;
           }
 
           &.weapon-type {

diff --git a/scss/pirateborg/_dialog.scss b/scss/pirateborg/_dialog.scss
@@ -6,7 +6,7 @@
   margin-bottom: 10px;
 
   label {
-    font-family: var(--h2-font);
+    font-family: var(--item-font);
     font-size: 20px;
     margin-right: 10px;
     text-align: right;
@@ -107,3 +107,58 @@
   text-transform: capitalize;
   padding-top: 2px;
 }
+
+.attack-dialog {
+  .form-group {
+    display: flex;
+    align-items: flex-start;
+  }
+
+  .item-armor-tier {
+    .tiers {
+      margin: 0;
+      padding: 0;
+      display: flex;
+      justify-content: flex-start;
+      gap: 12px;
+
+      li {
+        margin: 0;
+      }
+
+      input[type="radio"] {
+        display: none;
+      }
+
+      input[type="radio"]:checked + span.tier-num {
+        background: var(--button-background);
+        color: var(--button-color);
+        border-color: var(--button-background);
+      }
+
+      label {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        margin: 0;
+        font-size: 16px;
+        gap: 4px;
+      }
+
+      .tier-num {
+        cursor: pointer;
+        border: 1px solid black;
+        border-radius: 100%;
+        font-family: var(--item-font);
+        width: 24px;
+        height: 24px;
+        text-align: center;
+        line-height: 21px;
+      }
+
+      .tier-dmg {
+        line-height: 13px;
+      }
+    }
+  }
+}
diff --git a/scss/pirateborg/_root.scss b/scss/pirateborg/_root.scss
@@ -41,6 +41,8 @@
 
   --button-font: "Alegreya";
 
+  --color-text-hyperlink: var(--foreground-color);
+
   /* foundry core */
   --color-text-light-6: var(--foreground-color);
   --color-text-light-5: var(--foreground-color);

diff --git a/templates/actor/character-sheet.html b/templates/actor/character-sheet.html
@@ -210,30 +210,32 @@ <h4 class="item-name item-edit rollable">{{data.data.equippedArmor.name}}</h4>
               <label class="stat-label tier-label">{{ localize "PB.Tier" }}</label>
               <ul class="tiers">
                 <li>
-                  <label
-                    ><input class="tier-radio" type="radio" name="tier.value" value="0" {{#ifEq data.data.equippedArmor.data.tier.value
-                    0}}checked{{/ifEq}}/><span class="tier-num">0</span><span class="tier-dmg">-0</span></label
-                  >
+                  <label>
+                    <input class="tier-radio" type="radio" name="tier.value" value="0" {{#ifEq data.data.equippedArmor.data.tier.value 0}}checked{{/ifEq}}/>
+                    <span class="tier-num">0</span>
+                    <span class="tier-dmg">-0</span>
+                  </label>
                 </li>
                 <li>
-                  <label
-                    ><input class="tier-radio" type="radio" name="tier.value" value="1" {{#ifEq data.data.equippedArmor.data.tier.value
-                    1}}checked{{/ifEq}}/><span class="tier-num">1</span><span class="tier-dmg">-d2</span></label
-                  >
+                  <label>
+                    <input class="tier-radio" type="radio" name="tier.value" value="1" {{#ifEq data.data.equippedArmor.data.tier.value 1}}checked{{/ifEq}}/>
+                    <span class="tier-num">1</span>
+                    <span class="tier-dmg">-d2</span>
+                  </label>
                 </li>
                 <li>
                   <label
-                    ><input class="tier-radio" type="radio" name="tier.value" value="2" {{#ifEq data.data.equippedArmor.data.tier.value 2}}checked{{/ifEq}}
-                    {{#ifLt data.data.equippedArmor.data.tier.max 2}}disabled="true"{{/ifLt}}/><span class="tier-num">2</span
-                    ><span class="tier-dmg">-d4</span></label
-                  >
+                    ><input class="tier-radio" type="radio" name="tier.value" value="2" {{#ifEq data.data.equippedArmor.data.tier.value 2}}checked{{/ifEq}}/>
+                    <span class="tier-num">2</span>
+                    <span class="tier-dmg">-d4</span>
+                  </label>
                 </li>
                 <li>
                   <label
-                    ><input class="tier-radio" type="radio" name="tier.value" value="3" {{#ifEq data.data.equippedArmor.data.tier.value 3}}checked{{/ifEq}}
-                    {{#ifLt data.data.equippedArmor.data.tier.max 3}}disabled="true"{{/ifLt}}/><span class="tier-num">3</span
-                    ><span class="tier-dmg">-d6</span></label
-                  >
+                    ><input class="tier-radio" type="radio" name="tier.value" value="3" {{#ifEq data.data.equippedArmor.data.tier.value 3}}checked{{/ifEq}}/>
+                    <span class="tier-num">3</span>
+                    <span class="tier-dmg">-d6</span>
+                  </label>
                 </li>
               </ul>
             </div>

diff --git a/templates/dialog/attack-dialog.html b/templates/dialog/attack-dialog.html
@@ -1,11 +1,53 @@
-<form class="custom-dialog">
+<form class="custom-dialog attack-dialog">
   <input type="hidden" name="itemid" value="{{itemId}}" />
   <div class="form-group">
     <label>{{localize "PB.Attack"}} {{localize "PB.DR"}}:</label>
     <input type="text" name="attackdr" value="{{attackDR}}" placeholder="12" data-dtype="Number" />
   </div>
   <div class="form-group">
     <label>{{localize "PB.TargetArmor"}}:</label>
-    <input type="text" name="targetarmor" value="{{targetArmor}}" placeholder="1d2" data-dtype="String" />
+    <input id="targetArmor" type="text" name="targetarmor" value="{{targetArmor}}" placeholder="1d2" data-dtype="String" />
+  </div>
+  <div class="form-group">
+    <label></label>
+    <div class="item-armor-tier">
+      <ul class="tiers">
+        <li>
+          <label>
+            <input class="tier-radio" type="radio" name="tier.value" value="0" />
+            <span class="tier-num">0</span>
+            <span class="tier-dmg">0</span>
+          </label>
+        </li>
+        <li>
+          <label>
+            <input class="tier-radio" type="radio" name="tier.value" value="1d2" {{#ifEq targetArmor '1d2'}}checked{{/ifEq}}/>
+            <span class="tier-num">1</span>
+            <span class="tier-dmg">d2</span>
+          </label>
+        </li>
+        <li>
+          <label>
+            <input class="tier-radio" type="radio" name="tier.value" value="1d4" {{#ifEq targetArmor '1d4'}}checked{{/ifEq}}/>
+            <span class="tier-num">2</span>
+            <span class="tier-dmg">d4</span>
+          </label>
+        </li>
+        <li>
+          <label>
+            <input class="tier-radio" type="radio" name="tier.value" value="1d6" {{#ifEq targetArmor '1d6'}}checked{{/ifEq}}/>
+            <span class="tier-num">3</span>
+            <span class="tier-dmg">d6</span>
+          </label>
+        </li>
+        <li>
+          <label>
+            <input class="tier-radio" type="radio" name="tier.value" value="1d8" {{#ifEq targetArmor '1d8'}}checked{{/ifEq}}/>
+            <span class="tier-num">4</span>
+            <span class="tier-dmg">d8</span>
+          </label>
+        </li>
+      </ul>
+    </div>
   </div>
 </form>