diff --git a/gameboard-easy.html b/gameboard-easy.html index 07cd438..30f3a50 100644 --- a/gameboard-easy.html +++ b/gameboard-easy.html @@ -4,6 +4,7 @@ Memory Card Premium + @@ -162,7 +193,30 @@ let moves = 0; let score = 0; let countdown; -// Fungsi shuffle (Fisher-Yates) +let combo = 1; +let lastMatchTime = 0; +let pendingMatch = false; + +/* === POPUP COMBO TANPA ICON === */ +function showComboPopup(targetCard, combo, bonus) { + const popup = document.createElement("div"); + popup.className = "combo-popup"; + + popup.innerHTML = ` + COMBO x${combo}!
+ +${bonus} Bonus + `; + + const rect = targetCard.getBoundingClientRect(); + popup.style.left = rect.left + rect.width / 2 + "px"; + popup.style.top = rect.top + "px"; + popup.style.position = "fixed"; + + document.body.appendChild(popup); + + setTimeout(() => popup.remove(), 1500); +} + function shuffleArray(array) { for (let i = array.length - 1; i > 0; i--) { const j = Math.floor(Math.random() * (i + 1)); @@ -183,44 +237,64 @@ function startTimer() { }, 1000); } -function flipCard(card){ - if(!timerStarted) startTimer(); - if(flipped.length === 2 || card.classList.contains("matched") || card.classList.contains("flipped")) +function flipCard(card) { + if (!timerStarted) startTimer(); + if (flipped.length === 2 || card.classList.contains("matched") || card.classList.contains("flipped")) return; card.classList.add("flipped"); flipped.push(card); - if(flipped.length === 2){ + if (flipped.length === 2) { moves++; document.getElementById("moves").textContent = moves; let img1 = flipped[0].querySelector(".back img").src; let img2 = flipped[1].querySelector(".back img").src; - if(img1 === img2){ - flipped.forEach(c => c.classList.add("matched")); - score += 10; - document.getElementById("score").textContent = score; + if (img1 === img2) { - time += 5; // tambah 5 detik jika cocok + const now = Date.now(); + + /* === SISTEM COMBO === */ + if (!pendingMatch) { + pendingMatch = true; + combo = 1; + } else { + if (now - lastMatchTime <= 1500) { + combo++; + let comboBonus = 10 * combo; + score += comboBonus; + document.getElementById("score").textContent = score; + + showComboPopup(flipped[0], combo, comboBonus); + } else { + combo = 1; + pendingMatch = true; + } + } + + lastMatchTime = now; + + flipped.forEach(c => c.classList.add("matched")); + + time += 5; document.getElementById("timer").textContent = time; flipped = []; + } else { - setTimeout(()=> { - flipped.forEach(c=>c.classList.remove("flipped")); + setTimeout(() => { + flipped.forEach(c => c.classList.remove("flipped")); flipped = []; }, 800); } } } -function startGame(){ +function startGame() { const board = document.getElementById("game-board"); board.innerHTML = ""; - - // Shuffle kartu sebelum ditampilkan const shuffledCards = shuffleArray([...cards]); shuffledCards.forEach(image => { @@ -232,13 +306,18 @@ function startGame(){
`; - card.onclick = ()=>flipCard(card); + card.onclick = () => flipCard(card); board.appendChild(card); }); time = 60; moves = 0; score = 0; + + combo = 1; + lastMatchTime = 0; + pendingMatch = false; + flipped = []; timerStarted = false;