<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.w3.org/1999/xhtml">
<body>
<div th:fragment="main-navigation(activeSection)" class="navigation-container">
    <div class="navbar">
        <span><img class="logo" th:src="@{/img/logo.svg}" alt="reitti logo" title="reitti" src="/img/logo.svg"></span>
        <a id="nav-timeline" sec:authorize="hasAnyRole('ROLE_ADMIN', 'ROLE_USER', 'ROLE_MAGIC_LINK_FULL_ACCESS')" th:classappend="${activeSection == 'index'} ? 'active' : ''" href="/" class="nav-link" th:title="#{nav.timeline}"><i class="lni lni-route-1"></i></a>
        <a id="nav-memories" sec:authorize="hasAnyRole('ROLE_ADMIN', 'ROLE_USER')" href="/memories" class="nav-link" th:classappend="${activeSection == 'memories'} ? 'active' : ''"th:title="#{nav.memories}"><i class="lni lni-agenda"></i></a>
        <a id="nav-statistics" sec:authorize="hasAnyRole('ROLE_ADMIN', 'ROLE_USER')" href="/statistics" class="nav-link" th:classappend="${activeSection == 'statistics'} ? 'active' : ''" th:title="#{nav.statistics}"><i class="lni lni-bar-chart-4"></i></a>
        <a id="nav-settings" sec:authorize="hasAnyRole('ROLE_ADMIN', 'ROLE_USER')" href="/settings" class="nav-link" th:classappend="${activeSection == 'settings'} ? 'active' : ''" th:title="#{nav.settings.tooltip}"><i class="lni lni-gear-1"></i></a>
        <a sec:authorize="hasAnyRole('ROLE_ADMIN', 'ROLE_USER', 'ROLE_MAGIC_LINK_FULL_ACCESS')" th:if="${activeSection == 'index'}" type="button" class="nav-link" id="auto-update-btn" onclick="toggleAutoUpdate()" th:title="#{map.auto-update.enable.title}" title="Auto Update"><i class="lni lni-play"></i></a>
        <a sec:authorize="hasAnyRole('ROLE_ADMIN', 'ROLE_USER', 'ROLE_MAGIC_LINK_FULL_ACCESS')" th:if="${activeSection == 'index'}" type="button" class="nav-link" onclick="toggleFullscreen()" th:title="#{map.fullscreen.toggle.title}" title="Toggle Fullscreen"><i class="lni lni-arrow-all-direction"></i></a>
        <form th:action="@{/logout}" method="post">
            <button type="submit" class="nav-link" th:title="#{nav.logout.tooltip}"><i
                    class="lni lni-exit"></i>
            </button>
        </form>
    </div>
</div>
</body>
</html>
