92 lines
2.9 KiB
JavaScript
92 lines
2.9 KiB
JavaScript
(() => {
|
|
const filterForm = document.getElementById('filter-form');
|
|
const dataStatus = document.getElementById('data-status');
|
|
const jsonData = document.getElementById('json-data');
|
|
const resetFilters = document.getElementById('reset-filters');
|
|
const countdown = document.getElementById('reset-countdown');
|
|
|
|
function setStatus(text) {
|
|
if (dataStatus) dataStatus.textContent = text;
|
|
}
|
|
|
|
function valueOf(form, name) {
|
|
return String(form.get(name) || '').trim();
|
|
}
|
|
|
|
function buildQuery() {
|
|
const form = new FormData(filterForm);
|
|
const params = new URLSearchParams();
|
|
['location', 'abuse_type', 'gender', 'status', 'from', 'to', 'search', 'limit'].forEach((key) => {
|
|
const value = valueOf(form, key);
|
|
if (value) params.set(key, value);
|
|
});
|
|
return params.toString();
|
|
}
|
|
|
|
async function renderData(event) {
|
|
if (event) event.preventDefault();
|
|
if (!filterForm || !jsonData) return;
|
|
|
|
const query = buildQuery();
|
|
const url = query ? `/demo/registrations?${query}` : '/demo/registrations';
|
|
setStatus('Loading data…');
|
|
|
|
try {
|
|
const response = await fetch(url, { headers: { Accept: 'application/json' } });
|
|
if (!response.ok) throw new Error(`HTTP ${response.status}`);
|
|
const rows = await response.json();
|
|
jsonData.textContent = JSON.stringify(rows, null, 2);
|
|
setStatus(`Showing ${rows.length} row${rows.length === 1 ? '' : 's'} from ${url}.`);
|
|
} catch (err) {
|
|
jsonData.textContent = '[]';
|
|
setStatus(`Could not load demo data: ${err.message}`);
|
|
}
|
|
}
|
|
|
|
function renderCountdown() {
|
|
if (!countdown) return;
|
|
const resetAt = new Date(countdown.dataset.resetAt);
|
|
if (Number.isNaN(resetAt.getTime())) return;
|
|
|
|
function tick() {
|
|
const remainingMs = resetAt.getTime() - Date.now();
|
|
if (remainingMs <= 0) {
|
|
countdown.textContent = 'resetting…';
|
|
window.setTimeout(() => window.location.reload(), 1200);
|
|
return;
|
|
}
|
|
const seconds = Math.floor(remainingMs / 1000);
|
|
const minutes = Math.floor(seconds / 60);
|
|
const rest = seconds % 60;
|
|
countdown.textContent = `${minutes}m ${String(rest).padStart(2, '0')}s`;
|
|
window.setTimeout(tick, 1000);
|
|
}
|
|
|
|
tick();
|
|
}
|
|
|
|
function setupSingleOpenAccordions() {
|
|
document.querySelectorAll('[data-single-open]').forEach((group) => {
|
|
const panels = Array.from(group.querySelectorAll('details'));
|
|
panels.forEach((panel) => {
|
|
panel.addEventListener('toggle', () => {
|
|
if (!panel.open) return;
|
|
panels.forEach((other) => {
|
|
if (other !== panel) other.open = false;
|
|
});
|
|
});
|
|
});
|
|
});
|
|
}
|
|
|
|
if (filterForm) filterForm.addEventListener('submit', renderData);
|
|
if (resetFilters) resetFilters.addEventListener('click', () => {
|
|
filterForm.reset();
|
|
renderData();
|
|
});
|
|
|
|
setupSingleOpenAccordions();
|
|
renderCountdown();
|
|
renderData();
|
|
})();
|