<!DOCTYPE html>
<html
        xmlns:th="http://www.thymeleaf.org" xmlns="http://www.w3.org/1999/html"
        xmlns:sec="http://www.thymeleaf.org/extras/spring-security">
<th:block th:fragment="header">
    <div id="header">

        <!-- Logo -->
        <h1><a th:href="@{/}" id="logo">BUM ' <em>sPace</em></a></h1>
        <th:block sec:authorize="isAuthenticated()">
            <span style="margin-left:20px;">환영합니다, <b sec:authentication="name"></b>님!</span>
        </th:block>
        <!-- Nav -->
        <nav id="nav">
            <ul>
                <li id="menu_home" ><a th:href="@{/}">Home</a></li>
                <li id="menu_posts"><a  href="blog/posts">Posts</a></li>
                <li id="menu_stock">
                    <a href="#">Stock</a>
                    <ul>
                        <li sec:authorize="isAuthenticated()"><a href="/stock/config">API 설정</a></li>
                        <li sec:authorize="isAuthenticated()"><a href="/stock/dashboard">내 잔고/거래</a></li>
                        <li><a href="/stock/market">시장 지표</a></li>
                    </ul>
                </li>
                <li id="menu_bookmarks"><a href="/bookmarks">Bookmarks</a></li>
                <li id="menu_drop">
                    <a  href="#">Game</a>
                    <ul>
                        <li id="menu_nonogram"><a  href="puzzle/play">Nonogram</a></li>
                        <li id="menu_2048"><a  href="puzzle/2048">2048</a></li>
                        <li id="menu_sudoku"><a  href="puzzle/sudoku">sudoku</a></li>
                        <li id="menu_spider"><a  href="puzzle/spider">spider</a></li>
                    </ul>
                </li>
                <li id="menu_drop">
                    <a  href="#">About</a>
                    <ul>
                        <li><a href="javascript:gotoWhere()">bums's where</a></li>
                        <li><a href="javascript:gotoBUMSpace()">BUM'sPase</a></li>
                        <li>
                            <a href="#">Submenu</a>
                            <ul>
                                <th:block sec:authorize="isAuthenticated()">
                                    <li><a href="javascript:gotoWrite()">글쓰기</a></li>
                                    <li><a href="javascript:gotoModify()">수정하기</a></li>
                                    <li><a href="javascript:gotoPuzzleUpload()">네모로직 문제 생성</a></li>
                                    <li><a href="javascript:gotoSudoKuGen()">스도쿠 문제 생성</a></li>
                                </th:block>
                                <li><a href="#">Phasellus magna</a></li>
                                <!--                                <li><a href="#">Magna phasellus</a></li>-->
                                <!--                                <li><a href="#">Etiam nisl</a></li>-->
                                <!--                                <li><a href="#">Veroeros feugiat</a></li>-->
                            </ul>
                        </li>

                    </ul>
                </li>
                <li sec:authorize="isAuthenticated()">
                    <a href="/user/info" th:text="${#authentication.principal.username}">사용자ID</a>
                    <a href="/messages" id="message-icon" style="display: none; color: #FFA500; margin-left: 5px;" title="새 쪽지">
                        쪽지함<i class="icon solid fa-envelope"></i>
                    </a>
                </li>
                <th:block sec:authorize="!isAuthenticated()">
                    <li id="menu_login">
                        <a class="open-login-popup" to="#loginPopup">Login</a>
                    </li>
                </th:block>
                <th:block sec:authorize="isAuthenticated()">
                    <li>
                        <a href="javascript:logout()" style="margin-left:10px;">Logout</a>
                    <li>
                </th:block>
                <li><a th:href="@{/licenses}">Licenses</a></li>
            </ul>
        </nav>

    </div>
</th:block>
</html>