feat: show boosted rates in building UI and click power on WRITE CODE button
Some checks failed
Accessibility Checks / a11y-audit (pull_request) Failing after 2s
Smoke Test / smoke (pull_request) Failing after 3s

- Building rate display now shows actual boosted rates (after multipliers)
  instead of raw base rates, so players see their real production
- WRITE CODE button area now displays current click power dynamically
  (updates each render tick as boosts change)
- Click power also reflected in button aria-label for accessibility

Closes #61
This commit is contained in:
Alexander Whitestone
2026-04-10 22:17:26 -04:00
parent 1cb556aa3d
commit 25a2050ef1
3 changed files with 19 additions and 1 deletions

View File

@@ -130,6 +130,7 @@ body{background:var(--bg);color:var(--text);font-family:'SF Mono','Cascadia Code
<div class="panel" id="action-panel" role="region" aria-label="Actions">
<h2>ACTIONS</h2>
<div class="action-btn-group"><button class="main-btn" onclick="writeCode()" aria-label="Write code, generates code resource">WRITE CODE</button></div>
<div id="click-power-display" role="status" style="text-align:center;font-size:10px;color:#4a9eff;margin-top:4px"></div>
<div id="combo-display" role="status" aria-live="polite" style="text-align:center;font-size:10px;color:var(--dim);height:14px;margin-bottom:4px;transition:all 0.2s"></div>
<div id="debuffs" style="display:none;margin-top:8px"></div>
<div class="action-btn-group">

View File

@@ -918,7 +918,13 @@ function renderBuildings() {
if (qty > 1) costStr = `x${qty}: ${costStr}`;
}
const rateStr = def.rates ? Object.entries(def.rates).map(([r, v]) => `+${v}/${r}/s`).join(', ') : '';
// Show boosted rates instead of raw base rates
const boostMap = { code: G.codeBoost, compute: G.computeBoost, knowledge: G.knowledgeBoost, user: G.userBoost, impact: G.impactBoost, rescues: G.impactBoost };
const rateStr = def.rates ? Object.entries(def.rates).map(([r, v]) => {
const boost = boostMap[r] || 1;
const boosted = v * boost;
return boost !== 1 ? `+${fmt(boosted)}/${r}/s` : `+${v}/${r}/s`;
}).join(', ') : '';
html += `<button class="build-btn ${afford ? 'can-buy' : ''}" onclick="buyBuilding('${def.id}')" title="${def.edu}" aria-label="Buy ${def.name}, cost ${costStr}">`;
html += `<span class="b-name">${def.name}</span>`;

View File

@@ -12,6 +12,17 @@ function render() {
renderSprint();
renderPulse();
renderStrategy();
renderClickPower();
}
function renderClickPower() {
const el = document.getElementById('click-power-display');
if (!el) return;
const power = getClickPower();
el.textContent = `Click power: ${fmt(power)} code`;
// Also update the button's aria-label for accessibility
const btn = document.querySelector('.main-btn');
if (btn) btn.setAttribute('aria-label', `Write code, generates ${fmt(power)} code per click`);
}
function renderStrategy() {