This commit is contained in:
cay 2026-03-29 14:15:48 +01:00
parent ef9f01ddd8
commit 880ab267f9

View File

@ -36,37 +36,27 @@ function resetTabs() {
} }
/* ================================ /* ================================
Gebäude Popup öffnen Gebäude Popup öffnen (Funktion)
================================ */ ================================ */
document.querySelectorAll(".building").forEach((building) => { async function openBuildingPopup(url) {
building.addEventListener("click", async (e) => { title.innerText = "Lädt...";
e.preventDefault(); popup.style.left = "50%";
popup.style.top = "50%";
popup.classList.add("active");
resetTabs();
try { try {
const url = building.getAttribute("href"); const res = await fetch("/api" + url);
if (!res.ok) throw new Error("API Fehler");
const data = await res.json();
title.innerText = "Lädt..."; title.innerText = data.name;
popup.style.left = "50%"; const infoTab = document.getElementById("tab-info");
popup.style.top = "50%"; const tabs = document.querySelector(".popup-tabs");
popup.classList.add("active");
resetTabs(); infoTab.innerHTML = `
const res = await fetch("/api" + url);
if (!res.ok) throw new Error("API Fehler");
const data = await res.json();
title.innerText = data.name;
const infoTab = document.getElementById("tab-info");
const tabs = document.querySelector(".popup-tabs");
// Standard: Info anzeigen
infoTab.innerHTML = `
<div class="popup-info-title">${data.name}</div> <div class="popup-info-title">${data.name}</div>
<div class="popup-stat-row"><span class="popup-stat-key">Level</span><span class="popup-stat-val">${data.level}</span></div> <div class="popup-stat-row"><span class="popup-stat-key">Level</span><span class="popup-stat-val">${data.level}</span></div>
<div class="popup-stat-row"><span class="popup-stat-key">Punkte</span><span class="popup-stat-val">${data.points} / ${data.nextLevelPoints}</span></div> <div class="popup-stat-row"><span class="popup-stat-key">Punkte</span><span class="popup-stat-val">${data.points} / ${data.nextLevelPoints}</span></div>
@ -82,52 +72,91 @@ document.querySelectorAll(".building").forEach((building) => {
<div class="popup-divider"> · · </div> <div class="popup-divider"> · · </div>
`; `;
// Standard Tabs anzeigen tabs.style.display = "flex";
tabs.style.display = "flex";
// Prüfen ob Gebäude eigenes UI hat const buildingType = Number(data.type);
const buildingType = Number(data.type); if (buildingModules[buildingType]) {
if (buildingModules[buildingType]) { if (keepTabsVisible.has(buildingType)) {
if (keepTabsVisible.has(buildingType)) { tabs.style.display = "flex";
// Tabs sichtbar lassen (z.B. Mine) } else {
tabs.style.display = "flex"; tabs.style.display = "none";
// Aktionen-Tab aktivieren infoTab.innerHTML = `<div class="building-ui"></div>`;
document
.querySelectorAll(".tab")
.forEach((t) => t.classList.remove("active"));
document
.querySelectorAll(".tab-content")
.forEach((c) => c.classList.remove("active"));
document
.querySelector(".tab[data-tab='actions']")
.classList.add("active");
document.getElementById("tab-actions").classList.add("active");
} else {
// Tabs ausblenden, eigenes Voll-UI (Wohnhaus, Schwarzmarkt)
tabs.style.display = "none";
infoTab.innerHTML = `<div class="building-ui"></div>`;
}
buildingModules[buildingType](buildingType);
} }
buildingModules[buildingType](buildingType);
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>
<button class="popup-upgrade-btn" id="upgrade-btn" data-building="${url.split('/').pop()}"
${data.upgradeWood === null ? 'disabled style="opacity:0.4;cursor:not-allowed;"' : ''}>
UPGRADE STARTEN
</button>
`;
} catch (error) {
console.error("Gebäude konnte nicht geladen werden:", error);
} }
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>
<button class="popup-upgrade-btn" id="upgrade-btn" data-building="${url.split('/').pop()}"
${data.upgradeWood === null ? 'disabled style="opacity:0.4;cursor:not-allowed;"' : ''}>
UPGRADE STARTEN
</button>
`;
} catch (error) {
console.error("Gebäude konnte nicht geladen werden:", error);
}
}
/* ================================
Gebäude Popup per Klick öffnen
================================ */
document.querySelectorAll(".building").forEach((building) => {
building.addEventListener("click", async (e) => {
e.preventDefault();
const url = building.getAttribute("href");
await openBuildingPopup(url);
}); });
}); });
/* ================================
Upgrade Button
================================ */
document.addEventListener("click", async (e) => {
const btn = e.target.closest("#upgrade-btn");
if (!btn || btn.disabled) return;
const buildingId = btn.dataset.building;
btn.disabled = true;
btn.textContent = "Wird durchgeführt...";
try {
const res = await fetch("/api/building/" + buildingId + "/upgrade", {
method: "POST",
});
const data = await res.json();
if (!res.ok || data.error) {
window.showNotification(data.error || "Upgrade fehlgeschlagen.", "Upgrade", "⚒️");
btn.disabled = false;
btn.textContent = "⚒ UPGRADE STARTEN ⚒";
return;
}
window.showNotification(
`Upgrade erfolgreich!\nNeues Level: ${data.newLevel}\n\nKosten: ${data.cost.wood} Holz, ${data.cost.stone} Stein, ${data.cost.gold} Gold`,
"Upgrade",
"⚒️"
);
// Popup mit frischen Daten neu laden
await openBuildingPopup("/building/" + buildingId);
// HUD aktualisieren
import("/js/hud.js").then(({ loadHud }) => loadHud());
} catch (err) {
console.error("Upgrade Fehler:", err);
window.showNotification("Fehler beim Upgrade. Bitte erneut versuchen.", "Fehler", "⚠️");
btn.disabled = false;
btn.textContent = "⚒ UPGRADE STARTEN ⚒";
}
});
/* ================================ /* ================================
Tabs wechseln Tabs wechseln
================================ */ ================================ */
@ -155,54 +184,6 @@ document.querySelector(".popup-close").onclick = () => {
popup.classList.remove("active"); popup.classList.remove("active");
}; };
/* ================================
Upgrade Button
================================ */
document.addEventListener("click", async (e) => {
const btn = e.target.closest("#upgrade-btn");
if (!btn || btn.disabled) return;
const buildingId = btn.dataset.building;
btn.disabled = true;
btn.textContent = "Wird durchgeführt...";
try {
const res = await fetch("/api/building/" + buildingId + "/upgrade", {
method: "POST",
});
const data = await res.json();
if (!res.ok || data.error) {
window.showNotification(data.error || "Upgrade fehlgeschlagen.", "Upgrade", "⚒️");
btn.disabled = false;
btn.textContent = "⚒ UPGRADE STARTEN ⚒";
return;
}
window.showNotification(
`Upgrade erfolgreich!\nNeues Level: ${data.newLevel}\n\nKosten: ${data.cost.wood} Holz, ${data.cost.stone} Stein, ${data.cost.gold} Gold`,
"Upgrade",
"⚒️"
);
// Popup neu laden mit aktualisierten Daten
const building = document.querySelector(`.building[href="/building/${buildingId}"]`);
if (building) building.dispatchEvent(new MouseEvent("click", { bubbles: true }));
// HUD aktualisieren
import("/js/hud.js").then(({ loadHud }) => loadHud());
} catch (err) {
console.error("Upgrade Fehler:", err);
window.showNotification("Fehler beim Upgrade. Bitte erneut versuchen.", "Fehler", "⚠️");
btn.disabled = false;
btn.textContent = "⚒ UPGRADE STARTEN ⚒";
}
});
/* ================================ /* ================================
Tooltip Tooltip
================================ */ ================================ */