Skip to content

Commit 9368f18

Browse files
authored
Focus on d overrides (#257)
* Focus on d overrides * Fix sounds
1 parent c292721 commit 9368f18

File tree

2 files changed

+82
-27
lines changed

2 files changed

+82
-27
lines changed

src/_includes/footer.njk

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -52,34 +52,34 @@
5252
</div>
5353

5454
<div class="grid grid-cols-2 gap-1.5 mb-2">
55-
<button onclick="triggerSecretUnlock('matrix')" class="py-1.5 bg-green-500/5 hover:bg-green-500/20 text-green-500 text-[8px] border border-green-500/20 rounded transition-all">
55+
<button onclick="triggerSecretUnlock('matrix')" class="override-btn py-1.5 bg-green-500/5 hover:bg-green-500/20 text-green-500 text-[8px] border border-green-500/20 rounded transition-all">
5656
MATRIX
5757
</button>
58-
<button onclick="triggerSecretUnlock('konami')" class="py-1.5 bg-yellow-500/5 hover:bg-yellow-500/20 text-yellow-500 text-[8px] border border-yellow-500/20 rounded transition-all">
58+
<button onclick="triggerSecretUnlock('konami')" class="override-btn py-1.5 bg-yellow-500/5 hover:bg-yellow-500/20 text-yellow-500 text-[8px] border border-yellow-500/20 rounded transition-all">
5959
KONAMI
6060
</button>
61-
<button onclick="triggerSecretUnlock('gravity')" class="py-1.5 bg-red-500/5 hover:bg-red-500/20 text-red-500 text-[8px] border border-red-500/20 rounded transition-all">
61+
<button onclick="triggerSecretUnlock('gravity')" class="override-btn py-1.5 bg-red-500/5 hover:bg-red-500/20 text-red-500 text-[8px] border border-red-500/20 rounded transition-all">
6262
GRAVITY
6363
</button>
64-
<button onclick="triggerSecretUnlock('badge_click')" class="py-1.5 bg-purple-500/5 hover:bg-purple-500/20 text-purple-400 text-[8px] border border-purple-500/20 rounded transition-all">
64+
<button onclick="triggerSecretUnlock('badge_click')" class="override-btn py-1.5 bg-purple-500/5 hover:bg-purple-500/20 text-purple-400 text-[8px] border border-purple-500/20 rounded transition-all">
6565
BADGE_XP
6666
</button>
6767
</div>
6868

6969
<div class="space-y-1 mb-2">
70-
<button onclick="addExperience(5); playSound('click');" class="w-full flex justify-between px-2 py-1 bg-cyan-500/5 text-cyan-400 text-[8px] border border-cyan-500/20 rounded">
70+
<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">
7171
<span>💎 SKILL_MINER</span>
7272
<span class="opacity-50">+5</span>
7373
</button>
74-
<button onclick="addExperience(15); playSound('restore');" class="w-full flex justify-between px-2 py-1 bg-pink-500/5 text-pink-400 text-[8px] border border-pink-500/20 rounded">
74+
<button onclick="addExperience(15); playSound('restore');" class="override-btn w-full flex justify-between px-2 py-1 bg-pink-500/5 text-pink-400 text-[8px] border border-pink-500/20 rounded">
7575
<span>🛠️ SYS_OPTIMIZE</span>
7676
<span class="opacity-50">+15</span>
7777
</button>
78-
<button onclick="triggerMagicXP(); playSound('levelUp');" class="w-full flex justify-between px-2 py-1.5 bg-gradient-to-r from-purple-600/20 to-blue-600/20 text-purple-400 text-[8px] border border-purple-500/30 rounded hover:from-purple-600/40 hover:to-blue-600/40 transition-all group">
78+
<button onclick="triggerMagicXP(); playSound('levelUp');" class="override-btn w-full flex justify-between px-2 py-1.5 bg-gradient-to-r from-purple-600/20 to-blue-600/20 text-purple-400 text-[8px] border border-purple-500/30 rounded hover:from-purple-600/40 hover:to-blue-600/40 transition-all group">
7979
<span>✨ CAST_MAGIC_XP</span>
8080
<span class="group-hover:animate-pulse">+50 XP</span>
8181
</button>
82-
<button onclick="toggleScreenshotMode()" class="w-full flex justify-between px-2 py-1 bg-white/5 text-slate-400 text-[8px] border border-white/10 rounded">
82+
<button onclick="toggleScreenshotMode()" class="override-btn w-full flex justify-between px-2 py-1 bg-white/5 text-slate-400 text-[8px] border border-white/10 rounded">
8383
<span>📸 SCREENSHOT</span>
8484
<span class="opacity-50">[5 Seconds]</span>
8585
</button>
@@ -93,11 +93,12 @@
9393
placeholder="0"
9494
min="0"
9595
max="200"
96+
class="override-btn"
9697
style="background-color: #000 !important; color: #00ffcc !important; border: 1px solid #00ffcc !important; width: 60px !important; height: 30px !important; font-size: 14px !important; padding: 0 5px !important; border-radius: 4px !important;"
9798
>
9899
<button
99100
onclick="jumpToLevel()"
100-
class="flex-1 bg-accent/20 hover:bg-accent/40 text-accent text-[10px] font-black py-1 rounded transition-all border border-accent/40 uppercase"
101+
class="override-btn flex-1 bg-accent/20 hover:bg-accent/40 text-accent text-[10px] font-black py-1 rounded transition-all border border-accent/40 uppercase"
101102
style="height: 30px !important;"
102103
>
103104
EXECUTE
@@ -106,11 +107,11 @@
106107
</div>
107108

108109
<div class="flex gap-1.5 pt-2 border-t border-white/10">
109-
<button id="self-destruct-btn" onclick="startSelfDestruct()" class="flex-1 py-1.5 bg-red-600/10 hover:bg-red-600/30 text-red-500 text-[8px] border border-red-500/30 rounded flex justify-center gap-1">
110+
<button id="self-destruct-btn" onclick="startSelfDestruct()" class="override-btn flex-1 py-1.5 bg-red-600/10 hover:bg-red-600/30 text-red-500 text-[8px] border border-red-500/30 rounded flex justify-center gap-1">
110111
<span id="destruct-text">DESTRUCT</span>
111112
<span id="destruct-timer"></span>
112113
</button>
113-
<button onclick="localStorage.clear(); location.reload();" class="px-2 py-1.5 bg-blue-600/10 hover:bg-blue-600/30 text-blue-400 text-[8px] border border-blue-500/20 rounded uppercase">
114+
<button onclick="localStorage.clear(); location.reload();" class="override-btn px-2 py-1.5 bg-blue-600/10 hover:bg-blue-600/30 text-blue-400 text-[8px] border border-blue-500/20 rounded uppercase">
114115
Reset
115116
</button>
116117
</div>

src/assets/js/script.js

Lines changed: 70 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -299,23 +299,23 @@ function playSound(type) {
299299
else if (type === 'levelUp') {
300300
osc.type = 'square';
301301
osc.frequency.setValueAtTime(440, now);
302-
osc.frequency.exponentialRampToValueAtTime(880, now + 0.2);
302+
osc.frequency.exponentialRampToValueAtTime(880, now + 0.4);
303303
gain.gain.setValueAtTime(0.15, now);
304-
gain.gain.exponentialRampToValueAtTime(0.01, now + 0.4);
304+
gain.gain.exponentialRampToValueAtTime(0.01, now + 1.0);
305305
osc.start(now);
306-
osc.stop(now + 0.4);
306+
osc.stop(now + 1.5);
307307
}
308308
else if (type === 'secret') {
309309
osc.type = 'triangle';
310310
[523.25, 659.25, 783.99, 1046.50].forEach((freq, i) => {
311311
const s = audioCtx.createOscillator();
312312
const g = audioCtx.createGain();
313313
s.connect(g); g.connect(audioCtx.destination);
314-
s.frequency.setValueAtTime(freq, now + i * 0.1);
315-
g.gain.setValueAtTime(0.07, now + i * 0.1);
316-
g.gain.exponentialRampToValueAtTime(0.01, now + i * 0.1 + 0.1);
317-
s.start(now + i * 0.1);
318-
s.stop(now + i * 0.1 + 0.1);
314+
s.frequency.setValueAtTime(freq, now + i * 0.3);
315+
g.gain.setValueAtTime(0.07, now + i * 0.3);
316+
g.gain.exponentialRampToValueAtTime(0.01, now + i * 0.3 + 0.3);
317+
s.start(now + i * 0.3);
318+
s.stop(now + i * 0.3 + 0.3);
319319
});
320320
}
321321
else if (type === 'restore') {
@@ -655,6 +655,7 @@ function triggerSecretUnlock(type) {
655655

656656
// 3. Only process XP and Save if it's the first time
657657
if (isNewUnlock) {
658+
playSound('secret');
658659
// Update the array and save to localStorage
659660
unlockedEggs.push(eggId);
660661
localStorage.setItem('unlockedEggs', JSON.stringify(unlockedEggs));
@@ -670,6 +671,7 @@ function triggerSecretUnlock(type) {
670671

671672
console.log(`✨ Secret Unlocked: ${eggId}`);
672673
} else {
674+
playSound('click');
673675
console.log(`Secret ${eggId} already discovered. No extra XP granted.`);
674676
}
675677
}
@@ -682,13 +684,31 @@ window.addEventListener('keydown', (e) => {
682684
if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') return;
683685

684686
if (key === 'd') {
685-
const devPanel = document.getElementById('dev-tools');
686-
if (devPanel) {
687-
const isHidden = devPanel.classList.toggle('hidden');
688-
localStorage.setItem('devToolsVisible', !isHidden);
689-
playSound(isHidden ? 'click' : 'secret');
687+
e.preventDefault();
688+
689+
const systemDash = document.getElementById('dev-tools'); // Adjust ID as needed
690+
const isOpening = systemDash.classList.contains('hidden');
691+
692+
localStorage.setItem('devToolsVisible', !isOpening);
693+
playSound(isOpening ? 'secret' : 'click');
694+
695+
if (isOpening) {
696+
697+
document.getElementById('matrix-console-container').classList.add('hidden');
698+
systemDash.classList.remove('hidden');
699+
700+
// Wait 100-150ms for the animation/display to settle
701+
setTimeout(() => {
702+
// Find the first interactive element (button or link)
703+
const firstControl = systemDash.querySelector('button, a, input');
704+
if (firstControl) {
705+
firstControl.focus();
706+
}
707+
}, 150);
708+
} else {
709+
systemDash.classList.add('hidden');
710+
document.body.focus(); // Return focus to the page
690711
}
691-
return;
692712
}
693713

694714
if (key === konamiCode[konamiPosition]) {
@@ -703,13 +723,12 @@ window.addEventListener('keydown', (e) => {
703723
});
704724

705725
function activateKonami() {
706-
playSound('secret');
707726
document.documentElement.classList.add('konami-roll');
708727
setTimeout(() => document.documentElement.classList.remove('konami-roll'), 2000);
709728
}
710729

711730
function activateGravityEffect() {
712-
playSound('secret');
731+
713732
document.body.classList.add('glitch-shake');
714733

715734
setTimeout(() => {
@@ -803,6 +822,41 @@ function closeMatrix() {
803822
window.removeEventListener('keydown', handleMatrixEsc);
804823
}
805824

825+
826+
let hasTriggeredFirstLevel = false; // Prevents the sound from spamming every click
827+
828+
function triggerBadgeLevelUp() {
829+
const badge = document.getElementById('level-badge');
830+
831+
// 1. Visual Pop Animation
832+
if (badge) {
833+
badge.classList.remove('animate-badge-pop');
834+
void badge.offsetWidth; // Force reflow to restart animation
835+
badge.classList.add('animate-badge-pop');
836+
}
837+
838+
// 2. Secret Sound & Level Logic
839+
if (!hasTriggeredFirstLevel) {
840+
// Play your secret sound
841+
playSound('secret');
842+
843+
// Force a level up for the "first time" experience
844+
addExperience(45); // Assuming 45 XP = 1 Level
845+
846+
hasTriggeredFirstLevel = true;
847+
848+
// Push a special "Easter Egg" message to the Matrix Console
849+
if (typeof matrixConsoleLog === 'function') {
850+
matrixConsoleLog(currentLevel);
851+
}
852+
}
853+
}
854+
855+
// Attach to the badge click
856+
document.getElementById('level-badge').addEventListener('click', triggerBadgeLevelUp);
857+
858+
859+
806860
/**
807861
* 7. SELF DESTRUCT ENGINE
808862
*/

0 commit comments

Comments
 (0)