Foundry/.dungeon
0
0
Fork 0
Code Issues 57 Pull requests Projects Releases 7 Packages Wiki Activity Actions

Make it so we don't need to re-render the sheet on collapse toggle

Browse source
This commit is contained in:
Oliver-Akins 2024-03-25 19:05:01 -06:00
parent 34eae97b47
commit 97af3801c4
5 changed files with 63 additions and 51 deletions
Download patch file Download diff file Expand all files Collapse all files

8
module/sheets/GenericActorSheet.mjs
View file

@ -114,19 +114,19 @@ export class GenericActorSheet extends ActorSheet {
};
async _handleSummaryToggle($e) {
$e.stopPropagation();
let target = $e.currentTarget;
let parent = target.parentElement;
let parent = target.closest(`.collapse`);
let data = target.dataset;
console.debug(`.dungeon | Collapse ID: ${data.collapseId}`);
if (!this._expanded.has(data.collapseId)) {
this._expanded.add(data.collapseId);
parent.setAttribute(`open`, ``);
} else {
this._expanded.delete(data.collapseId);
parent.removeAttribute(`open`, ``);
};
if (parent.nodeName !== "DETAILS") {
this.render();
}
};
async openEmbeddedSheet($event) {

49
styles/sheets/actor/char-sheet/v2/pages/inventory.scss
View file

@ -128,6 +128,38 @@
}
}
.collapse {
&__header {
display: flex;
gap: 8px;
align-items: center;
justify-content: space-between;
&:hover {
cursor: pointer;
}
}
&__toggle {
color: var(--inventory-material-color);
transition: transform 200ms ease-in-out;
&:focus-visible {
box-shadow: 0 0 10px var(--color-shadow-highlight);
}
}
&__content { display: none; visibility: hidden; }
&[open] .collapse{
&__toggle {
transform: rotate(90deg);
}
&__content {
display: unset;
visibility: visible;
}
}
}
.material {
@include material.elevate(1);
padding: 8px;
@ -192,23 +224,6 @@
border-radius: 4px;
color: var(--inventory-material-color);
&__header {
display: flex;
gap: 8px;
align-items: center;
justify-content: space-between;
&:hover {
cursor: pointer;
}
button {
color: var(--inventory-material-color);
&:focus-visible {
box-shadow: 0 0 10px var(--color-shadow-highlight);
}
}
}
&__name {
flex-grow: 1;
cursor: inherit;

19
templates/actors/char-sheet/v2/partials/inventory/items/aspect.v2.pc.hbs
View file

@ -1,28 +1,27 @@
<section class="aspect">
<section
class="aspect collapse"
{{dd-expanded meta.expanded item.uuid}}
>
<div
class="aspect__header"
class="collapse__header"
data-collapse-id="{{item.uuid}}"
>
<button
type="button"
class="equal-padding reduced-padding"
class="collapse__toggle equal-padding reduced-padding"
data-collapse-id="{{item.uuid}}"
tabindex="0"
aria-label="{{dd-i18n 'dotdungeon.sheet.actor.v2.toggle-item-information' item}}"
>
<div aria-hidden="true" class="icon icon--12">
{{#if (dd-set-has meta.expanded item.uuid)}}
{{{ icons.caret-down }}}
{{else}}
{{{ icons.caret-right }}}
{{/if}}
{{{ icons.caret-right }}}
</div>
</button>
<h3 class="aspect__name">
{{item.name}}
</h3>
</div>
{{#if (dd-set-has meta.expanded item.uuid)}}
<div class="collapse__content">
<hr>
<div class="aspect__content">
<div class="aspect__field editable">
@ -95,5 +94,5 @@
</div>
</button>
</div>
{{/if}}
</div>
</section>

19
templates/actors/char-sheet/v2/partials/inventory/items/untyped.v2.pc.hbs
View file

@ -1,21 +1,20 @@
<section class="untyped">
<section
class="untyped collapse"
{{dd-expanded meta.expanded item.uuid}}
>
<div
class="untyped__header"
class="collapse__header"
data-collapse-id="{{item.uuid}}"
>
<button
type="button"
class="equal-padding reduced-padding"
class="collapse__toggle equal-padding reduced-padding"
data-collapse-id="{{item.uuid}}"
tabindex="0"
aria-label="{{dd-i18n 'dotdungeon.sheet.actor.v2.toggle-item-information' item}}"
>
<div aria-hidden="true" class="icon icon--12">
{{#if (dd-set-has meta.expanded item.uuid)}}
{{{ icons.caret-down }}}
{{else}}
{{{ icons.caret-right }}}
{{/if}}
{{{ icons.caret-right }}}
</div>
</button>
<h3 class="untyped__name">
@ -25,7 +24,7 @@
(x {{item.system.quantity}})
</div>
</div>
{{#if (dd-set-has meta.expanded item.uuid)}}
<div class="collapse__content">
<hr>
<div class="untyped__content">
<div class="untyped__field editable">
@ -98,5 +97,5 @@
</div>
</button>
</div>
{{/if}}
</div>
</section>

19
templates/actors/char-sheet/v2/partials/inventory/items/weapon.v2.pc.hbs
View file

@ -1,21 +1,20 @@
<section class="weapon">
<section
class="weapon collapse"
{{dd-expanded meta.expanded item.uuid}}
>
<div
class="weapon__header"
class="collapse__header"
data-collapse-id="{{item.uuid}}"
>
<button
type="button"
class="equal-padding reduced-padding"
class="collapse__toggle equal-padding reduced-padding"
data-collapse-id="{{item.uuid}}"
tabindex="0"
aria-label="{{dd-i18n 'dotdungeon.sheet.actor.v2.toggle-item-information' item}}"
>
<div aria-hidden="true" class="icon icon--12">
{{#if (dd-set-has meta.expanded item.uuid)}}
{{{ icons.caret-down }}}
{{else}}
{{{ icons.caret-right }}}
{{/if}}
{{{ icons.caret-right }}}
</div>
</button>
<h3 class="weapon__name">
@ -25,7 +24,7 @@
(x {{item.system.quantity}})
</div>
</div>
{{#if (dd-set-has meta.expanded item.uuid)}}
<div class="collapse__content">
<hr>
<div class="weapon__content">
<div class="weapon__field editable">
@ -113,5 +112,5 @@
</div>
</button>
</div>
{{/if}}
</div>
</section>