Memory mit mehreren Themen

Animiertes Memory

Spieler 1

Spieler 2

${icon}

`; if (icon === '⭐') { card.addEventListener('click', function () { if (lockBoard || this.classList.contains('flipped')) return; this.classList.add('flipped'); setTimeout(() => { this.classList.add('matched'); // Bonus: Der Spieler, der den Stern findet, erhält einen Punkt? // Oder ihn einfach entfernen. Sagen wir, es ist einfach ein Gratispunkt. scores[currentPlayer]++; updateUI(); // Falls dies die einzige verbleibende Karte war, ist das Spiel vielleicht vorbei? // Aber normalerweise ist es einfach eine Karte, die gefunden wurde. // Wir erhöhen matchedPairs nicht, da es kein Paar ist. // Wir müssen jedoch prüfen, ob das Spiel vorbei ist. checkGameOver(); }, 600); }); } else { card.addEventListener('click', flipCard); } grid.appendChild(card); }); } function flipCard() { if (lockBoard) return; if (this.classList.contains('flipped')) return; if (this.classList.contains('matched')) return; this.classList.add('flipped'); flippedCards.push(this); if (flippedCards.length === 2) { checkMatch(); } } function checkMatch() { lockBoard = true; const [card1, card2] = flippedCards; const isMatch = card1.dataset.icon === card2.dataset.icon; if (isMatch) { handleMatch(card1, card2); } else { unflipCards(card1, card2); } } function handleMatch(card1, card2) { scores[currentPlayer]++; matchedPairs++; updateUI(); card1.classList.add('matched'); card2.classList.add('matched'); flippedCards = []; lockBoard = false; checkGameOver(); } function checkGameOver() { const totalNeeded = totalPairs; const matchedCards = document.querySelectorAll('.card.matched').length; const totalCards = gridSize * gridSize; if (matchedCards === totalCards) { showWinner(); } } function unflipCards(card1, card2) { setTimeout(() => { card1.classList.remove('flipped'); card2.classList.remove('flipped'); switchPlayer(); flippedCards = []; lockBoard = false; }, 800); } function switchPlayer() { currentPlayer = currentPlayer === 0 ? 1 : 0; p1Area.classList.toggle('active-player'); p2Area.classList.toggle('active-player'); } function updateUI() { p1ScoreDisplay.innerText = scores[0]; p2ScoreDisplay.innerText = scores[1]; } function showWinner() { let msg = ""; if (scores[0] > scores[1]) { msg = "Spieler 1 gewinnt! 🏆"; } else if (scores[1] > scores[0]) { msg = "Spieler 2 gewinnt! 🏆"; } else { msg = "Unentschieden! 🤝"; } winnerText.innerText = msg; modal.classList.remove('hidden'); } function resetGame() { scores = [0, 0]; currentPlayer = 0; matchedPairs = 0; flippedCards = []; lockBoard = false; p1Area.classList.add('active-player'); p2Area.classList.remove('active-player'); modal.classList.add('hidden'); updateUI(); createBoard(); } // Das Spiel wartet beim Start auf die Auswahl eines Themas über das standardmäßig sichtbare Modal

Animiertes Memory

Spieleinstellungen

🎉

Spieler 1 gewinnt!