30 lines
1.2 KiB
JavaScript
30 lines
1.2 KiB
JavaScript
(() => {
|
|
const flow = document.getElementById('msgflow');
|
|
if (!flow) return;
|
|
flow.innerHTML = '';
|
|
const es = new EventSource('/messages/stream');
|
|
const MAX_ROWS = 200;
|
|
const tsFmt = (n) => new Date(n * 1000).toISOString().slice(11, 19);
|
|
const esc = (s) => s.replace(/[&<>]/g, (c) => ({'&':'&','<':'<','>':'>'}[c]));
|
|
es.onmessage = (e) => {
|
|
let m;
|
|
try { m = JSON.parse(e.data); } catch { return; }
|
|
const row = document.createElement('div');
|
|
row.className = 'msgrow ' + m.kind;
|
|
const kind = m.kind === 'sent' ? '→' : '✓';
|
|
row.innerHTML =
|
|
'<span class="msg-ts">' + tsFmt(m.at) + '</span>' +
|
|
'<span class="msg-arrow">' + kind + '</span>' +
|
|
'<span class="msg-from">' + esc(m.from) + '</span>' +
|
|
'<span class="msg-sep">→</span>' +
|
|
'<span class="msg-to">' + esc(m.to) + '</span>' +
|
|
'<span class="msg-body">' + esc(m.body) + '</span>';
|
|
flow.insertBefore(row, flow.firstChild);
|
|
while (flow.childNodes.length > MAX_ROWS) flow.removeChild(flow.lastChild);
|
|
};
|
|
es.onerror = () => {
|
|
flow.insertBefore(Object.assign(document.createElement('div'), {
|
|
className: 'msgrow meta', textContent: '[connection lost — retrying]'
|
|
}), flow.firstChild);
|
|
};
|
|
})();
|