Skip to content

Commit 4a5829d

Browse files
Copilotjbampton
andauthored
feat: Phaser.js game framework expansion — arcade games, lazy loading, GameManager (#400)
* feat: implement full Phaser.js expansion (all 6 phases) Agent-Logs-Url: https://github.com/NextCommunity/NextCommunity.github.io/sessions/e7dc0226-fa25-488a-a713-47a2399e85cd Co-authored-by: jbampton <418747+jbampton@users.noreply.github.com> * fix: address code review issues (arguments.callee, xpEarned, skills split) Agent-Logs-Url: https://github.com/NextCommunity/NextCommunity.github.io/sessions/e7dc0226-fa25-488a-a713-47a2399e85cd Co-authored-by: jbampton <418747+jbampton@users.noreply.github.com> * fix(code-breaker, dev-duel): fix canvas visibility, texture collision, and safe tile iteration Agent-Logs-Url: https://github.com/NextCommunity/NextCommunity.github.io/sessions/ad42dcb0-9f21-4451-bc76-4eae16616da5 Co-authored-by: jbampton <418747+jbampton@users.noreply.github.com> * fix(code-breaker): draw pill at (0,0) so texture captures the full shape Agent-Logs-Url: https://github.com/NextCommunity/NextCommunity.github.io/sessions/bb692ff9-eb4b-4e04-9a86-1f0552306666 Co-authored-by: jbampton <418747+jbampton@users.noreply.github.com> * chore: plan d-key toggle fix Agent-Logs-Url: https://github.com/NextCommunity/NextCommunity.github.io/sessions/bc6011cc-b6dd-4d83-8400-f901f06940fd Co-authored-by: jbampton <418747+jbampton@users.noreply.github.com> * fix: correct inverted localStorage value and add null-guard in d-key toggle Agent-Logs-Url: https://github.com/NextCommunity/NextCommunity.github.io/sessions/bc6011cc-b6dd-4d83-8400-f901f06940fd Co-authored-by: jbampton <418747+jbampton@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: jbampton <418747+jbampton@users.noreply.github.com> Co-authored-by: John Bampton <jbampton@users.noreply.github.com>
1 parent ed49be7 commit 4a5829d

File tree

16 files changed

+1840
-283
lines changed

16 files changed

+1840
-283
lines changed

biome.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"$schema": "https://biomejs.dev/schemas/2.3.14/schema.json",
33
"files": {
4-
"includes": ["**/*.json", "**/*.njk", "**/*.yaml", "**/*.yml"]
4+
"includes": ["**/*.json", "**/*.njk", "**/*.yaml", "**/*.yml", "src/assets/js/**/*.js"]
55
},
66
"linter": {
77
"enabled": true,

src/_includes/bio.njk

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
66
<title>{{ name }} | {{ role }}</title>
77
<script src="https://cdn.tailwindcss.com"></script>
8-
<script src="https://cdnjs.cloudflare.com/ajax/libs/phaser/3.90.0/phaser.min.js"></script>
98
<link rel="stylesheet" href="/assets/css/style.css">
109
</head>
1110
<body class="min-h-screen scroll-smooth bg-[var(--bg-page)] text-[var(--text-main)] transition-colors duration-300">
@@ -91,6 +90,18 @@
9190
</div>
9291
</div>
9392
{% endif %}
93+
94+
<div class="user-card p-8 rounded-3xl">
95+
<h2 class="text-xs font-black uppercase tracking-[0.3em] text-[var(--text-muted)] mb-4 flex items-center gap-2">
96+
<span class="w-8 h-[2px] bg-accent"></span> Mini-Game
97+
</h2>
98+
<p class="text-sm text-[var(--text-muted)] mb-4">Catch the skill tiles before they fall! Collect enough to win XP.</p>
99+
<button
100+
onclick="CodeBreaker.launch(window.PROFILE_SKILLS, window.PROFILE_NAME)"
101+
class="inline-flex items-center gap-2 px-6 py-3 rounded-xl bg-accent text-white font-black uppercase tracking-wider text-sm hover:opacity-90 active:scale-95 transition-all shadow-lg shadow-accent/30">
102+
⌨️ Play Code Breaker
103+
</button>
104+
</div>
94105
</div>
95106
</div>
96107
</main>
@@ -105,6 +116,10 @@
105116
span.innerText = 'Copied!';
106117
setTimeout(() => span.innerText = 'Copy', 2000);
107118
}
119+
120+
// Pass profile data to game modules
121+
window.PROFILE_NAME = "{{ name }}";
122+
window.PROFILE_SKILLS = "{{ languages | default('') }}".trim().split(/\s+/).filter(Boolean);
108123
</script>
109124
</body>
110125
</html>

src/_includes/game-modal.njk

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{#
2+
game-modal.njk — Reusable game overlay anchor element.
3+
4+
GameManager.createOverlay(id) builds the actual overlay dynamically in JS,
5+
but this element provides a static placeholder that is always present in the
6+
DOM so games have a guaranteed mount target if needed.
7+
8+
Usage: {% include "game-modal.njk" %}
9+
#}
10+
11+
<div id="game-modal-root" aria-live="polite" aria-atomic="true"></div>

src/_includes/game-stats.njk

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -80,12 +80,56 @@
8080
<div class="w-full h-1 md:h-1.5 bg-black/10 dark:bg-white/10 rounded-full mt-1.5 md:mt-2 overflow-hidden">
8181
<div id="level-progress" class="h-full bg-accent transition-all duration-1000" style="width: 0%"></div>
8282
</div>
83+
84+
{# Per-game high score mini-strip (hidden on xs) #}
85+
<div class="hidden md:flex items-center gap-3 mt-1.5">
86+
<span class="text-[7px] font-mono text-[var(--text-muted)] uppercase tracking-widest opacity-60">HS:</span>
87+
<span class="text-[7px] font-mono font-bold text-[var(--text-muted)]">👾 <span id="hs-si" class="text-accent">—</span></span>
88+
<span class="text-[7px] font-mono font-bold text-[var(--text-muted)]">⌨️ <span id="hs-cb" class="text-accent">—</span></span>
89+
<span class="text-[7px] font-mono font-bold text-[var(--text-muted)]">⚔️ <span id="hs-dd" class="text-accent">—</span></span>
90+
</div>
8391
</div>
8492

8593
<div class="w-px h-6 md:h-8 bg-[var(--border-color)] ml-1"></div>
8694

8795
<button onclick="toggleTheme()" class="text-base md:text-lg p-1 md:p-2 hover:bg-black/5 dark:hover:bg-white/5 rounded-full transition-all" id="theme-icon">
8896
🌙
8997
</button>
98+
99+
{# Achievement badges — shown when earned, read from localStorage #}
100+
<div id="achievement-badges" class="hidden sm:flex items-center gap-1 ml-1">
101+
</div>
90102
</div>
91103
</div>
104+
105+
<script>
106+
(function refreshGameStats() {
107+
// High scores
108+
var hs = {
109+
"hs-si": localStorage.getItem("hs_space-invaders"),
110+
"hs-cb": localStorage.getItem("hs_code-breaker"),
111+
"hs-dd": localStorage.getItem("hs_dev-duel"),
112+
};
113+
Object.keys(hs).forEach(function (id) {
114+
var el = document.getElementById(id);
115+
if (el && hs[id]) el.textContent = hs[id];
116+
});
117+
118+
// Achievement badges
119+
var badgeContainer = document.getElementById("achievement-badges");
120+
if (!badgeContainer) return;
121+
var earned = {};
122+
try { earned = JSON.parse(localStorage.getItem("gameAchievements") || "{}"); } catch (_) {}
123+
var icons = { first_blood: "🩸", code_wizard: "🧙", duelist: "⚔️" };
124+
var labels = { first_blood: "First Blood", code_wizard: "Code Wizard", duelist: "Duelist" };
125+
Object.keys(icons).forEach(function (id) {
126+
if (earned[id]) {
127+
var badge = document.createElement("span");
128+
badge.title = labels[id];
129+
badge.className = "text-sm cursor-help";
130+
badge.textContent = icons[id];
131+
badgeContainer.appendChild(badge);
132+
}
133+
});
134+
})();
135+
</script>

src/_includes/header.njk

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,12 @@
33

44
{% include "header-details.njk" %}
55

6+
<nav class="flex items-center gap-2">
7+
<a href="/games/" class="text-[10px] font-black uppercase tracking-widest px-3 py-1.5 rounded-lg border border-[var(--border-color)] text-[var(--text-muted)] hover:text-accent hover:border-accent transition-all{% if page.url == '/games/' %} border-accent text-accent{% endif %}">
8+
🕹️ Arcade
9+
</a>
10+
</nav>
11+
612
{% include "game-stats.njk" %}
713

814
</div>

src/_includes/scripts.njk

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,4 +4,9 @@
44
</script>
55

66
<script src="/assets/js/script.js"></script>
7+
<script src="/assets/js/games/config.js"></script>
8+
<script src="/assets/js/games/game-manager.js"></script>
9+
<script src="/assets/js/games/space-invaders.js"></script>
10+
<script src="/assets/js/games/code-breaker.js"></script>
11+
<script src="/assets/js/games/dev-duel.js"></script>
712
<script src="/assets/js/eggs.js"></script>

src/_includes/system-override.njk

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,18 @@
2525
</div>
2626

2727
<div class="space-y-1 mb-2">
28+
<button onclick="addExperience(XP_SPACE_INVADERS_WIN); playSound('levelUp');" class="override-btn w-full flex justify-between px-2 py-1 bg-orange-500/5 text-orange-400 text-[8px] border border-orange-500/20 rounded">
29+
<span>👾 INVADER_WIN</span>
30+
<span class="opacity-50">+{{ XP_SPACE_INVADERS_WIN }}</span>
31+
</button>
32+
<button onclick="addExperience(XP_CODE_BREAKER_WIN); playSound('levelUp');" class="override-btn w-full flex justify-between px-2 py-1 bg-teal-500/5 text-teal-400 text-[8px] border border-teal-500/20 rounded">
33+
<span>⌨️ BREAKER_WIN</span>
34+
<span class="opacity-50">+{{ XP_CODE_BREAKER_WIN }}</span>
35+
</button>
36+
<button onclick="addExperience(XP_DEV_DUEL_PLAY); playSound('click');" class="override-btn w-full flex justify-between px-2 py-1 bg-yellow-500/5 text-yellow-400 text-[8px] border border-yellow-500/20 rounded">
37+
<span>⚔️ DUEL_PLAY</span>
38+
<span class="opacity-50">+{{ XP_DEV_DUEL_PLAY }}</span>
39+
</button>
2840
<button onclick="addExperience(5); playSound('click');" class="override-btn w-full flex justify-between px-2 py-1 bg-cyan-500/5 text-cyan-400 text-[8px] border border-cyan-500/20 rounded">
2941
<span>💎 SKILL_MINER</span>
3042
<span class="opacity-50">+5</span>

0 commit comments

Comments
 (0)