Don't show description for locked birds

This commit is contained in:
Idrees Hassan
2024-12-28 17:11:13 -05:00
parent 5e225aa84b
commit 1c8235c575

20
birb.js
View File

@@ -221,6 +221,8 @@ const styles = `
} }
.birb-field-guide-description { .birb-field-guide-description {
box-sizing: border-box;
width: 100%;
margin-top: 10px; margin-top: 10px;
padding: 8px; padding: 8px;
padding-top: 4px; padding-top: 4px;
@@ -919,17 +921,19 @@ Promise.all([loadSpritesheetPixels(SPRITE_SHEET_URI), loadSpritesheetPixels(DECO
} }
content.innerHTML = ""; content.innerHTML = "";
const generateDescription = (theme) => { const generateDescription = (/** @type {string} */ themeId) => {
return "<b>" + theme.name + "</b><div style='height: 0.3em'></div>" + theme.description; const theme = species[themeId];
const unlocked = unlockedThemes.includes(themeId);
return "<b>" + theme.name + "</b><div style='height: 0.3em'></div>" + (!unlocked ? "Not yet unlocked" : theme.description);
}; };
const description = fieldGuide.querySelector(".birb-field-guide-description"); const description = fieldGuide.querySelector(".birb-field-guide-description");
if (!description) { if (!description) {
return; return;
} }
description.innerHTML = generateDescription(species[currentTheme]); description.innerHTML = generateDescription(currentTheme);
for (const [name, theme] of Object.entries(species)) { for (const [id, theme] of Object.entries(species)) {
const unlocked = unlockedThemes.includes(name); const unlocked = unlockedThemes.includes(id);
const themeElement = makeElement("birb-grid-item"); const themeElement = makeElement("birb-grid-item");
const themeCanvas = document.createElement("canvas"); const themeCanvas = document.createElement("canvas");
themeCanvas.width = SPRITE_WIDTH * CANVAS_PIXEL_SIZE; themeCanvas.width = SPRITE_WIDTH * CANVAS_PIXEL_SIZE;
@@ -943,7 +947,7 @@ Promise.all([loadSpritesheetPixels(SPRITE_SHEET_URI), loadSpritesheetPixels(DECO
content.appendChild(themeElement); content.appendChild(themeElement);
if (unlocked) { if (unlocked) {
themeElement.addEventListener("click", () => { themeElement.addEventListener("click", () => {
switchTheme(name); switchTheme(id);
fieldGuide.remove(); fieldGuide.remove();
}); });
} else { } else {
@@ -951,10 +955,10 @@ Promise.all([loadSpritesheetPixels(SPRITE_SHEET_URI), loadSpritesheetPixels(DECO
} }
themeElement.addEventListener("mouseover", () => { themeElement.addEventListener("mouseover", () => {
console.log("mouseover"); console.log("mouseover");
description.innerHTML = generateDescription(theme); description.innerHTML = generateDescription(id);
}); });
themeElement.addEventListener("mouseout", () => { themeElement.addEventListener("mouseout", () => {
description.innerHTML = generateDescription(species[currentTheme]); description.innerHTML = generateDescription(currentTheme);
}); });
} }
} }