120 lines
4.0 KiB
JavaScript
120 lines
4.0 KiB
JavaScript
// --- 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();
|
|
});
|
|
} |