hjsilicon/js/header.js

const headerLangData = {
    zh: {
        nav: {
            home: "首页",
            business: "主营业务",
            products: "产品案例",
            support: "技术支持",
            future: "展望未来",
            about: "关于我们"
        },
        btn: "English",
        logo: "../imgs/svg/logo.svg"
    },
    en: {
        nav: {
            home: "Home",
            business: "Business",
            products: "Products",
            support: "Support",
            future: "Future",
            about: "About Us"
        },
        btn: "简体中文",
        logo: "../imgs/svg/logo_en.svg"
    }
};

// 语言显示更新函数
function updateHeaderLanguageDisplay(lang) {
    const currentFlag = document.getElementById('current-flag');
    const currentLangText = document.getElementById('current-lang');
    
    if (currentFlag && currentLangText) {
        // 检查图片路径是否需要调整
        const isRootPage = window.location.pathname.includes('index.html') || 
                           window.location.pathname.endsWith('/');
        const imgPathPrefix = isRootPage ? './imgs/flags/' : '../imgs/flags/';
        
        if (lang === 'en') {
            currentFlag.src = `${imgPathPrefix}en.svg`;
            currentLangText.textContent = 'English';
        } else {
            currentFlag.src = `${imgPathPrefix}zh.svg`;
            currentLangText.textContent = '简体中文';
        }
    }
}

function setHeaderLang(lang) {
    const data = headerLangData[lang];
    
    // 导航文本
    const navHome = document.getElementById("nav-home");
    if (navHome) navHome.textContent = data.nav.home;
    
    const navBusiness = document.getElementById("nav-business");
    if (navBusiness) navBusiness.textContent = data.nav.business;
    
    const navProducts = document.getElementById("nav-products");
    if (navProducts) navProducts.textContent = data.nav.products;
    
    const navSupport = document.getElementById("nav-support");
    if (navSupport) navSupport.textContent = data.nav.support;
    
    const navFuture = document.getElementById("nav-future");
    if (navFuture) navFuture.textContent = data.nav.future;
    
    const navAbout = document.getElementById("nav-about");
    if (navAbout) navAbout.textContent = data.nav.about;
    
    // logo
    // const logoImg = document.getElementById("logo-img");
    // if (logoImg) logoImg.src = data.logo;
    
    // 更新语言显示
    updateHeaderLanguageDisplay(lang);
}

// 处理语言切换
function handleHeaderLangToggle(lang) {
    window.currentLang = lang;
    localStorage.setItem('siteLang', lang);
    setHeaderLang(lang);
    
    // 如果有页面特定的语言处理函数，也调用它
    if (typeof applyLang === 'function') {
        applyLang(lang);
    }
    
    // 如果在aboutUs页面，还需要更新地图信息
    if (typeof updateMapInfo === 'function') {
        updateMapInfo(lang);
    }
}

document.addEventListener('DOMContentLoaded', () => {
    let currentLang = localStorage.getItem('siteLang') || "zh";
    
    // 初始化语言
    setHeaderLang(currentLang);
    
    // 获取语言切换相关的DOM元素
    const langBtn = document.getElementById('lang-btn');
    const langDropdown = document.getElementById('lang-dropdown');
    const langItems = document.querySelectorAll('.lang-item');
    
    if (langBtn) {
        // 切换下拉菜单显示/隐藏
        langBtn.addEventListener('click', function(e) {
            e.stopPropagation(); // 阻止事件冒泡
            langDropdown.classList.toggle('show');
            const arrow = langBtn.querySelector('.arrow');
            if (arrow) {
                arrow.style.transform = langDropdown.classList.contains('show') ? 'rotate(180deg)' : 'rotate(0)';
            }
        });
        
        // 点击其他区域关闭下拉菜单
        document.addEventListener('click', function(event) {
            if (!event.target.closest('.lang-dropdown') && langDropdown) {
                langDropdown.classList.remove('show');
                const arrow = langBtn.querySelector('.arrow');
                if (arrow) {
                    arrow.style.transform = 'rotate(0)';
                }
            }
        });
        
        // 语言选择事件
        langItems.forEach(item => {
            item.addEventListener('click', function() {
                const lang = this.getAttribute('data-lang');
                if (lang !== currentLang) {
                    currentLang = lang;
                    handleHeaderLangToggle(lang);
                }
                langDropdown.classList.remove('show');
                const arrow = langBtn.querySelector('.arrow');
                if (arrow) {
                    arrow.style.transform = 'rotate(0)';
                }
            });
        });
    } else {
        // 兼容旧版切换按钮
        const langToggle = document.getElementById("lang-toggle");
        if (langToggle) {
            langToggle.addEventListener("click", () => {
                currentLang = currentLang === "zh" ? "en" : "zh";
                handleHeaderLangToggle(currentLang);
            });
            langToggle.addEventListener("keydown", e => {
                if (e.key === "Enter" || e.key === " ") {
                    currentLang = currentLang === "zh" ? "en" : "zh";
                    handleHeaderLangToggle(currentLang);
                }
            });
        }
    }
});