Function displayFiles

web/scripts/ragnar_modern.js:13232–13335

(files, path, highlightFile = null)

function _pwnFileSizeLabel(bytes) {
    if (!bytes || bytes <= 0) return '';
    if (bytes < 1024) return bytes + ' B';
    if (bytes < 1048576) return (bytes / 1024).toFixed(1) + ' KB';
    return (bytes / 1048576).toFixed(1) + ' MB';
}

function _pwnFilesHTML(files) {
    if (!Array.isArray(files) || files.length === 0) return '';
    return '<div class="flex flex-wrap gap-2 mt-2">' + files.map(f => {
        const name = escapeHtml(f.name || '');
        const size = _pwnFileSizeLabel(f.size);
        const sizeLabel = size ? ` (${size})` : '';
        const encodedName = encodeURIComponent(f.name || '');
        return `<a href="/api/pwnagotchi/download?file=${encodedName}" download
                    class="inline-flex items-center gap-1 px-2 py-1 rounded text-xs bg-slate-700 hover:bg-slate-600 text-slate-200 hover:text-white transition-colors"
                    title="Download ${name}${sizeLabel}">
                    <svg class="w-3 h-3 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"></path></svg>
                    <span class="truncate max-w-[10rem]">${name}</span></a>`;
    }).join('') + '</div>';
}

function displayPwnNetworksTable(networks) {
    const container = document.getElementById('pwn-networks-table');
    if (!container) return;

    if (!Array.isArray(networks) || networks.length === 0) {
        container.innerHTML = '<p class="text-gray-400">No Pwnagotchi captures found yet.</p>';
        return;
    }

    const previewCount = 10;
    const hasMore = networks.length > previewCount;
    const previewItems = networks.slice(0, previewCount);
    const hiddenItems = hasMore ? networks.slice(previewCount) : [];

    /* --- Mobile card layout (shown < md) --- */
    function networkCardHTML(net) {
        const ssid = escapeHtml(net.ssid || 'Unknown');
        const bssid = escapeHtml(net.bssid || 'Unknown');
        const lastSeen = net.last_seen ? formatTimestamp(net.last_seen) : 'Unknown';
        return `
            <div class="bg-slate-800 bg-opacity-60 rounded-lg p-4">
                <div class="flex items-start justify-between gap-2 mb-2">
                    <span class="text-white font-semibold text-sm break-all">${ssid}</span>
                    <span class="text-xs text-gray-400 whitespace-nowrap">${lastSeen}</span>
                </div>
                <div class="text-xs text-gray-400 font-mono mb-2">${bssid}</div>
                <div class="flex flex-wrap gap-1 mb-1">${_pwnBadgesHTML(net)}</div>
                <div class="text-xs mt-1">${_pwnGpsHTML(net)}</div>
                ${_pwnFilesHTML(net.files)}
            </div>`;
    }

    /* --- Desktop table row (shown >= md) --- */
    function networkRowHTML(net) {
        const ssid = escapeHtml(net.ssid || 'Unknown');
        const bssid = escapeHtml(net.bssid || 'Unknown');
        const lastSeen = net.last_seen ? formatTimestamp(net.last_seen) : 'Unknown';
        return `