noham/Pocket-Bird
1
0
Fork 0
mirror of https://github.com/NohamR/Pocket-Bird.git synced 2026-05-25 19:59:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add bird unlocking

Browse Source
This commit is contained in:
Idrees Hassan
2024-12-28 16:31:28 -05:00
parent ddbaa4c029
commit 26329d0ffa
1 changed files with 43 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
birb.js
View File

@@ -200,6 +200,11 @@ const styles = `
cursor: pointer; cursor: pointer;
} }
.birb-grid-item-locked {
filter: grayscale(100%);
cursor: auto;
}
.birb-grid-item canvas { .birb-grid-item canvas {
image-rendering: pixelated; image-rendering: pixelated;
transform: scale(2); transform: scale(2);
@@ -220,6 +225,10 @@ const styles = `
font-size: 14px; font-size: 14px;
color: rgb(124, 108, 75); color: rgb(124, 108, 75);
} }
#${FEATHER_ID} {
cursor: pointer;
}
`; `;
class Layer { class Layer {
@@ -620,6 +629,7 @@ Promise.all([loadSpritesheetPixels(SPRITE_SHEET_URI), loadSpritesheetPixels(DECO
let timeOfLastAction = Date.now(); let timeOfLastAction = Date.now();
let petStack = []; let petStack = [];
let currentTheme = "bluebird"; let currentTheme = "bluebird";
let unlockedThemes = ["bluebird"];
function init() { function init() {
if (window !== window.top) { if (window !== window.top) {
@@ -766,12 +776,12 @@ Promise.all([loadSpritesheetPixels(SPRITE_SHEET_URI), loadSpritesheetPixels(DECO
makeDraggable(decorationCanvas, false); makeDraggable(decorationCanvas, false);
} }
insertFeather(); insertFeather("shimaEnaga");
function insertFeather() { function insertFeather(birdType) {
let theme = species[currentTheme]; let theme = species[birdType];
const featherCanvas = document.createElement("canvas"); const featherCanvas = document.createElement("canvas");
featherCanvas.id = "birb-feather"; featherCanvas.id = FEATHER_ID;
featherCanvas.classList.add("birb-decoration"); featherCanvas.classList.add("birb-decoration");
featherCanvas.width = FEATHER_SPRITE_WIDTH * CANVAS_PIXEL_SIZE; featherCanvas.width = FEATHER_SPRITE_WIDTH * CANVAS_PIXEL_SIZE;
featherCanvas.height = FEATHER_SPRITE_WIDTH * CANVAS_PIXEL_SIZE; featherCanvas.height = FEATHER_SPRITE_WIDTH * CANVAS_PIXEL_SIZE;
@@ -783,8 +793,27 @@ Promise.all([loadSpritesheetPixels(SPRITE_SHEET_URI), loadSpritesheetPixels(DECO
} }
FEATHER_ANIMATIONS.feather.draw(featherCtx, Directions.LEFT, Date.now(), theme); FEATHER_ANIMATIONS.feather.draw(featherCtx, Directions.LEFT, Date.now(), theme);
document.body.appendChild(featherCanvas); document.body.appendChild(featherCanvas);
featherCanvas.addEventListener("click", () => {
unlockTheme(birdType);
removeFeather();
});
} }
function removeFeather() {
const feather = document.querySelector("#" + FEATHER_ID);
if (feather) {
feather.remove();
}
}
/**
* @param {string} theme
*/
function unlockTheme(theme) {
if (!unlockedThemes.includes(theme)) {
unlockedThemes.push(theme);
}
}
function updateFeather() { function updateFeather() {
const feather = document.querySelector("#birb-feather"); const feather = document.querySelector("#birb-feather");
@@ -801,7 +830,7 @@ Promise.all([loadSpritesheetPixels(SPRITE_SHEET_URI), loadSpritesheetPixels(DECO
// insertDecoration(); // insertDecoration();
insertFieldGuide(); // insertFieldGuide();
function insertFieldGuide() { function insertFieldGuide() {
if (document.querySelector("#" + FIELD_GUIDE_ID)) { if (document.querySelector("#" + FIELD_GUIDE_ID)) {
@@ -854,6 +883,7 @@ Promise.all([loadSpritesheetPixels(SPRITE_SHEET_URI), loadSpritesheetPixels(DECO
} }
description.innerHTML = generateDescription(species[currentTheme]); description.innerHTML = generateDescription(species[currentTheme]);
for (const [name, theme] of Object.entries(species)) { for (const [name, theme] of Object.entries(species)) {
const unlocked = unlockedThemes.includes(name);
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;
@@ -865,10 +895,14 @@ Promise.all([loadSpritesheetPixels(SPRITE_SHEET_URI), loadSpritesheetPixels(DECO
birbFrames.base.draw(themeCtx, Directions.RIGHT, theme); birbFrames.base.draw(themeCtx, Directions.RIGHT, theme);
themeElement.appendChild(themeCanvas); themeElement.appendChild(themeCanvas);
content.appendChild(themeElement); content.appendChild(themeElement);
themeElement.addEventListener("click", () => { if (unlocked) {
switchTheme(name); themeElement.addEventListener("click", () => {
fieldGuide.remove(); switchTheme(name);
}); fieldGuide.remove();
});
} else {
themeElement.classList.add("birb-grid-item-locked");
}
themeElement.addEventListener("mouseover", () => { themeElement.addEventListener("mouseover", () => {
console.log("mouseover"); console.log("mouseover");
description.innerHTML = generateDescription(theme); description.innerHTML = generateDescription(theme);