cosmo/daggerheart
1
0
Fork 0
mirror of https://github.com/Foundryborne/daggerheart.git synced 2026-01-14 12:41:07 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add ability to toggle between list and card views

Browse source
This commit is contained in:
IrkTheImp 2025-06-27 18:50:55 -05:00
parent c6cede40b2
commit 798c07dffe
6 changed files with 66 additions and 43 deletions
Download patch file Download diff file Expand all files Collapse all files

9
module/applications/sheets/character.mjs
View file

@ -25,6 +25,7 @@ export default class CharacterSheet extends DaggerheartSheet(ActorSheetV2) {
toggleStress: this.toggleStress, toggleStress: this.toggleStress,
toggleHope: this.toggleHope, toggleHope: this.toggleHope,
toggleGold: this.toggleGold, toggleGold: this.toggleGold,
toggleLoadoutView: this.toggleLoadoutView,
attackRoll: this.attackRoll, attackRoll: this.attackRoll,
useDomainCard: this.useDomainCard, useDomainCard: this.useDomainCard,
removeCard: this.removeDomainCard, removeCard: this.removeDomainCard,
@ -291,7 +292,8 @@ export default class CharacterSheet extends DaggerheartSheet(ActorSheetV2) {
loadout: { loadout: {
top: loadout.slice(0, Math.min(2, nrLoadoutCards)), top: loadout.slice(0, Math.min(2, nrLoadoutCards)),
bottom: nrLoadoutCards > 2 ? loadout.slice(2, Math.min(5, nrLoadoutCards)) : [], bottom: nrLoadoutCards > 2 ? loadout.slice(2, Math.min(5, nrLoadoutCards)) : [],
nrTotal: nrLoadoutCards nrTotal: nrLoadoutCards,
listView: this.document.system.layout.listView
}, },
vault: vault.map(x => ({ vault: vault.map(x => ({
...x, ...x,
@ -447,6 +449,11 @@ export default class CharacterSheet extends DaggerheartSheet(ActorSheetV2) {
await this.document.update({ [update]: newValue }); await this.document.update({ [update]: newValue });
} }
static async toggleLoadoutView(_, button) {
const listView = !(button.dataset.value === 'true');
await this.document.update({ 'system.layout.listView': listView });
}
static async attackRoll(event, button) { static async attackRoll(event, button) {
const weapon = await fromUuid(button.dataset.weapon); const weapon = await fromUuid(button.dataset.weapon);
if (!weapon) return; if (!weapon) return;

3
module/data/actor/character.mjs
View file

@ -90,6 +90,9 @@ export default class DhCharacter extends BaseDataActor {
attack: new fields.NumberField({ integer: true, initial: 0 }), attack: new fields.NumberField({ integer: true, initial: 0 }),
spellcast: new fields.NumberField({ integer: true, initial: 0 }), spellcast: new fields.NumberField({ integer: true, initial: 0 }),
armorScore: new fields.NumberField({ integer: true, initial: 0 }) armorScore: new fields.NumberField({ integer: true, initial: 0 })
}),
layout: new fields.SchemaField({
listView: new fields.BooleanField({ initial: true })
}) })
}; };
} }

12
styles/daggerheart.css
View file

@ -3956,7 +3956,7 @@ div.daggerheart.views.multiclass {
z-index: 1; z-index: 1;
color: light-dark(#18162e50, #efe6d850); color: light-dark(#18162e50, #efe6d850);
} }
.application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toogle-view { .application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toggle-view {
background: light-dark(#18162e10, #18162e); background: light-dark(#18162e10, #18162e);
border: 1px solid light-dark(#18162e, #f3c267); border: 1px solid light-dark(#18162e, #f3c267);
border-radius: 15px; border-radius: 15px;
@ -3964,24 +3964,24 @@ div.daggerheart.views.multiclass {
gap: 0; gap: 0;
width: 62px; width: 62px;
} }
.application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toogle-view span { .application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toggle-view span {
margin: 1px; margin: 1px;
width: 26px; width: 26px;
color: light-dark(#18162e, #f3c267); color: light-dark(#18162e, #f3c267);
} }
.application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toogle-view span.list-icon i { .application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toggle-view span.list-icon i {
margin-left: 3px; margin-left: 3px;
} }
.application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toogle-view span.grid-icon i { .application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toggle-view span.grid-icon i {
margin-right: 3px; margin-right: 3px;
} }
.application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toogle-view span.list-active { .application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toggle-view span.list-active {
border-radius: 32px 3px 3px 32px; border-radius: 32px 3px 3px 32px;
background-color: light-dark(#18162e, #f3c267); background-color: light-dark(#18162e, #f3c267);
color: light-dark(#efe6d8, #18162e); color: light-dark(#efe6d8, #18162e);
padding: 2px; padding: 2px;
} }
.application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toogle-view span.grid-active { .application.sheet.daggerheart.actor.dh-style.character .tab.loadout .search-section .btn-toggle-view span.grid-active {
border-radius: 3px 32px 32px 3px; border-radius: 3px 32px 32px 3px;
background-color: light-dark(#18162e, #f3c267); background-color: light-dark(#18162e, #f3c267);
color: light-dark(#efe6d8, #18162e); color: light-dark(#efe6d8, #18162e);

2
styles/less/actors/character/loadout.less
View file

@ -43,7 +43,7 @@
} }
} }
.btn-toogle-view { .btn-toggle-view {
background: light-dark(@dark-blue-10, @dark-blue); background: light-dark(@dark-blue-10, @dark-blue);
border: 1px solid light-dark(@dark-blue, @golden); border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 15px; border-radius: 15px;

17
templates/sheets/actors/character/loadout.hbs
View file

@ -11,18 +11,29 @@
<input type="text" name="" id="" placeholder="Search..."> <input type="text" name="" id="" placeholder="Search...">
</div> </div>
<a><i class="fa-solid fa-filter"></i></a> <a><i class="fa-solid fa-filter"></i></a>
<button class="btn-toogle-view"> <button class="btn-toggle-view" data-action="toggleLoadoutView" data-value="{{this.abilities.loadout.listView}}">
<span class="{{#if listView}}list-active{{/if}}list-active list-icon"> <span class="{{#if this.abilities.loadout.listView}}list-active{{/if}} list-icon">
<i class="fa-solid fa-bars"></i> <i class="fa-solid fa-bars"></i>
</span> </span>
<span class="{{#if gridView}}grid-active{{/if}} grid-icon"> <span class="{{#unless this.abilities.loadout.listView}}grid-active{{/unless}} grid-icon">
<i class="fa-solid fa-grip"></i> <i class="fa-solid fa-grip"></i>
</span> </span>
</button> </button>
</div> </div>
<div class="items-section"> <div class="items-section">
{{#if this.abilities.loadout.listView}}
{{> 'systems/daggerheart/templates/sheets/global/partials/inventory-fieldset-items.hbs' title=(localize 'DAGGERHEART.Sheets.PC.Tabs.Loadout') type='domainCard' isGlassy=true cardView='list'}} {{> 'systems/daggerheart/templates/sheets/global/partials/inventory-fieldset-items.hbs' title=(localize 'DAGGERHEART.Sheets.PC.Tabs.Loadout') type='domainCard' isGlassy=true cardView='list'}}
{{else}}
{{> 'systems/daggerheart/templates/sheets/global/partials/inventory-fieldset-items.hbs' title=(localize 'DAGGERHEART.Sheets.PC.Tabs.Loadout') type='domainCard' isGlassy=true cardView='card'}}
{{/if}}
{{#if this.abilities.loadout.listView}}
{{> 'systems/daggerheart/templates/sheets/global/partials/inventory-fieldset-items.hbs' title=(localize 'DAGGERHEART.Sheets.PC.Tabs.Vault') type='domainCard' isGlassy=true cardView='list'}} {{> 'systems/daggerheart/templates/sheets/global/partials/inventory-fieldset-items.hbs' title=(localize 'DAGGERHEART.Sheets.PC.Tabs.Vault') type='domainCard' isGlassy=true cardView='list'}}
{{else}}
{{> 'systems/daggerheart/templates/sheets/global/partials/inventory-fieldset-items.hbs' title=(localize 'DAGGERHEART.Sheets.PC.Tabs.Vault') type='domainCard' isGlassy=true cardView='card'}}
{{/if}}
</div> </div>
</section> </section>

66
templates/sheets/global/partials/inventory-fieldset-items.hbs
View file

@ -1,38 +1,40 @@
<fieldset class="{{#if isGlassy}}glassy{{/if}}"> <fieldset class="{{#if isGlassy}}glassy{{/if}}">
<legend>{{title}}</legend> <legend>{{title}}</legend>
<ul class="items-list"> <ul class="items-list">
{{#each document.items as |item|}} {{#unless (eq cardView 'card') }}
{{#if (eq item.type ../type)}} {{#each document.items as |item|}}
{{#unless (or (eq ../type 'ancestry') (eq item.type 'class') (eq item.type 'subclass'))}} {{#if (eq item.type ../type)}}
{{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=item type=../type}} {{#unless (or (eq ../type 'ancestry') (eq item.type 'class') (eq item.type 'subclass'))}}
{{/unless}} {{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=item type=../type}}
{{/if}} {{/unless}}
{{/each}} {{/if}}
{{#each document.system.ancestry.system.actions as |action|}} {{/each}}
{{#if (or (eq ../type 'ancestry'))}} {{#each document.system.ancestry.system.actions as |action|}}
{{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=action type=../type}} {{#if (or (eq ../type 'ancestry'))}}
{{/if}} {{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=action type=../type}}
{{/each}} {{/if}}
{{#each document.system.ancestry.system.actions as |action|}} {{/each}}
{{#if (or (eq ../type 'ancestry'))}} {{#each document.system.ancestry.system.actions as |action|}}
{{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=action type=../type}} {{#if (or (eq ../type 'ancestry'))}}
{{/if}} {{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=action type=../type}}
{{/each}} {{/if}}
{{#each document.system.class.value.system.classFeatures as |classFeature|}} {{/each}}
{{#if (or (eq ../type 'class'))}} {{#each document.system.class.value.system.classFeatures as |classFeature|}}
{{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=classFeature type=../type}} {{#if (or (eq ../type 'class'))}}
{{/if}} {{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=classFeature type=../type}}
{{/each}} {{/if}}
{{#each document.system.class.value.system.classFeatures as |classFeature|}} {{/each}}
{{#if (or (eq ../type 'class'))}} {{#each document.system.class.value.system.classFeatures as |classFeature|}}
{{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=classFeature type=../type}} {{#if (or (eq ../type 'class'))}}
{{/if}} {{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=classFeature type=../type}}
{{/each}} {{/if}}
{{#each document.appliedEffects as |effect|}} {{/each}}
{{#if (or (eq ../type 'effect'))}} {{#each document.appliedEffects as |effect|}}
{{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=effect type=../type}} {{#if (or (eq ../type 'effect'))}}
{{/if}} {{> 'systems/daggerheart/templates/sheets/global/partials/inventory-item.hbs' item=effect type=../type}}
{{/each}} {{/if}}
{{/each}}
{{/unless}}
</ul> </ul>
<ul class="card-list"> <ul class="card-list">