From 87de3942f6d5333ab060dae5369580bd5113a1e2 Mon Sep 17 00:00:00 2001
From: Nathan <nathan-h.inf25@ukwms.ac.id>
Date: Fri, 19 Dec 2025 03:07:06 +0700
Subject: [PATCH] IT'S DONE

---
 Leaderboard.php       |  2 +
 assets/leaderboard.js | 85 +++++++++++++++++++++++++++++++++++++------
 2 files changed, 76 insertions(+), 11 deletions(-)

diff --git a/Leaderboard.php b/Leaderboard.php
index 18f8ed6..4d5ed76 100644
--- a/Leaderboard.php
+++ b/Leaderboard.php
@@ -150,7 +150,9 @@ if (is_array($currentUser)) {
 <div class="music-container">
     <button id="lbMusicBtn" class="music-btn">🔇</button>
 </div>
+
 <audio id="lbAudio" loop src="music/music_background.mp3"></audio>
+<audio id="sfxAudio" src="music/click.mp3"></audio>
 
 <script src="assets/leaderboard.js"></script>
 
diff --git a/assets/leaderboard.js b/assets/leaderboard.js
index f6e6ae3..62a5855 100644
--- a/assets/leaderboard.js
+++ b/assets/leaderboard.js
@@ -1,26 +1,88 @@
+// --- 1. SETUP SFX (Sama persis kayak Mainboard) ---
+const sfxClick = new Audio('music/music-click.mp3'); 
+
+function playClick() {
+    sfxClick.currentTime = 0;
+    sfxClick.play().catch(() => {});
+}
+
+// --- 2. LOGIKA TOMBOL FILTER (Var 'buttons' TETAP, cuma tambah delay) ---
 const buttons = document.querySelectorAll(".filter-btn");
 buttons.forEach(btn => {
-    btn.addEventListener("click", function () {
+    btn.addEventListener("click", function (e) {
+        e.preventDefault(); // Tahan dulu biar gak langsung pindah
+        playClick(); // Bunyiin suara
+
+        // Logic ganti warna tombol (Asli punya kamu)
         buttons.forEach(b => b.classList.remove("active"));
         this.classList.add("active");
+
+        // Ambil link tujuan (href) lalu pindah setelah 300ms
+        const targetUrl = this.getAttribute("href");
+        setTimeout(() => {
+            window.location.href = targetUrl;
+        }, 300);
     });
 });
 
+// --- 3. LOGIKA TOMBOL KEMBALI & LOGOUT (Tambahan biar ada suaranya) ---
+const backBtn = document.querySelector(".back-btn");
+const logoutBtn = document.querySelector(".logout-btn");
 
+if (backBtn) {
+    backBtn.removeAttribute("onclick"); // Hapus onclick bawaan HTML
+    backBtn.addEventListener("click", () => {
+        playClick();
+        setTimeout(() => {
+            window.location.href = 'mainboard.php';
+        }, 300);
+    });
+}
+
+if (logoutBtn) {
+    logoutBtn.addEventListener("click", (e) => {
+        e.preventDefault(); // Tahan link logout
+        playClick();
+        setTimeout(() => {
+            window.location.href = 'logout.php';
+        }, 300);
+    });
+}
+
+// --- 4. LOGIKA BACKGROUND MUSIC (UBAHAN: CERDAS DETEKSI HALAMAN) ---
 const lbMusicBtn = document.getElementById("lbMusicBtn");
 const lbAudio = document.getElementById("lbAudio");
 
 if (lbMusicBtn && lbAudio) {
-    lbAudio.loop = true; 
-    const savedState = localStorage.getItem("musicState");
-    let isLbPlaying = savedState === null ? true : (savedState === "on");
-    
+    lbAudio.loop = true;
+
+    // 1. Cek nama file halaman saat ini
+    const path = window.location.pathname;
+    // Cek apakah nama filenya mengandung kata "mainboard" (huruf kecil/besar gak masalah)
+    const isMainboardPage = path.toLowerCase().includes("mainboard");
+
+    let isLbPlaying;
+
+    if (isMainboardPage) {
+        // SKENARIO A: Kalau ini halaman MAINBOARD
+        // Aturannya: Pas masuk HARUS ON (Reset).
+        isLbPlaying = true;
+        localStorage.setItem("musicState", "on"); 
+    } else {
+        // SKENARIO B: Kalau ini halaman LEVEL (Easy/Medium/Hard)
+        // Aturannya: IKUTI settingan terakhir user (baca localStorage).
+        const savedState = localStorage.getItem("musicState");
+        // Kalau gak ada data (null), anggap on. Kalau ada, ikutin isinya.
+        isLbPlaying = savedState === null ? true : (savedState === "on");
+    }
+
+    // Fungsi update tampilan & play/pause
     const updateMusicState = () => {
         if (isLbPlaying) {
             lbAudio.play().then(() => {
                 lbMusicBtn.innerHTML = "🔊";
             }).catch(error => {
-                console.log("Autoplay dicegah, menunggu interaksi user...");
+                console.log("Autoplay dicegah browser, nunggu klik user...");
                 lbMusicBtn.innerHTML = "🔇"; 
                 
                 const enableAudioOnInteraction = () => {
@@ -28,11 +90,8 @@ if (lbMusicBtn && lbAudio) {
                         lbMusicBtn.innerHTML = "🔊";
                     });
                     document.removeEventListener('click', enableAudioOnInteraction);
-                    document.removeEventListener('touchstart', enableAudioOnInteraction);
                 };
-                
                 document.addEventListener('click', enableAudioOnInteraction);
-                document.addEventListener('touchstart', enableAudioOnInteraction);
             });
         } else {
             lbAudio.pause();
@@ -40,17 +99,21 @@ if (lbMusicBtn && lbAudio) {
         }
     };
 
+    // Jalankan pertama kali saat load
     updateMusicState();
 
+    // Event Listener saat tombol speaker diklik
     lbMusicBtn.addEventListener("click", (e) => {
         e.stopPropagation(); 
+        
+        // playClick(); // Uncomment kalau mau tombol mute bunyi klik
 
         if (isLbPlaying) {
             isLbPlaying = false;
-            localStorage.setItem("musicState", "off");
+            localStorage.setItem("musicState", "off"); // Simpan 'off' biar level selanjutnya tau
         } else {
             isLbPlaying = true;
-            localStorage.setItem("musicState", "on");
+            localStorage.setItem("musicState", "on"); // Simpan 'on'
         }
         updateMusicState();
     });