FailedProxy/Varaverk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui: show resolution and codec counts in streams header

Browse Source 
Adds height/codec fields to both Emby/Jellyfin and Plex session data,
then surfaces them as chip groups (· 2 4K  3 1080p · 4 H.264  2 HEVC)
in the streams card header alongside the existing device type bar.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Gmer4Lfe
2026-05-31 21:52:31 -04:00
co-authored by Claude Sonnet 4.6
parent bea7b6b045
commit 89df1a98db
2 changed files with 53 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Plugin/unraid/pages/monitor.php
+37 -1
View File
@@ -1461,6 +1461,42 @@ function vvRenderStreams() {
? `<span class="vv-device-sep">·</span>${deviceBar}`
: '';
// Resolution summary — e.g. "2 4K 3 1080p 1 720p"
function vvResLabel(h) {
if (h >= 2160) return '4K';
if (h >= 1080) return '1080p';
if (h >= 720) return '720p';
if (h >= 480) return '480p';
return null;
}
const resCounts = {};
sessions.forEach(s => {
const r = vvResLabel(s.height || 0);
if (r) resCounts[r] = (resCounts[r] || 0) + 1;
});
const resOrder = ['4K', '1080p', '720p', '480p'];
const resBar = resOrder.filter(r => resCounts[r])
.map(r => `<span class="vv-device-chip">${resCounts[r]} ${r}</span>`)
.join('');
const resSection = resBar ? `<span class="vv-device-sep">·</span>${resBar}` : '';
// Codec summary — e.g. "4 H.264 2 HEVC"
function vvCodecLabel(c) {
if (!c) return null;
const m = { h264: 'H.264', hevc: 'HEVC', av1: 'AV1', vp9: 'VP9', mpeg4: 'MPEG-4', mpeg2video: 'MPEG-2' };
return m[c] || c.toUpperCase();
}
const codecCounts = {};
sessions.forEach(s => {
const c = vvCodecLabel(s.codec || '');
if (c) codecCounts[c] = (codecCounts[c] || 0) + 1;
});
const codecBar = Object.entries(codecCounts)
.sort((a, b) => b[1] - a[1])
.map(([c, n]) => `<span class="vv-device-chip">${n} ${c}</span>`)
.join('');
const codecSection = codecBar ? `<span class="vv-device-sep">·</span>${codecBar}` : '';
if (sessions.length === 0) {
el.innerHTML = `<div class="vv-stream-servers">${badges}</div>`
+ '<p class="vv-stream-empty">Nothing playing</p>';
@@ -1520,7 +1556,7 @@ function vvRenderStreams() {
? `<div style="font-size:10px;color:#555;margin-top:4px;">+${sessions.length - 12} more not shown</div>`
: '';
el.innerHTML = `<div class="vv-stream-servers">${badges}${deviceSection}</div>
el.innerHTML = `<div class="vv-stream-servers">${badges}${deviceSection}${resSection}${codecSection}</div>
<div style="display:flex;gap:10px;">${sCols.map(vvStreamCol).join('')}</div>${overflow}`;
}