webs/hanJing/js/ourProducts.js

document.addEventListener('DOMContentLoaded', function() {
    // 获取URL参数中的产品ID
    const urlParams = new URLSearchParams(window.location.search);
    const productId = urlParams.get('product');

    // 显示产品的函数
    function showProduct(productId, shouldScroll = false) { // 默认不滚动
        console.log('Showing product:', productId);

        // 移除所有产品项的active类
        const productItems = document.querySelectorAll('.product-item');
        productItems.forEach(p => {
            p.classList.remove('active');
        });
        
        // 找到对应的产品项并添加active类
        const targetItem = document.querySelector(`[data-product="${productId}"]`);
        if (targetItem) {
            targetItem.classList.add('active');
            
            // 确保产品所在的分类是展开的
            const category = targetItem.closest('.category-content');
            if (category) {
                // 先移除所有分类的show类
                document.querySelectorAll('.category-content').forEach(c => {
                    c.classList.remove('show');
                });
                document.querySelectorAll('.category-header').forEach(h => {
                    h.classList.remove('active');
                });

                // 展开当前分类
                category.classList.add('show');
                const categoryHeader = category.previousElementSibling;
                if (categoryHeader) {
                    categoryHeader.classList.add('active');
                }
            }

            // 隐藏所有详情内容
            document.querySelectorAll('.detail-content').forEach(content => {
                if (content) {
                    content.style.display = 'none';
                }
            });
            
            // 显示目标产品详情
            const targetContent = document.getElementById(productId);
            if (targetContent) {
                targetContent.style.display = 'block';
            }

            // 只在指定需要滚动时才滚动
            if (shouldScroll) {
                setTimeout(() => {
                    targetItem.scrollIntoView({ behavior: 'smooth', block: 'center' });
                }, 100);
            }
        }
    }

    // 初始化：根据URL参数决定行为
    if (productId) {
        // 如果有产品ID参数，则显示对应产品并滚动
        showProduct(productId, true); // 有参数时滚动
    } else {
        // 没有参数时，显示第一个产品但不滚动
        const firstProduct = document.querySelector('.product-item');
        if (firstProduct) {
            showProduct(firstProduct.dataset.product, false); // 无参数时不滚动
        }
    }

    // 产品项点击处理
    const productItems = document.querySelectorAll('.product-item');
    productItems.forEach(item => {
        item.addEventListener('click', function() {
            const productId = this.dataset.product;
            // 点击产品项时需要滚动
            showProduct(productId, true);
            updateURL(productId);
        });
    });

    // 更新URL函数
    function updateURL(productId) {
        const newURL = new URL(window.location.href);
        newURL.searchParams.set('product', productId);
        window.history.pushState({ productId }, '', newURL);
    }

    // 处理浏览器后退/前进
    window.addEventListener('popstate', function(event) {
        if (event.state && event.state.productId) {
            showProduct(event.state.productId, true);
        }
    });


    // ----------------------


    const langData = {
        zh: {
           
            btn: "English",
            logo: "../imgs/svg/logo.svg",       
   
            title: "深圳汉晶电子信息有限公司",
            topBannerLeftTitle1:"成功的工艺",
            topBannerLeftTitle2:"与产品案例",
            topBannerBthSpan:"联系我们",
            product_item_titleY100:"Y100 服务器芯片",
            product_item_titleS6PRO:"S6PRO 运算加速芯片",
            product_item_titleFX100:"FX100 MCU芯片",
            product_item_titleGSEC8:"GSEC8 安全加密芯片",
            product_item_titleS1PRO:"S1PRO 运算加速芯片",
            product_item_titleVV10:"VV10 信息安全芯片",
            OtherProducts:"其他产品",
            detail_info_textY1001:"解决方案：我们通过对客户需求的深度研究，设计了一款集成了高速计算、信号处理单元和数据传输功能的芯片。",
            detail_info_textY1002:"技术亮点：采用了定制化的22nm工艺，低功耗设计。",
            detail_info_textS6PRO1:"解决方案：在S1PRO芯片的架构基础上进一步优化细节，缩减逻辑资源，节省面积。",
            detail_info_textS6PRO2:"技术亮点：使用了定制化的12nm工艺，集成了多个核心模块，并通过自研AI算法加速模块，提升了AI运算能力。",
            detail_info_textS1PRO1:"解决方案：我们根据客户的需求设计了一个集成soc和特定加速模块的系统级芯片。通过先进的架构和特定的低功耗设计，确保芯片在性能和功耗上的平衡。",
            detail_info_textS1PRO2:"技术亮点：使用了定制化的22nm工艺，集成了多个核心模块，并通过自研AI算法加速模块，提升了AI运算能力。",
            detail_info_textVV101:"解决方案：我们根据客户的需求设计了一个由CPU核心处理器连接外部存储并通过私有总线扩展外设接口，内部包含两个RAM，具备ITCM和DTCM用于指令和数据存储。",
            detail_info_textVV102:"技术亮点：EAI协处理器接口和AES算法核支持高效加解密运算，RSA算法核由控制、模乘和寄存器堆组成，实现高效RSA算法运算。",
            detail_info_textFX1001:"解决方案：我们根据客户的需求设计了一个由两个Master和三个Slave组成，其中，两个Master分别是CPU内核和DMA控制器，三个Slave为内部SRAM，NVM和外设。",
            detail_info_textFX1002:"技术亮点：FX100采用超低功耗休眠模式（μA级别），使得搭载该芯片的医疗器械在外部断电时依然可以通过内置电池继续工作。",
            detail_info_textGSEC81:"解决方案：集成 RSA/ECC 加速器，支持安全启动与防物理攻击。",
            detail_info_textGSEC82:"技术亮点：支持国密算法，具备 CC EAL5+ 认证与 TRNG。",
            emailLeftTitle:"我们准备好了",
            emailLeftText:"如果您有更多的需求，请联系我们",
        },
        en: {
           
            btn: "简体中文",
            logo: "../imgs/svg/logo_en.svg",
    
            title: "SZHJ Electronic Information Co., Ltd",
            topBannerLeftTitle1:"Successful Processes",
            topBannerLeftTitle2:"With product examples",
            topBannerBthSpan:"Contact Us",
            product_item_titleY100:"Y100 Server Chips",
            product_item_titleS6PRO:"S6PRO computing accelerator chip",
            product_item_titleFX100:"FX100 MCU chip",
            product_item_titleGSEC8:"GSEC8 Secure encryption chip",
            product_item_titleS1PRO:"S1PRO computing accelerator chip",
            product_item_titleVV10:"VV10 Information Security Chip",
            OtherProducts:"Other Products",
            detail_info_textY1001:"Solution: We designed a chip that integrates high-speed computing, signal processing unit and data transmission functions through an in-depth study of customer requirements.",
            detail_info_textY1002:"Technology highlights: Customized 22nm process with low power design.",
            detail_info_textS6PRO1:"Solution: Further optimize the details based on the architecture of the S1PRO chip, reduce logic resources and save area.",
            detail_info_textS6PRO2:"Technical highlights: it uses a customized 12nm process, integrates multiple core modules, and improves AI computing power with a self-developed AI algorithm acceleration module.",
            detail_info_textS1PRO1:"Solution: We designed a system-on-chip with integrated soc and specific acceleration modules according to the customer's requirements. The advanced architecture and specific low-power design ensure that the chip is balanced in terms of performance and power consumption.",
            detail_info_textS1PRO2:"Technical highlights: it uses a customized 22nm process, integrates multiple core modules, and improves AI computing power with a self-developed AI algorithm acceleration module.",
            detail_info_textVV101:"Solution: According to the customer's requirements, we designed a CPU core processor to connect to external storage and extend the peripheral interface through a private bus, which contains two internal RAMs with ITCM and DTCM for instruction and data storage.",
            detail_info_textVV102:"Technology highlights: EAI coprocessor interface and AES algorithm core support efficient encryption and decryption operations, RSA algorithm core consists of control, modulo multiplication and register stacks to realize efficient RSA algorithm operations.",
            detail_info_textFX1001:"Solution: According to the customer's requirements, we designed a system consisting of two Masters and three Slaves, where the two Masters are the CPU core and the DMA controller, and the three Slaves are the internal SRAM, NVM and peripherals.",
            detail_info_textFX1002:"Technical highlights: The FX100 utilizes an ultra-low power sleep mode (μA level), which allows medical devices equipped with the chip to continue to operate with the built-in battery even when external power is lost.",
            detail_info_textGSEC81:"Solution: Integrated RSA/ECC gas pedal supports secure boot and physical attack prevention.",
            detail_info_textGSEC82:"Technical Highlights: Supports state secret algorithms with CC EAL5+ certification and TRNG.",
            emailLeftTitle:"We're ready.",
            emailLeftText:"If you have more needs, please contact us!",

          

        }
    };



    let currentLang = localStorage.getItem('siteLang') || "zh";

    function applyLang(lang) {
        const data = langData[lang];
    
     
    

        // logo
        document.getElementById("footerLogo").src = data.logo;
    

    
        // 页面内容
        document.getElementById("title").textContent = data.title;
        document.getElementById("topBannerLeftTitle1").textContent = data.topBannerLeftTitle1;
        document.getElementById("topBannerLeftTitle2").textContent = data.topBannerLeftTitle2;
        document.querySelector(".topBannerBthSpan").textContent = data.topBannerBthSpan;

        document.querySelectorAll('.product_item_titleY100').forEach(el => {
            el.textContent = data.product_item_titleY100;
        });
        document.querySelectorAll('.product_item_titleS6PRO').forEach(el => {
            el.textContent = data.product_item_titleS6PRO;
        });
        document.querySelectorAll('.product_item_titleFX100').forEach(el => {
            el.textContent = data.product_item_titleFX100;
        });
        document.querySelectorAll('.product_item_titleGSEC8').forEach(el => {
            el.textContent = data.product_item_titleGSEC8;
        });
        document.querySelectorAll('.product_item_titleS1PRO').forEach(el => {
            el.textContent = data.product_item_titleS1PRO;
        }); 
        document.querySelectorAll('.product_item_titleVV10').forEach(el => {
            el.textContent = data.product_item_titleVV10;
        });  


        document.querySelector(".OtherProducts").textContent = data.OtherProducts;
        document.querySelector(".detail_info_textY1001").textContent = data.detail_info_textY1001;
        document.querySelector(".detail_info_textY1002").textContent = data.detail_info_textY1002;
        document.querySelector(".detail_info_textS6PRO1").textContent = data.detail_info_textS6PRO1;
        document.querySelector(".detail_info_textS6PRO2").textContent = data.detail_info_textS6PRO2;
        document.querySelector(".detail_info_textS1PRO1").textContent = data.detail_info_textS1PRO1;
        document.querySelector(".detail_info_textS1PRO2").textContent = data.detail_info_textS1PRO2;
        document.querySelector(".detail_info_textVV101").textContent = data.detail_info_textVV101;
        document.querySelector(".detail_info_textVV102").textContent = data.detail_info_textVV102;
        document.querySelector(".detail_info_textFX1001").textContent = data.detail_info_textFX1001;
        document.querySelector(".detail_info_textFX1002").textContent = data.detail_info_textFX1002;
        document.querySelector(".detail_info_textGSEC81").textContent = data.detail_info_textGSEC81;
        document.querySelector(".detail_info_textGSEC82").textContent = data.detail_info_textGSEC82;
        document.querySelector(".emailLeftTitle").textContent = data.emailLeftTitle;
        document.querySelector(".emailLeftText").textContent = data.emailLeftText;
        document.querySelector('.footerBoxRightTitle').textContent = data.title;

          // 切换样式
            if (lang === 'en') {
                document.getElementById('topBannerLeftTitle1').classList.add('en');
                document.getElementById('topBannerLeftTitle2').classList.add('en');
            } else {
                document.getElementById('topBannerLeftTitle1').classList.remove('en');
                document.getElementById('topBannerLeftTitle2').classList.remove('en');
            }

       
    
    }
    
    function handleLangToggle() {
        currentLang = currentLang === "zh" ? "en" : "zh";
        localStorage.setItem('siteLang', currentLang);
        applyLang(currentLang);
    }
        // 初始化
    applyLang(currentLang);
    
    
       // 事件绑定
       document.getElementById("lang-toggle").addEventListener("click", handleLangToggle);
       document.getElementById("lang-toggle").addEventListener("keydown", e => {
           if (e.key === "Enter" || e.key === " ") handleLangToggle();
       });












});