Files
uniare.sori.studio/script/navigation.js
zenn dbf02241e2 v4.0.0: 회원·덱 API, 인증 UI, 프로필 및 레이아웃 통일
Express/SQLite API와 Docker 구성을 추가하고 로그인·덱 저장·공개 덱·관리자·프로필 화면을 구현했다. 결과 화면 저장 UX, 헤더 프로필, 애드센스용 app-shell 레이아웃(1280px) 및 문서를 반영했다.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-22 16:59:36 +09:00

95 lines
3.1 KiB
JavaScript

function redirectToHomeAndRefresh() {
localStorage.clear();
window.location.href = '/';
}
// 페이지 로드 시 네비게이션 생성 및 이벤트 핸들러 등록
document.addEventListener('DOMContentLoaded', () => {
createNavigation();
setupEventListeners();
});
// 네비게이션 생성
function createNavigation() {
// 오버레이 메뉴 추가
const overlayMenu = document.createElement('div');
overlayMenu.id = 'overlay-menu';
overlayMenu.className = 'fixed top-0 left-0 w-full h-full bg-black bg-opacity-50 z-50 hidden';
overlayMenu.innerHTML = `
<div class="flex flex-col items-center justify-center h-full">
<div class="overlay-content bg-white p-6 rounded-lg shadow-lg">
<div class="content-list cursor-pointer p-2 hover:bg-gray-100" onclick="goToCardSeries()">
<span data-i18n="selectTitle"></span>
</div>
<div class="content-list cursor-pointer p-2 hover:bg-gray-100" onclick="goToDeckHistory()">
<span data-i18n="myDeckHistory"></span>
</div>
<div class="content-list cursor-pointer p-2 hover:bg-gray-100" onclick="goToChangeLanguage()">
Language
</div>
<div class="content-list cursor-pointer p-2 hover:bg-gray-100" onclick="goToPreset()">
<span data-i18n="metaDeck"></span>
</div>
<div class="content-list cursor-pointer p-2 hover:bg-gray-100" onclick="goToMyCardsDatabase()">
My Database
</div>
</div>
</div>
`;
document.body.appendChild(overlayMenu); // body의 마지막 자식으로 오버레이 메뉴 추가
}
// 이벤트 핸들러 등록
function setupEventListeners() {
// 필요한 경우 추가적인 이벤트 핸들러 등록
}
function redirectToHomeAndRefresh() {
const keysToRemove = Object.keys(localStorage).filter(key => key !== 'lang');
keysToRemove.forEach(key => localStorage.removeItem(key));
// localStorage.clear();
window.location.href = '/';
}
function toggleMobileMenu() {
const menuIcon = document.getElementById('hambergerIcon');
menuIcon.classList.toggle('open');
menuIcon.classList.toggle('bg-red-600');
const overlayMenu = document.getElementById("overlay-menu");
overlayMenu.classList.toggle("hidden");
}
function goToCardSeries() {
window.location.href = "index.html"; // 작품 선택 페이지로 이동
toggleMobileMenu();
}
function goToDeckHistory() {
window.location.href = "deckHistory.html";
toggleMobileMenu();
}
function goToChangeLanguage() {
toggleMobileMenu();
}
function goToPreset() {
window.location.href = "preset.html";
toggleMobileMenu();
}
function goToMyCardsDatabase() {
window.location.href = "deckHistory.html";
toggleMobileMenu();
}
// function toggleMobileMenu() {
// const menuIcon = document.getElementById('hambergerIcon');
// menuIcon.classList.toggle('open');
// menuIcon.classList.toggle('bg-red-600');
// }