allow button icon and text to be configured on a per script basis

Author: FurtherV

lang/en.json

@@ -18,7 +18,7 @@
       },
       "showHeaderButtonLabel": {
         "Name": "Display Button Label",
-        "Hint": "If checked, the button's label is displayed."
+        "Hint": "If checked, the label is displayed in the header of applicable item sheets."
       },
       "chatCardScriptButtonPrefix": {
         "Name": "Default Chat Card Button Prefix",

scriptable-items

@@ -1,4 +1,5 @@
-import { FLAG, LANG_ID, MODULE_ID } from "../constants.mjs";
+import { FLAG, LANG_ID, MODULE_ID, SETTING } from "../constants.mjs";
+import { getSetting } from "../settings.mjs";
 
 export class ScriptModel extends foundry.abstract.DataModel {
   static DEFAULT_ICON = "icons/svg/dice-target.svg";
@@ -40,6 +41,17 @@ export class ScriptModel extends foundry.abstract.DataModel {
           label: "Trigger Set",
         },
       ),
+      buttonIconClasses: new fields.StringField({
+        required: false,
+        blank: true,
+        label: "Button Icon Classes",
+        initial: () => getSetting(SETTING.CHAT_CARD_SCRIPT_BUTTON_ICON),
+      }),
+      buttonText: new fields.StringField({
+        required: false,
+        blank: true,
+        label: "Button Text",
+      }),
     };
   }
 

scripts/data/script-model.mjs

@@ -20,7 +20,7 @@ Hooks.on("getItemSheetHeaderButtons", (app, buttons) => {
   const item = app.document;
   buttons.unshift({
     class: MODULE_ID,
-    icon: "fas fa-play",
+    icon: "fa-solid fa-code",
     label: getSetting(SETTING.SHOW_HEADER_BUTTON_LABEL)
       ? "Scriptable Items"
       : undefined,
@@ -86,9 +86,9 @@ Hooks.on("dnd5e.renderChatMessage", async (message, html) => {
       {
         action: `${MODULE_ID}-execute`,
         id: script.id,
-        iconClasses: getSetting(SETTING.CHAT_CARD_SCRIPT_BUTTON_ICON),
-        prefix: getSetting(SETTING.CHAT_CARD_SCRIPT_BUTTON_PREFIX),
-        name: script.name,
+        iconClasses: script.buttonIconClasses,
+        prefix: "",
+        name: script.buttonText ? script.buttonText : script.name,
       },
     );
 

scripts/scriptable-items.mjs

@@ -32,20 +32,12 @@ export function registerModuleSettings() {
     default: true,
   });
 
-  _registerSetting(SETTING.CHAT_CARD_SCRIPT_BUTTON_PREFIX, {
-    scope: "world",
-    config: true,
-    requiresReload: false,
-    type: String,
-    default: "Execute",
-  });
-
   _registerSetting(SETTING.CHAT_CARD_SCRIPT_BUTTON_ICON, {
     scope: "world",
-    config: true,
+    config: false,
     requiresReload: false,
     type: String,
-    default: `fas fa-play`,
+    default: `fa-solid fa-code`,
   });
 }
 

scripts/settings.mjs

@@ -15,30 +15,6 @@
             /></h1>
     </header>
 
-    {{!-- <div class="form-group">
-    <label>Triggers</label>
-    <div class="form-fields trigger-controls">
-      <select>
-        {{selectOptions availableTriggers}}
-      </select>
-      <button class="trigger-control" type="button" data-action="addTrigger">
-        <i class="fas fa-plus"></i>
-        Add
-      </button>
-    </div>
-  </div>
-
-  <ol class="form-group stacked triggers">
-    {{#each data.triggers}}
-      <li class="flexrow" data-trigger-id="{{this}}">
-        <span>{{localize (concat "SCRIPTABLE-ITEMS.Trigger." this)}}</span>
-        <a class="trigger-control" data-action="removeTrigger">
-          <i class="fas fa-trash"></i>
-        </a>
-      </li>
-    {{/each}}
-  </ol> --}}
-
     <div class="form-group">
         <label>Triggers</label>
         <multi-select name="triggers">
@@ -48,6 +24,34 @@
         </multi-select>
     </div>
 
+    <details>
+        <summary>Button Configuration</summary>
+        <fieldset>
+            <div class="form-group">
+                <label>Icon</label>
+                <input
+                    name="buttonIconClasses"
+                    type="text"
+                    value="{{data.buttonIconClasses}}"
+                    placeholder="fa-solid fa-code"
+                />
+                <p class="hint">CSS classes used for the icon of the button. If
+                    empty, no icon will be shown.</p>
+            </div>
+            <div class="form-group">
+                <label>Text</label>
+                <input
+                    name="buttonText"
+                    type="text"
+                    value="{{data.buttonText}}"
+                    placeholder="{{data.name}}"
+                />
+                <p class="hint">Text displayed on the button. Is always right of
+                    the icon and defaults to the scripts name if left empty.</p>
+            </div>
+        </fieldset>
+    </details>
+
     <div class="form-group stacked command">
         <label>{{localize "Command"}}</label>
         <textarea name="command">{{data.command}}</textarea>