Add hat collection message

This commit is contained in:
Idrees Hassan
2026-01-21 22:36:12 -05:00
parent 3b2081943d
commit 130fae6e0c
10 changed files with 144 additions and 36 deletions

BIN
dist/extension.zip vendored

Binary file not shown.

View File

@@ -735,7 +735,7 @@
if (hatId === HAT.NONE) {
return new Layer([], TAG.DEFAULT);
}
const hatIndex = Object.keys(HAT).indexOf(hatId) - 1;
const hatIndex = Object.values(HAT).indexOf(hatId) - 1;
let hatPixels = getLayerPixels(spriteSheet, hatIndex, HAT_WIDTH);
hatPixels = pad(hatPixels, 1, 1, 1, 1);
hatPixels = drawOutline(hatPixels, true);
@@ -1674,10 +1674,16 @@
image-rendering: pixelated;
position: absolute;
bottom: 0;
transform-origin: bottom;
transform: scale(calc(var(--birb-scale) * 1.5)) !important;
transform-origin: bottom;
transition-duration: 0.2s;
z-index: 2147483630 !important;
cursor: pointer;
}
.birb-item:hover {
transform: scale(calc(var(--birb-scale) * 2)) !important;
transition-duration: 0.2s;
}
.birb-window {
@@ -2338,7 +2344,7 @@
focusOnElement(true);
// TODO: This is for testing
generateHat();
insertHat();
}
function update() {
@@ -2522,13 +2528,13 @@
/**
* Insert the hat as an item element in the document if possible
*/
function generateHat() {
function insertHat() {
if (document.querySelector("#" + HAT_ID)) {
return;
}
// Select a random hat
const hatKeys = Object.keys(HAT);
const hatId = hatKeys[Math.floor(Math.random() * (hatKeys.length - 1)) + 1];
const hats = Object.values(HAT);
const hatId = hats[Math.floor(Math.random() * (hats.length - 1)) + 1];
// Find a random valid element to place the hat on
const element = getRandomValidElement();
@@ -2546,6 +2552,17 @@
if (!hatCtx) {
return;
}
onClick(hatCanvas, () => {
switchHat(hatId);
hatCanvas.remove();
const message = makeElement("birb-message-content");
message.appendChild(document.createTextNode("You've unlocked the "));
const bold = document.createElement("b");
bold.textContent = HAT_METADATA[hatId].name;
message.appendChild(bold);
message.appendChild(document.createTextNode("! To see all of your unlocked accessories, click the Wardrobe from the menu."));
insertModal("New Hat Found!", message);
});
// Create hat animation
const hatAnimation = createHatItemAnimation(hatId, HATS_SPRITE_SHEET);
@@ -2826,6 +2843,7 @@
* @param {string} hat
*/
function switchHat(hat) {
log("Switching hat to: " + hat);
currentHat = hat;
save();
}

30
dist/obsidian/main.js vendored
View File

@@ -740,7 +740,7 @@ module.exports = class PocketBird extends Plugin {
if (hatId === HAT.NONE) {
return new Layer([], TAG.DEFAULT);
}
const hatIndex = Object.keys(HAT).indexOf(hatId) - 1;
const hatIndex = Object.values(HAT).indexOf(hatId) - 1;
let hatPixels = getLayerPixels(spriteSheet, hatIndex, HAT_WIDTH);
hatPixels = pad(hatPixels, 1, 1, 1, 1);
hatPixels = drawOutline(hatPixels, true);
@@ -1717,10 +1717,16 @@ module.exports = class PocketBird extends Plugin {
image-rendering: pixelated;
position: absolute;
bottom: 0;
transform-origin: bottom;
transform: scale(calc(var(--birb-scale) * 1.5)) !important;
transform-origin: bottom;
transition-duration: 0.2s;
z-index: 2147483630 !important;
cursor: pointer;
}
.birb-item:hover {
transform: scale(calc(var(--birb-scale) * 2)) !important;
transition-duration: 0.2s;
}
.birb-window {
@@ -2381,7 +2387,7 @@ module.exports = class PocketBird extends Plugin {
focusOnElement(true);
// TODO: This is for testing
generateHat();
insertHat();
}
function update() {
@@ -2565,13 +2571,13 @@ module.exports = class PocketBird extends Plugin {
/**
* Insert the hat as an item element in the document if possible
*/
function generateHat() {
function insertHat() {
if (document.querySelector("#" + HAT_ID)) {
return;
}
// Select a random hat
const hatKeys = Object.keys(HAT);
const hatId = hatKeys[Math.floor(Math.random() * (hatKeys.length - 1)) + 1];
const hats = Object.values(HAT);
const hatId = hats[Math.floor(Math.random() * (hats.length - 1)) + 1];
// Find a random valid element to place the hat on
const element = getRandomValidElement();
@@ -2589,6 +2595,17 @@ module.exports = class PocketBird extends Plugin {
if (!hatCtx) {
return;
}
onClick(hatCanvas, () => {
switchHat(hatId);
hatCanvas.remove();
const message = makeElement("birb-message-content");
message.appendChild(document.createTextNode("You've unlocked the "));
const bold = document.createElement("b");
bold.textContent = HAT_METADATA[hatId].name;
message.appendChild(bold);
message.appendChild(document.createTextNode("! To see all of your unlocked accessories, click the Wardrobe from the menu."));
insertModal("New Hat Found!", message);
});
// Create hat animation
const hatAnimation = createHatItemAnimation(hatId, HATS_SPRITE_SHEET);
@@ -2869,6 +2886,7 @@ module.exports = class PocketBird extends Plugin {
* @param {string} hat
*/
function switchHat(hat) {
log("Switching hat to: " + hat);
currentHat = hat;
save();
}

View File

@@ -749,7 +749,7 @@
if (hatId === HAT.NONE) {
return new Layer([], TAG.DEFAULT);
}
const hatIndex = Object.keys(HAT).indexOf(hatId) - 1;
const hatIndex = Object.values(HAT).indexOf(hatId) - 1;
let hatPixels = getLayerPixels(spriteSheet, hatIndex, HAT_WIDTH);
hatPixels = pad(hatPixels, 1, 1, 1, 1);
hatPixels = drawOutline(hatPixels, true);
@@ -1679,10 +1679,16 @@
image-rendering: pixelated;
position: absolute;
bottom: 0;
transform-origin: bottom;
transform: scale(calc(var(--birb-scale) * 1.5)) !important;
transform-origin: bottom;
transition-duration: 0.2s;
z-index: 2147483630 !important;
cursor: pointer;
}
.birb-item:hover {
transform: scale(calc(var(--birb-scale) * 2)) !important;
transition-duration: 0.2s;
}
.birb-window {
@@ -2343,7 +2349,7 @@
focusOnElement(true);
// TODO: This is for testing
generateHat();
insertHat();
}
function update() {
@@ -2527,13 +2533,13 @@
/**
* Insert the hat as an item element in the document if possible
*/
function generateHat() {
function insertHat() {
if (document.querySelector("#" + HAT_ID)) {
return;
}
// Select a random hat
const hatKeys = Object.keys(HAT);
const hatId = hatKeys[Math.floor(Math.random() * (hatKeys.length - 1)) + 1];
const hats = Object.values(HAT);
const hatId = hats[Math.floor(Math.random() * (hats.length - 1)) + 1];
// Find a random valid element to place the hat on
const element = getRandomValidElement();
@@ -2551,6 +2557,17 @@
if (!hatCtx) {
return;
}
onClick(hatCanvas, () => {
switchHat(hatId);
hatCanvas.remove();
const message = makeElement("birb-message-content");
message.appendChild(document.createTextNode("You've unlocked the "));
const bold = document.createElement("b");
bold.textContent = HAT_METADATA[hatId].name;
message.appendChild(bold);
message.appendChild(document.createTextNode("! To see all of your unlocked accessories, click the Wardrobe from the menu."));
insertModal("New Hat Found!", message);
});
// Create hat animation
const hatAnimation = createHatItemAnimation(hatId, HATS_SPRITE_SHEET);
@@ -2831,6 +2848,7 @@
* @param {string} hat
*/
function switchHat(hat) {
log("Switching hat to: " + hat);
currentHat = hat;
save();
}

View File

@@ -735,7 +735,7 @@
if (hatId === HAT.NONE) {
return new Layer([], TAG.DEFAULT);
}
const hatIndex = Object.keys(HAT).indexOf(hatId) - 1;
const hatIndex = Object.values(HAT).indexOf(hatId) - 1;
let hatPixels = getLayerPixels(spriteSheet, hatIndex, HAT_WIDTH);
hatPixels = pad(hatPixels, 1, 1, 1, 1);
hatPixels = drawOutline(hatPixels, true);
@@ -1659,10 +1659,16 @@
image-rendering: pixelated;
position: absolute;
bottom: 0;
transform-origin: bottom;
transform: scale(calc(var(--birb-scale) * 1.5)) !important;
transform-origin: bottom;
transition-duration: 0.2s;
z-index: 2147483630 !important;
cursor: pointer;
}
.birb-item:hover {
transform: scale(calc(var(--birb-scale) * 2)) !important;
transition-duration: 0.2s;
}
.birb-window {
@@ -2323,7 +2329,7 @@
focusOnElement(true);
// TODO: This is for testing
generateHat();
insertHat();
}
function update() {
@@ -2507,13 +2513,13 @@
/**
* Insert the hat as an item element in the document if possible
*/
function generateHat() {
function insertHat() {
if (document.querySelector("#" + HAT_ID)) {
return;
}
// Select a random hat
const hatKeys = Object.keys(HAT);
const hatId = hatKeys[Math.floor(Math.random() * (hatKeys.length - 1)) + 1];
const hats = Object.values(HAT);
const hatId = hats[Math.floor(Math.random() * (hats.length - 1)) + 1];
// Find a random valid element to place the hat on
const element = getRandomValidElement();
@@ -2531,6 +2537,17 @@
if (!hatCtx) {
return;
}
onClick(hatCanvas, () => {
switchHat(hatId);
hatCanvas.remove();
const message = makeElement("birb-message-content");
message.appendChild(document.createTextNode("You've unlocked the "));
const bold = document.createElement("b");
bold.textContent = HAT_METADATA[hatId].name;
message.appendChild(bold);
message.appendChild(document.createTextNode("! To see all of your unlocked accessories, click the Wardrobe from the menu."));
insertModal("New Hat Found!", message);
});
// Create hat animation
const hatAnimation = createHatItemAnimation(hatId, HATS_SPRITE_SHEET);
@@ -2811,6 +2828,7 @@
* @param {string} hat
*/
function switchHat(hat) {
log("Switching hat to: " + hat);
currentHat = hat;
save();
}

30
dist/web/birb.js vendored
View File

@@ -735,7 +735,7 @@
if (hatId === HAT.NONE) {
return new Layer([], TAG.DEFAULT);
}
const hatIndex = Object.keys(HAT).indexOf(hatId) - 1;
const hatIndex = Object.values(HAT).indexOf(hatId) - 1;
let hatPixels = getLayerPixels(spriteSheet, hatIndex, HAT_WIDTH);
hatPixels = pad(hatPixels, 1, 1, 1, 1);
hatPixels = drawOutline(hatPixels, true);
@@ -1659,10 +1659,16 @@
image-rendering: pixelated;
position: absolute;
bottom: 0;
transform-origin: bottom;
transform: scale(calc(var(--birb-scale) * 1.5)) !important;
transform-origin: bottom;
transition-duration: 0.2s;
z-index: 2147483630 !important;
cursor: pointer;
}
.birb-item:hover {
transform: scale(calc(var(--birb-scale) * 2)) !important;
transition-duration: 0.2s;
}
.birb-window {
@@ -2323,7 +2329,7 @@
focusOnElement(true);
// TODO: This is for testing
generateHat();
insertHat();
}
function update() {
@@ -2507,13 +2513,13 @@
/**
* Insert the hat as an item element in the document if possible
*/
function generateHat() {
function insertHat() {
if (document.querySelector("#" + HAT_ID)) {
return;
}
// Select a random hat
const hatKeys = Object.keys(HAT);
const hatId = hatKeys[Math.floor(Math.random() * (hatKeys.length - 1)) + 1];
const hats = Object.values(HAT);
const hatId = hats[Math.floor(Math.random() * (hats.length - 1)) + 1];
// Find a random valid element to place the hat on
const element = getRandomValidElement();
@@ -2531,6 +2537,17 @@
if (!hatCtx) {
return;
}
onClick(hatCanvas, () => {
switchHat(hatId);
hatCanvas.remove();
const message = makeElement("birb-message-content");
message.appendChild(document.createTextNode("You've unlocked the "));
const bold = document.createElement("b");
bold.textContent = HAT_METADATA[hatId].name;
message.appendChild(bold);
message.appendChild(document.createTextNode("! To see all of your unlocked accessories, click the Wardrobe from the menu."));
insertModal("New Hat Found!", message);
});
// Create hat animation
const hatAnimation = createHatItemAnimation(hatId, HATS_SPRITE_SHEET);
@@ -2811,6 +2828,7 @@
* @param {string} hat
*/
function switchHat(hat) {
log("Switching hat to: " + hat);
currentHat = hat;
save();
}

View File

@@ -396,7 +396,7 @@ function startApplication(birbPixels, featherPixels, hatsPixels) {
focusOnElement(true);
// TODO: This is for testing
generateHat();
insertHat();
}
function update() {
@@ -583,13 +583,13 @@ function startApplication(birbPixels, featherPixels, hatsPixels) {
/**
* Insert the hat as an item element in the document if possible
*/
function generateHat() {
function insertHat() {
if (document.querySelector("#" + HAT_ID)) {
return;
}
// Select a random hat
const hatKeys = Object.keys(HAT);
const hatId = hatKeys[Math.floor(Math.random() * (hatKeys.length - 1)) + 1];
const hats = Object.values(HAT);
const hatId = hats[Math.floor(Math.random() * (hats.length - 1)) + 1];
// Find a random valid element to place the hat on
const element = getRandomValidElement();
@@ -607,6 +607,17 @@ function startApplication(birbPixels, featherPixels, hatsPixels) {
if (!hatCtx) {
return;
}
onClick(hatCanvas, () => {
switchHat(hatId);
hatCanvas.remove();
const message = makeElement("birb-message-content");
message.appendChild(document.createTextNode("You've unlocked the "));
const bold = document.createElement("b");
bold.textContent = HAT_METADATA[hatId].name;
message.appendChild(bold);
message.appendChild(document.createTextNode("! To see all of your unlocked accessories, click the Wardrobe from the menu."));
insertModal("New Hat Found!", message);
});
// Create hat animation
const hatAnimation = createHatItemAnimation(hatId, HATS_SPRITE_SHEET);
@@ -892,6 +903,7 @@ function startApplication(birbPixels, featherPixels, hatsPixels) {
* @param {string} hat
*/
function switchHat(hat) {
log("Switching hat to: " + hat);
currentHat = hat;
save();
}

0
src/fieldGuide.js Normal file
View File

View File

@@ -124,7 +124,7 @@ function buildHatItemLayer(spriteSheet, hatId) {
if (hatId === HAT.NONE) {
return new Layer([], TAG.DEFAULT);
}
const hatIndex = Object.keys(HAT).indexOf(hatId) - 1;
const hatIndex = Object.values(HAT).indexOf(hatId) - 1;
let hatPixels = getLayerPixels(spriteSheet, hatIndex, HAT_WIDTH);
hatPixels = pad(hatPixels, 1, 1, 1, 1);
hatPixels = drawOutline(hatPixels, true);

View File

@@ -45,10 +45,16 @@
image-rendering: pixelated;
position: absolute;
bottom: 0;
transform-origin: bottom;
transform: scale(calc(var(--birb-scale) * 1.5)) !important;
transform-origin: bottom;
transition-duration: 0.2s;
z-index: 2147483630 !important;
cursor: pointer;
}
.birb-item:hover {
transform: scale(calc(var(--birb-scale) * 2)) !important;
transition-duration: 0.2s;
}
.birb-window {