{% import "includes/macros" as macros %} {% import "includes/forms/log" as log %} {% extends "base" %} {% block content %} <div class="max-w-screen-lg w-full"> <h1 class="h1"> Logbuch {% if loggedin_user and "admin" in loggedin_user.roles %} <select id="yearSelect" onchange="changeYear()" style="background: transparent; background-image: none; text-decoration: underline"></select> {% endif %} </h1> <div class="mt-3"> <div class="search-wrapper"> <label for="name" class="sr-only">Suche</label> <input type="search" name="name" id="filter-js" class="search-bar" placeholder="Suchen nach Bootsname oder Ruderer..."> </div> <div id="filter-result-js" class="search-result"></div> {% for log in logs %}{{ log::show_old(log=log, state="completed", only_ones=false, index=loop.index) }}{% endfor %} </div> </div> <script> function getYearFromURL() { var queryParams = new URLSearchParams(window.location.search); return queryParams.get('year'); } function populateYears() { var select = document.getElementById('yearSelect'); var currentYear = new Date().getFullYear(); var selectedYear = getYearFromURL() || currentYear; for (var year = 2019; year <= currentYear; year++) { var option = document.createElement('option'); option.value = option.textContent = year; if (year == selectedYear) { option.selected = true; } select.appendChild(option); } } function changeYear() { var selectedYear = document.getElementById('yearSelect').value; window.location.href = '?year=' + selectedYear; } // Call this function when the page loads populateYears(); </script> {% endblock content %}