Merge branch 'main' of https://git-eng.ukwms.ac.id/2526-web/Kelompok02-Memory-Card

gameboard-medium.html

@@ -241,7 +241,7 @@ body {
 </div>
 
 <script>
-/* === 8 GAMBAR (16 kartu) === */
+
 const images = [
   "asset/alpukat.jpg",
   "asset/anggur.jpg",
@@ -280,12 +280,32 @@ function showComboPopup(targetCard, combo, bonus) {
   setTimeout(() => popup.remove(), 1500);
 }
 
-function shuffleArray(array) {
-  for (let i = array.length - 1; i > 0; i--) {
-    const j = Math.floor(Math.random() * (i + 1));
-    [array[i], array[j]] = [array[j], array[i]];
+
+function shuffleDistant(cards, minDistance = 5) {
+  let valid = false;
+  let result;
+
+  while (!valid) {
+    result = [...cards].sort(() => Math.random() - 0.5);
+    valid = true;
+    const checked = new Set();
+
+    for (let i = 0; i < result.length; i++) {
+      const value = result[i];
+      if (checked.has(value)) continue;
+      checked.add(value);
+
+      const firstIndex = result.indexOf(value);
+      const lastIndex  = result.lastIndexOf(value);
+      const distance = Math.abs(lastIndex - firstIndex);
+
+      if (distance < minDistance) {
+        valid = false;
+        break;
+      }
+    }
   }
-  return array;
+  return result;
 }
 
 function startTimer() {
@@ -359,7 +379,7 @@ function startGame() {
   const board = document.getElementById("game-board");
   board.innerHTML = "";
 
-  shuffleArray([...cards]).forEach(image => {
+  shuffleDistant(cards, 4).forEach(image => {
     const card = document.createElement("div");
     card.className = "card";
     card.innerHTML = `