Progressbar Punkte für das Upgrade

This commit is contained in:
cay 2026-03-30 14:50:08 +01:00
parent 7c1e597371
commit 3bb3518a9b
2 changed files with 40 additions and 5 deletions

16
app.js
View File

@ -151,9 +151,10 @@ app.get("/api/building/:id", requireLogin, async (req, res) => {
upgradeCost: nextLevel[0]
? `${nextLevel[0].wood} Holz, ${nextLevel[0].stone} Stein, ${nextLevel[0].gold} Gold`
: "Max Level erreicht",
upgradeWood: nextLevel[0]?.wood ?? null,
upgradeStone: nextLevel[0]?.stone ?? null,
upgradeGold: nextLevel[0]?.gold ?? null,
upgradeWood: nextLevel[0]?.wood ?? null,
upgradeStone: nextLevel[0]?.stone ?? null,
upgradeGold: nextLevel[0]?.gold ?? null,
upgradeRequiredPoints: nextLevel[0]?.required_points ?? null, // NEU
});
} catch (err) {
console.error(err);
@ -172,7 +173,7 @@ app.post("/api/building/:id/upgrade", requireLogin, async (req, res) => {
try {
// Aktuelles Level holen
const [[userBuilding]] = await db.query(
"SELECT id, level FROM user_buildings WHERE user_id = ? AND building_id = ?",
"SELECT id, level, points FROM user_buildings WHERE user_id = ? AND building_id = ?",
[userId, buildingId],
);
@ -192,6 +193,13 @@ app.post("/api/building/:id/upgrade", requireLogin, async (req, res) => {
return res.status(400).json({ error: "Maximales Level bereits erreicht" });
}
// Punkte prüfen
if (userBuilding.points < levelData.required_points) {
return res.status(400).json({
error: `Nicht genügend Punkte. Benötigt: ${levelData.required_points}, Vorhanden: ${userBuilding.points}`,
});
}
// Ressourcen des Spielers prüfen
const [[currency]] = await db.query(
"SELECT wood, stone, gold FROM account_currency WHERE account_id = ?",

View File

@ -85,15 +85,42 @@ async function openBuildingPopup(url) {
buildingModules[buildingType](buildingType);
}
// Punkte-Check: Upgrade nur möglich wenn genug Punkte vorhanden
const hasEnoughPoints =
data.upgradeRequiredPoints === null ||
data.points >= data.upgradeRequiredPoints;
const canUpgrade = data.upgradeWood !== null && hasEnoughPoints;
const pointsPct = data.upgradeRequiredPoints
? Math.min((data.points / data.upgradeRequiredPoints) * 100, 100)
: 100;
const barColor = hasEnoughPoints ? "#88ff88" : "#e8a020";
document.getElementById("tab-upgrade").innerHTML = `
<div class="popup-info-title">Upgrade</div>
<div class="popup-stat-row"><span class="popup-stat-key">Holz</span><span class="popup-stat-val">${data.upgradeWood ?? ""}</span></div>
<div class="popup-stat-row"><span class="popup-stat-key">Stein</span><span class="popup-stat-val">${data.upgradeStone ?? ""}</span></div>
<div class="popup-stat-row"><span class="popup-stat-key">Gold</span><span class="popup-stat-val">${data.upgradeGold ?? ""}</span></div>
<div class="popup-xp-wrap" style="margin-top:14px;">
<div class="popup-xp-label" style="display:flex;justify-content:space-between;">
<span>Punkte für Upgrade</span>
<span style="color:${barColor}">${data.points} / ${data.upgradeRequiredPoints ?? ""}</span>
</div>
<div class="popup-xp-track">
<div class="popup-xp-fill" style="width:${pointsPct}%;background:${barColor};">
<div class="popup-xp-shimmer"></div>
</div>
</div>
</div>
<button class="popup-upgrade-btn" id="upgrade-btn" data-building="${url.split('/').pop()}"
${data.upgradeWood === null ? 'disabled style="opacity:0.4;cursor:not-allowed;"' : ''}>
${!canUpgrade ? 'disabled style="opacity:0.4;cursor:not-allowed;"' : ''}>
UPGRADE STARTEN
</button>
${!hasEnoughPoints ? `<p style="color:#ff6666;font-size:12px;margin-top:8px;text-align:center;">Noch ${data.upgradeRequiredPoints - data.points} Punkte bis zum Upgrade.</p>` : ""}
`;
} catch (error) {
console.error("Gebäude konnte nicht geladen werden:", error);