Character Printer improvement, Campaign main block overflow

This commit is contained in:
Clément Pons 2025-11-19 17:40:19 +01:00
parent c9f60d92ca
commit 00e7d647d3
3 changed files with 19 additions and 9 deletions

BIN
db.sqlite

Binary file not shown.

View File

@ -30,10 +30,15 @@ class CharacterPrinter
{
this.compiler = new CharacterCompiler(character);
const compiled = this.compiler.compiled;
const armor = this.compiler.armor;
this.container.replaceChildren(div('flex flex-row justify-between items-center', [
span('text-bold text-xl', compiled.name),
div('flex flex-row gap-2 items-baseline', [ span('text-sm font-bold', 'PV'), span('text-lg', `${(compiled.health ?? 0) - (compiled.variables.health ?? 0)}/${compiled.health ?? 0}`) ])
div('flex flex-row gap-2 items-baseline', [ span('text-sm font-bold', 'PV'), span('text-lg', `${(compiled.health ?? 0) - (compiled.variables.health ?? 0)}/${compiled.health ?? 0}`) ]),
]), div('flex flex-row justify-between items-center', [
div('flex flex-col gap-px items-center justify-center', [ span('text-sm font-bold', 'Armure'), span('text-lg', armor === undefined ? `-` : `${armor.current}/${armor.max}`) ]),
div('flex flex-col gap-px items-center justify-center', [ span('text-sm font-bold', 'Mana'), span('text-lg', `${(compiled.mana ?? 0) - (compiled.variables.mana ?? 0)}/${compiled.mana ?? 0}`) ]),
div('flex flex-col gap-px items-center justify-center', [ span('text-sm font-bold', 'Fatigue'), span('text-lg', `${compiled.variables.exhaustion ?? 0}`) ]),
]));
}
else throw new Error();
@ -137,7 +142,7 @@ export class CampaignSheet
}
private logText(log: CampaignLog)
{
return `${log.target === 0 ? 'Le groupe' : this.players.find(e => e.user.id === log.target)?.user.username ?? 'Le groupe'}${logType[log.type]}${log.details}`;
return `${log.target === 0 ? 'Le groupe' : this.players.find(e => e.user.id === log.target)?.user.username ?? 'Un personange'}${logType[log.type]}${log.details}`;
}
private render()
{
@ -163,7 +168,7 @@ export class CampaignSheet
]),
]),
]),
div('flex flex-row gap-4 flex-1', [
div('flex flex-row gap-4 flex-1 h-0', [
div('flex flex-col gap-2', [
div('flex flex-row items-center gap-4 w-[320px]', [ span('font-bold text-lg', 'Etat'), div('border-t border-light-40 dark:border-dark-40 border-dashed flex-1') ]),
...this.characters.map(e => e.container),
@ -172,7 +177,7 @@ export class CampaignSheet
div('flex flex-col', [
tabgroup([
{ id: 'campaign', title: [ text('Campagne') ], content: () => [
markdown(campaign.public_notes, '', { tags: { a: preview } }),
markdown(campaign.public_notes, '', { tags: { a: preview }, class: 'px-2' }),
] },
{ id: 'inventory', title: [ text('Inventaire') ], content: () => [
@ -188,15 +193,15 @@ export class CampaignSheet
div('w-3 h-3 border-2 rounded-full bg-light-40 dark:bg-dark-40 border-light-0 dark:border-dark-0'),
div('flex flex-row gap-2 items-center flex-1', [
div('flex-1 border-t border-light-40 dark:border-dark-40 border-dashed'),
span('text-light-70 dark:text-dark-70 text-sm italic', format(date, 'dd MMMM yyyy')),
span('text-light-70 dark:text-dark-70 text-sm italic tracking-tight', format(date, 'dd MMMM yyyy')),
div('flex-1 border-t border-light-40 dark:border-dark-40 border-dashed'),
])
]))
}
arr.push(div('flex flex-row gap-2 items-center relative -left-2 mx-px', [
arr.push(div('flex flex-row gap-2 items-center relative -left-2 mx-px group', [
div('w-3 h-3 border-2 rounded-full bg-light-40 dark:bg-dark-40 border-light-0 dark:border-dark-0'),
div('flex flex-row items-center', [ svg('svg', { class: 'fill-light-40 dark:fill-dark-40', attributes: { width: "6", height: "9", viewBox: "0 0 6 9" } }, [svg('path', { attributes: { d: "M0 4.5L6 -4.15L6 9L0 4.5Z" } })]), span('px-4 py-2 bg-light-25 dark:bg-dark-25 border border-light-40 dark:border-dark-40', this.logText(e)) ]),
span('italic text-xs tracking-tight text-light-70 dark:text-dark-70', format(new Date(e.timestamp), 'HH:mm:ss')),
div('flex flex-row items-center', [ svg('svg', { class: 'fill-light-40 dark:fill-dark-40', attributes: { width: "8", height: "12", viewBox: "0 0 6 9" } }, [svg('path', { attributes: { d: "M0 4.5L6 0L6 9L0 4.5Z" } })]), span('px-4 py-2 bg-light-25 dark:bg-dark-25 border border-light-40 dark:border-dark-40', this.logText(e)) ]),
span('italic text-xs tracking-tight text-light-70 dark:text-dark-70 font-mono invisible group-hover:visible', format(new Date(e.timestamp), 'HH:mm:ss')),
]));
return arr;
});
@ -213,7 +218,7 @@ export class CampaignSheet
{ id: 'ressources', title: [ text('Ressources') ], content: () => [
] }
], { focused: 'campaign', class: { container: 'max-w-[900px] w-[900px]' } }),
], { focused: 'campaign', class: { container: 'max-w-[900px] w-[900px] h-full', content: 'overflow-auto', tabbar: 'gap-4' } }),
])
]))
}

View File

@ -340,6 +340,11 @@ export class CharacterCompiler
return p;
}, {} as Record<string, number>);
}
get armor()
{
const armors = this._character.variables.items.filter(e => e.equipped && config.items[e.id]?.category === 'armor');
return armors.length > 0 ? armors.map(e => ({ max: (config.items[e.id] as ArmorConfig).health, current: (config.items[e.id] as ArmorConfig).health - e.state.health })).reduce((p, v) => { p.max += v.max; p.current += v.current; return p; }, { max: 0, current: 0 }) : undefined;
}
parse(text: string): string
{