Removed top header. Replaced with button at bottom of site. Removed add date functionality

This commit is contained in:
Greg 2025-05-10 18:23:50 +02:00
parent 418c2375e7
commit 3d34fdb5c9
2 changed files with 16 additions and 59 deletions

View File

@ -15,7 +15,7 @@ function saveData() {
});
}
let matchViewMode = 'fromLast'; // 'fromLast', 'all', 'future'
let matchViewMode = 'future'; // 'all' or 'future'
function renderTable() {
const container = document.getElementById('attendance-table');
@ -64,17 +64,8 @@ function renderTable() {
let filteredDates = [];
if (matchViewMode === 'all') {
filteredDates = data.dates;
} else if (matchViewMode === 'future') {
filteredDates = data.dates.filter(date => parseDate(date) > today);
} else {
// Default: show from last played match and all after
const pastDates = data.dates.filter(date => parseDate(date) <= today);
const lastMatch = pastDates.length > 0 ? pastDates.reduce((a, b) => parseDate(a) > parseDate(b) ? a : b) : null;
let found = false;
filteredDates = data.dates.filter(date => {
if (date === lastMatch) found = true;
return found;
});
filteredDates = data.dates.filter(date => parseDate(date) > today);
}
// Find closest date to today for scroll
let closestIdx = 0;
@ -189,43 +180,20 @@ document.getElementById('add-date').onclick = function() {
window.onload = () => {
fetchData();
// Menu bar event listeners
document.addEventListener('DOMContentLoaded', () => {
const showAll = document.getElementById('show-all-matches');
const showFuture = document.getElementById('show-future-matches');
const dropdown = document.querySelector('.menu-bar .dropdown');
const dropdownContent = document.getElementById('show-menu-dropdown');
const showMenuBtn = document.getElementById('show-menu-btn');
let menuOpen = false;
function openMenu() {
dropdownContent.style.opacity = '1';
dropdownContent.style.visibility = 'visible';
dropdownContent.style.pointerEvents = 'auto';
showMenuBtn.setAttribute('aria-expanded', 'true');
menuOpen = true;
}
function closeMenu() {
dropdownContent.style.opacity = '';
dropdownContent.style.visibility = '';
dropdownContent.style.pointerEvents = '';
showMenuBtn.setAttribute('aria-expanded', 'false');
menuOpen = false;
}
if (dropdown && dropdownContent && showMenuBtn) {
showMenuBtn.onclick = (e) => {
e.stopPropagation();
dropdown.classList.toggle('open');
};
// Close menu when clicking elsewhere
document.addEventListener('click', (e) => {
if (!dropdown.contains(e.target)) {
dropdown.classList.remove('open');
const showBtn = document.getElementById('show-matches-btn');
if (showBtn) {
showBtn.textContent = 'Show All Matches';
showBtn.onclick = () => {
if (matchViewMode === 'future') {
matchViewMode = 'all';
showBtn.textContent = 'Show Future Matches';
} else {
matchViewMode = 'future';
showBtn.textContent = 'Show All Matches';
}
});
renderTable();
};
}
if (showAll) showAll.onclick = () => { matchViewMode = 'all'; renderTable(); if (dropdown) dropdown.classList.remove('open'); };
if (showFuture) showFuture.onclick = () => { matchViewMode = 'future'; renderTable(); if (dropdown) dropdown.classList.remove('open'); };
});
};

View File

@ -100,27 +100,16 @@
table { min-width: 400px; }
}
</style>
</style>
</head>
<body>
<div class="header-bar">
<h1 style="margin: 0;">Padel Nivelles</h1>
<nav class="menu-bar">
<ul>
<li class="dropdown">
<span id="show-menu-btn" tabindex="0" aria-haspopup="true" aria-expanded="false">Show ▾</span>
<ul class="dropdown-content" id="show-menu-dropdown">
<li id="show-all-matches">Show all matches</li>
<li id="show-future-matches">Show future matches</li>
</ul>
</li>
</ul>
</nav>
</div>
<div class="table-container">
<div id="attendance-table"></div>
</div>
<button id="add-date">Add Date</button>
<button id="show-matches-btn">Show</button>
<script src="/static/app.js"></script>
</body>
</html>