adam/potato-mesh
1
0
Fork 0
mirror of https://github.com/l5yth/potato-mesh.git synced 2026-08-11 03:12:57 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add long name tooltip to short name badge (#102)

Browse Source
This commit is contained in:
l5y
2025-09-16 18:58:29 +02:00
committed by GitHub
parent baf7f5d137
commit e424485761
1 changed files with 9 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/views/index.erb
+9 -7
View File
@@ -255,13 +255,15 @@
.replace(/'/g, ''');
}
function renderShortHtml(short, role){
function renderShortHtml(short, role, longName){
const safeTitle = longName ? escapeHtml(String(longName)) : '';
const titleAttr = safeTitle ? ` title="${safeTitle}"` : '';
if (!short) {
return `<span class="short-name" style="background:#ccc">?&nbsp;&nbsp;&nbsp;</span>`;
return `<span class="short-name" style="background:#ccc"${titleAttr}>?&nbsp;&nbsp;&nbsp;</span>`;
}
const padded = escapeHtml(String(short).padStart(4, ' ')).replace(/ /g, '&nbsp;');
const color = roleColors[role] || roleColors.CLIENT;
return `<span class="short-name" style="background:${color}">${padded}</span>`;
return `<span class="short-name" style="background:${color}"${titleAttr}>${padded}</span>`;
}
function appendChatEntry(div) {
@@ -292,7 +294,7 @@
const div = document.createElement('div');
const ts = formatTime(new Date(n.first_heard * 1000));
div.className = 'chat-entry-node';
const short = renderShortHtml(n.short_name, n.role);
const short = renderShortHtml(n.short_name, n.role, n.long_name);
const longName = escapeHtml(n.long_name || '');
div.innerHTML = `[${ts}] ${short} <em>New node: ${longName}</em>`;
appendChatEntry(div);
@@ -302,7 +304,7 @@
maybeAddDateDivider(m.rx_time);
const div = document.createElement('div');
const ts = formatTime(new Date(m.rx_time * 1000));
const short = renderShortHtml(m.node?.short_name, m.node?.role);
const short = renderShortHtml(m.node?.short_name, m.node?.role, m.node?.long_name);
const text = escapeHtml(m.text || '');
div.className = 'chat-entry-msg';
div.innerHTML = `[${ts}] ${short} ${text}`;
@@ -399,7 +401,7 @@
const tr = document.createElement('tr');
tr.innerHTML = `
<td class="mono">${n.node_id || ""}</td>
<td>${renderShortHtml(n.short_name, n.role)}</td>
<td>${renderShortHtml(n.short_name, n.role, n.long_name)}</td>
<td>${n.long_name || ""}</td>
<td>${timeAgo(n.last_heard, nowSec)}</td>
<td>${n.role || "CLIENT"}</td>
@@ -439,7 +441,7 @@
});
const lines = [
`<b>${n.long_name || ''}</b>`,
`${renderShortHtml(n.short_name, n.role)} <span class="mono">${n.node_id || ''}</span>`,
`${renderShortHtml(n.short_name, n.role, n.long_name)} <span class="mono">${n.node_id || ''}</span>`,
n.hw_model ? `Model: ${fmtHw(n.hw_model)}` : null,
`Role: ${n.role || 'CLIENT'}`,
(n.battery_level != null ? `Battery: ${fmtAlt(n.battery_level, "%")}, ${fmtAlt(n.voltage, "V")}` : null),