1
0

Enhance HUD functionality: optimize member-only video tracking and improve HUD update logic

This commit is contained in:
Chipperfluff 2026-01-20 05:49:56 +01:00
parent 8f1a0fe28f
commit ab931e1264

View File

@ -9,6 +9,8 @@ const DATA_PREFIX = "chipperfluff-nobs"; // nobs = "no-bs" (member-only videos)
const HUD_DOT_ID = `${DATA_PREFIX}-hud-dot`;
const HUD_PANEL_ID = `${DATA_PREFIX}-hud-panel`;
let generatedIdCounter = 0;
let hudDirty = false;
let lastHudSignature = "";
/* ---------------- CSS injection ---------------- */
@ -247,15 +249,19 @@ function process(root = document) {
if (id) video.setAttribute(`data-${DATA_PREFIX}-id`, id);
if (id) {
memberOnlyIndex.set(id, {
channelKey,
channelLabel: channel,
channelUrl,
hidden: false,
title,
url,
thumb
});
const existing = memberOnlyIndex.get(id);
if (!existing) {
memberOnlyIndex.set(id, {
channelKey,
channelLabel: channel,
channelUrl,
hidden: false,
title,
url,
thumb
});
hudDirty = true;
}
}
const whitelisted = whitelist.includes(channelKey);
@ -271,12 +277,16 @@ function process(root = document) {
if (!whitelisted) {
video.setAttribute(`data-${DATA_PREFIX}-hidden`, "true");
if (id && memberOnlyIndex.has(id)) {
memberOnlyIndex.get(id).hidden = true;
const meta = memberOnlyIndex.get(id);
if (!meta.hidden) hudDirty = true;
meta.hidden = true;
}
} else {
video.removeAttribute(`data-${DATA_PREFIX}-hidden`);
if (id && memberOnlyIndex.has(id)) {
memberOnlyIndex.get(id).hidden = false;
const meta = memberOnlyIndex.get(id);
if (meta.hidden) hudDirty = true;
meta.hidden = false;
}
}
});
@ -298,9 +308,11 @@ function updateKnownVisibility() {
}
if (whitelist.includes(meta.channelKey)) {
video.removeAttribute(`data-${DATA_PREFIX}-hidden`);
if (meta.hidden) hudDirty = true;
meta.hidden = false;
} else {
video.setAttribute(`data-${DATA_PREFIX}-hidden`, "true");
if (!meta.hidden) hudDirty = true;
meta.hidden = true;
}
}
@ -406,7 +418,8 @@ function ensureHudDot() {
}
if (!dot.dataset.bound) {
dot.dataset.bound = "true";
dot.addEventListener("click", () => {
dot.addEventListener("click", event => {
event.stopPropagation();
const isHidden =
panel.getAttribute(`data-${DATA_PREFIX}-hidden`) === "true";
panel.setAttribute(
@ -415,23 +428,40 @@ function ensureHudDot() {
);
if (isHidden) renderHudPanel(panel);
});
panel.addEventListener("click", event => event.stopPropagation());
document.addEventListener("click", event => {
if (panel.getAttribute(`data-${DATA_PREFIX}-hidden`) !== "false") return;
if (panel.contains(event.target) || dot.contains(event.target)) return;
panel.setAttribute(`data-${DATA_PREFIX}-hidden`, "true");
});
}
return dot;
}
function updateHudDot() {
const dot = ensureHudDot();
const panel = document.getElementById(HUD_PANEL_ID);
let total = 0;
let hidden = 0;
for (const meta of memberOnlyIndex.values()) {
total += 1;
if (meta.hidden) hidden += 1;
}
const signature = `${total}:${hidden}`;
dot.title = `Member-only videos: ${total} (${hidden} hidden)`;
dot.setAttribute(
`data-${DATA_PREFIX}-active`,
total > 0 ? "true" : "false"
);
if (
panel &&
panel.getAttribute(`data-${DATA_PREFIX}-hidden`) === "false" &&
(hudDirty || signature !== lastHudSignature)
) {
renderHudPanel(panel);
hudDirty = false;
lastHudSignature = signature;
}
}
function renderHudPanel(panel) {