Show what food heals and what gear does on recipe cards

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
rope 2026-10-18 22:36:00 +01:00
parent 81963d68ea
commit e3a5f519fc
2 changed files with 17 additions and 1 deletions

View file

@ -287,7 +287,7 @@ function pageHtml() {
function itemChip(id, qty, have) { function itemChip(id, qty, have) {
const short = have !== undefined && have < qty; const short = have !== undefined && have < qty;
return `<span class="item-chip ${short ? "short" : ""}" title="${esc(item(id).name)}">${item(id).icon} ${fmt(qty)}${have !== undefined ? ` <span class="have">/ ${fmt(have)}</span>` : ""}</span>`; return `<span class="item-chip ${short ? "short" : ""}" title="${esc([item(id).name, itemStats(id)].filter(Boolean).join(": "))}">${item(id).icon} ${fmt(qty)}${have !== undefined ? ` <span class="have">/ ${fmt(have)}</span>` : ""}</span>`;
} }
// Progress towards a building cost: "have / need". // Progress towards a building cost: "have / need".
@ -378,6 +378,19 @@ function combatPanel() {
</div></div>`; </div></div>`;
} }
// What an item does once made: healing, defence, tool speed, and who can use it.
function itemStats(id) {
const it = item(id);
const parts = [];
if (it.heal) parts.push(`❤️ Heals ${it.heal}`);
if (it.food) parts.push(`feeds ${it.food} ${it.food === 1 ? "person" : "people"} for two days`);
if (it.power) parts.push(`+${it.power} power`);
if (it.armour) parts.push(`+${it.armour} armour`);
if (it.tool) parts.push(`${Math.round(it.speed * 100)}% faster ${skillOf(it.tool).name.toLowerCase()}`);
if (it.req && it.req[1] > 1) parts.push(`needs ${skillOf(it.req[0]).name.toLowerCase()} ${it.req[1]}`);
return parts.join(", ");
}
function actionCard(a) { function actionCard(a) {
const me = S.me; const me = S.me;
const active = me.action?.id === a.id; const active = me.action?.id === a.id;
@ -399,6 +412,8 @@ function actionCard(a) {
if (a.special === "sabotage") extra += `<div class="small muted">Each win weakens the coming raid by 3%, up to 30%.</div>`; if (a.special === "sabotage") extra += `<div class="small muted">Each win weakens the coming raid by 3%, up to 30%.</div>`;
} }
if (a.special === "recon") extra = `<div class="small muted">+${a.recon} recon on the next event</div>`; if (a.special === "recon") extra = `<div class="small muted">+${a.recon} recon on the next event</div>`;
const made = Object.keys(a.outputs).map(itemStats).filter(Boolean);
if (made.length) extra += `<div class="small makes">${made.join(" · ")}</div>`;
return ` return `
<div class="action ${active ? "active" : ""} ${locked ? "locked" : ""}"> <div class="action ${active ? "active" : ""} ${locked ? "locked" : ""}">
<div class="top"><div class="ico">${icon}</div><div> <div class="top"><div class="ico">${icon}</div><div>

View file

@ -378,3 +378,4 @@ button.sheet-skill:hover { background: var(--panel-2); }
.tab { border: 1px solid var(--line); background: var(--panel); border-radius: 999px; padding: 5px 14px; font-weight: 600; font-size: 14px; } .tab { border: 1px solid var(--line); background: var(--panel); border-radius: 999px; padding: 5px 14px; font-weight: 600; font-size: 14px; }
.tab.on { background: var(--gold); border-color: var(--gold); color: var(--bg); } .tab.on { background: var(--gold); border-color: var(--gold); color: var(--bg); }
.tab.dim:not(.on) { opacity: .5; } .tab.dim:not(.on) { opacity: .5; }
.makes { color: var(--muted); }