danvics/soulsync
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Video watchlist: nav badge with the live count

Browse source 
Adds a .dl-nav-badge to the Watchlist nav entry, updated from
/api/video/watchlist/counts on boot, on every watchlist change, and whenever
the page loads. Hidden at 0.
This commit is contained in:
BoulderBadgeDad 2026-06-16 10:20:33 -07:00
parent 58ceca86b1
commit 964675443b
2 changed files with 18 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
webui/index.html
View file

@ -344,6 +344,7 @@
<a class="nav-button" data-video-page="video-watchlist" href="#">
<span class="nav-icon"><svg class="nav-svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg></span>
<span class="nav-text">Watchlist</span>
<span class="dl-nav-badge hidden" data-video-watchlist-badge>0</span>
</a>
<a class="nav-button" data-video-page="video-wishlist" href="#">
<span class="nav-icon"><svg class="nav-svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg></span>

18
webui/static/video/video-watchlist.js
View file

@ -58,10 +58,24 @@
esc(it.title) + '</span>' + meta + '</div></a>';
}
function updateNavBadge(counts) {
var b = $('[data-video-watchlist-badge]'); if (!b) return;
var n = counts ? ((counts.show || 0) + (counts.person || 0)) : 0;
b.textContent = n;
b.classList.toggle('hidden', !n);
}
function refreshBadge() {
fetch('/api/video/watchlist/counts', { headers: { Accept: 'application/json' } })
.then(function (r) { return r.ok ? r.json() : null; })
.then(function (d) { if (d && d.success) updateNavBadge(d); })
.catch(function () { /* ignore */ });
}
function setCounts(counts) {
state.counts = { show: (counts && counts.show) || 0, person: (counts && counts.person) || 0 };
var cs = $('[data-vwlp-count-show]'); if (cs) cs.textContent = state.counts.show;
var cp = $('[data-vwlp-count-person]'); if (cp) cp.textContent = state.counts.person;
updateNavBadge(state.counts);
}
function updatePagination(p) {
@ -132,7 +146,8 @@
// un-followed card drops and counts/pagination stay correct.
function onChanged() {
var grid = $('[data-vwlp-grid]');
if (state.loaded && grid && grid.offsetParent !== null) load();
if (grid && grid.offsetParent !== null) load(); // visible → reload (refreshes badge via setCounts)
else refreshBadge(); // not visible → keep the nav badge current
}
function wire() {
@ -187,6 +202,7 @@
function init() {
wire();
document.addEventListener('soulsync:video-page-shown', onShown);
refreshBadge(); // seed the nav badge on boot
}
if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init);