<%@ page language="java" pageEncoding="UTF-8" %>
<ul class="subMenu">
    <li><a href="/main/main.do" class="home">홈</a></li>
    <li>
        <div class="dropdown">
            <button id="Btn1" class="dropbtn" onclick="subMenuToggle()"></button>
            <div id="Dropdown1" class="dropdown-content">
                <a href="/traffic/realtime.do">교통정보</a>
                <a href="https://bus.andong.go.kr" target="_blank" rel="noopener noreferrer">버스정보</a>
                <a href="/parking/parking.do">주차정보</a>
                <a href="/trafficStats/trafficStats.do">교통통계</a>
                <a href="/notice/noticeList.do">공지사항</a>
                <a href="/intro/center.do">센터소개</a>
                <a href="/relate/relateSite.do">교통관련사이트</a>
                <a href="/relate/siteMap.do">사이트맵</a>
            </div>
        </div>
    </li>
</ul>
<script>
    const subTitle = '${subTitle}';
    let isUserSubMenu = false;
    let subMainTitle = '';
    let subSubTitleList = '';
    switch (subTitle) {
        case '센터소개':
        case '찾아오시는길':
            isUserSubMenu = true;
            subMainTitle = '센터소개';
            subSubTitleList =
                `<a href="/intro/center.do">센터소개</a>
                <a href="/intro/location.do">찾아오시는길</a>`;
            break;
        case '실시간소통정보':
        case 'VMS':
        case '돌발정보':
            isUserSubMenu = true;
            subMainTitle = '교통정보';
            subSubTitleList =
                `<a href="/traffic/realtime.do">실시간소통정보</a>
                <a href="/traffic/vms.do">VMS</a>
                <a href="/traffic/incd.do">돌발정보</a>`;
            break;
        case '교통량통계':
        case '소통통계':
            isUserSubMenu = true;
            subMainTitle = '교통통계';
            subSubTitleList =
                `<a href="/trafficStats/info.do">소통통계</a>
                <a href="/trafficStats/trafficStats.do">교통량통계</a>`;
            break;
        case '공지사항':
        case '교통관련사이트' :
        case '사이트맵':
        case '주차정보':
            subMainTitle = subTitle;
            break;
    }

    $('#Btn1').text(subMainTitle);
    if (isUserSubMenu === true) {
        const secondMenu =
            $(`<li>
                <div class="dropdown">
                    <button id="Btn2" class="dropbtn" onclick="subCategoryToggle()">\${subTitle}</button>
                    <div id="Dropdown2" class="dropdown-content">
                       \${subSubTitleList}
                    </div>
                </div>
            </li>`);
        $('.subMenu').append(secondMenu);
    }

</script>