initial commit from original sev version

internal/web/static/js/app.js

@@ -0,0 +1,91 @@
+(() => {
+  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();
+})();

internal/web/static/js/theme.js

@@ -0,0 +1,23 @@
+(function () {
+  function currentSystemTheme() {
+    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'tokyo' : 'light';
+  }
+
+  var btn = document.getElementById('theme-toggle');
+  if (btn) {
+    btn.addEventListener('click', function () {
+      var current = document.documentElement.getAttribute('data-theme') || 'light';
+      var next = current === 'light' ? 'tokyo' : 'light';
+      document.documentElement.setAttribute('data-theme', next);
+      localStorage.setItem('poc-theme', next);
+      window.dispatchEvent(new Event('theme-change'));
+    });
+  }
+
+  window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', function () {
+    if (!localStorage.getItem('poc-theme')) {
+      document.documentElement.setAttribute('data-theme', currentSystemTheme());
+      window.dispatchEvent(new Event('theme-change'));
+    }
+  });
+})();