const STATUS_ENDPOINT = '/health';
const POLL_INTERVAL = 2000;

const statusCard = document.getElementById('statusCard');
const responseCard = document.getElementById('responseCard');
const requestsCard = document.getElementById('requestsCard');
const appStatus = document.getElementById('appStatus');
const responseTime = document.getElementById('responseTime');
const requestCount = document.getElementById('requestCount');
const updateTime = document.getElementById('updateTime');
const pulse = document.querySelector('.pulse');

function setStatusCard(status) {
  statusCard.classList.remove('status-up', 'status-down');
  statusCard.classList.add(status === 'UP' ? 'status-up' : 'status-down');
  appStatus.textContent = status;
}

function formatTimestamp(date) {
  const y = date.getFullYear();
  const m = String(date.getMonth() + 1).padStart(2, '0');
  const d = String(date.getDate()).padStart(2, '0');
  const h = String(date.getHours()).padStart(2, '0');
  const min = String(date.getMinutes()).padStart(2, '0');
  const s = String(date.getSeconds()).padStart(2, '0');
  return `${y}-${m}-${d} ${h}:${min}:${s}`;
}

async function poll() {
  try {
    const start = performance.now();
    const res = await fetch(STATUS_ENDPOINT);
    const elapsed = Math.round(performance.now() - start);

    if (!res.ok) throw new Error(`HTTP ${res.status}`);

    const data = await res.json();

    setStatusCard(data.status || 'UP');
    responseTime.textContent = `${elapsed} ms`;
    requestCount.textContent = data.requestCount ?? '--';
    pulse.classList.remove('offline');
  } catch {
    setStatusCard('DOWN');
    responseTime.textContent = '-- ms';
    requestCount.textContent = '--';
    pulse.classList.add('offline');
  }

  updateTime.textContent = `Last update: ${formatTimestamp(new Date())}`;
}

poll();
setInterval(poll, POLL_INTERVAL);