121 lines
2.3 KiB
JavaScript
121 lines
2.3 KiB
JavaScript
export async function loadSchwarzmarkt() {
|
|
const ui = document.querySelector(".building-ui");
|
|
|
|
ui.innerHTML = `
|
|
|
|
<div class="market-tabs">
|
|
|
|
<button class="market-tab active" data-tab="inventory">
|
|
Inventar
|
|
</button>
|
|
|
|
<button class="market-tab" data-tab="artifacts">
|
|
Artefakte
|
|
</button>
|
|
|
|
<button class="market-tab" data-tab="special">
|
|
Geheimhandel
|
|
</button>
|
|
|
|
</div>
|
|
|
|
|
|
<div class="market-content">
|
|
|
|
<div class="market-tab-content active" id="market-inventory">
|
|
<div id="market-pages"></div>
|
|
</div>
|
|
|
|
<div class="market-tab-content" id="market-artifacts">
|
|
<p>Noch keine Artefakte verfügbar</p>
|
|
</div>
|
|
|
|
<div class="market-tab-content" id="market-special">
|
|
<p>Schwarzmarkt Angebote folgen bald</p>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
`;
|
|
|
|
loadPages();
|
|
|
|
initMarketTabs();
|
|
}
|
|
|
|
async function loadPages() {
|
|
const res = await fetch("/api/blackmarket/pages");
|
|
const data = await res.json();
|
|
|
|
const container = document.getElementById("market-pages");
|
|
|
|
let html = "";
|
|
|
|
for (let i = 1; i <= 8; i++) {
|
|
if (data.ownedPages.includes(i)) {
|
|
html += `
|
|
<div class="market-page owned">
|
|
Seite ${i} ✔
|
|
</div>
|
|
`;
|
|
} else {
|
|
const price = data.prices.find((p) => p.page === i);
|
|
|
|
if (price) {
|
|
html += `
|
|
<div class="market-page buy" data-page="${i}">
|
|
Seite ${i} Kaufen (${price.price} Gold)
|
|
</div>
|
|
`;
|
|
} else {
|
|
html += `
|
|
<div class="market-page locked">
|
|
Seite ${i} 🔒
|
|
</div>
|
|
`;
|
|
}
|
|
}
|
|
}
|
|
|
|
container.innerHTML = html;
|
|
}
|
|
|
|
document.addEventListener("click", async (e) => {
|
|
if (!e.target.classList.contains("buy")) return;
|
|
|
|
const res = await fetch("/api/blackmarket/buy-page", {
|
|
method: "POST",
|
|
});
|
|
|
|
const data = await res.json();
|
|
|
|
if (data.error) {
|
|
alert(data.error);
|
|
return;
|
|
}
|
|
|
|
alert("Seite " + data.page + " freigeschaltet!");
|
|
|
|
loadPages();
|
|
});
|
|
|
|
function initMarketTabs() {
|
|
document.querySelectorAll(".market-tab").forEach((tab) => {
|
|
tab.addEventListener("click", () => {
|
|
document
|
|
.querySelectorAll(".market-tab")
|
|
.forEach((t) => t.classList.remove("active"));
|
|
|
|
tab.classList.add("active");
|
|
|
|
document
|
|
.querySelectorAll(".market-tab-content")
|
|
.forEach((c) => c.classList.remove("active"));
|
|
|
|
document
|
|
.getElementById("market-" + tab.dataset.tab)
|
|
.classList.add("active");
|
|
});
|
|
});
|
|
}
|