module/applications/dialogs/groupRollDialog.mjs

@@ -37,7 +37,7 @@ export default class GroupRollDialog extends HandlebarsApplicationMixin(Applicat
         tag: 'form',
         id: 'GroupRollDialog',
         classes: ['daggerheart', 'views', 'dh-style', 'dialog', 'group-roll-dialog'],
-        position: { width: 390, height: 'auto' },
+        position: { width: 380, height: 'auto' },
         window: {
             icon: 'fa-solid fa-users'
         },
@@ -47,7 +47,7 @@ export default class GroupRollDialog extends HandlebarsApplicationMixin(Applicat
             makeRoll: this.#makeRoll,
             removeRoll: this.#removeRoll,
             rerollDice: this.#rerollDice,
-            markSuccessful: this.#markSuccessful,
+            markSuccessfull: this.#markSuccessfull,
             cancelRoll: this.#onCancelRoll,
             finishRoll: this.#finishRoll
         },
@@ -204,8 +204,7 @@ export default class GroupRollDialog extends HandlebarsApplicationMixin(Applicat
             isEditable: actor?.testUserPermission(game.user, CONST.DOCUMENT_OWNERSHIP_LEVELS.OWNER),
             key: partId,
             readyToRoll: Boolean(data.rollChoice),
-            hasRolled: Boolean(data.rollData),
+            hasRolled: Boolean(data.rollData)
-            modifier: data.successfull ? 1 : data.successfull === false ? -1 : 0
         };
     }
 
@@ -407,13 +406,12 @@ export default class GroupRollDialog extends HandlebarsApplicationMixin(Applicat
         );
     }
 
-    static #markSuccessful(_event, button) {
+    static #markSuccessfull(_event, button) {
-        const memberKey = button.closest('[data-member-key]').dataset.memberKey;
+        const previousValue = this.party.system.groupRoll.aidingCharacters[button.dataset.member].successfull;
-        const previousValue = this.party.system.groupRoll.aidingCharacters[memberKey].successfull;
+        const newValue = Boolean(button.dataset.successfull === 'true');
-        const newValue = Boolean(button.dataset.success === 'true');
         this.updatePartyData(
             {
-                [`system.groupRoll.aidingCharacters.${memberKey}.successfull`]:
+                [`system.groupRoll.aidingCharacters.${button.dataset.member}.successfull`]:
                     previousValue === newValue ? null : newValue
             },
             this.getUpdatingParts(button)

styles/less/dialog/group-roll-dialog/main.less

@@ -19,58 +19,15 @@
         }
 
         .item-tags {
-            gap: 6px;
-            .tag.failure,
             .tag.success {
-                font-weight: 600;
-                justify-content: center;
-                min-width: 3ch;
-            }
-
-            .tag.success {
-                border-color: @green;
                 background: @green-10;
                 color: @green;
             }
 
             .tag.failure {
-                border-color: @red;
                 background: @red-10;
                 color: @red;
             }
-
-            .tag {
-                padding-top: 0;
-                padding-bottom: 0;
-                line-height: 1.1875rem;
-            }
-        }
-
-        .with-result {
-            border-radius: 5px;
-            background: var(--duality-bg);
-            color: var(--color-light-2);
-            
-            &.hope {
-                --duality-text-color: @golden;
-                --duality-bg: url(../assets/parchments/dh-parchment-hope.png);
-            }
-
-            &.fear {
-                --duality-text-color: @chat-blue;
-                --duality-bg: url(../assets/parchments/dh-parchment-fear.png);
-            }
-
-            &.critical {
-                --duality-text-color: @chat-purple;
-                --duality-bg: url(../assets/parchments/dh-parchment-critical.png);
-            }
-
-            .duality-label {
-                font-family: var(--dh-font-subtitle);
-                color: var(--duality-text-color);
-                font-weight: 700;
-            }
         }
 
         .member-roll-container {
@@ -80,11 +37,6 @@
             gap: 8px;
             height: 3.375rem;
 
-            &.inactive {
-                opacity: 0.3;
-                pointer-events: none;
-            }
-
             .name-area {
                 display: flex;
                 flex-direction: column;
@@ -96,24 +48,17 @@
                 .trait {
                     display: flex;
                     align-items: center;
-                    gap: 6px;
+                    gap: var(--spacer-8);
                     select {
                         --input-height: 2em;
                         width: auto;
                     }
                 }
-                .item-tags {
-                    align-items: stretch;
-                }
             }
 
-            .buttons {
+            &.inactive {
-                display: flex;
+                opacity: 0.3;
-                flex-direction: column;
+                pointer-events: none;
-                button {
-                    --button-size: 1.5em;
-                    padding: 0 var(--spacer-4);
-                }
             }
 
             a.roll-button.initial-roll {
@@ -121,82 +66,94 @@
                 height: 1.875rem;
                 margin-right: 2px; /** makes hover look a bit nicer */
             }
+        }
+    }
 
-            .with-result {
+    .roll-container {
+        display: flex;
+        flex-direction: column;
+    }
+
+    .with-result {
+        border-radius: 5px;
+        background: var(--duality-bg);
+        color: var(--color-light-2);
+        
+        &.hope {
+            --duality-text-color: @golden;
+            --duality-bg: url(../assets/parchments/dh-parchment-hope.png);
+        }
+
+        &.fear {
+            --duality-text-color: @chat-blue;
+            --duality-bg: url(../assets/parchments/dh-parchment-fear.png);
+        }
+
+        &.critical {
+            --duality-text-color: @chat-purple;
+            --duality-bg: url(../assets/parchments/dh-parchment-critical.png);
+        }
+
+        .duality-label {
+            font-family: var(--dh-font-subtitle);
+            color: var(--duality-text-color);
+            font-weight: 700;
+        }
+    }
+
+    .roll-data {
+        display: flex;
+        flex-direction: column;
+        align-items: end;
+        justify-content: center;
+        padding: 0 4px;
+        min-height: 3rem;
+
+        .duality-label {
+            font-size: var(--font-size-15);
+
+            .unused-damage {
+                text-decoration: line-through;
+            }
+
+            .with {
+                font-size: var(--font-size-10);
+            }
+        }
+
+        .roll-dice-container {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            flex-wrap: wrap;
+            gap: 4px;
+
+            .roll-dice {
+                position: relative;
                 display: flex;
-                justify-content: end;
                 align-items: center;
-                gap: 6px;
+                justify-content: center;
 
-                .roll-data {
+                .dice-label {
-                    display: flex;
+                    position: absolute;
-                    flex-direction: column;
+                    color: white;
-                    align-items: end;
+                    font-size: 1rem;
-                    justify-content: center;
+                    paint-order: stroke fill;
-                    padding: 0 4px;
+                    -webkit-text-stroke: 2px black;
-                    min-height: 3rem;
-
-                    .duality-label {
-                        font-size: var(--font-size-15);
-
-                        .unused-damage {
-                            text-decoration: line-through;
-                        }
-
-                        .with {
-                            font-size: var(--font-size-10);
-                        }
-                    }
-
-                    .roll-dice-container {
-                        display: flex;
-                        align-items: center;
-                        justify-content: center;
-                        flex-wrap: wrap;
-                        gap: 4px;
-
-                        .roll-dice {
-                            position: relative;
-                            display: flex;
-                            align-items: center;
-                            justify-content: center;
-
-                            .dice-label {
-                                position: absolute;
-                                color: white;
-                                font-size: 1rem;
-                                paint-order: stroke fill;
-                                -webkit-text-stroke: 2px black;
-                            }
-
-                            img {
-                                height: 1.25rem;
-                            }
-                        }
-
-                        .roll-operator {
-                            font-size: var(--font-size-18);
-                        }
-
-                        .roll-value {
-                            font-size: var(--font-size-16);
-                        }
-                    }
                 }
 
-                .buttons {
+                img {
-                    gap: 2px;
+                    height: 1.25rem;
-                    button {                    
-                        color: var(--medium-red);
-                        &[data-success=true] {
-                            color: var(--green);
-                        }
-                        &.inactive {
-                            opacity: 0.4;
-                        }
-                    }
                 }
             }
+
+            .roll-operator {
+                font-size: var(--font-size-18);
+            }
+
+            .roll-value {
+                font-size: var(--font-size-16);
+            }
         }
     }
 
@@ -221,10 +178,6 @@
             margin-block: var(--spacer-4);
         }
 
-        .modifiers .item-tags {
-            min-height: calc(2px + 1.1875rem);
-        }
-
         .total {
             .label {
                 font-size: var(--font-size-14);

templates/dialogs/groupRollDialog/parts/member.hbs

@@ -1,17 +1,13 @@
 {{#with (ifThen (eq partId "leader") leader (lookup members partId))}}
     <section class="member-roll-container {{type}} {{#if @root.allHaveRolled}}select-padding{{/if}} {{#unless isEditable}}inactive{{/unless}}" data-member-key="{{@root.partId}}">
         {{log this}}
+        {{log @root}}
         <img class="portrait" src="{{img}}" />
         <div class="name-area">
             <span class="name">{{name}}</span>
             {{#if hasRolled}}
                 <div class="trait item-tags">
                     <div class="tag">{{rollChoiceLabel}}</div>
-                    {{#if modifier}}
-                        <span class="tag {{#if (gte modifier 0)}}success{{else}}failure{{/if}}">
-                            {{numberFormat modifier sign=true}}
-                        </span>
-                    {{/if}}
                 </div>
             {{else if readyToRoll}}
                 <div class="trait">
@@ -23,38 +19,30 @@
             {{/if}}
         </div>
         {{#if roll}}
-            <div class="with-result {{#if roll.withHope}}hope{{else if roll.withFear}}fear{{else}}critical{{/if}}">
+            <div class="roll-data with-result {{#if roll.withHope}}hope{{else if roll.withFear}}fear{{else}}critical{{/if}}">
-                <div class="roll-data">
+                <div class="duality-label">
-                    <div class="duality-label">
+                    {{roll.total}} 
-                        {{roll.total}} 
+                    <span class="with">{{localize "DAGGERHEART.GENERAL.withThing" thing=roll.totalLabel}}</span>
-                        <span class="with">{{localize "DAGGERHEART.GENERAL.withThing" thing=roll.totalLabel}}</span>
+                </div>
-                    </div>
+                <div class="roll-dice-container">
-                    <div class="roll-dice-container">
+                    <a class="roll-dice" data-action="rerollDice" data-member="{{@root.partId}}" data-dice-type="hope">
-                        <a class="roll-dice" data-action="rerollDice" data-member="{{@root.partId}}" data-dice-type="hope">
+                        <span class="dice-label">{{roll.dHope.total}}</span>
-                            <span class="dice-label">{{roll.dHope.total}}</span>
+                        <img src="{{concat "systems/daggerheart/assets/icons/dice/hope/" roll.dHope.denomination ".svg"}}" />
-                            <img src="{{concat "systems/daggerheart/assets/icons/dice/hope/" roll.dHope.denomination ".svg"}}" />
+                    </a>
-                        </a>
+                    <a class="roll-dice" data-action="rerollDice" data-member="{{@root.partId}}" data-dice-type="fear">
-                        <a class="roll-dice" data-action="rerollDice" data-member="{{@root.partId}}" data-dice-type="fear">
+                        <span class="dice-label">{{roll.dFear.total}}</span>
-                            <span class="dice-label">{{roll.dFear.total}}</span>
+                        <img src="{{concat "systems/daggerheart/assets/icons/dice/fear/" roll.dFear.denomination ".svg"}}" />
-                            <img src="{{concat "systems/daggerheart/assets/icons/dice/fear/" roll.dFear.denomination ".svg"}}" />
+                    </a>
-                        </a>
+                    {{#if roll.advantage.type}}
-                        {{#if roll.advantage.type}}
+                        <span class="roll-operator">{{#if (eq roll.advantage.type 1)}}+{{else}}-{{/if}}</span>
-                            <span class="roll-operator">{{#if (eq roll.advantage.type 1)}}+{{else}}-{{/if}}</span>
+                        <span class="roll-dice">
-                            <span class="roll-dice">
+                            <span class="dice-label">{{roll.advantage.value}}</span>
-                                <span class="dice-label">{{roll.advantage.value}}</span>
+                            <img src="{{concat "systems/daggerheart/assets/icons/dice/" (ifThen (eq roll.advantage.type 1) "adv/" "disadv/") roll.advantage.dice ".svg"}}" />
-                                <img src="{{concat "systems/daggerheart/assets/icons/dice/" (ifThen (eq roll.advantage.type 1) "adv/" "disadv/") roll.advantage.dice ".svg"}}" />
+                        </span>
-                            </span>
+                    {{/if}}
-                        {{/if}}
+                    <span class="roll-operator">{{#if (gte roll.modifierTotal 0)}}+{{else}}-{{/if}}</span>
-                        <span class="roll-operator ">{{#if (gte roll.modifierTotal 0)}}+{{else}}-{{/if}}</span>
+                    <span class="roll-value">{{positive roll.modifierTotal}}</span>
-                        <span class="roll-value">{{positive roll.modifierTotal}}</span>
-                    </div>
                 </div>
-                {{#if (and isEditable (ne ../partId "leader"))}}
-                    <div class="buttons">
-                        <button type="button" data-action="markSuccessful" data-success="true" class="plain icon fa-solid fa-check {{#if modifier}}{{#if successfull}}active{{else}}inactive{{/if}}{{/if}}"></button>
-                        <button type="button" data-action="markSuccessful" class="plain icon fa-solid fa-times {{#if modifier}}{{#if successfull}}inactive{{else}}active{{/if}}{{/if}}"></button>
-                    </div>
-                {{/if}}
             </div>
         {{else if readyToRoll}}
             <a class="roll-button initial-roll" data-action="makeRoll" data-member="{{@root.partId}}">

templates/dialogs/groupRollDialog/parts/result.hbs

@@ -12,9 +12,7 @@
             <span class="label">Modifiers</span>
             <div class="item-tags">
                 {{#each groupRoll.modifiers as |modifier|}}
-                    <span class="tag {{#if (gte modifier 0)}}success{{else}}failure{{/if}}">
+                    <span class="tag">{{#if (gte modifier 0)}}+{{else}}-{{/if}}{{positive modifier}}</span>
-                        {{numberFormat modifier sign=true}}
-                    </span>
                 {{/each}}
             </div>
         </div>