96 lines
2.7 KiB
JavaScript
96 lines
2.7 KiB
JavaScript
(() => {
|
|
const REFRESH_INTERVAL = 5000;
|
|
const root = document.querySelector('[data-board-root]');
|
|
const statusEl = document.querySelector('[data-refresh-status]');
|
|
const errorEl = document.querySelector('[data-refresh-error]');
|
|
const clockEl = document.querySelector('[data-board-clock]');
|
|
|
|
if (!root) {
|
|
return;
|
|
}
|
|
|
|
const formatTime = (date) =>
|
|
date.toLocaleTimeString([], {
|
|
hour: 'numeric',
|
|
minute: '2-digit',
|
|
second: '2-digit',
|
|
});
|
|
|
|
const setError = (message) => {
|
|
if (!errorEl) return;
|
|
if (message) {
|
|
errorEl.textContent = message;
|
|
errorEl.setAttribute('aria-hidden', 'false');
|
|
} else {
|
|
errorEl.textContent = '';
|
|
errorEl.setAttribute('aria-hidden', 'true');
|
|
}
|
|
};
|
|
|
|
const updateStatus = (timestamp) => {
|
|
if (!statusEl) return;
|
|
if (timestamp) {
|
|
const parsed = new Date(timestamp);
|
|
if (!Number.isNaN(parsed.getTime())) {
|
|
statusEl.textContent = formatTime(parsed);
|
|
return;
|
|
}
|
|
}
|
|
statusEl.textContent = formatTime(new Date());
|
|
};
|
|
|
|
const updateClock = () => {
|
|
if (!clockEl) return;
|
|
clockEl.textContent = new Date().toLocaleString([], {
|
|
month: 'short',
|
|
day: 'numeric',
|
|
year: 'numeric',
|
|
hour: 'numeric',
|
|
minute: '2-digit',
|
|
second: '2-digit',
|
|
});
|
|
};
|
|
|
|
const refresh = async () => {
|
|
try {
|
|
const response = await fetch('data/main.php', {
|
|
cache: 'no-store',
|
|
headers: { 'X-Requested-With': 'XMLHttpRequest' },
|
|
});
|
|
|
|
if (!response.ok) {
|
|
throw new Error(`Request failed: ${response.status}`);
|
|
}
|
|
|
|
const html = await response.text();
|
|
root.innerHTML = html;
|
|
|
|
const generatedAt = root.querySelector('[data-generated-at]');
|
|
if (generatedAt) {
|
|
updateStatus(generatedAt.getAttribute('data-generated-at'));
|
|
} else {
|
|
updateStatus();
|
|
}
|
|
|
|
setError('');
|
|
root.removeAttribute('data-refresh-error');
|
|
} catch (error) {
|
|
console.error('Failed to refresh overview data', error);
|
|
setError('Connection lost — retrying');
|
|
root.setAttribute('data-refresh-error', 'true');
|
|
}
|
|
};
|
|
|
|
refresh();
|
|
updateClock();
|
|
|
|
setInterval(refresh, REFRESH_INTERVAL);
|
|
setInterval(updateClock, 1000);
|
|
|
|
document.addEventListener('visibilitychange', () => {
|
|
if (!document.hidden) {
|
|
refresh();
|
|
}
|
|
});
|
|
})();
|