(function() { 'use strict'; let drawerElement = null; let isDrawerOpen = false; // 创建抽屉 (从隐藏的 div 克隆) function createDrawer() { const template = document.getElementById('mobile-drawer-template'); if (!template) { console.error('Drawer template not found'); return null; } const overlay = template.querySelector('#mobile-sidebar-overlay'); if (!overlay) { console.error('Overlay element not found in template'); return null; } const clone = overlay.cloneNode(true); clone.id = 'mobile-sidebar-overlay-active'; // --- [新增逻辑] 自动搬运侧边栏挂件 --- const sidebarWidgets = document.getElementById('sidebar-widgets'); const drawerContent = clone.querySelector('.p-5.space-y-6'); // 抽屉的内容容器 if (sidebarWidgets && drawerContent) { // 创建一个专门存放侧边栏内容的容器 const sidebarMobileContainer = document.createElement('section'); sidebarMobileContainer.className = 'mobile-sidebar-content space-y-6 pt-4 border-t border-gray-100'; sidebarMobileContainer.innerHTML = '

实时资讯

'; // 克隆侧边栏所有的子元素(欢迎卡片、计时器等) const widgetsClone = sidebarWidgets.cloneNode(true); // 移除原本的 ID 避免冲突 widgetsClone.removeAttribute('id'); // 将侧边栏内容追加到抽屉中 sidebarMobileContainer.appendChild(widgetsClone); drawerContent.appendChild(sidebarMobileContainer); } // ------------------------------------ document.body.appendChild(clone); return clone; } function openDrawer() { if (isDrawerOpen) return; if (!drawerElement) { drawerElement = createDrawer(); if (!drawerElement) return; bindDrawerEvents(); } // 锁定背景滚动 const scrollY = window.scrollY; document.body.style.overflow = 'hidden'; document.body.style.position = 'fixed'; document.body.style.top = `-${scrollY}px`; document.body.style.width = '100%'; drawerElement.style.display = 'block'; isDrawerOpen = true; requestAnimationFrame(() => { requestAnimationFrame(() => { const backdrop = drawerElement.querySelector('.drawer-backdrop'); const panel = drawerElement.querySelector('.drawer-panel'); if (backdrop) backdrop.style.opacity = '1'; if (panel) panel.style.transform = 'translateX(0)'; }); }); // 如果克隆的内容里包含计时器,需要重新初始化计时器逻辑 if (window.initTimers) window.initTimers(drawerElement); } function closeDrawer() { if (!isDrawerOpen || !drawerElement) return; const backdrop = drawerElement.querySelector('.drawer-backdrop'); const panel = drawerElement.querySelector('.drawer-panel'); if (backdrop) backdrop.style.opacity = '0'; if (panel) panel.style.transform = 'translateX(100%)'; setTimeout(() => { if (drawerElement) { drawerElement.style.display = 'none'; } // 恢复滚动 const scrollY = document.body.style.top; document.body.style.overflow = ''; document.body.style.position = ''; document.body.style.top = ''; document.body.style.width = ''; window.scrollTo(0, parseInt(scrollY || '0') * -1); isDrawerOpen = false; }, 300); } function bindDrawerEvents() { if (!drawerElement) return; const closeBtn = drawerElement.querySelector('#drawer-close-btn'); if (closeBtn) { closeBtn.addEventListener('click', (e) => { e.preventDefault(); closeDrawer(); }); } const backdrop = drawerElement.querySelector('.drawer-backdrop'); if (backdrop) { backdrop.addEventListener('click', closeDrawer); } const links = drawerElement.querySelectorAll('.drawer-link, .mobile-nav-grid a, a'); links.forEach(link => { link.addEventListener('click', () => { setTimeout(closeDrawer, 100); }); }); } document.addEventListener('DOMContentLoaded', () => { const trigger = document.getElementById('mobile-menu-trigger'); if (trigger) { trigger.addEventListener('click', (e) => { e.preventDefault(); e.stopPropagation(); openDrawer(); }); } document.addEventListener('keydown', (e) => { if (e.key === 'Escape' && isDrawerOpen) closeDrawer(); }); }); window.mobileMenu = { open: openDrawer, close: closeDrawer, isOpen: () => isDrawerOpen }; })();