codey/codey.lol
1
0
Fork 0
Code Issues Pull Requests Activity

feat: Update AudioPlayer and LyricSearch components for improved functionality and user experience

Browse Source
This commit is contained in:
codey
2025-11-25 13:05:37 -05:00
parent 8500cd6e67
commit ee25ad243c
5 changed files with 133 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
src/layouts/Nav.astro
View File

@@ -33,93 +33,7 @@ const currentPath = Astro.url.pathname;
---
<script is:inline define:vars={{ API_URL }}>
toggleTheme = () => {
const currentTheme = document.documentElement.getAttribute("data-theme");
const newTheme = currentTheme === "dark" ? "light" : "dark";
document.dispatchEvent(new CustomEvent("set-theme", { detail: newTheme }));
}
window.handleLogout = async () => {
try {
await fetch(`${API_URL}/auth/logout`, {
method: "POST",
credentials: "include",
});
} catch (error) {
console.error("Logout failed", error);
} finally {
window.location.href = "/";
}
};
// Mobile menu toggle
function initMobileMenu() {
const menuBtn = document.getElementById('mobile-menu-btn');
const mobileMenu = document.getElementById('mobile-menu');
const menuIcon = document.getElementById('menu-icon');
const closeIcon = document.getElementById('close-icon');
if (!menuBtn || !mobileMenu || !menuIcon || !closeIcon) {
return;
}
// Remove existing listeners by cloning (prevents duplicate listeners)
const newMenuBtn = menuBtn.cloneNode(true);
menuBtn.parentNode.replaceChild(newMenuBtn, menuBtn);
newMenuBtn.addEventListener('click', (e) => {
e.stopPropagation();
const isOpen = mobileMenu.classList.contains('open');
if (isOpen) {
mobileMenu.classList.remove('open');
menuIcon.style.display = 'block';
closeIcon.style.display = 'none';
} else {
mobileMenu.classList.add('open');
menuIcon.style.display = 'none';
closeIcon.style.display = 'block';
}
});
// Close menu when clicking a link
const mobileLinks = mobileMenu.querySelectorAll('a');
mobileLinks.forEach(link => {
link.addEventListener('click', () => {
mobileMenu.classList.remove('open');
menuIcon.style.display = 'block';
closeIcon.style.display = 'none';
});
});
// Close menu when clicking outside
const closeHandler = (e) => {
if (!mobileMenu.contains(e.target) && !newMenuBtn.contains(e.target)) {
if (mobileMenu.classList.contains('open')) {
mobileMenu.classList.remove('open');
menuIcon.style.display = 'block';
closeIcon.style.display = 'none';
}
}
};
// Remove old handler if exists
document.removeEventListener('click', closeHandler);
document.addEventListener('click', closeHandler);
}
// Initialize on page load
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', initMobileMenu);
} else {
initMobileMenu();
}
// Re-initialize after view transitions
document.addEventListener('astro:page-load', initMobileMenu);
</script>
<script src="/scripts/nav-controls.js" defer data-api-url={API_URL}></script>
<nav class="w-full px-4 sm:px-6 py-4 bg-transparent sticky top-0 z-50 backdrop-blur-sm bg-white/80 dark:bg-[#121212]/80 border-b border-neutral-200/50 dark:border-neutral-800/50">
<div class="max-w-7xl mx-auto">