From 3d079ae1a472d5c05c95f0038b4ba64b9a7b520e Mon Sep 17 00:00:00 2001 From: Michael Green Date: Sun, 16 Mar 2025 01:20:12 +0100 Subject: [PATCH 1/3] button to collapse/expand attributes and attribute groups --- module/helper.js | 49 +++++++++++++++++++++++++-- styles/simple.css | 12 +++++++ template.json | 2 ++ templates/actor-sheet.html | 4 ++- templates/item-sheet.html | 4 ++- templates/parts/sheet-attributes.html | 2 +- templates/parts/sheet-groups.html | 4 ++- 7 files changed, 71 insertions(+), 6 deletions(-) diff --git a/module/helper.js b/module/helper.js index e01438b..5373814 100644 --- a/module/helper.js +++ b/module/helper.js @@ -127,6 +127,27 @@ export class EntitySheetHelper { /* -------------------------------------------- */ + /** + * Toggle whether a list of attributes are collapsed or expanded + * @param {object} element The element containing the group list + * @param {boolean=} collapsed Force the group collapsed to true or false + */ + static toggleAttributeCollapse(el, collapsed) { + const cb = el.querySelector('.attribute-collapsed'); + const i = el.querySelector('a.attribute-control > i'); + if(cb.checked = collapsed !== undefined ? collapsed : !cb.checked){ + i.classList.remove('fa-caret-down') + i.classList.add('fa-caret-right') + el.parentElement.querySelector('section.attributes-group').style.display = 'none'; + } else { + i.classList.remove('fa-caret-right') + i.classList.add('fa-caret-down') + el.parentElement.querySelector('section.attributes-group').style.display = 'block'; + } + } + + /* -------------------------------------------- */ + /** * Listen for click events on an attribute control to modify the composition of attributes in the sheet * @param {MouseEvent} event The originating left click event @@ -140,6 +161,8 @@ export class EntitySheetHelper { return EntitySheetHelper.createAttribute(event, this); case "delete": return EntitySheetHelper.deleteAttribute(event, this); + case "collapse": + return EntitySheetHelper.collapseAttributes(event, this); } } @@ -158,6 +181,8 @@ export class EntitySheetHelper { return EntitySheetHelper.createAttributeGroup(event, this); case "delete-group": return EntitySheetHelper.deleteAttributeGroup(event, this); + case "collapse": + return EntitySheetHelper.collapseAttributes(event, this); } } @@ -273,6 +298,9 @@ export class EntitySheetHelper { const groups = app.object.system.groups; const form = app.form; + // force group attributes not to be collapsed + EntitySheetHelper.toggleAttributeCollapse(a.parentElement, false); + // Determine the new attribute key for ungrouped attributes. let objKeys = Object.keys(attrs).filter(k => !Object.keys(groups).includes(k)); let nk = Object.keys(attrs).length + 1; @@ -351,6 +379,19 @@ export class EntitySheetHelper { /* -------------------------------------------- */ + /** + * Collapse or expand attributes. + * @param {MouseEvent} event The originating left click event + * @param {Object} app The form application object. + */ + static async collapseAttributes(event, app) { + const a = event.currentTarget; + EntitySheetHelper.toggleAttributeCollapse(a.parentElement); + await app._onSubmit(event); + } + + /* -------------------------------------------- */ + /** * Create new attribute groups. * @param {MouseEvent} event The originating left click event @@ -418,7 +459,8 @@ export class EntitySheetHelper { let groupKeys = []; // Handle the free-form attributes list - const formAttrs = foundry.utils.expandObject(formData)?.system?.attributes || {}; + const expanded = foundry.utils.expandObject(formData); + const formAttrs = expanded?.system?.attributes || {}; const attributes = Object.values(formAttrs).reduce((obj, v) => { let attrs = []; let group = null; @@ -464,8 +506,11 @@ export class EntitySheetHelper { } } + // Copy across collapsed flag for attributes + formAttrs.attributes_collapsed = expanded?.attributes_collapsed; + // Re-combine formData - formData = Object.entries(formData).filter(e => !e[0].startsWith("system.attributes")).reduce((obj, e) => { + formData = Object.entries(formData).filter(e => !e[0].startsWith("system.attributes.")).reduce((obj, e) => { obj[e[0]] = e[1]; return obj; }, {_id: document.id, "system.attributes": attributes}); diff --git a/styles/simple.css b/styles/simple.css index 09e8e4f..7e7ec4d 100644 --- a/styles/simple.css +++ b/styles/simple.css @@ -3,6 +3,11 @@ /* Items List */ /* Attributes */ } +.worldbuilding a.fa-caret-right, +.worldbuilding a.fa-caret-down { + font-weight: 900; + font-size: smaller; +} .worldbuilding .window-content { height: 100%; padding: 5px; @@ -215,6 +220,10 @@ border-radius: 2px; padding: 2px 5px; } +.worldbuilding .attributes-header .attribute-control:first-child, +.worldbuilding .group-header .attribute-control:first-child { + flex: none; +} .worldbuilding .group-key, .worldbuilding .group-label { font-weight: bold; @@ -235,6 +244,9 @@ flex: 0 0 116px; margin: 0 5px; } +.worldbuilding .attribute-collapsed { + display: none; +} .worldbuilding.sheet.actor { min-width: 560px; min-height: 420px; diff --git a/template.json b/template.json index 762e621..eeb59fe 100644 --- a/template.json +++ b/template.json @@ -14,6 +14,7 @@ "min": 0, "max": 5 }, + "attributes_collapsed": false, "attributes": {}, "groups": {} } @@ -25,6 +26,7 @@ "description": "", "quantity": 1, "weight": 0, + "attributes_collapsed": false, "attributes": {}, "groups": {} } diff --git a/templates/actor-sheet.html b/templates/actor-sheet.html index 3b31169..544c29a 100644 --- a/templates/actor-sheet.html +++ b/templates/actor-sheet.html @@ -91,15 +91,17 @@

{{item.name}}

{{!-- Attributes Tab --}}
+ {{localize "SIMPLE.AttributeKey"}} {{localize "SIMPLE.AttributeValue"}} {{localize "SIMPLE.AttributeLabel"}} {{localize "SIMPLE.AttributeDtype"}} +
{{!-- Render the attribute list partial. --}} - {{> "systems/worldbuilding/templates/parts/sheet-attributes.html" attributes=systemData.ungroupedAttributes dtypes=dtypes}} + {{> "systems/worldbuilding/templates/parts/sheet-attributes.html" attributes=systemData.ungroupedAttributes dtypes=dtypes collapsed=systemData.attributes_collapsed}} {{!-- Render the grouped attributes partial and control. --}}
diff --git a/templates/item-sheet.html b/templates/item-sheet.html index c3fa48d..342e27f 100644 --- a/templates/item-sheet.html +++ b/templates/item-sheet.html @@ -33,15 +33,17 @@

{{!-- Attributes Tab --}}
+ {{localize "SIMPLE.AttributeKey"}} {{localize "SIMPLE.AttributeValue"}} {{localize "SIMPLE.AttributeLabel"}} {{localize "SIMPLE.AttributeDtype"}} +
{{!-- Render the attribute list partial. --}} - {{> "systems/worldbuilding/templates/parts/sheet-attributes.html" attributes=systemData.ungroupedAttributes dtypes=dtypes}} + {{> "systems/worldbuilding/templates/parts/sheet-attributes.html" attributes=systemData.ungroupedAttributes dtypes=dtypes collapsed=systemData.attributes_collapsed}} {{!-- Render the grouped attributes partial and control. --}}
diff --git a/templates/parts/sheet-attributes.html b/templates/parts/sheet-attributes.html index eb7ba89..4612673 100644 --- a/templates/parts/sheet-attributes.html +++ b/templates/parts/sheet-attributes.html @@ -1,4 +1,4 @@ -
+
    {{#each attributes as |attr key|}}
  1. diff --git a/templates/parts/sheet-groups.html b/templates/parts/sheet-groups.html index 0309ecc..bc65078 100644 --- a/templates/parts/sheet-groups.html +++ b/templates/parts/sheet-groups.html @@ -2,6 +2,7 @@ {{#each groups as |group groupKey|}}
  2. + +
    - {{> "systems/worldbuilding/templates/parts/sheet-attributes.html" attributes=group.attributes group=groupKey dtypes=../dtypes}} + {{> "systems/worldbuilding/templates/parts/sheet-attributes.html" attributes=group.attributes group=groupKey dtypes=../dtypes collapsed=group.collapsed}}
    3. {{/each}}
From 3cecc8e10020a7b30f3a0763167bdd1789b8d90e Mon Sep 17 00:00:00 2001 From: Michael Green Date: Sat, 22 Mar 2025 18:00:08 +0100 Subject: [PATCH 2/3] remove font-weight and font-size for fa-carret-right/down as "fas" group is supplying the defaults for these --- styles/simple.css | 5 ----- 1 file changed, 5 deletions(-) diff --git a/styles/simple.css b/styles/simple.css index 7e7ec4d..1562c9e 100644 --- a/styles/simple.css +++ b/styles/simple.css @@ -3,11 +3,6 @@ /* Items List */ /* Attributes */ } -.worldbuilding a.fa-caret-right, -.worldbuilding a.fa-caret-down { - font-weight: 900; - font-size: smaller; -} .worldbuilding .window-content { height: 100%; padding: 5px; From 9b460546229e8db8a83f75d0b5c28c53818b6d5a Mon Sep 17 00:00:00 2001 From: Michael Green Date: Sat, 22 Mar 2025 18:12:12 +0100 Subject: [PATCH 3/3] use camel-case variable names --- module/helper.js | 2 +- template.json | 4 ++-- templates/actor-sheet.html | 6 +++--- templates/item-sheet.html | 6 +++--- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/module/helper.js b/module/helper.js index 5373814..939a018 100644 --- a/module/helper.js +++ b/module/helper.js @@ -507,7 +507,7 @@ export class EntitySheetHelper { } // Copy across collapsed flag for attributes - formAttrs.attributes_collapsed = expanded?.attributes_collapsed; + formAttrs.attributesCollapsed = expanded?.attributesCollapsed; // Re-combine formData formData = Object.entries(formData).filter(e => !e[0].startsWith("system.attributes.")).reduce((obj, e) => { diff --git a/template.json b/template.json index eeb59fe..0df074d 100644 --- a/template.json +++ b/template.json @@ -14,7 +14,7 @@ "min": 0, "max": 5 }, - "attributes_collapsed": false, + "attributesCollapsed": false, "attributes": {}, "groups": {} } @@ -26,7 +26,7 @@ "description": "", "quantity": 1, "weight": 0, - "attributes_collapsed": false, + "attributesCollapsed": false, "attributes": {}, "groups": {} } diff --git a/templates/actor-sheet.html b/templates/actor-sheet.html index 544c29a..73ecc01 100644 --- a/templates/actor-sheet.html +++ b/templates/actor-sheet.html @@ -91,17 +91,17 @@

{{item.name}}

{{!-- Attributes Tab --}}
- + {{localize "SIMPLE.AttributeKey"}} {{localize "SIMPLE.AttributeValue"}} {{localize "SIMPLE.AttributeLabel"}} {{localize "SIMPLE.AttributeDtype"}} - +
{{!-- Render the attribute list partial. --}} - {{> "systems/worldbuilding/templates/parts/sheet-attributes.html" attributes=systemData.ungroupedAttributes dtypes=dtypes collapsed=systemData.attributes_collapsed}} + {{> "systems/worldbuilding/templates/parts/sheet-attributes.html" attributes=systemData.ungroupedAttributes dtypes=dtypes collapsed=systemData.attributesCollapsed}} {{!-- Render the grouped attributes partial and control. --}}
diff --git a/templates/item-sheet.html b/templates/item-sheet.html index 342e27f..7bfe421 100644 --- a/templates/item-sheet.html +++ b/templates/item-sheet.html @@ -33,17 +33,17 @@

{{!-- Attributes Tab --}}
- + {{localize "SIMPLE.AttributeKey"}} {{localize "SIMPLE.AttributeValue"}} {{localize "SIMPLE.AttributeLabel"}} {{localize "SIMPLE.AttributeDtype"}} - +
{{!-- Render the attribute list partial. --}} - {{> "systems/worldbuilding/templates/parts/sheet-attributes.html" attributes=systemData.ungroupedAttributes dtypes=dtypes collapsed=systemData.attributes_collapsed}} + {{> "systems/worldbuilding/templates/parts/sheet-attributes.html" attributes=systemData.ungroupedAttributes dtypes=dtypes collapsed=systemData.attributesCollapsed}} {{!-- Render the grouped attributes partial and control. --}}