File size: 3,910 Bytes
adb3c25 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 |
document.addEventListener('DOMContentLoaded', () => {
const buttons = document.querySelectorAll('game-button');
const startBtn = document.getElementById('startBtn');
const strictBtn = document.getElementById('strictBtn');
const scoreDisplay = document.querySelector('score-display');
let sequence = [];
let playerSequence = [];
let level = 0;
let strictMode = false;
let gameActive = false;
// Sound effects
const sounds = {
red: new Audio('https://www.soundjay.com/buttons/sounds/button-09.mp3'),
blue: new Audio('https://www.soundjay.com/buttons/sounds/button-10.mp3'),
yellow: new Audio('https://www.soundjay.com/buttons/sounds/button-21.mp3'),
green: new Audio('https://www.soundjay.com/buttons/sounds/button-22.mp3'),
error: new Audio('https://www.soundjay.com/buttons/sounds/button-08.mp3')
};
// Initialize game
function initGame() {
sequence = [];
playerSequence = [];
level = 0;
gameActive = true;
scoreDisplay.setAttribute('score', level);
generateSequence();
playSequence();
}
// Generate random sequence
function generateSequence() {
const colors = ['red', 'blue', 'yellow', 'green', 'purple', 'pink', 'indigo', 'teal'];
sequence.push(colors[Math.floor(Math.random() * 4)]);
}
// Play the current sequence
function playSequence() {
let i = 0;
const interval = setInterval(() => {
if (i >= sequence.length) {
clearInterval(interval);
return;
}
const color = sequence[i];
const button = document.querySelector(`game-button[color="${color}"]`);
button.flash();
sounds[color].play();
i++;
}, 800);
}
// Handle player input
function handlePlayerInput(color) {
if (!gameActive) return;
playerSequence.push(color);
sounds[color].play();
const currentIndex = playerSequence.length - 1;
if (playerSequence[currentIndex] !== sequence[currentIndex]) {
// Wrong sequence
sounds.error.play();
scoreDisplay.setAttribute('status', 'error');
document.body.classList.add('game-over');
setTimeout(() => {
document.body.classList.remove('game-over');
scoreDisplay.setAttribute('status', '');
if (strictMode) {
initGame(); // Restart in strict mode
} else {
playerSequence = [];
playSequence(); // Replay sequence
}
}, 1000);
return;
}
// Correct sequence so far
if (playerSequence.length === sequence.length) {
// Completed the level
level++;
scoreDisplay.setAttribute('score', level);
scoreDisplay.setAttribute('status', 'success');
setTimeout(() => {
scoreDisplay.setAttribute('status', '');
playerSequence = [];
generateSequence();
setTimeout(playSequence, 1000);
}, 1000);
}
}
// Event listeners
buttons.forEach(button => {
button.addEventListener('click', () => {
if (!gameActive || playerSequence.length >= sequence.length) return;
button.flash();
handlePlayerInput(button.getAttribute('color'));
});
});
startBtn.addEventListener('click', initGame);
strictBtn.addEventListener('click', () => {
strictMode = !strictMode;
strictBtn.classList.toggle('bg-indigo-600', strictMode);
strictBtn.classList.toggle('bg-gray-700', !strictMode);
});
}); |