From 786d4095a9a7e9442a306ec73e20f4a6db04750d Mon Sep 17 00:00:00 2001
From: Matt Smith <matt.smith@mediacurrent.com>
Date: Sun, 9 Aug 2020 16:37:16 -0500
Subject: [PATCH] 8: Add rolls to items on actor sheets

- Utilized the revisions made to roll syntax to allow for rollable
  buttons on item lists on actor sheets. Rolls are evaluated using
  `@items.ITEM.KEY`, where ITEM is the item name (slugified), and KEY is
  an attribute key for a formula attribute.
---
 module/actor-sheet.js      | 6 ++++++
 module/simple.js           | 7 +++++++
 styles/simple.css          | 5 +++++
 styles/simple.less         | 6 ++++++
 templates/actor-sheet.html | 5 +++++
 5 files changed, 29 insertions(+)

diff --git a/module/actor-sheet.js b/module/actor-sheet.js
index e8a153a..af192a2 100644
--- a/module/actor-sheet.js
+++ b/module/actor-sheet.js
@@ -34,6 +34,12 @@ export class SimpleActorSheet extends ActorSheet {
 	activateListeners(html) {
     super.activateListeners(html);
 
+    // Handle rollable attributes.
+    html.find('.items .rollable').click(ev => {
+      let r = new Roll($(ev.currentTarget).data('roll'), this.actor.getRollData());
+      r.roll().toMessage();
+    });
+
     // Everything below here is only needed if the sheet is editable
     if (!this.options.editable) return;
 
diff --git a/module/simple.js b/module/simple.js
index a880059..d618abc 100644
--- a/module/simple.js
+++ b/module/simple.js
@@ -82,4 +82,11 @@ Hooks.once("init", async function() {
     }
   }
 
+  /**
+   * Slugify a string.
+   */
+  Handlebars.registerHelper('slugify', function(value) {
+    return value.slugify({strict: true});
+  });
+
 });
diff --git a/styles/simple.css b/styles/simple.css
index f4090e1..5729e0c 100644
--- a/styles/simple.css
+++ b/styles/simple.css
@@ -94,6 +94,11 @@
 .worldbuilding .item-list .item-controls {
   flex: 0 0 36px;
 }
+.worldbuilding .item-list .item-button {
+  height: 100%;
+  line-height: 1;
+  font-size: 11px;
+}
 .worldbuilding .attributes-header {
   padding: 5px;
   margin: 5px 0;
diff --git a/styles/simple.less b/styles/simple.less
index ba89e19..cf37f71 100644
--- a/styles/simple.less
+++ b/styles/simple.less
@@ -105,6 +105,12 @@
     .item-controls {
       flex: 0 0 36px;
     }
+
+    .item-button {
+      height: 100%;
+      line-height: 1;
+      font-size: 11px;
+    }
   }
 
   /* Attributes */
diff --git a/templates/actor-sheet.html b/templates/actor-sheet.html
index c51e2a3..715d1e1 100644
--- a/templates/actor-sheet.html
+++ b/templates/actor-sheet.html
@@ -40,6 +40,11 @@
                 <li class="item flexrow" data-item-id="{{item._id}}">
                     <img src="{{item.img}}" title="{{item.name}}" width="24" height="24"/>
                     <h4 class="item-name">{{item.name}}</h4>
+                    {{#each item.data.attributes as |itemAttr key|}}
+                      {{#if (eq itemAttr.dtype "Formula")}}
+                        <button class="item-button rollable" data-roll="@items.{{slugify item.name}}.{{key}}" title="{{itemAttr.value}}">{{itemAttr.label}}</button>
+                      {{/if}}
+                    {{/each}}
                     <div class="item-controls">
                         <a class="item-control item-edit" title="Edit Item"><i class="fas fa-edit"></i></a>
                         <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>