Prettied up roll-results template

daggerheart.mjs

@@ -59,6 +59,7 @@ CONFIG.Canvas.layers.tokens.layerClass = DhTokenLayer;
 CONFIG.MeasuredTemplate.objectClass = placeables.DhMeasuredTemplate;
 
 CONFIG.RollTable.documentClass = documents.DhRollTable;
+CONFIG.RollTable.resultTemplate = 'systems/daggerheart/templates/ui/chat/table-result.hbs';
 
 CONFIG.Scene.documentClass = documents.DhScene;
 
@@ -308,11 +309,12 @@ Hooks.on('chatMessage', (_, message) => {
         const difficulty = rollCommand.difficulty;
 
         const target = getCommandTarget({ allowNull: true });
-        const title = flavor ??
-            traitValue ? game.i18n.format('DAGGERHEART.UI.Chat.dualityRoll.abilityCheckTitle', {
-                  ability: game.i18n.localize(SYSTEM.ACTOR.abilities[traitValue].label)
-              })
-            : game.i18n.localize('DAGGERHEART.GENERAL.duality');
+        const title =
+            (flavor ?? traitValue)
+                ? game.i18n.format('DAGGERHEART.UI.Chat.dualityRoll.abilityCheckTitle', {
+                      ability: game.i18n.localize(SYSTEM.ACTOR.abilities[traitValue].label)
+                  })
+                : game.i18n.localize('DAGGERHEART.GENERAL.duality');
 
         enrichedDualityRoll({
             reaction,

module/documents/rollTable.mjs

@@ -74,4 +74,49 @@ export default class DhRollTable extends foundry.documents.RollTable {
         // Return the Roll and the results
         return { roll, results };
     }
+
+    async toMessage(results, { roll, messageData = {}, messageOptions = {} } = {}) {
+        messageOptions.rollMode ??= game.settings.get('core', 'rollMode');
+
+        // Construct chat data
+        messageData = foundry.utils.mergeObject(
+            {
+                author: game.user.id,
+                speaker: foundry.documents.ChatMessage.implementation.getSpeaker(),
+                rolls: [],
+                sound: roll ? CONFIG.sounds.dice : null,
+                flags: { 'core.RollTable': this.id }
+            },
+            messageData
+        );
+        if (roll) messageData.rolls.push(roll);
+
+        // Render the chat card which combines the dice roll with the drawn results
+        const detailsPromises = await Promise.allSettled(results.map(r => r.getHTML()));
+        const flavorKey = `TABLE.DrawFlavor${results.length > 1 ? 'Plural' : ''}`;
+        const flavor = game.i18n.format(flavorKey, {
+            number: results.length,
+            name: foundry.utils.escapeHTML(this.name)
+        });
+        messageData.content = await foundry.applications.handlebars.renderTemplate(CONFIG.RollTable.resultTemplate, {
+            description: await TextEditor.implementation.enrichHTML(this.description, {
+                documents: true,
+                secrets: this.isOwner
+            }),
+            flavor: flavor,
+            results: results.map((result, i) => {
+                const r = result.toObject(false);
+                r.details = detailsPromises[i].value ?? '';
+                const useTableIcon =
+                    result.icon === CONFIG.RollTable.resultIcon && this.img !== this.constructor.DEFAULT_ICON;
+                r.icon = useTableIcon ? this.img : result.icon;
+                return r;
+            }),
+            rollHTML: this.displayRoll && roll ? await roll.render() : null,
+            table: this
+        });
+
+        // Create the chat message
+        return foundry.documents.ChatMessage.implementation.create(messageData, messageOptions);
+    }
 }

styles/less/global/chat.less

@@ -15,6 +15,14 @@
         .message-header .message-header-main .message-sub-header-container h4 {
             color: @dark-blue;
         }
+
+        .message-content {
+            .table-draw {
+                .table-description {
+                    color: @dark;
+                }
+            }
+        }
     }
 }
 
@@ -83,6 +91,7 @@
 
             .message-content {
                 padding-bottom: 8px;
+
                 .flavor-text {
                     font-size: var(--font-size-12);
                     line-height: 20px;
@@ -90,6 +99,23 @@
                     text-align: center;
                     display: block;
                 }
+
+                .table-draw {
+                    .table-flavor {
+                        padding-top: 5px;
+                        padding-bottom: 0.5rem;
+                        font-size: var(--font-size-12);
+                    }
+
+                    .table-description {
+                        color: @beige;
+                        font-style: italic;
+
+                        &.flavor-spaced {
+                            padding-top: 0;
+                        }
+                    }
+                }
             }
         }
     }

templates/ui/chat/table-result.hbs

@@ -0,0 +1,17 @@
+<div class="table-draw" data-table-id="{{table.id}}">
+    {{#if flavor}}<div class="table-flavor">{{flavor}}</div>{{/if}}
+
+    {{#if description}}
+        <div class="table-description {{#if flavor}}flavor-spaced{{/if}}">{{{description}}}</div>
+    {{/if}}
+    {{{rollHTML}}}
+
+    <ul class="table-results">
+        {{#each results as |result|}}
+            <li class="flexrow" data-result-id="{{result.id}}">
+                <img src="{{result.icon}}">
+                {{{result.details}}}
+            </li>
+        {{/each}}
+    </ul>
+</div>