added next and prev day
This commit is contained in:
parent
d3e68fda22
commit
1ace5dc60b
@ -150,6 +150,11 @@ tbody tr:hover {
|
|||||||
background: rgba(74, 222, 128, 0.1);
|
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 {
|
tbody tr:last-child td {
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
}
|
}
|
||||||
@ -245,6 +250,9 @@ tbody tr:last-child td {
|
|||||||
<div class="filters">
|
<div class="filters">
|
||||||
<input id="search" type="text" placeholder="Hledat přenos..." />
|
<input id="search" type="text" placeholder="Hledat přenos..." />
|
||||||
<input id="datePicker" type="date" />
|
<input id="datePicker" type="date" />
|
||||||
|
<button id="prevDayBtn">Den −</button>
|
||||||
|
<button id="todayBtn">Dnes</button>
|
||||||
|
<button id="nextDayBtn">Den +</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="sport-buttons" id="sportButtons"></div>
|
<div class="sport-buttons" id="sportButtons"></div>
|
||||||
@ -259,6 +267,8 @@ const loadingEl = document.getElementById('loading');
|
|||||||
const searchEl = document.getElementById('search');
|
const searchEl = document.getElementById('search');
|
||||||
const sportButtonsEl = document.getElementById('sportButtons');
|
const sportButtonsEl = document.getElementById('sportButtons');
|
||||||
const datePicker = document.getElementById('datePicker');
|
const datePicker = document.getElementById('datePicker');
|
||||||
|
const prevDayBtn = document.getElementById('prevDayBtn');
|
||||||
|
const nextDayBtn = document.getElementById('nextDayBtn');
|
||||||
let all = [];
|
let all = [];
|
||||||
let selectedSport = 'Basketbal';
|
let selectedSport = 'Basketbal';
|
||||||
|
|
||||||
@ -271,6 +281,16 @@ function getLocalDateString() {
|
|||||||
return `${year}-${month}-${day}`;
|
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 ===
|
// === inicializace ===
|
||||||
const today = getLocalDateString();
|
const today = getLocalDateString();
|
||||||
datePicker.value = today;
|
datePicker.value = today;
|
||||||
@ -282,6 +302,30 @@ datePicker.addEventListener('change', () => {
|
|||||||
if (dateStr) fetchForDate(dateStr);
|
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 ===
|
// === debounce funkce ===
|
||||||
function debounce(func, wait) {
|
function debounce(func, wait) {
|
||||||
let timeout;
|
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 ===
|
// === ikona pro sport ===
|
||||||
function getSportIcon(sport) {
|
function getSportIcon(sport) {
|
||||||
const icons = {
|
const icons = {
|
||||||
@ -414,6 +478,17 @@ function renderList(items) {
|
|||||||
return;
|
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 = `
|
let tableHTML = `
|
||||||
<div class="table-container">
|
<div class="table-container">
|
||||||
<table>
|
<table>
|
||||||
@ -428,14 +503,16 @@ function renderList(items) {
|
|||||||
<tbody>
|
<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 dateTimeStr = formatDateTime(t.date, t.time);
|
||||||
const league = t.league || '';
|
const league = t.league || '';
|
||||||
const leaguePart = t.leaguePart || '';
|
const leaguePart = t.leaguePart || '';
|
||||||
const fullLeague = `${league} ${leaguePart}`.trim();
|
const fullLeague = `${league} ${leaguePart}`.trim();
|
||||||
|
const rowClass = i === closestIndex ? ' class="closest-time"' : '';
|
||||||
|
|
||||||
tableHTML += `
|
tableHTML += `
|
||||||
<tr>
|
<tr${rowClass}>
|
||||||
<td class="time-cell">${dateTimeStr}</td>
|
<td class="time-cell">${dateTimeStr}</td>
|
||||||
<td class="title-cell"><a href="${t.link}" target="_blank">${t.title}</a></td>
|
<td class="title-cell"><a href="${t.link}" target="_blank">${t.title}</a></td>
|
||||||
<td class="sport-cell">${t.sport || ''}</td>
|
<td class="sport-cell">${t.sport || ''}</td>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user