[foundryvtt#244] Preserve expanded state of items on actor sheets acr…

…oss re-render
arbron · Jan 23, 2023 · 33a0609 · 33a0609
1 parent 8b27023
commit 33a0609
Show file tree

Hide file tree

Showing 9 changed files with 48 additions and 10 deletions.
diff --git a/module/applications/actor/base-sheet.mjs b/module/applications/actor/base-sheet.mjs
@@ -39,6 +39,15 @@ export default class ActorSheet5e extends ActorSheet {
 
   /* -------------------------------------------- */
 
+  /**
+   * IDs for items on the sheet that have been expanded.
+   * @type {Set<string>}
+   * @protected
+   */
+  _expanded = new Set();
+
+  /* -------------------------------------------- */
+
   /** @override */
   static get defaultOptions() {
     return foundry.utils.mergeObject(super.defaultOptions, {
@@ -152,6 +161,10 @@ export default class ActorSheet5e extends ActorSheet {
 
     // Prepare owned items
     this._prepareItems(context);
+    context.expandedData = {};
+    for ( const id of this._expanded ) {
+      context.expandedData[id] = await this.actor.items.get(id).getChatData({secrets: this.actor.isOwner});
+    }
 
     // Biography HTML enrichment
     context.biographyHTML = await TextEditor.enrichHTML(context.system.details.biography.value, {
@@ -1148,15 +1161,14 @@ export default class ActorSheet5e extends ActorSheet {
 
     // Toggle summary
     if ( li.hasClass("expanded") ) {
-      let summary = li.children(".item-summary");
+      const summary = li.children(".item-summary");
       summary.slideUp(200, () => summary.remove());
+      this._expanded.delete(item.id);
     } else {
-      let div = $(`<div class="item-summary">${chatData.description.value}</div>`);
-      let props = $('<div class="item-properties"></div>');
-      chatData.properties.forEach(p => props.append(`<span class="tag">${p}</span>`));
-      div.append(props);
-      li.append(div.hide());
-      div.slideDown(200);
+      const summary = $(await renderTemplate("systems/dnd5e/templates/items/parts/item-summary.hbs", chatData));
+      li.append(summary.hide());
+      summary.slideDown(200);
+      this._expanded.add(item.id);
     }
     li.toggleClass("expanded");
   }

diff --git a/module/applications/actor/character-sheet.mjs b/module/applications/actor/character-sheet.mjs
@@ -78,6 +78,9 @@ export default class ActorSheet5eCharacter extends ActorSheet5e {
         }
       }[item.system.attunement];
 
+      // Prepare data needed to display expanded sections
+      ctx.isExpanded = this._expanded.has(item.id);
+
       // Item usage
       ctx.hasUses = uses && (uses.max > 0);
       ctx.isOnCooldown = recharge && !!recharge.value && (recharge.charged === false);

diff --git a/module/applications/actor/npc-sheet.mjs b/module/applications/actor/npc-sheet.mjs
@@ -59,6 +59,7 @@ export default class ActorSheet5eNPC extends ActorSheet5e {
       const {quantity, uses, recharge, target} = item.system;
       const ctx = context.itemContext[item.id] ??= {};
       ctx.isStack = Number.isNumeric(quantity) && (quantity !== 1);
+      ctx.isExpanded = this._expanded.has(item.id);
       ctx.hasUses = uses && (uses.max > 0);
       ctx.isOnCooldown = recharge && !!recharge.value && (recharge.charged === false);
       ctx.isDepleted = item.isOnCooldown && (uses.per && (uses.value > 0));

diff --git a/module/applications/actor/vehicle-sheet.mjs b/module/applications/actor/vehicle-sheet.mjs
@@ -169,6 +169,7 @@ export default class ActorSheet5eVehicle extends ActorSheet5e {
       const {uses, recharge} = item.system;
       const ctx = context.itemContext[item.id] ??= {};
       ctx.canToggle = false;
+      ctx.isExpanded = this._expanded.has(item.id);
       ctx.hasUses = uses && (uses.max > 0);
       ctx.isOnCooldown = recharge && !!recharge.value && (recharge.charged === false);
       ctx.isDepleted = item.isOnCooldown && (uses.per && (uses.value > 0));

diff --git a/module/utils.mjs b/module/utils.mjs
@@ -124,6 +124,7 @@ export async function preloadHandlebarsTemplates() {
     "systems/dnd5e/templates/items/parts/item-description.hbs",
     "systems/dnd5e/templates/items/parts/item-mountable.hbs",
     "systems/dnd5e/templates/items/parts/item-spellcasting.hbs",
+    "systems/dnd5e/templates/items/parts/item-summary.hbs",
 
     // Journal Partials
     "systems/dnd5e/templates/journal/parts/journal-table.hbs",

diff --git a/templates/actors/parts/actor-features.hbs b/templates/actors/parts/actor-features.hbs
@@ -37,7 +37,8 @@
     <ol class="item-list">
     {{#each section.items as |item iid|}}
     {{#dnd5e-itemContext item as |ctx|}}
-        <li class="item flexrow {{#if ctx.isDepleted}}depleted{{/if}}" data-item-id="{{item.id}}">
+        <li class="item flexrow {{#if ctx.isDepleted}}depleted{{/if}} {{#if ctx.isExpanded}}expanded{{/if}}"
+            data-item-id="{{item.id}}">
             <div class="item-name flexrow rollable">
                 <div class="item-image" tabindex="0" role="button" aria-label="{{item.name}}" style="background-image: url('{{item.img}}')"></div>
                 <h4>
@@ -108,6 +109,10 @@
                 </a>
             </div>
             {{/if}}
+
+            {{#if ctx.isExpanded}}
+                {{> "dnd5e.item-summary" (lookup @root.expandedData item.id)}}
+            {{/if}}
         </li>
     {{/dnd5e-itemContext}}
     {{/each}}

diff --git a/templates/actors/parts/actor-inventory.hbs b/templates/actors/parts/actor-inventory.hbs
@@ -56,7 +56,7 @@
     <ol class="item-list">
     {{#each section.items as |item iid|}}
     {{#dnd5e-itemContext item as |ctx|}}
-        <li class="item flexrow {{section.css}}" data-item-id="{{item.id}}"
+        <li class="item flexrow {{section.css}} {{#if ctx.isExpanded}}expanded{{/if}}" data-item-id="{{item.id}}"
             {{#if section.editableName}}data-item-index="{{iid}}"{{/if}}>
             <div class="item-name flexrow {{@root.rollableClass}}">
                 {{#if section.editableName}}
@@ -129,6 +129,10 @@
                 </a>
             </div>
             {{/if}}
+
+            {{#if ctx.isExpanded}}
+                {{> "dnd5e.item-summary" (lookup @root.expandedData item.id)}}
+            {{/if}}
         </li>
     {{/dnd5e-itemContext}}
     {{/each}}

diff --git a/templates/actors/parts/actor-spellbook.hbs b/templates/actors/parts/actor-spellbook.hbs
@@ -70,7 +70,7 @@
     <ol class="item-list">
     {{#each section.spells as |item i|}}
     {{#dnd5e-itemContext item as |ctx|}}
-        <li class="item flexrow" data-item-id="{{item.id}}">
+        <li class="item flexrow {{#if ctx.isExpanded}}expanded{{/if}}" data-item-id="{{item.id}}">
             <div class="item-name flexrow rollable">
                 <div class="item-image" tabindex="0" role="button" aria-label="{{item.name}}" style="background-image: url('{{item.img}}')"></div>
                 <h4>{{item.name}}</h4>
@@ -107,6 +107,10 @@
                 </a>
             </div>
             {{/if}}
+
+            {{#if ctx.isExpanded}}
+                {{> "dnd5e.item-summary" (lookup @root.expandedData item.id)}}
+            {{/if}}
         </li>
     {{/dnd5e-itemContext}}
     {{/each}}

diff --git a/templates/items/parts/item-summary.hbs b/templates/items/parts/item-summary.hbs
@@ -0,0 +1,7 @@
+<div class="item-summary">
+  {{{description.value}}}
+
+  <div class="item-properties">
+    {{#each properties}}<span class="tag">{{this}}</span>{{/each}}
+  </div>
+</div>