[Feature] Support for configurable currency icons (#1422)

* Add support for configurable currency icons

* Remove unused plain style

* Changed so that icons don't have to have an icon

---------

Co-authored-by: WBHarry <williambjrklund@gmail.com>

lang/en.json

@@ -2441,9 +2441,12 @@
                 },
                 "currency": {
                     "title": "Currency Overrides",
+                    "changeIcon": "Change Currency Icon",
                     "currencyName": "Currency Name",
                     "coinName": "Coin Name",
                     "handfulName": "Handful Name",
+                    "iconName": "Icon Name",
+                    "iconNameHint": "Icons are from fontawesome",
                     "bagName": "Bag Name",
                     "chestName": "Chest Name"
                 },

module/applications/settings/homebrewSettings.mjs

@@ -32,6 +32,7 @@ export default class DhHomebrewSettings extends HandlebarsApplicationMixin(Appli
             icon: 'fa-solid fa-gears'
         },
         actions: {
+            editCurrencyIcon: this.changeCurrencyIcon,
             addItem: this.addItem,
             editItem: this.editItem,
             removeItem: this.removeItem,
@@ -115,6 +116,45 @@ export default class DhHomebrewSettings extends HandlebarsApplicationMixin(Appli
         this.render();
     }
 
+    static async changeCurrencyIcon(_, target) {
+        const type = target.dataset.currency;
+        const currentIcon = this.settings.currency[type].icon;
+        const icon = await foundry.applications.api.DialogV2.input({
+            classes: ['daggerheart', 'dh-style', 'change-currency-icon'],
+            content: await foundry.applications.handlebars.renderTemplate(
+                'systems/daggerheart/templates/settings/homebrew-settings/change-currency-icon.hbs',
+                { currentIcon }
+            ),
+            window: {
+                title: game.i18n.localize('DAGGERHEART.SETTINGS.Homebrew.currency.changeIcon'),
+                icon: 'fa-solid fa-coins'
+            },
+            render: (_, dialog) => {
+                const icon = dialog.element.querySelector('.displayed-icon i');
+                const input = dialog.element.querySelector('input');
+                const reset = dialog.element.querySelector('button[data-action=reset]');
+                input.addEventListener('input', () => {
+                    icon.classList.value = input.value;
+                });
+                reset.addEventListener('click', () => {
+                    const currencyField = DhHomebrew.schema.fields.currency.fields[type];
+                    const initial = currencyField.fields.icon.getInitialValue();
+                    input.value = icon.classList.value = initial;
+                });
+            },
+            ok: {
+                callback: (_, button) => button.form.elements.icon.value
+            }
+        });
+
+        if (icon !== null) {
+            await this.settings.updateSource({
+                [`currency.${type}.icon`]: icon
+            });
+            this.render();
+        }
+    }
+
     static async addItem(_, target) {
         const { type } = target.dataset;
         if (['shortRest', 'longRest'].includes(type)) {

module/data/settings/Homebrew.mjs

@@ -1,14 +1,15 @@
 import { defaultRestOptions } from '../../config/generalConfig.mjs';
 import { ActionsField } from '../fields/actionField.mjs';
 
-const currencyField = (initial, label) =>
+const currencyField = (initial, label, icon) =>
     new foundry.data.fields.SchemaField({
         enabled: new foundry.data.fields.BooleanField({ required: true, initial: true }),
         label: new foundry.data.fields.StringField({
             required: true,
             initial,
             label
-        })
+        }),
+        icon: new foundry.data.fields.StringField({ required: true, nullable: false, blank: true, initial: icon })
     });
 
 export default class DhHomebrew extends foundry.abstract.DataModel {
@@ -45,10 +46,22 @@ export default class DhHomebrew extends foundry.abstract.DataModel {
                     initial: 'Gold',
                     label: 'DAGGERHEART.SETTINGS.Homebrew.currency.currencyName'
                 }),
-                coins: currencyField('Coins', 'DAGGERHEART.SETTINGS.Homebrew.currency.coinName'),
-                handfuls: currencyField('Handfuls', 'DAGGERHEART.SETTINGS.Homebrew.currency.handfulName'),
-                bags: currencyField('Bags', 'DAGGERHEART.SETTINGS.Homebrew.currency.bagName'),
-                chests: currencyField('Chests', 'DAGGERHEART.SETTINGS.Homebrew.currency.chestName')
+                coins: currencyField(
+                    'Coins',
+                    'DAGGERHEART.SETTINGS.Homebrew.currency.coinName',
+                    'fa-solid fa-coin-front'
+                ),
+                handfuls: currencyField(
+                    'Handfuls',
+                    'DAGGERHEART.SETTINGS.Homebrew.currency.handfulName',
+                    'fa-solid fa-coins'
+                ),
+                bags: currencyField('Bags', 'DAGGERHEART.SETTINGS.Homebrew.currency.bagName', 'fa-solid fa-sack'),
+                chests: currencyField(
+                    'Chests',
+                    'DAGGERHEART.SETTINGS.Homebrew.currency.chestName',
+                    'fa-solid fa-treasure-chest'
+                )
             }),
             restMoves: new fields.SchemaField({
                 longRest: new fields.SchemaField({
@@ -139,22 +152,10 @@ export default class DhHomebrew extends foundry.abstract.DataModel {
     /** @inheritDoc */
     _initializeSource(source, options = {}) {
         source = super._initializeSource(source, options);
-        source.currency.coins = {
-            enabled: source.currency.coins.enabled ?? true,
-            label: source.currency.coins.label || source.currency.coins
-        };
-        source.currency.handfuls = {
-            enabled: source.currency.handfuls.enabled ?? true,
-            label: source.currency.handfuls.label || source.currency.handfuls
-        };
-        source.currency.bags = {
-            enabled: source.currency.bags.enabled ?? true,
-            label: source.currency.bags.label || source.currency.bags
-        };
-        source.currency.chests = {
-            enabled: source.currency.chests.enabled ?? true,
-            label: source.currency.chests.label || source.currency.chests
-        };
+        for (const type of ['coins', 'handfuls', 'bags', 'chests']) {
+            const initial = this.schema.fields.currency.fields[type].getInitialValue();
+            source.currency[type] = foundry.utils.mergeObject(initial, source.currency[type], { inplace: false });
+        }
         return source;
     }
 }

styles/less/dialog/index.less

@@ -37,3 +37,5 @@
 @import './image-select/sheet.less';
 
 @import './item-transfer/sheet.less';
+
+@import './settings/change-currency-icon.less';

styles/less/dialog/settings/change-currency-icon.less

@@ -0,0 +1,13 @@
+.application.daggerheart.dialog.dh-style.change-currency-icon {
+    .displayed-icon {
+        height: 2.5rem;
+        text-align: center;
+        font-size: 2.5rem;
+        margin-bottom: 1.25rem;
+    }
+    .input-row {
+        display: flex;
+        gap: 4px;
+        align-items: center;
+    }
+}

templates/settings/homebrew-settings/change-currency-icon.hbs

@@ -0,0 +1,10 @@
+<div>
+    <div class="displayed-icon">
+        <i class="{{currentIcon}}" inert></i>
+    </div>
+    <span>{{localize "DAGGERHEART.SETTINGS.Homebrew.currency.iconName"}} (<em>{{localize "DAGGERHEART.SETTINGS.Homebrew.currency.iconNameHint"}}</em>)</span>
+    <div class="input-row">
+        <input type="text" name="icon" value="{{currentIcon}}" />
+        <button type="button" data-action="reset" class="plain icon fa-solid fa-redo"></button>
+    </div>
+</div>

templates/settings/homebrew-settings/settings.hbs

@@ -33,18 +33,22 @@
                 {{formGroup settingFields.schema.fields.currency.fields.title value=settingFields._source.currency.title localize=true}}
             </div>
             <div class="toggleable-row">
+                <button class="icon {{settingFields._source.currency.coins.icon}}" data-action="editCurrencyIcon" data-currency="coins" data-tooltip="DAGGERHEART.SETTINGS.Homebrew.currency.changeIcon"></button>
                 {{formGroup settingFields.schema.fields.currency.fields.coins.fields.label value=settingFields._source.currency.coins.label localize=true}}
                 <input type="checkbox" name="currency.coins.enabled" {{checked settingFields._source.currency.coins.enabled}} />
             </div>
             <div class="toggleable-row">
+                <button class="icon {{settingFields._source.currency.handfuls.icon}}" data-action="editCurrencyIcon" data-currency="handfuls" data-tooltip="DAGGERHEART.SETTINGS.Homebrew.currency.changeIcon"></button>
                 {{formGroup settingFields.schema.fields.currency.fields.handfuls.fields.label value=settingFields._source.currency.handfuls.label localize=true}}
                 <input type="checkbox" name="currency.handfuls.enabled" {{checked settingFields._source.currency.handfuls.enabled}} />
             </div>
             <div class="toggleable-row">
+                <button class="icon {{settingFields._source.currency.bags.icon}}" data-action="editCurrencyIcon" data-currency="bags" data-tooltip="DAGGERHEART.SETTINGS.Homebrew.currency.changeIcon"></button>
                 {{formGroup settingFields.schema.fields.currency.fields.bags.fields.label value=settingFields._source.currency.bags.label localize=true}}
                 <input type="checkbox" name="currency.bags.enabled" {{checked settingFields._source.currency.bags.enabled}} />
             </div>
             <div class="toggleable-row">
+                <button class="icon {{settingFields._source.currency.chests.icon}}" data-action="editCurrencyIcon" data-currency="chests" data-tooltip="DAGGERHEART.SETTINGS.Homebrew.currency.changeIcon"></button>
                 {{formGroup settingFields.schema.fields.currency.fields.chests.fields.label value=settingFields._source.currency.chests.label localize=true}}
                 <input type="checkbox" name="currency.chests.enabled" {{checked settingFields._source.currency.chests.enabled}} />
             </div>

templates/sheets/actors/character/inventory.hbs

@@ -17,7 +17,9 @@
             {{#each this.inventory.currencies as | currency |}}
                 {{#if currency.enabled}}
                     <div class="input">
-                        <span>{{localize currency.label}}</span>
+                        <span>
+                            <i class="{{currency.icon}}" inert></i> {{localize currency.label}}
+                        </span>
                         <input type="text" name="{{currency.field.fieldPath}}" data-allow-delta value="{{currency.value}}" data-dtype="Number" min="0" step="1" />
                     </div>
                 {{/if}}

templates/sheets/actors/party/inventory.hbs

@@ -20,7 +20,9 @@
             {{#each this.inventory.currencies as | currency |}}
                 {{#if currency.enabled}}
                     <div class="input">
-                        <span>{{localize currency.label}}</span>
+                        <span>
+                            <i class="{{currency.icon}}" inert></i> {{localize currency.label}}
+                        </span>
                         <input type="text" name="{{currency.field.fieldPath}}" data-allow-delta value="{{currency.value}}" data-dtype="Number" min="0" step="1" />
                     </div>
                 {{/if}}