added next and prev day

This commit is contained in:
kamma 2025-12-06 13:37:41 +01:00
parent d3e68fda22
commit 1ace5dc60b

View File

@ -150,6 +150,11 @@ tbody tr:hover {
background: rgba(74, 222, 128, 0.1);
}
tbody tr.closest-time {
background: rgba(74, 222, 128, 0.25);
border-left: 3px solid #4ade80;
}
tbody tr:last-child td {
border-bottom: none;
}
@ -245,6 +250,9 @@ tbody tr:last-child td {
<div class="filters">
<input id="search" type="text" placeholder="Hledat přenos..." />
<input id="datePicker" type="date" />
<button id="prevDayBtn">Den </button>
<button id="todayBtn">Dnes</button>
<button id="nextDayBtn">Den +</button>
</div>
<div class="sport-buttons" id="sportButtons"></div>
@ -259,6 +267,8 @@ const loadingEl = document.getElementById('loading');
const searchEl = document.getElementById('search');
const sportButtonsEl = document.getElementById('sportButtons');
const datePicker = document.getElementById('datePicker');
const prevDayBtn = document.getElementById('prevDayBtn');
const nextDayBtn = document.getElementById('nextDayBtn');
let all = [];
let selectedSport = 'Basketbal';
@ -271,6 +281,16 @@ function getLocalDateString() {
return `${year}-${month}-${day}`;
}
// === funkce pro posun data ===
function addDaysToDateString(dateStr, days) {
const date = new Date(dateStr + 'T00:00:00');
date.setDate(date.getDate() + days);
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
}
// === inicializace ===
const today = getLocalDateString();
datePicker.value = today;
@ -282,6 +302,30 @@ datePicker.addEventListener('change', () => {
if (dateStr) fetchForDate(dateStr);
});
// === Den- tlačítko ===
prevDayBtn.addEventListener('click', () => {
const currentDate = datePicker.value || getLocalDateString();
const prevDate = addDaysToDateString(currentDate, -1);
datePicker.value = prevDate;
fetchForDate(prevDate);
});
// === Den+ tlačítko ===
nextDayBtn.addEventListener('click', () => {
const currentDate = datePicker.value || getLocalDateString();
const nextDate = addDaysToDateString(currentDate, 1);
datePicker.value = nextDate;
fetchForDate(nextDate);
});
// === Dnes tlačítko ===
const todayBtn = document.getElementById('todayBtn');
todayBtn.addEventListener('click', () => {
const today = getLocalDateString();
datePicker.value = today;
fetchForDate(today);
});
// === debounce funkce ===
function debounce(func, wait) {
let timeout;
@ -389,6 +433,26 @@ function formatDateTime(dateStr, timeStr) {
}
}
// === porovnání času s aktuálním ===
function getMinutesUntilTime(timeStr) {
if (!timeStr) return Infinity;
try {
const now = new Date();
const currentHours = now.getHours();
const currentMinutes = now.getMinutes();
const timeParts = timeStr.split(':');
if (timeParts.length !== 2) return Infinity;
const eventHours = parseInt(timeParts[0], 10);
const eventMinutes = parseInt(timeParts[1], 10);
const currentTotalMinutes = currentHours * 60 + currentMinutes;
const eventTotalMinutes = eventHours * 60 + eventMinutes;
const diff = Math.abs(eventTotalMinutes - currentTotalMinutes);
return diff;
} catch (e) {
return Infinity;
}
}
// === ikona pro sport ===
function getSportIcon(sport) {
const icons = {
@ -414,6 +478,17 @@ function renderList(items) {
return;
}
// Najdi řádek nejblíž aktuálnímu času
let closestIndex = -1;
let closestDiff = Infinity;
for (let i = 0; i < items.length; i++) {
const diff = getMinutesUntilTime(items[i].time);
if (diff < closestDiff) {
closestDiff = diff;
closestIndex = i;
}
}
let tableHTML = `
<div class="table-container">
<table>
@ -428,14 +503,16 @@ function renderList(items) {
<tbody>
`;
for (const t of items) {
for (let i = 0; i < items.length; i++) {
const t = items[i];
const dateTimeStr = formatDateTime(t.date, t.time);
const league = t.league || '';
const leaguePart = t.leaguePart || '';
const fullLeague = `${league} ${leaguePart}`.trim();
const rowClass = i === closestIndex ? ' class="closest-time"' : '';
tableHTML += `
<tr>
<tr${rowClass}>
<td class="time-cell">${dateTimeStr}</td>
<td class="title-cell"><a href="${t.link}" target="_blank">${t.title}</a></td>
<td class="sport-cell">${t.sport || ''}</td>