// 获取按钮和侧边栏元素
const menuButton = document.querySelector('.toggle-menu');
const sidebar = document.getElementById('sidebar');

const menuButtons = document.querySelectorAll('.tag-btn');


// 侧边栏切换功能
menuButton.addEventListener('click', function(event) {
    event.stopPropagation();  // 阻止事件冒泡，避免触发文档点击事件
    toggleSidebar();  // 调用切换侧边栏函数
    toggleRotation();  // 调用旋转按钮函数
});

menuButtons.forEach(button => {
    button.addEventListener('click', function(event) {
        event.stopPropagation();  // 阻止事件冒泡
        toggleSidebar();  // 关闭侧边栏
        toggleRotation();  // 旋转按钮
    });
});

// 侧边栏元素和按钮
function toggleSidebar() {
    if (window.innerWidth <= 768) {  // 小屏幕显示菜单按钮
        sidebar.classList.toggle('open');  // 切换侧边栏的显示/隐藏
        if (sidebar.classList.contains('open')) {
            document.body.classList.add('no-scroll'); // 禁用滚动
        } else {
            document.body.classList.remove('no-scroll'); // 恢复滚动
        }
    } 
}

// 检查侧边栏的状态，更新按钮显示/隐藏
function updateMenuButtonVisibility() {
    if (window.innerWidth <= 768) {  // 小屏幕显示菜单按钮
        menuButton.style.display = 'block';
    } else {  // 大屏幕上不显示菜单按钮，侧边栏始终可见
        menuButton.style.display = 'none';
        if (sidebar.classList.contains('open')) {
            sidebar.classList.add('open');
        }
    }
}

// 监听窗口大小变化，确保菜单按钮的显示和隐藏正确
window.addEventListener('resize', function() {
    updateMenuButtonVisibility();
});

// 初始化时检查菜单按钮的显示状态
updateMenuButtonVisibility();

// 监听点击事件，点击侧边栏外部区域关闭侧边栏
document.addEventListener('click', function(event) {
    const isClickInsideSidebar = sidebar.contains(event.target);
    const isClickInsideButton = menuButton.contains(event.target);

    // 如果点击的地方不在侧边栏和按钮内部，并且侧边栏是打开的，则关闭侧边栏
    if (!isClickInsideSidebar && !isClickInsideButton && sidebar.classList.contains('open')) {
        sidebar.classList.remove('open');  // 关闭侧边栏
        menuButton.classList.remove('rotated');  // 恢复按钮横向
        document.body.classList.remove('no-scroll'); // 允许滚动
    }
});

// 阻止点击侧边栏时关闭侧边栏
sidebar.addEventListener('click', function(event) {
    event.stopPropagation();  // 阻止事件冒泡，防止点击侧边栏时关闭
});

// 动画效果
function animateToolCards() {
    const toolCards = document.querySelectorAll('.tool-card');
    toolCards.forEach((card, index) => {
        card.style.transitionDelay = `${index * 100}ms`; // 按顺序延迟动画
        card.classList.add('animated'); // 添加动画类
    });
}
;

// 禁用双指缩放
document.addEventListener('touchstart', function(e) {
    if (e.touches.length > 1) {  // 如果检测到多于一个手指
        e.preventDefault();  // 阻止默认缩放行为
    }
});

document.addEventListener('touchmove', function(e) {
    if (e.touches.length > 1) {  // 如果检测到多于一个手指
        e.preventDefault();  // 阻止默认缩放行为
    }
});