Greg/SportAttendanceSheet
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
static/app.js
View File

@ -15,7 +15,7 @@ function saveData() {
}); });
} }
let matchViewMode = 'fromLast'; // 'fromLast', 'all', 'future' let matchViewMode = 'future'; // 'all' or 'future'
function renderTable() { function renderTable() {
const container = document.getElementById('attendance-table'); const container = document.getElementById('attendance-table');
@ -64,17 +64,8 @@ function renderTable() {
let filteredDates = []; let filteredDates = [];
if (matchViewMode === 'all') { if (matchViewMode === 'all') {
filteredDates = data.dates; filteredDates = data.dates;
} else if (matchViewMode === 'future') {
filteredDates = data.dates.filter(date => parseDate(date) > today);
} else { } else {
// Default: show from last played match and all after filteredDates = data.dates.filter(date => parseDate(date) > today);
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;
});
} }
// Find closest date to today for scroll // Find closest date to today for scroll
let closestIdx = 0; let closestIdx = 0;
@ -189,43 +180,20 @@ document.getElementById('add-date').onclick = function() {
window.onload = () => { window.onload = () => {
fetchData(); fetchData();
// Menu bar event listeners
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
const showAll = document.getElementById('show-all-matches'); const showBtn = document.getElementById('show-matches-btn');
const showFuture = document.getElementById('show-future-matches'); if (showBtn) {
const dropdown = document.querySelector('.menu-bar .dropdown'); showBtn.textContent = 'Show All Matches';
const dropdownContent = document.getElementById('show-menu-dropdown'); showBtn.onclick = () => {
const showMenuBtn = document.getElementById('show-menu-btn'); if (matchViewMode === 'future') {
let menuOpen = false; matchViewMode = 'all';
showBtn.textContent = 'Show Future Matches';
function openMenu() { } else {
dropdownContent.style.opacity = '1'; matchViewMode = 'future';
dropdownContent.style.visibility = 'visible'; showBtn.textContent = 'Show All Matches';
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');
} }
}); 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'); };
}); });
}; };

15
templates/index.html
View File

@ -100,27 +100,16 @@
table { min-width: 400px; } table { min-width: 400px; }
} }
</style> </style>
</style>
</head> </head>
<body> <body>
<div class="header-bar"> <div class="header-bar">
<h1 style="margin: 0;">Padel Nivelles</h1> <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>
<div class="table-container"> <div class="table-container">
<div id="attendance-table"></div> <div id="attendance-table"></div>
</div> </div>
<button id="add-date">Add Date</button> <button id="show-matches-btn">Show</button>
<script src="/static/app.js"></script> <script src="/static/app.js"></script>
</body> </body>
</html> </html>