var Jour_num = localStorage.getItem("Journals_num");
function  initForAuthorTop(){

    const style = document.createElement('style');
    style.innerHTML = `
    .for_mess>.for_all p:nth-child(3n+2){
        width: auto;
    }
    .for_messall{
        display: grid;
        float: left;
        grid-template-columns: repeat(3, 1fr);
        gap: 0px;
    }
    .for_messall .fr_edit{
       width: calc(100% - 110px);
    }
    .forAuthor .for_mess>.for_all p{
display: flex;
        align-items: flex-start;
       
    }
    .article .for_mnall{
        width: calc(100% - 285px) !important;
    }
    .for_mess>.for_all {
        
        width: calc(100% - 285px);
        padding-top:36px;
    }
    .for_mess>.for_all div>a{
        margin-left: calc((100% - 230px)/2);
    }
    #top_bar{
        position: sticky;
    top: 0;
    background-color: #fff;
    z-index: 999;
    }
  .forAuthor #top_bar .top .top_logo .home_logo img{
    position: absolute;
    top: 20px;
   }
   
    .mb_aform{
        display:none;
    }
    .pos_ter{
        padding:10px;
    }
    .pos_ter>div:nth-child(1) {
        width: 25%;
    }
    .htmlImageNote blue{
        color :#0082AA !important;
    }
    .wenzhang .wen_jian h4 i{
           
        font-weight: 500;
        font-weight: bold;
    
    
    }
    .v4-art-top #st-2 .st-btn > img{
            
        width:16px !important;
        height: 16px  !important;
    }
    .pos_ter>a {
    width: 23%;
    }
    .pos_ter>div:nth-child(3) {
    width: 23%;
    }
    .pos_ter>a {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .pos_ter>a>img {
        min-width: 260px;
        margin-top: -10px;
    }
    .pos_ter>div:nth-child(3)>a:nth-child(1){
    margin-left: calc((100% - 160px - 55px - 20px)/2);
    }
    .pos_ter>div:nth-child(1)>div:nth-child(1){
    margin-left: calc((100% - 190px - 65px)/2) !important;
    }
                
    .pos_ter>div:nth-child(4) {
        width: 23%; overflow:hidden;
    
    }
    .pos_ter>div:nth-child(4) img{
        position: relative;
        top: -16px;
    }
    .footer .daohang ul{
        width: 26% !important;
    
    }
    
    `
    
    document.head.appendChild(style);
    var newBox = document.querySelector('.newBox');
    var commonPopupStr = `
    <div id="common-overlay"></div>
    <div id="common-popup">
        <span class="common-close-btn" onclick="closePopup()">×</span>
        <div style="padding: 30px 30px 20px 30px" class="common-popup-box">
            <h2 class="common-popup-title"></h2>
            <div class="common-popup-content">

            </div>
        </div>
    </div>
`;

    // 将弹窗插入到页面中
    newBox.insertAdjacentHTML('beforeend', commonPopupStr);


}
function initArticleNavList() {
    var Journals_color = localStorage.getItem('Journals_color')
    var Journals_usx = localStorage.getItem('Journals_usx')
    $('.nav_ban h1 a').attr('href', '/' + Journals_usx);
    var journalStageID = localStorage.getItem('journalStageID')
    //是否显示地图
    var isShowAuthorship = 0;
    if ([1, 14, 8].includes(Number(Jour_num))) {
        isShowAuthorship = 1
    }
    
    const style = document.createElement('style');
    style.innerHTML = `/* 遮罩层 */
        .article_dropbtn:hover {
            color: ${Journals_color};
            
        }
        .article_dropdown-list a:hover {
           
            border-bottom:2px solid  ${Journals_color};
            font-weight:bold;
            color:#333;
        }
        .toggle-btn{
            color: ${Journals_color};
        }
       `;
    document.head.appendChild(style);


    // 获取 id 为 top_bar 的元素
    var topBar = document.getElementById("top_bar");

    var otherStr1 = `
      
        <p class=""><a href="/article_list.html?J_num=${Jour_num}&y_id=${journalStageID}" target="_blank">Current Issue</a></p>
       <p class="mes_all_section_other_online"><a href="/article_list.html?J_num=${Jour_num}&o_id=${Jour_num}" target="_blank">Online First</a></p>
        <p><a href="/stages.html?J_num=${Jour_num}" target="_blank">Archiving</a></p>
        <p style="${Jour_num == 1 ? 'display:block' : 'display:none'}"><a href="/guest.html?J_num=${Jour_num}" target="_blank">Special Issues</a></p> 
        
         <p><a href="/article_list.html?J_num=${Jour_num}&top_id=${Jour_num}" target="_blank">Highlights</a></p>
       
        `
    var otherStr2 = `<p><a href="/about_journal.html?J_num=${Jour_num}" target="_blank">Journal Information</a></p>

        <p><a href="/for_author.html?J_num=${Jour_num}" target="_blank">Guide for Authors</a></p>
        <p><a href="javascript:;"  onclick="openAbstracting(${Jour_num},'${Journals_color}')">Abstracting & Indexing</a></p>
      
        
        `
    // Abstracting & Indexing
    var otherStr3 = `
        <p ><a href="/afoor_text.html?footer_id=37" target="_blank">Peer-review process</a></p>
        <p><a href="${localStorage.getItem('submission_url')}" target="_blank">Submission System</a></p>
        <p><a href="/z_f11-1.html?J_num=${Jour_num}" target="_blank">Ethics and Malpractice Statement</a></p>
        <!--地图弹窗-->
        <div class="Authorship" style="position: relative;z-index:10;cursor: pointer;${isShowAuthorship ? 'display:block' : 'display:none'}">

        <p class="Authorship_text"><a href="javascript:;"  onclick="openAuthorship(${Jour_num},'${Journals_color}')">Authorship</a></p>
            
        `
    var str = ` <div class="article_navbar-container" id="article_navbar-container" style="display:block">
    <div style="display: flex
    ;
        align-items: center;margin:0 auto">
                <div class="article_dropdown-menu">
                    <div class="article_dropbtn">Articles & Issues <i class="fa fa-chevron-down" style="font-size: 14px;margin-left: 6px;"></i></div>
                    <div class="article_dropdown-list">
                        ${otherStr1}
                    </div>
                </div>
                <div class="article_dropdown-menu">
                    <div class="article_dropbtn">About Journal <i class="fa fa-chevron-down" style="font-size: 14px;margin-left: 6px;"></i></div>
                    <div class="article_dropdown-list" style="min-width:180px">
                       ${otherStr2}
                    </div>
                </div>
                <div class="article_dropdown-menu">
                    <div class="article_dropbtn">Publish <i class="fa fa-chevron-down" style="font-size: 14px;margin-left: 6px;"></i></div>
                    <div class="article_dropdown-list" style="min-width:250px">
                       ${otherStr3}
                    </div>
                </div>
                </div>
            </div>`



    // 使用 insertAdjacentHTML 在 top_bar 后插入新元素
    if (topBar) {
        topBar.insertAdjacentHTML('afterend', str);

    }
}
function openAbstracting(Jour_num, Journals_color) {
    var list = localStorage.getItem('journalAbs')
    var arr_Abc = JSON.parse(list).filter(e => e.is_show == 1);
    var Abstractingcontent = `<ul style="margin-top:10px;">
            ${arr_Abc.map((item, i) => {
        return `<li  style="font-weight:700;font-size:14px;"><span style="display:inline-block">»&nbsp;</span><a target="_blank" href="${item.url}" style="font-weight:700;display:inline-block">${item.title}</a></li>`;
    }).join('')}
        </ul>`
    document.querySelector('#common-popup .common-popup-content').classList.add('whitebg');
    showPopup(`<span style="font-weight:bold;color:${Journals_color}">Abstracting & Indexing</span>`, Abstractingcontent)


}
function openAuthorship(Jour_num, Journals_color) {
    var Abstractingcontent = `
    <div class="tmr_side_map AuthorshipInfo" style="
            width:300px;margin-top:20px">
                <div id="worldMap" style="width: 100%;height: 140px;margin: 0 auto 10px auto"></div>
                <ul class="map_paiming" style="padding: 0 20px 10px 20px;"></ul>
            </div>
        </div>
    `
    document.querySelector('#common-popup .common-popup-content').classList.add('whitebg');
    showPopup(`<span style="font-weight:bold;color:${Journals_color}">Abstracting & Indexing</span>`, Abstractingcontent, 'Authorship')


}
function showPopup(title, content, type) {
    $('#common-popup .common-popup-title').html(title)
    $('#common-popup .common-popup-content').html(content)

    document.getElementById('common-overlay').style.display = 'block';
    if (type == 'Authorship') {
        document.getElementById('common-popup').style.width = 'auto';
        renderMap(190)
    }

    document.getElementById('common-popup').style.opacity = '1';
    document.getElementById('common-overlay').style.zIndex = '1000';
    document.getElementById('common-popup').style.zIndex = '1001';

    // 5秒后自动关闭
    // setTimeout(closePopup, 5000);
}

function closePopup() {
    document.getElementById('common-popup').style.opacity = '0';
    document.getElementById('common-popup').style.zIndex = '-1';
    setTimeout(function () {
        document.getElementById('common-overlay').style.display = 'none';
        $('#common-popup .common-popup-title').html('')
        $('#common-popup .common-popup-content').html('')
    }, 50);
   
}
function initForAuthor(Jour_num, arr_jour) {

    var apcStr = ``;
    if ([1, 25, 11].includes(Number(Jour_num))) {
        apcStr = arr_jour.apc
    } else {
        apcStr = arr_jour.apc + `<span style="color: ${arr_jour.system_color};font-weight: bold;margin-left:6px;">( 2025–2026 )</span>`;
    }

    $('.for_mess div .fr_APC').html(apcStr);

}
function initForAuthorHtml(Jour_num, arr_jour) {
    $.ajax({
        type: 'post',
        url: apiUrl + 'api/Journal/getForAuthors',
        data: { 'journal_id': Jour_num },
        success: function (result) {
            if (result.code == 0) {
                var arr = result.data.forAuthors;
                var str = "";
                var sgl = "";
                var anchorCount = 1; // 生成唯一锚点ID的计数器

                // 遍历父级+子级，建立锚点关联
                arr.forEach(function(parent) {
                    // 1. 父级导航：href指向锚点ID
                    str += `<li><a href="#anchor-${anchorCount}" class="snf-nav" style="padding:6px 0 6px 27px;"><b>${parent.jfa_title}</b></a></li>`;
                    // 2. 父级内容：添加对应锚点ID
                    sgl += `<div id="anchor-${anchorCount}" class="snf-page">
                                <h3 class="big" style="font-size: 22px;padding-top: 15px;color: rgb(0, 71, 178);">${parent.jfa_title}</h3>
                            </div>`;
                    anchorCount++; // 锚点ID自增，确保唯一

                    // 子级处理（和父级逻辑一致）
                    parent.children.forEach(function(child) {
                        str += `<li><a href="#anchor-${anchorCount}" class="snf-nav" style="padding:6px 0 6px 27px">${child.jfa_title}</a></li>`;
                        sgl += `<div id="anchor-${anchorCount}" class="snf-page">
                                    <h3 style="font-size:16px">${child.jfa_title}</h3>
                                    ${child.content}
                                </div>`;
                        anchorCount++;
                    });
                });

                // 渲染DOM
                $('#for_nag').html(str);
                $('#for_nag li:nth-child(1) a').addClass('active'); // 默认第一个导航高亮
                $('#for_main').html(sgl);

                // 关键：初始化simpleNavFollow（补全锚点关联后，插件能识别跳转和高亮）
               
                setTimeout(() => {
                   
                        simpleNavFollow({
                            leaveTop: 10, 
                            nav: '#for_nag', 
                            navItem: '.snf-nav', 
                            content: '#for_main', 
                            contentItem: '.snf-page', 
                            activeClass: 'active', 
                            smoothScroll: true,
                           
                        });
                   
                }, 300); // 短延时确保DOM渲染完成

            } else {
                ShowDanger(result.msg);
            }
        },
        error: function () {
            ShowDanger("接口请求失败！");
        }
    });
}