mirror of
https://github.com/shadoll/sLogos.git
synced 2025-12-20 08:30:59 +00:00
Refactor achievement definitions: Standardize formatting and add new achievements for improved clarity and functionality
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
<script>
|
<script>
|
||||||
import { createEventDispatcher } from 'svelte';
|
import { createEventDispatcher } from "svelte";
|
||||||
import InlineSvg from './InlineSvg.svelte';
|
import InlineSvg from "./InlineSvg.svelte";
|
||||||
|
|
||||||
const dispatch = createEventDispatcher();
|
const dispatch = createEventDispatcher();
|
||||||
|
|
||||||
@@ -15,85 +15,90 @@
|
|||||||
|
|
||||||
// Achievement definitions
|
// Achievement definitions
|
||||||
const achievementDefinitions = {
|
const achievementDefinitions = {
|
||||||
'first_correct': {
|
first_correct: {
|
||||||
name: 'First Victory',
|
name: "First Victory",
|
||||||
description: 'Answer your first question correctly',
|
description: "Answer your first question correctly",
|
||||||
icon: 'smile-squre.svg',
|
icon: "smile-squre.svg",
|
||||||
requirement: () => gameStats.correct >= 1
|
requirement: () => gameStats.correct >= 1,
|
||||||
},
|
},
|
||||||
'perfect_10': {
|
party_time: {
|
||||||
name: 'Perfect Ten',
|
name: "Party Time!",
|
||||||
description: 'Answer 10 questions correctly without any mistakes',
|
description: "Answer 5 questions correctly in a row",
|
||||||
icon: 'medal-star.svg',
|
icon: "confetti-minimalistic.svg",
|
||||||
requirement: () => currentStreak >= 10
|
requirement: () => currentStreak >= 5,
|
||||||
},
|
},
|
||||||
'speedrunner': {
|
dedication: {
|
||||||
name: 'Speed Runner',
|
name: "Dedicated Learner",
|
||||||
description: 'Skip 10 questions in a row',
|
description: "Answer 10 questions in total",
|
||||||
icon: 'running.svg',
|
icon: "check-circle.svg",
|
||||||
requirement: () => achievements.consecutive_skips >= 10
|
requirement: () => gameStats.total >= 10,
|
||||||
},
|
},
|
||||||
'explorer': {
|
perfect_10: {
|
||||||
name: 'World Explorer',
|
name: "Perfect Ten",
|
||||||
description: 'Answer 50 questions correctly',
|
description: "Answer 10 questions correctly without any mistakes",
|
||||||
icon: 'crown-minimalistic.svg',
|
icon: "medal-star.svg",
|
||||||
requirement: () => gameStats.correct >= 50
|
requirement: () => currentStreak >= 10,
|
||||||
},
|
},
|
||||||
'master': {
|
speedrunner: {
|
||||||
name: 'Flag Master',
|
name: "Speed Runner",
|
||||||
description: 'Answer 100 questions correctly',
|
description: "Skip 10 questions in a row",
|
||||||
icon: 'cup-first.svg',
|
icon: "running.svg",
|
||||||
requirement: () => gameStats.correct >= 100
|
requirement: () => achievements.consecutive_skips >= 10,
|
||||||
},
|
},
|
||||||
'persistent': {
|
|
||||||
name: 'Persistent Scholar',
|
persistent: {
|
||||||
description: 'Answer 25 questions (correct or wrong)',
|
name: "Persistent Scholar",
|
||||||
icon: 'medal-ribbons-star.svg',
|
description: "Answer 25 questions (correct or wrong)",
|
||||||
requirement: () => gameStats.total >= 25
|
icon: "medal-ribbons-star.svg",
|
||||||
|
requirement: () => gameStats.total >= 25,
|
||||||
},
|
},
|
||||||
'perfectionist': {
|
|
||||||
name: 'Perfectionist',
|
perfectionist: {
|
||||||
description: 'Achieve 90% accuracy with at least 20 answers',
|
name: "Perfectionist",
|
||||||
icon: 'medal-star-circle.svg',
|
description: "Achieve 90% accuracy with at least 20 answers",
|
||||||
requirement: () => gameStats.total >= 20 && (gameStats.correct / gameStats.total) >= 0.9
|
icon: "medal-star-circle.svg",
|
||||||
|
requirement: () =>
|
||||||
|
gameStats.total >= 20 && gameStats.correct / gameStats.total >= 0.9,
|
||||||
},
|
},
|
||||||
'party_time': {
|
explorer: {
|
||||||
name: 'Party Time!',
|
name: "World Explorer",
|
||||||
description: 'Answer 5 questions correctly in a row',
|
description: "Answer 50 questions correctly",
|
||||||
icon: 'confetti-minimalistic.svg',
|
icon: "crown-minimalistic.svg",
|
||||||
requirement: () => currentStreak >= 5
|
requirement: () => gameStats.correct >= 50,
|
||||||
},
|
},
|
||||||
'dedication': {
|
|
||||||
name: 'Dedicated Learner',
|
master: {
|
||||||
description: 'Answer 10 questions in total',
|
name: "Flag Master",
|
||||||
icon: 'check-circle.svg',
|
description: "Answer 100 questions correctly",
|
||||||
requirement: () => gameStats.total >= 10
|
icon: "cup-first.svg",
|
||||||
|
requirement: () => gameStats.correct >= 100,
|
||||||
|
},
|
||||||
|
|
||||||
|
legend: {
|
||||||
|
name: "Geography Legend",
|
||||||
|
description: "Answer 200 questions correctly",
|
||||||
|
icon: "crown-star.svg",
|
||||||
|
requirement: () => gameStats.correct >= 200,
|
||||||
},
|
},
|
||||||
'legend': {
|
|
||||||
name: 'Geography Legend',
|
|
||||||
description: 'Answer 200 questions correctly',
|
|
||||||
icon: 'crown-star.svg',
|
|
||||||
requirement: () => gameStats.correct >= 200
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// Achievement functions
|
// Achievement functions
|
||||||
export function loadAchievements() {
|
export function loadAchievements() {
|
||||||
try {
|
try {
|
||||||
const saved = localStorage.getItem('flagQuizAchievements');
|
const saved = localStorage.getItem("flagQuizAchievements");
|
||||||
if (saved) {
|
if (saved) {
|
||||||
achievements = JSON.parse(saved);
|
achievements = JSON.parse(saved);
|
||||||
} else {
|
} else {
|
||||||
achievements = { consecutive_skips: 0 };
|
achievements = { consecutive_skips: 0 };
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Error loading achievements:', error);
|
console.error("Error loading achievements:", error);
|
||||||
achievements = { consecutive_skips: 0 };
|
achievements = { consecutive_skips: 0 };
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function saveAchievements() {
|
function saveAchievements() {
|
||||||
localStorage.setItem('flagQuizAchievements', JSON.stringify(achievements));
|
localStorage.setItem("flagQuizAchievements", JSON.stringify(achievements));
|
||||||
}
|
}
|
||||||
|
|
||||||
export function checkAchievements() {
|
export function checkAchievements() {
|
||||||
@@ -103,11 +108,11 @@
|
|||||||
if (!achievements[key] && achievement.requirement()) {
|
if (!achievements[key] && achievement.requirement()) {
|
||||||
achievements[key] = {
|
achievements[key] = {
|
||||||
unlocked: true,
|
unlocked: true,
|
||||||
unlockedAt: Date.now()
|
unlockedAt: Date.now(),
|
||||||
};
|
};
|
||||||
newUnlocked.push({
|
newUnlocked.push({
|
||||||
key,
|
key,
|
||||||
...achievement
|
...achievement,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -116,7 +121,7 @@
|
|||||||
newAchievements = [...newAchievements, ...newUnlocked];
|
newAchievements = [...newAchievements, ...newUnlocked];
|
||||||
saveAchievements();
|
saveAchievements();
|
||||||
showNewAchievements();
|
showNewAchievements();
|
||||||
dispatch('achievementsUnlocked', newUnlocked);
|
dispatch("achievementsUnlocked", newUnlocked);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -133,14 +138,14 @@
|
|||||||
.map(([key, data]) => ({
|
.map(([key, data]) => ({
|
||||||
key,
|
key,
|
||||||
...achievementDefinitions[key],
|
...achievementDefinitions[key],
|
||||||
...data
|
...data,
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
export function getAchievementCount() {
|
export function getAchievementCount() {
|
||||||
return {
|
return {
|
||||||
unlocked: Object.values(achievements).filter(a => a.unlocked).length,
|
unlocked: Object.values(achievements).filter((a) => a.unlocked).length,
|
||||||
total: Object.keys(achievementDefinitions).length
|
total: Object.keys(achievementDefinitions).length,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -160,20 +165,20 @@
|
|||||||
function handleOverlayClick(event) {
|
function handleOverlayClick(event) {
|
||||||
if (event.target === event.currentTarget) {
|
if (event.target === event.currentTarget) {
|
||||||
show = false;
|
show = false;
|
||||||
dispatch('close');
|
dispatch("close");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function handleOverlayKeydown(event) {
|
function handleOverlayKeydown(event) {
|
||||||
if (event.key === 'Escape') {
|
if (event.key === "Escape") {
|
||||||
show = false;
|
show = false;
|
||||||
dispatch('close');
|
dispatch("close");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function closeModal() {
|
function closeModal() {
|
||||||
show = false;
|
show = false;
|
||||||
dispatch('close');
|
dispatch("close");
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -200,7 +205,10 @@
|
|||||||
|
|
||||||
<div class="achievements-content">
|
<div class="achievements-content">
|
||||||
{#each Object.entries(achievementDefinitions) as [key, def]}
|
{#each Object.entries(achievementDefinitions) as [key, def]}
|
||||||
<div class="achievement-item" class:unlocked={achievements[key]?.unlocked}>
|
<div
|
||||||
|
class="achievement-item"
|
||||||
|
class:unlocked={achievements[key]?.unlocked}
|
||||||
|
>
|
||||||
<div class="achievement-icon">
|
<div class="achievement-icon">
|
||||||
<InlineSvg path={`/icons/${def.icon}`} alt={def.name} />
|
<InlineSvg path={`/icons/${def.icon}`} alt={def.name} />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user