// --- 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 (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;

    // 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 browser, nunggu klik user...");
                lbMusicBtn.innerHTML = "🔇"; 
                
                const enableAudioOnInteraction = () => {
                    lbAudio.play().then(() => {
                        lbMusicBtn.innerHTML = "🔊";
                    });
                    document.removeEventListener('click', enableAudioOnInteraction);
                };
                document.addEventListener('click', enableAudioOnInteraction);
            });
        } else {
            lbAudio.pause();
            lbMusicBtn.innerHTML = "🔇";
        }
    };

    // 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"); // Simpan 'off' biar level selanjutnya tau
        } else {
            isLbPlaying = true;
            localStorage.setItem("musicState", "on"); // Simpan 'on'
        }
        updateMusicState();
    });
}