Add conditions to skills/attributes drawer, update as needed (#28)

Addresses #26
rayners · May 20, 2024 · 9060f11 · 9060f11
1 parent 89c509c
commit 9060f11
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 3 deletions.
diff --git a/src/styles/module.scss b/src/styles/module.scss
@@ -44,6 +44,12 @@
           color: #f5f5f5;
         }
       }
+
+      .attribute-condition {
+        &.on {
+          color: red;
+        }
+      }
     }
 
     .movement-hud.dragonbane-movement-hud {

diff --git a/src/ts/dragonbane-drawer-panel.ts b/src/ts/dragonbane-drawer-panel.ts
@@ -6,7 +6,36 @@ type DrawerCategory = {
   buttons: Array<ArgonComponent>;
 };
 
+const attributesList = ["STR", "CON", "AGL", "INT", "WIL", "CHA"];
+
 export default class DragonbaneDrawerPanel extends ARGON.DRAWER.DrawerPanel {
+  constructor(...args) {
+    super(...args);
+
+    // should probably Hooks.off this somewhere, just not sure
+    // where. Probably won't be needed _too_ much
+
+    // this._updateHook =
+    Hooks.on("updateActor", this.updateConditions.bind(this));
+  }
+
+  updateConditions() {
+    attributesList
+      // .map((a) => a.toLowerCase())
+      .forEach((a) => {
+        const el = this.element.querySelector(
+          ".attribute-condition." + a.toLowerCase(),
+        );
+        if (el) {
+          if (this.actor.hasCondition(a.toLowerCase())) {
+            el.classList.add("on");
+          } else {
+            el.classList.remove("on");
+          }
+        }
+      });
+  }
+
   get classes() {
     return ["ability-menu", "dragonbane-ability-menu"];
   }
@@ -26,7 +55,7 @@ export default class DragonbaneDrawerPanel extends ARGON.DRAWER.DrawerPanel {
 
     const categories: Array<DrawerCategory> = [];
     if (this.actor.isCharacter) {
-      const attributesButtons = ["STR", "CON", "AGL", "INT", "WIL", "CHA"].map(
+      const attributesButtons = attributesList.map(
         (a) =>
           new ARGON.DRAWER.DrawerButton([
             {
@@ -35,14 +64,22 @@ export default class DragonbaneDrawerPanel extends ARGON.DRAWER.DrawerPanel {
               ),
               onClick: () => game.dragonbane.rollAttribute(this.actor, a),
             },
+            {
+              label: `<span class="attribute-condition ${a.toLowerCase()} ${this.actor.hasCondition(a.toLowerCase()) ? "on" : ""}">${game.i18n.localize("DoD.conditions." + a.toLowerCase())}</span>`,
+              onClick: () =>
+                this.actor.updateCondition(
+                  a.toLowerCase(),
+                  !this.actor.hasCondition(a.toLowerCase()),
+                ),
+            },
             {
               label: this.actor.system.attributes[a.toLowerCase()]?.value,
               onClick: () => game.dragonbane.rollAttribute(this.actor, a),
             },
           ]),
       );
       categories.push({
-        gridCols: "8fr 1fr",
+        gridCols: "5fr 2fr 2fr",
         captions: [
           {
             label: game.i18n.localize(
@@ -51,8 +88,9 @@ export default class DragonbaneDrawerPanel extends ARGON.DRAWER.DrawerPanel {
             align: "left",
           },
           { label: "", align: "right" },
+          { label: "", align: "right" },
         ],
-        align: ["left", "right"],
+        align: ["left", "right", "right"],
         buttons: attributesButtons,
       });
     }

diff --git a/src/ts/enhancedcombathud-dragonbane.d.ts b/src/ts/enhancedcombathud-dragonbane.d.ts
@@ -57,6 +57,9 @@ class DragonbaneActor extends Actor {
   getEquippedWeapons(): Array<DragonbaneItem>;
   hasSpells: boolean;
   getSkill(skillName: string): any;
+
+  hasCondition(attribute: string): boolean;
+  updateCondition(attribute: string, value: boolean): void;
 }
 
 class ArgonComponent {
@@ -66,6 +69,7 @@ class ArgonComponent {
   name?: string;
 
   async _renderInner(): void;
+  async render(): void;
   element: HTMLElement;
 }