pihkaal/pihkaal-me
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(achievements): distinguish regular and secret achievements

Browse Source
This commit is contained in:
Stevan
2026-01-31 01:18:28 +01:00
parent d9c9dba166
commit 9071adff23
4 changed files with 26 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
app/components/Achievements/BottomScreen.vue
View File

@@ -46,7 +46,7 @@ onRender((ctx) => {
i-- i--
) { ) {
const achievement = ACHIEVEMENTS[i]!; const achievement = ACHIEVEMENTS[i]!;
const isUnlocked = achievementsStore.isUnlocked(achievement); const isUnlocked = achievementsStore.isUnlocked(achievement.id);
const offset = store.getItemOffset(i); const offset = store.getItemOffset(i);
if (offset === -ACHIEVEMENTS_LINE_HEIGHT) continue; if (offset === -ACHIEVEMENTS_LINE_HEIGHT) continue;
@@ -60,11 +60,12 @@ onRender((ctx) => {
ctx.fillStyle = "#000000"; ctx.fillStyle = "#000000";
ctx.fillRect(0, y, LOGICAL_WIDTH, ACHIEVEMENTS_LINE_HEIGHT); ctx.fillRect(0, y, LOGICAL_WIDTH, ACHIEVEMENTS_LINE_HEIGHT);
// TODO: draw ??? for secret ones
ctx.fillStyle = isUnlocked ? "#ffffff" : "#666666"; ctx.fillStyle = isUnlocked ? "#ffffff" : "#666666";
drawCheckbox(ctx, ACHIEVEMENTS_X, y, isUnlocked); drawCheckbox(ctx, ACHIEVEMENTS_X, y, isUnlocked);
ctx.fillText( ctx.fillText(
$t(`achievements.${achievement}`).replace("\n", " "), achievement.secret && !isUnlocked
? "???"
: $t(`achievements.${achievement.id}`).replace("\n", " "),
ACHIEVEMENTS_X + CHECKBOX_SIZE + CHECKBOX_TEXT_GAP, ACHIEVEMENTS_X + CHECKBOX_SIZE + CHECKBOX_TEXT_GAP,
y, y,
); );

7
app/components/Achievements/TopScreen.vue
View File

@@ -86,7 +86,7 @@ onRender((ctx) => {
ctx.font = "7px NDS7"; ctx.font = "7px NDS7";
for (let i = ACHIEVEMENTS_TOP_SCREEN_COUNT - 1; i >= 0; i--) { for (let i = ACHIEVEMENTS_TOP_SCREEN_COUNT - 1; i >= 0; i--) {
const achievement = ACHIEVEMENTS[i]!; const achievement = ACHIEVEMENTS[i]!;
const isUnlocked = achievementsStore.isUnlocked(achievement); const isUnlocked = achievementsStore.isUnlocked(achievement.id);
const offset = store.getItemOffset(i); const offset = store.getItemOffset(i);
if (offset === -ACHIEVEMENTS_LINE_HEIGHT) continue; if (offset === -ACHIEVEMENTS_LINE_HEIGHT) continue;
@@ -98,11 +98,12 @@ onRender((ctx) => {
ctx.fillStyle = "#000000"; ctx.fillStyle = "#000000";
ctx.fillRect(0, y, LOGICAL_WIDTH, ACHIEVEMENTS_LINE_HEIGHT); ctx.fillRect(0, y, LOGICAL_WIDTH, ACHIEVEMENTS_LINE_HEIGHT);
// TODO: draw ??? for secret ones
ctx.fillStyle = isUnlocked ? "#ffffff" : "#666666"; ctx.fillStyle = isUnlocked ? "#ffffff" : "#666666";
drawCheckbox(ctx, ACHIEVEMENTS_X, y, isUnlocked); drawCheckbox(ctx, ACHIEVEMENTS_X, y, isUnlocked);
ctx.fillText( ctx.fillText(
$t(`achievements.${achievement}`).replace("\n", " "), achievement.secret && !isUnlocked
? "???"
: $t(`achievements.${achievement.id}`).replace("\n", " "),
ACHIEVEMENTS_X + CHECKBOX_SIZE + CHECKBOX_TEXT_GAP, ACHIEVEMENTS_X + CHECKBOX_SIZE + CHECKBOX_TEXT_GAP,
y, y,
); );

6
app/pages/index.vue
View File

@@ -46,12 +46,12 @@ useKeyDown((key) => {
a.reset(); a.reset();
} else if (key === "o") { } else if (key === "o") {
for (const ach of ACHIEVEMENTS) { for (const ach of ACHIEVEMENTS) {
a.unlock(ach); a.unlock(ach.id);
} }
} else if (key === "p") { } else if (key === "p") {
for (const ach of ACHIEVEMENTS) { for (const ach of ACHIEVEMENTS) {
if (!a.isUnlocked(ach)) { if (!a.isUnlocked(ach.id)) {
a.unlock(ach); a.unlock(ach.id);
break; break;
} }
} }

30
app/stores/achievements.ts
View File

@@ -3,29 +3,29 @@ import { useLocalStorage } from "@vueuse/core";
const STORAGE_ID = "achievements"; const STORAGE_ID = "achievements";
export const ACHIEVEMENTS = [ export const ACHIEVEMENTS = [
"boot", { id: "boot", secret: false },
// projects // projects
"projects_visit", { id: "projects_visit", secret: false },
"projects_view_5", { id: "projects_view_5", secret: false },
"projects_open_link", { id: "projects_open_link", secret: false },
// gallery // gallery
"gallery_visit", { id: "gallery_visit", secret: false },
// contact // contact
"contact_visit", { id: "contact_visit", secret: false },
"contact_git_visit", { id: "contact_git_visit", secret: false },
// settings // settings
"settings_color_change", { id: "settings_color_change", secret: false },
// snake // snake
"snake_play", { id: "snake_play", secret: false },
"snake_score_40", { id: "snake_score_40", secret: false },
// secrets // secrets
"settings_color_try_all", { id: "settings_color_try_all", secret: true },
"settings_language_try_all", { id: "settings_language_try_all", secret: true },
"settings_visit_all", { id: "settings_visit_all", secret: true },
"contact_36_notifications", { id: "contact_36_notifications", secret: true },
] as const; ] as const;
export type Achievement = (typeof ACHIEVEMENTS)[number]; export type Achievement = (typeof ACHIEVEMENTS)[number]["id"];
export const useAchievementsStore = defineStore("achievements", () => { export const useAchievementsStore = defineStore("achievements", () => {
const app = useAppStore(); const app = useAppStore();