index.js

// ── STATE ──
let vaults = [];
let feedLog = [];
let heartbeatSeconds = 85632; // ~23h 47m remaining
let checkinsToday = 0;
let currentFilter = 'all';

// ── DEMO DATA ──
const demoVaults = [
  {
    id: 'v1',
    name: 'Hardware Wallet Recovery',
    message: 'The seed phrase is stored in the red notebook on the left shelf of my office bookcase, behind "The Pragmatic Programmer". The PIN is your mother\'s birth year + 1.\n\nWallet addresses:\n- BTC: bc1q...x4k9\n- ETH: 0x2f3...a91b\n- TRAC: trac1abc...def',
    recipients: ['trac1alice...', 'trac1bob...'],
    deadline: 7,
    type: '💰',
    daysLeft: 5.2,
    status: 'active',
    createdAt: '2026-02-18',
    witnesses: ['trac1wit1...', 'trac1wit2...', 'trac1wit3...'],
  },
  {
    id: 'v2',
    name: 'Server Admin Credentials',
    message: 'Root password is in Bitwarden under "Production Servers".\nSSH key is in ~/.ssh/id_rsa_prod\nContact: DevOps team at devops@company.com',
    recipients: ['trac1colleague...'],
    deadline: 3,
    type: '🔐',
    daysLeft: 0.8,
    status: 'warning',
    createdAt: '2026-02-20',
    witnesses: ['trac1wit4...', 'trac1wit5...', 'trac1wit6...'],
  },
  {
    id: 'v3',
    name: 'Letter to My Family',
    message: 'If you are reading this, I want you to know how much I love you all. The things I never said out loud...',
    recipients: ['trac1family...', 'trac1spouse...'],
    deadline: 30,
    type: '📜',
    daysLeft: 28.5,
    status: 'active',
    createdAt: '2026-02-01',
    witnesses: ['trac1wit7...', 'trac1wit8...', 'trac1wit9...'],
  },
];

const demoFeed = [
  {
    time: '09:14',
    event: '<strong>Witness trac1wit2...</strong> confirmed node alive for <strong>Hardware Wallet Recovery</strong>',
    badge: 'witness',
    cls: 'badge-witness',
  },
  {
    time: '08:32',
    event: '<strong>You</strong> checked in — all vault timers reset',
    badge: 'check-in',
    cls: 'badge-checkin',
  },
  {
    time: '07:55',
    event: '<strong>Witness trac1wit6...</strong> confirmed node alive for <strong>Server Admin Credentials</strong>',
    badge: 'witness',
    cls: 'badge-witness',
  },
  {
    time: 'yesterday',
    event: '<strong>Vault</strong> "Letter to My Family" was sealed and registered on Intercom',
    badge: 'create',
    cls: 'badge-create',
  },
];

// ── INIT ──
function init() {
  vaults = [...demoVaults];
  feedLog = [...demoFeed];
  updateStats();
  renderVaults();
  renderFeed();
  startHeartbeatTimer();
  startCountdownTick();
}

// ── STATS ──
function updateStats() {
  document.getElementById('totalVaults').textContent    = vaults.filter(v => v.status !== 'triggered').length;
  document.getElementById('triggeredCount').textContent = vaults.filter(v => v.status === 'triggered').length;
  document.getElementById('checkinsToday').textContent  = checkinsToday;
  document.getElementById('totalWitnesses').textContent = vaults.length * 3;
}

// ── RENDER VAULTS ──
function renderVaults() {
  const grid = document.getElementById('vaultGrid');
  const filtered = currentFilter === 'all'
    ? vaults
    : vaults.filter(v => v.status === currentFilter);

  if (filtered.length === 0) {
    grid.innerHTML = `
      <div class="empty">
        <div class="empty-icon">🔒</div>
        <div class="empty-text">No vaults here yet.<br>Create your first vault using the panel on the left.</div>
      </div>`;
    return;
  }

  grid.innerHTML = filtered.map(v => {
    const days    = Math.floor(v.daysLeft);
    const hours   = Math.floor((v.daysLeft % 1) * 24);
    const display = v.daysLeft < 1 ? hours + 'h' : days + 'd';

    const recipStr = v.recipients
      .map(r => `<span class="recipient-tag">${r.substring(0, 10)}…</span>`)
      .join('');

    const countdownColor = {
      active:    '#3d5a4c',
      warning:   '#b45309',
      critical:  '#dc2626',
      triggered: '#6b7280',
    }[v.status] || '#6b7280';

    const actions = v.status !== 'triggered'
      ? `<button class="action-btn confirm" onclick="doCheckin()">✓ Check In</button>
         <button class="action-btn peek"    onclick="peekVault('${v.id}')">👁 Preview</button>
         <button class="action-btn revoke"  onclick="revokeVault('${v.id}')">✕ Revoke</button>`
      : `<button class="action-btn peek" onclick="peekVault('${v.id}')">📬 View Released Contents</button>`;

    return `
      <div class="vault-card ${v.status}" data-id="${v.id}">
        <div class="vault-icon">${v.type}</div>
        <div>
          <div class="vault-name">${v.name}</div>
          <div class="vault-meta">
            <span>⚡ ${v.deadline}-day window</span>
            <span>👥 ${v.recipients.length} recipient${v.recipients.length > 1 ? 's' : ''}</span>
            <span>🧑‍⚖️ 3 witnesses</span>
            <span>📅 ${v.createdAt}</span>
          </div>
          <div class="vault-recipients">${recipStr}</div>
          <div class="vault-actions">${actions}</div>
        </div>
        <div class="vault-countdown">
          <div class="countdown-val" style="color:${countdownColor}">
            ${v.status === 'triggered' ? 'SENT' : display}
          </div>
          <span class="countdown-unit">${v.status === 'triggered' ? 'released' : 'remaining'}</span>
        </div>
      </div>`;
  }).join('');
}

// ── RENDER FEED ──
function renderFeed() {
  const container = document.getElementById('feedItems');
  container.innerHTML = feedLog.map(f => `
    <div class="feed-item">
      <span class="feed-time">${f.time}</span>
      <span class="feed-event">${f.event}</span>
      <span class="feed-badge ${f.cls}">${f.badge}</span>
    </div>`
  ).join('') || '<div style="font-size:0.68rem;color:#aaa;padding:1rem 0;">No activity yet.</div>';
}

// ── CREATE VAULT ──
function createVault() {
  const name         = document.getElementById('vaultName').value.trim();
  const message      = document.getElementById('vaultMessage').value.trim();
  const recipientsRaw = document.getElementById('vaultRecipients').value.trim();
  const deadline     = parseInt(document.getElementById('vaultDeadline').value);
  const type         = document.getElementById('vaultType').value.split(' ')[0];

  if (!name || !message || !recipientsRaw) {
    showToast('⚠ Please fill in name, message, and at least one recipient.');
    return;
  }

  const recipients = recipientsRaw.split(',').map(r => r.trim()).filter(Boolean);

  const vault = {
    id: 'v' + Date.now(),
    name,
    message,
    recipients,
    deadline,
    type,
    daysLeft: deadline,
    status: 'active',
    createdAt: new Date().toISOString().split('T')[0],
    witnesses: ['trac1wit_a...', 'trac1wit_b...', 'trac1wit_c...'],
  };

  vaults.unshift(vault);

  feedLog.unshift({
    time: 'just now',
    event: `<strong>Vault</strong> "${name}" sealed and registered on Intercom P2P mesh with ${recipients.length} recipient(s)`,
    badge: 'create',
    cls: 'badge-create',
  });

  // Reset form fields
  ['vaultName', 'vaultMessage', 'vaultRecipients'].forEach(id => {
    document.getElementById(id).value = '';
  });

  updateStats();
  renderVaults();
  renderFeed();
  showToast(`🔐 Vault "${name}" sealed successfully.`);
}

// ── CHECK IN ──
function doCheckin() {
  heartbeatSeconds = 86400; // reset to 24h
  checkinsToday++;
  updateStats();
  updateHeartbeatDisplay();

  vaults.forEach(v => {
    if (v.status === 'warning') v.status = 'active';
  });

  feedLog.unshift({
    time: 'just now',
    event: '<strong>You</strong> checked in — all vault timers reset',
    badge: 'check-in',
    cls: 'badge-checkin',
  });

  renderVaults();
  renderFeed();
  showToast('✓ Check-in confirmed. All vaults reset.');
}

// ── REVOKE VAULT ──
function revokeVault(id) {
  const vault = vaults.find(v => v.id === id);
  if (!vault) return;
  if (!confirm(`Revoke vault "${vault.name}"? This will permanently destroy the sealed contents.`)) return;

  feedLog.unshift({
    time: 'just now',
    event: `<strong>Vault</strong> "${vault.name}" was revoked and destroyed`,
    badge: 'revoke',
    cls: 'badge-release',
  });

  vaults = vaults.filter(v => v.id !== id);
  updateStats();
  renderVaults();
  renderFeed();
  showToast(`🗑 Vault "${vault.name}" revoked.`);
}

// ── PEEK VAULT (MODAL) ──
function peekVault(id) {
  const vault = vaults.find(v => v.id === id);
  if (!vault) return;

  const isTriggered = vault.status === 'triggered';

  document.getElementById('modalTitle').textContent = vault.type + ' ' + vault.name;
  document.getElementById('modalBody').innerHTML = `
    <div style="font-size:0.65rem;letter-spacing:0.12em;text-transform:uppercase;color:#888;margin-bottom:0.75rem;">
      ${isTriggered ? '📬 Released to Recipients' : '🔒 Sealed · Preview Mode'}
    </div>
    ${isTriggered
      ? `<div class="reveal-box">${vault.message}</div>`
      : `<div class="reveal-box" style="filter:blur(4px);user-select:none;cursor:not-allowed;">${vault.message}</div>
         <p class="modal-note">⚠ Contents are encrypted and sealed. They will only be revealed to your designated recipients after the dead man's switch triggers. This is a preview of the sealed state.</p>`
    }
    <div style="margin-top:1rem;">
      <div style="font-size:0.65rem;letter-spacing:0.12em;text-transform:uppercase;color:#888;margin-bottom:0.5rem;">Recipients</div>
      ${vault.recipients.map(r => `<span class="recipient-tag">${r}</span>`).join('')}
    </div>
    <div style="margin-top:1rem;font-size:0.65rem;color:#888;">
      <strong>Witnesses:</strong> ${vault.witnesses.join(' · ')}
    </div>`;

  document.getElementById('modal').classList.add('open');
}

function closeModal() {
  document.getElementById('modal').classList.remove('open');
}

// ── SIMULATE TRIGGER (DEMO) ──
function simulateTrigger() {
  const active = vaults.find(v => v.status !== 'triggered');
  if (!active) { showToast('No active vaults to trigger.'); return; }

  active.status = 'triggered';
  active.daysLeft = 0;

  feedLog.unshift({
    time: 'just now',
    event: `🚨 <strong>VAULT TRIGGERED</strong> — "${active.name}" released to ${active.recipients.length} recipient(s) after witness consensus`,
    badge: 'release',
    cls: 'badge-release',
  });

  updateStats();
  renderVaults();
  renderFeed();
  showToast(`🚨 TRIGGERED: "${active.name}" has been released!`);
}

// ── FILTER TABS ──
function filterVaults(filter, btn) {
  currentFilter = filter;
  document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));
  btn.classList.add('active');
  renderVaults();
}

// ── HEARTBEAT TIMER ──
function startHeartbeatTimer() {
  setInterval(() => {
    heartbeatSeconds = Math.max(0, heartbeatSeconds - 1);
    updateHeartbeatDisplay();
    if (heartbeatSeconds <= 0) triggerHeartbeatMiss();
  }, 1000);
}

function updateHeartbeatDisplay() {
  const h = Math.floor(heartbeatSeconds / 3600);
  const m = Math.floor((heartbeatSeconds % 3600) / 60);
  const s = heartbeatSeconds % 60;

  document.getElementById('heartbeatTimer').textContent =
    String(h).padStart(2, '0') + ':' +
    String(m).padStart(2, '0') + ':' +
    String(s).padStart(2, '0');

  const pct = ((86400 - heartbeatSeconds) / 86400 * 100).toFixed(1);
  document.getElementById('progressFill').style.width = pct + '%';

  const dot        = document.getElementById('statusDot');
  const statusText = document.getElementById('statusText');

  if (heartbeatSeconds > 28800) {         // > 8h  — safe
    dot.className        = 'status-dot status-safe';
    statusText.textContent = 'All vaults safe';
  } else if (heartbeatSeconds > 7200) {   // > 2h  — warn
    dot.className        = 'status-dot status-warn';
    statusText.textContent = 'Check-in recommended soon';
    vaults.forEach(v => { if (v.status === 'active') v.status = 'warning'; });
    renderVaults();
  } else {                                // < 2h  — critical
    dot.className        = 'status-dot status-danger';
    statusText.textContent = 'CRITICAL — Check in now!';
  }
}

function triggerHeartbeatMiss() {
  showToast('⚠ Heartbeat missed! Witnesses will attempt contact.');
}

// ── VAULT COUNTDOWN TICK (every minute) ──
function startCountdownTick() {
  setInterval(() => {
    vaults.forEach(v => {
      if (v.status === 'triggered') return;
      v.daysLeft = Math.max(0, v.daysLeft - 1 / 86400);
      if (v.daysLeft < 1   && v.status === 'active')  v.status = 'warning';
      if (v.daysLeft < 0.1 && v.status === 'warning') v.status = 'critical';
    });
    renderVaults();
  }, 60000);
}

// ── TOAST NOTIFICATION ──
function showToast(msg) {
  const t = document.getElementById('toast');
  t.textContent  = msg;
  t.style.display = 'block';
  setTimeout(() => { t.style.display = 'none'; }, 3500);
}

// ── MODAL CLOSE ON OVERLAY CLICK ──
document.getElementById('modal').addEventListener('click', function (e) {
  if (e.target === this) closeModal();
});

// ── BOOT ──
init();