mirror of
https://github.com/BetterSEQTA/BetterSEQTA-Plus.git
synced 2026-08-28 09:11:06 +00:00
chore: reduce complexity
This commit is contained in:
+39
-35
@@ -513,20 +513,10 @@ function isTrustedMessage(event) {
|
||||
return event.source === window && event.origin === window.location.origin;
|
||||
}
|
||||
|
||||
window.addEventListener("message", (event) => {
|
||||
if (!isTrustedMessage(event)) return;
|
||||
|
||||
if (event.data.type === "reactFiberRequest") {
|
||||
const { selector, action, payload, debug, messageId } = event.data;
|
||||
const fiberInstance = ReactFiber.find(selector, {
|
||||
debug,
|
||||
});
|
||||
|
||||
let response;
|
||||
function executeReactFiberAction(fiberInstance, action, payload) {
|
||||
switch (action) {
|
||||
case "getState":
|
||||
response = fiberInstance.getState(payload.key);
|
||||
break;
|
||||
return fiberInstance.getState(payload.key);
|
||||
case "setState":
|
||||
if (
|
||||
payload.updateObject &&
|
||||
@@ -537,51 +527,54 @@ window.addEventListener("message", (event) => {
|
||||
} else {
|
||||
console.warn("[pageState] setState rejected: only plain objects are allowed");
|
||||
}
|
||||
response = {};
|
||||
break;
|
||||
|
||||
return {};
|
||||
case "getProp":
|
||||
response = fiberInstance.getProp(payload.propName);
|
||||
break;
|
||||
return fiberInstance.getProp(payload.propName);
|
||||
case "setProp":
|
||||
fiberInstance.setProp(payload.propName, payload.value);
|
||||
response = {};
|
||||
break;
|
||||
return {};
|
||||
case "forceUpdate":
|
||||
fiberInstance.forceUpdate();
|
||||
response = {};
|
||||
break;
|
||||
return {};
|
||||
default:
|
||||
console.warn(`[pageState] Unknown action: ${action}`);
|
||||
response = null;
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function sanitizeResponseForPostMessage(response) {
|
||||
if (response !== null && typeof response === "object") {
|
||||
response = makeSerializable(response);
|
||||
}
|
||||
|
||||
// Final safety check before postMessage
|
||||
try {
|
||||
deepFunctionCheck(response);
|
||||
} catch (functionError) {
|
||||
console.warn("[pageState] Function detected in response, cleaning:", functionError.message);
|
||||
response = `[Cleaned Response - Function found at: ${functionError.message}]`;
|
||||
return `[Cleaned Response - Function found at: ${functionError.message}]`;
|
||||
}
|
||||
|
||||
// Additional structured clone test
|
||||
try {
|
||||
// Test if the object can be cloned (same algorithm as postMessage)
|
||||
if (typeof structuredClone === 'function') {
|
||||
if (typeof structuredClone === "function") {
|
||||
structuredClone(response);
|
||||
} else {
|
||||
// Fallback for older browsers - try JSON round-trip
|
||||
JSON.parse(JSON.stringify(response));
|
||||
}
|
||||
} catch (cloneError) {
|
||||
console.warn("[pageState] Response not cloneable, fallback:", cloneError.message);
|
||||
response = `[Uncloneable Response: ${cloneError.message}]`;
|
||||
return `[Uncloneable Response: ${cloneError.message}]`;
|
||||
}
|
||||
|
||||
return response;
|
||||
}
|
||||
|
||||
function handleReactFiberRequest(data) {
|
||||
const { selector, action, payload, debug, messageId } = data;
|
||||
const fiberInstance = ReactFiber.find(selector, { debug });
|
||||
const response = sanitizeResponseForPostMessage(
|
||||
executeReactFiberAction(fiberInstance, action, payload),
|
||||
);
|
||||
|
||||
window.postMessage(
|
||||
{
|
||||
type: "reactFiberResponse",
|
||||
@@ -590,11 +583,11 @@ window.addEventListener("message", (event) => {
|
||||
},
|
||||
window.location.origin,
|
||||
);
|
||||
} else if (event.data.type === "triggerKeyboardEvent") {
|
||||
// Handle keyboard event triggering from content script
|
||||
const { key, code, altKey, ctrlKey, metaKey, shiftKey, keyCode } = event.data;
|
||||
}
|
||||
|
||||
const keyboardEvent = new KeyboardEvent('keydown', {
|
||||
function handleTriggerKeyboardEvent(data) {
|
||||
const { key, code, altKey, ctrlKey, metaKey, shiftKey, keyCode } = data;
|
||||
const keyboardEvent = new KeyboardEvent("keydown", {
|
||||
key,
|
||||
code,
|
||||
keyCode: keyCode || 0,
|
||||
@@ -604,9 +597,20 @@ window.addEventListener("message", (event) => {
|
||||
metaKey: metaKey || false,
|
||||
shiftKey: shiftKey || false,
|
||||
bubbles: true,
|
||||
cancelable: true
|
||||
cancelable: true,
|
||||
});
|
||||
|
||||
document.dispatchEvent(keyboardEvent);
|
||||
}
|
||||
|
||||
window.addEventListener("message", (event) => {
|
||||
if (!isTrustedMessage(event)) return;
|
||||
|
||||
if (event.data.type === "reactFiberRequest") {
|
||||
handleReactFiberRequest(event.data);
|
||||
return;
|
||||
}
|
||||
|
||||
if (event.data.type === "triggerKeyboardEvent") {
|
||||
handleTriggerKeyboardEvent(event.data);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -1040,7 +1040,15 @@ function resolveTabSetClasses(): Record<string, string> {
|
||||
return resolved;
|
||||
}
|
||||
|
||||
async function buildWeightingsTabContent(api: any, sheet: HTMLElement) {
|
||||
interface WeightingTabContext {
|
||||
assessmentID?: string;
|
||||
autoWeight?: number;
|
||||
override?: number | string;
|
||||
weightingUnavailable: boolean;
|
||||
statusNote: string;
|
||||
}
|
||||
|
||||
async function resolveWeightingTabContext(api: any): Promise<WeightingTabContext> {
|
||||
const selectedItem = document.querySelector(
|
||||
"[class*='AssessmentItem__AssessmentItem___'][class*='selected___']",
|
||||
) as HTMLElement | null;
|
||||
@@ -1056,14 +1064,11 @@ async function buildWeightingsTabContent(api: any, sheet: HTMLElement) {
|
||||
? (api.storage.weightings?.[assessmentID] as WeightingEntry | undefined)
|
||||
: undefined;
|
||||
const rawWeight = entry?.weight;
|
||||
|
||||
const weightingUnavailable = rawWeight === "N/A";
|
||||
|
||||
const autoWeight =
|
||||
rawWeight && rawWeight !== "processing" && rawWeight !== "N/A"
|
||||
? rawWeight
|
||||
: undefined;
|
||||
|
||||
const override = assessmentID
|
||||
? api.storage.weightingOverrides?.[assessmentID]
|
||||
: undefined;
|
||||
@@ -1076,6 +1081,22 @@ async function buildWeightingsTabContent(api: any, sheet: HTMLElement) {
|
||||
? "No weighting was found in the marksheet. Set one manually."
|
||||
: "Overrides the auto-detected value.";
|
||||
|
||||
return {
|
||||
assessmentID,
|
||||
autoWeight,
|
||||
override,
|
||||
weightingUnavailable,
|
||||
statusNote,
|
||||
};
|
||||
}
|
||||
|
||||
function renderWeightingTabHtml(
|
||||
sheet: HTMLElement,
|
||||
context: WeightingTabContext,
|
||||
) {
|
||||
const { assessmentID, autoWeight, override, weightingUnavailable, statusNote } =
|
||||
context;
|
||||
|
||||
sheet.innerHTML = `
|
||||
<style>
|
||||
#betterseqta-weight-override::placeholder {
|
||||
@@ -1120,9 +1141,13 @@ async function buildWeightingsTabContent(api: any, sheet: HTMLElement) {
|
||||
${!assessmentID ? `<p style="font-size:12px;color:rgba(255,80,80,0.8);margin-top:8px">Assessment not yet indexed — try refreshing.</p>` : ""}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
if (!assessmentID) return;
|
||||
|
||||
function attachWeightingInputHandlers(
|
||||
sheet: HTMLElement,
|
||||
api: any,
|
||||
assessmentID: string,
|
||||
) {
|
||||
const input = sheet.querySelector(
|
||||
"#betterseqta-weight-override",
|
||||
) as HTMLInputElement;
|
||||
@@ -1132,20 +1157,17 @@ async function buildWeightingsTabContent(api: any, sheet: HTMLElement) {
|
||||
|
||||
const save = () => {
|
||||
const raw = input.value.trim();
|
||||
if (raw === "") {
|
||||
const result = saveWeightingOverride(api, assessmentID, "");
|
||||
if (!result.ok) return;
|
||||
input.style.borderColor = "rgba(128,128,128,0.3)";
|
||||
} else {
|
||||
const result = saveWeightingOverride(api, assessmentID, raw);
|
||||
if (!result.ok) {
|
||||
if (raw !== "") {
|
||||
input.style.borderColor = "rgba(255,80,80,0.6)";
|
||||
statusEl.textContent = result.error ?? "Invalid. Must be 0 or greater";
|
||||
statusEl.style.color = "rgba(255,80,80,0.8)";
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
input.style.borderColor = "rgba(128,128,128,0.3)";
|
||||
}
|
||||
statusEl.textContent = "Saved";
|
||||
statusEl.style.color = "";
|
||||
setTimeout(() => (statusEl.textContent = ""), 2000);
|
||||
@@ -1165,6 +1187,13 @@ async function buildWeightingsTabContent(api: any, sheet: HTMLElement) {
|
||||
});
|
||||
}
|
||||
|
||||
async function buildWeightingsTabContent(api: any, sheet: HTMLElement) {
|
||||
const context = await resolveWeightingTabContext(api);
|
||||
renderWeightingTabHtml(sheet, context);
|
||||
if (!context.assessmentID) return;
|
||||
attachWeightingInputHandlers(sheet, api, context.assessmentID);
|
||||
}
|
||||
|
||||
export function injectWeightingsTab(api: any) {
|
||||
const tabList = document.querySelector(
|
||||
'[class*="TabSet__tabs___"]',
|
||||
|
||||
@@ -128,6 +128,58 @@ export async function mountSearchBar(
|
||||
}
|
||||
};
|
||||
|
||||
const resetIdleProgressUi = () => {
|
||||
clearDoneFlashTimer();
|
||||
progressBarWrapper.classList.remove("is-active", "is-rough-complete");
|
||||
searchAnchor.classList.remove("is-indexing");
|
||||
searchButton.classList.remove("is-indexing");
|
||||
progressText.classList.remove(
|
||||
"is-active",
|
||||
"is-rough",
|
||||
"is-fading-done",
|
||||
"is-done-message",
|
||||
);
|
||||
progressBar.style.width = "0%";
|
||||
progressText.textContent = "";
|
||||
ranIndexingCycle = false;
|
||||
indexingStatus = null;
|
||||
};
|
||||
|
||||
const showActiveIndexingUi = (percentage: number) => {
|
||||
clearDoneFlashTimer();
|
||||
progressBarWrapper.classList.remove("is-rough-complete");
|
||||
progressText.classList.remove("is-rough", "is-fading-done", "is-done-message");
|
||||
progressBar.style.width = `${Math.max(2, percentage)}%`;
|
||||
progressBarWrapper.classList.add("is-active");
|
||||
searchAnchor.classList.add("is-indexing");
|
||||
searchButton.classList.add("is-indexing");
|
||||
progressText.textContent = indexingStatus
|
||||
? `${truncateStatus(indexingStatus)} · ${percentage}%`
|
||||
: `Indexing ${completedJobs}/${totalJobs} (${percentage}%)`;
|
||||
progressText.classList.add("is-active");
|
||||
};
|
||||
|
||||
const scheduleCompletionFlash = (rough: boolean) => {
|
||||
progressBar.style.width = "0%";
|
||||
progressBarWrapper.classList.remove("is-active");
|
||||
searchAnchor.classList.remove("is-indexing");
|
||||
searchButton.classList.remove("is-indexing");
|
||||
progressText.classList.remove("is-fading-done");
|
||||
progressText.textContent = rough ? truncateStatus(indexingStatus!, 52) : "Done!";
|
||||
progressText.classList.toggle("is-rough", rough);
|
||||
progressBarWrapper.classList.toggle("is-rough-complete", rough);
|
||||
progressText.classList.add("is-active", "is-done-message");
|
||||
|
||||
doneFlashTimer = setTimeout(() => {
|
||||
doneFlashTimer = null;
|
||||
progressText.classList.add("is-fading-done");
|
||||
doneFadeTimer = setTimeout(() => {
|
||||
doneFadeTimer = null;
|
||||
resetIdleProgressUi();
|
||||
}, DONE_FADE_MS);
|
||||
}, DONE_HOLD_MS);
|
||||
};
|
||||
|
||||
const updateProgressDisplay = () => {
|
||||
const indexingStoppedThisTick = indexingJustStoppedFlag;
|
||||
indexingJustStoppedFlag = false;
|
||||
@@ -137,9 +189,7 @@ export async function mountSearchBar(
|
||||
// Stray pulses (missing total, 0 completed, etc.) used to hit the idle
|
||||
// branch and call clearDoneFlashTimer(), killing the Done! hold/fade.
|
||||
if (doneFlashTimer !== null || doneFadeTimer !== null) {
|
||||
if (!active) {
|
||||
return;
|
||||
}
|
||||
if (!active) return;
|
||||
clearDoneFlashTimer();
|
||||
}
|
||||
|
||||
@@ -150,92 +200,18 @@ export async function mountSearchBar(
|
||||
(completedJobs >= totalJobs || indexingStoppedThisTick);
|
||||
|
||||
if (active) {
|
||||
clearDoneFlashTimer();
|
||||
progressBarWrapper.classList.remove("is-rough-complete");
|
||||
progressText.classList.remove(
|
||||
"is-rough",
|
||||
"is-fading-done",
|
||||
"is-done-message",
|
||||
);
|
||||
const percentage = Math.round((completedJobs / totalJobs) * 100);
|
||||
progressBar.style.width = `${Math.max(2, percentage)}%`;
|
||||
progressBarWrapper.classList.add("is-active");
|
||||
searchAnchor.classList.add("is-indexing");
|
||||
searchButton.classList.add("is-indexing");
|
||||
|
||||
if (indexingStatus) {
|
||||
progressText.textContent = `${truncateStatus(indexingStatus)} · ${percentage}%`;
|
||||
} else {
|
||||
progressText.textContent = `Indexing ${completedJobs}/${totalJobs} (${percentage}%)`;
|
||||
}
|
||||
progressText.classList.add("is-active");
|
||||
showActiveIndexingUi(Math.round((completedJobs / totalJobs) * 100));
|
||||
return;
|
||||
}
|
||||
|
||||
if (completionEligible) {
|
||||
// Duplicate end-of-run ticks must not reschedule hold/fade timers
|
||||
if (doneFlashTimer !== null || doneFadeTimer !== null) {
|
||||
if (doneFlashTimer !== null || doneFadeTimer !== null) return;
|
||||
const rough = indexingStatus != null && statusLooksRough(indexingStatus);
|
||||
scheduleCompletionFlash(rough);
|
||||
return;
|
||||
}
|
||||
|
||||
const rough =
|
||||
indexingStatus != null && statusLooksRough(indexingStatus);
|
||||
|
||||
progressBar.style.width = "0%";
|
||||
progressBarWrapper.classList.remove("is-active");
|
||||
searchAnchor.classList.remove("is-indexing");
|
||||
searchButton.classList.remove("is-indexing");
|
||||
progressText.classList.remove("is-fading-done");
|
||||
|
||||
progressText.textContent = rough ? truncateStatus(indexingStatus!, 52) : "Done!";
|
||||
if (rough) {
|
||||
progressText.classList.add("is-rough");
|
||||
progressBarWrapper.classList.add("is-rough-complete");
|
||||
} else {
|
||||
progressText.classList.remove("is-rough");
|
||||
progressBarWrapper.classList.remove("is-rough-complete");
|
||||
}
|
||||
progressText.classList.add("is-active", "is-done-message");
|
||||
|
||||
doneFlashTimer = setTimeout(() => {
|
||||
doneFlashTimer = null;
|
||||
progressText.classList.add("is-fading-done");
|
||||
doneFadeTimer = setTimeout(() => {
|
||||
doneFadeTimer = null;
|
||||
ranIndexingCycle = false;
|
||||
indexingStatus = null;
|
||||
progressBar.style.width = "0%";
|
||||
progressBarWrapper.classList.remove("is-active");
|
||||
progressBarWrapper.classList.remove("is-rough-complete");
|
||||
searchAnchor.classList.remove("is-indexing");
|
||||
searchButton.classList.remove("is-indexing");
|
||||
progressText.classList.remove(
|
||||
"is-active",
|
||||
"is-rough",
|
||||
"is-fading-done",
|
||||
"is-done-message",
|
||||
);
|
||||
progressText.textContent = "";
|
||||
}, DONE_FADE_MS);
|
||||
}, DONE_HOLD_MS);
|
||||
return;
|
||||
}
|
||||
|
||||
clearDoneFlashTimer();
|
||||
progressBarWrapper.classList.remove("is-active");
|
||||
progressBarWrapper.classList.remove("is-rough-complete");
|
||||
searchAnchor.classList.remove("is-indexing");
|
||||
searchButton.classList.remove("is-indexing");
|
||||
progressText.classList.remove(
|
||||
"is-active",
|
||||
"is-rough",
|
||||
"is-fading-done",
|
||||
"is-done-message",
|
||||
);
|
||||
progressBar.style.width = "0%";
|
||||
progressText.textContent = "";
|
||||
ranIndexingCycle = false;
|
||||
indexingStatus = null;
|
||||
resetIdleProgressUi();
|
||||
};
|
||||
|
||||
// Listen for indexing progress events
|
||||
|
||||
@@ -105,6 +105,78 @@ function appendFolderBadgeContent(badge: HTMLElement, folder: Folder): void {
|
||||
badge.appendChild(document.createTextNode(folder.name));
|
||||
}
|
||||
|
||||
const MESSAGE_LIST_ITEM_SELECTOR =
|
||||
"[class*='MessageList__MessageList___'] ol > li[data-message]";
|
||||
|
||||
function getMessageListItems(): NodeListOf<Element> {
|
||||
return document.querySelectorAll(MESSAGE_LIST_ITEM_SELECTOR);
|
||||
}
|
||||
|
||||
function clearMessageListBadges(
|
||||
messageItems: NodeListOf<Element>,
|
||||
restoreSubjectPlain: (subject: Element) => void,
|
||||
): void {
|
||||
for (const li of messageItems) {
|
||||
const subject = li.querySelector("[class*='MessageList__subject___']");
|
||||
if (
|
||||
subject &&
|
||||
(subject.querySelector(".bsplus-msg-badges") ||
|
||||
subject.querySelector(".bsplus-subject-text"))
|
||||
) {
|
||||
restoreSubjectPlain(subject);
|
||||
} else {
|
||||
li.querySelector(".bsplus-msg-badges")?.remove();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function getAssignedFolderIds(
|
||||
msgId: string,
|
||||
assignments: Record<string, string[]>,
|
||||
): string[] {
|
||||
return Object.entries(assignments)
|
||||
.filter(([, messageIds]) => messageIds.includes(msgId))
|
||||
.map(([folderId]) => folderId);
|
||||
}
|
||||
|
||||
function ensureMessageBadgeContainer(li: Element): HTMLElement {
|
||||
const existing = li.querySelector(".bsplus-msg-badges") as HTMLElement | null;
|
||||
if (existing) return existing;
|
||||
|
||||
const badgeContainer = document.createElement("div");
|
||||
badgeContainer.className = "bsplus-msg-badges";
|
||||
const subject = li.querySelector("[class*='MessageList__subject___']");
|
||||
if (subject) {
|
||||
if (!subject.querySelector(".bsplus-subject-text")) {
|
||||
const textWrap = document.createElement("span");
|
||||
textWrap.className = "bsplus-subject-text";
|
||||
textWrap.textContent = subject.textContent;
|
||||
subject.textContent = "";
|
||||
subject.appendChild(textWrap);
|
||||
}
|
||||
subject.appendChild(badgeContainer);
|
||||
} else {
|
||||
li.appendChild(badgeContainer);
|
||||
}
|
||||
return badgeContainer;
|
||||
}
|
||||
|
||||
function createFolderBadge(
|
||||
folder: Folder,
|
||||
onFilter: (folderId: string) => void,
|
||||
): HTMLElement {
|
||||
const badge = document.createElement("span");
|
||||
badge.className = "bsplus-msg-badge";
|
||||
badge.style.background = folder.color;
|
||||
appendFolderBadgeContent(badge, folder);
|
||||
badge.title = `Filter by "${folder.name}"`;
|
||||
badge.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
onFilter(folder.id);
|
||||
});
|
||||
return badge;
|
||||
}
|
||||
|
||||
const messageFoldersPlugin: Plugin<typeof messageFoldersSettings, MessageFoldersStorage> = {
|
||||
id: "messageFolders",
|
||||
name: "Message Folders",
|
||||
@@ -799,66 +871,37 @@ const messageFoldersPlugin: Plugin<typeof messageFoldersSettings, MessageFolders
|
||||
};
|
||||
|
||||
const applyBadges = () => {
|
||||
const messageItems = document.querySelectorAll("[class*='MessageList__MessageList___'] ol > li[data-message]");
|
||||
const messageItems = getMessageListItems();
|
||||
if (!shouldShowBadgesInList()) {
|
||||
for (const li of messageItems) {
|
||||
const subject = li.querySelector("[class*='MessageList__subject___']");
|
||||
if (subject && (subject.querySelector(".bsplus-msg-badges") || subject.querySelector(".bsplus-subject-text"))) {
|
||||
restoreSubjectPlain(subject);
|
||||
} else {
|
||||
li.querySelector(".bsplus-msg-badges")?.remove();
|
||||
}
|
||||
}
|
||||
clearMessageListBadges(messageItems, restoreSubjectPlain);
|
||||
return;
|
||||
}
|
||||
|
||||
const folders = getFolders();
|
||||
const assignments = getAssignments();
|
||||
for (const li of messageItems) {
|
||||
const msgId = li.getAttribute("data-message");
|
||||
if (!msgId) continue;
|
||||
let badgeContainer = li.querySelector(".bsplus-msg-badges") as HTMLElement | null;
|
||||
const folderIds: string[] = [];
|
||||
for (const [fId, mIds] of Object.entries(assignments)) {
|
||||
if (mIds.includes(msgId)) folderIds.push(fId);
|
||||
}
|
||||
if (folderIds.length === 0) {
|
||||
badgeContainer?.remove();
|
||||
continue;
|
||||
}
|
||||
if (!badgeContainer) {
|
||||
badgeContainer = document.createElement("div");
|
||||
badgeContainer.className = "bsplus-msg-badges";
|
||||
const subject = li.querySelector("[class*='MessageList__subject___']");
|
||||
if (subject) {
|
||||
if (!subject.querySelector(".bsplus-subject-text")) {
|
||||
const textWrap = document.createElement("span");
|
||||
textWrap.className = "bsplus-subject-text";
|
||||
textWrap.textContent = subject.textContent;
|
||||
subject.textContent = "";
|
||||
subject.appendChild(textWrap);
|
||||
}
|
||||
subject.appendChild(badgeContainer);
|
||||
} else {
|
||||
li.appendChild(badgeContainer);
|
||||
}
|
||||
}
|
||||
badgeContainer.innerHTML = "";
|
||||
for (const fId of folderIds) {
|
||||
const folder = folders.find((f) => f.id === fId);
|
||||
if (!folder) continue;
|
||||
const badge = document.createElement("span");
|
||||
badge.className = "bsplus-msg-badge";
|
||||
badge.style.background = folder.color;
|
||||
appendFolderBadgeContent(badge, folder);
|
||||
badge.title = `Filter by "${folder.name}"`;
|
||||
badge.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
activeFolderId = folder.id;
|
||||
const selectFolder = (folderId: string) => {
|
||||
activeFolderId = folderId;
|
||||
applyFolderFilter();
|
||||
applyBadges();
|
||||
renderSidebarFolders();
|
||||
});
|
||||
badgeContainer.appendChild(badge);
|
||||
};
|
||||
|
||||
for (const li of messageItems) {
|
||||
const msgId = li.getAttribute("data-message");
|
||||
if (!msgId) continue;
|
||||
|
||||
const folderIds = getAssignedFolderIds(msgId, assignments);
|
||||
if (folderIds.length === 0) {
|
||||
li.querySelector(".bsplus-msg-badges")?.remove();
|
||||
continue;
|
||||
}
|
||||
|
||||
const badgeContainer = ensureMessageBadgeContainer(li);
|
||||
badgeContainer.replaceChildren();
|
||||
for (const folderId of folderIds) {
|
||||
const folder = folders.find((f) => f.id === folderId);
|
||||
if (!folder) continue;
|
||||
badgeContainer.appendChild(createFolderBadge(folder, selectFolder));
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@@ -14,216 +14,215 @@ function escapeHtmlAttr(value: string): string {
|
||||
.replace(/>/g, ">");
|
||||
}
|
||||
|
||||
export function OpenMenuOptions() {
|
||||
if (MenuOptionsOpen) return;
|
||||
function syncDefaultMenuOrder(menu: HTMLElement) {
|
||||
const childnodes = menu.firstChild!.childNodes;
|
||||
if (settingsState.defaultmenuorder.length === 0) {
|
||||
settingsState.defaultmenuorder = Array.from(childnodes).map(
|
||||
(element) => (element as HTMLElement).dataset.key,
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
var container = document.getElementById("container");
|
||||
var menu = document.getElementById("menu");
|
||||
if (settingsState.defaultmenuorder.length === childnodes.length) return;
|
||||
|
||||
if (settingsState.defaultmenuorder.length == 0) {
|
||||
let childnodes = menu!.firstChild!.childNodes;
|
||||
let newdefaultmenuorder = [];
|
||||
const nextOrder = [...settingsState.defaultmenuorder];
|
||||
for (let i = 0; i < childnodes.length; i++) {
|
||||
const element = childnodes[i];
|
||||
newdefaultmenuorder.push((element as HTMLElement).dataset.key);
|
||||
settingsState.defaultmenuorder = newdefaultmenuorder;
|
||||
}
|
||||
}
|
||||
let childnodes = menu!.firstChild!.childNodes;
|
||||
if (settingsState.defaultmenuorder.length != childnodes.length) {
|
||||
for (let i = 0; i < childnodes.length; i++) {
|
||||
const element = childnodes[i];
|
||||
if (
|
||||
settingsState.defaultmenuorder.indexOf(
|
||||
(element as HTMLElement).dataset.key,
|
||||
) === -1
|
||||
) {
|
||||
let newdefaultmenuorder = settingsState.defaultmenuorder;
|
||||
newdefaultmenuorder.push((element as HTMLElement).dataset.key);
|
||||
settingsState.defaultmenuorder = newdefaultmenuorder;
|
||||
}
|
||||
const key = (childnodes[i] as HTMLElement).dataset.key;
|
||||
if (key && nextOrder.indexOf(key) === -1) nextOrder.push(key);
|
||||
}
|
||||
settingsState.defaultmenuorder = nextOrder;
|
||||
}
|
||||
|
||||
MenuOptionsOpen = true;
|
||||
|
||||
var cover = document.createElement("div");
|
||||
function createMenuEditControls(menu: HTMLElement, container: HTMLElement) {
|
||||
const cover = document.createElement("div");
|
||||
cover.classList.add("notMenuCover");
|
||||
menu!.style.zIndex = "20";
|
||||
menu!.style.setProperty("--menuHidden", "flex");
|
||||
container!.append(cover);
|
||||
menu.style.zIndex = "20";
|
||||
menu.style.setProperty("--menuHidden", "flex");
|
||||
container.append(cover);
|
||||
|
||||
var menusettings = document.createElement("div");
|
||||
const menusettings = document.createElement("div");
|
||||
menusettings.classList.add("editmenuoption-container");
|
||||
|
||||
var defaultbutton = document.createElement("div");
|
||||
const defaultbutton = document.createElement("div");
|
||||
defaultbutton.classList.add("editmenuoption");
|
||||
defaultbutton.innerText = "Restore Default";
|
||||
defaultbutton.id = "restoredefaultoption";
|
||||
|
||||
var savebutton = document.createElement("div");
|
||||
const savebutton = document.createElement("div");
|
||||
savebutton.classList.add("editmenuoption");
|
||||
savebutton.innerText = "Save";
|
||||
savebutton.id = "savemenuoption";
|
||||
|
||||
menusettings.appendChild(defaultbutton);
|
||||
menusettings.appendChild(savebutton);
|
||||
menu.appendChild(menusettings);
|
||||
|
||||
menu!.appendChild(menusettings);
|
||||
return { cover, menusettings, defaultbutton, savebutton };
|
||||
}
|
||||
|
||||
var ListItems = menu!.firstChild!.childNodes;
|
||||
for (let i = 0; i < ListItems.length; i++) {
|
||||
const element1 = ListItems[i];
|
||||
const element = element1 as HTMLElement;
|
||||
|
||||
(element as HTMLElement).classList.add("draggable");
|
||||
if ((element as HTMLElement).classList.contains("hasChildren")) {
|
||||
(element as HTMLElement).classList.remove("active");
|
||||
function prepareMenuItemsForEdit(menu: HTMLElement) {
|
||||
const listItems = menu.firstChild!.childNodes;
|
||||
for (let i = 0; i < listItems.length; i++) {
|
||||
const element = listItems[i] as HTMLElement;
|
||||
element.classList.add("draggable");
|
||||
if (element.classList.contains("hasChildren")) {
|
||||
element.classList.remove("active");
|
||||
(element.firstChild as HTMLElement).classList.remove("noscroll");
|
||||
}
|
||||
|
||||
const menuKey = escapeHtmlAttr((element as HTMLElement).dataset.key ?? "");
|
||||
let MenuItemToggle = stringToHTML(
|
||||
const menuKey = escapeHtmlAttr(element.dataset.key ?? "");
|
||||
const menuItemToggle = stringToHTML(
|
||||
`<div class="onoffswitch" style="margin: auto 0;"><input class="onoffswitch-checkbox notification menuitem" type="checkbox" id="${menuKey}"><label for="${menuKey}" class="onoffswitch-label"></label>`,
|
||||
).firstChild;
|
||||
(element as HTMLElement).append(MenuItemToggle!);
|
||||
element.append(menuItemToggle!);
|
||||
|
||||
if (!element.dataset.betterseqta) {
|
||||
const a = document.createElement("section");
|
||||
cloneAttributes(a, element);
|
||||
while (element.firstChild) {
|
||||
a.appendChild(element.firstChild);
|
||||
}
|
||||
menu!.firstChild!.insertBefore(a, element);
|
||||
if (element.dataset.betterseqta) continue;
|
||||
|
||||
const section = document.createElement("section");
|
||||
cloneAttributes(section, element);
|
||||
while (element.firstChild) section.appendChild(element.firstChild);
|
||||
menu.firstChild!.insertBefore(section, element);
|
||||
element.remove();
|
||||
}
|
||||
return listItems;
|
||||
}
|
||||
|
||||
if (Object.keys(settingsState.menuitems).length == 0) {
|
||||
menubuttons = menu!.firstChild!.childNodes;
|
||||
let menuItems = {} as any;
|
||||
for (var i = 0; i < menubuttons.length; i++) {
|
||||
var id = (menubuttons[i] as HTMLElement).dataset.key;
|
||||
const element: any = {};
|
||||
element.toggle = true;
|
||||
(menuItems[id as keyof typeof menuItems] as any) = element;
|
||||
function ensureMenuItemSettings(menu: HTMLElement) {
|
||||
if (Object.keys(settingsState.menuitems).length > 0) return;
|
||||
|
||||
const menuItems: Record<string, { toggle: boolean }> = {};
|
||||
const menuButtons = menu.firstChild!.childNodes;
|
||||
for (let i = 0; i < menuButtons.length; i++) {
|
||||
const id = (menuButtons[i] as HTMLElement).dataset.key;
|
||||
if (id) menuItems[id] = { toggle: true };
|
||||
}
|
||||
settingsState.menuitems = menuItems;
|
||||
}
|
||||
|
||||
var menubuttons: any = document.getElementsByClassName("menuitem");
|
||||
|
||||
let menuItems = settingsState.menuitems as any;
|
||||
let buttons = document.getElementsByClassName("menuitem");
|
||||
function applySavedMenuToggleStates() {
|
||||
const menuItems = settingsState.menuitems as Record<
|
||||
string,
|
||||
{ toggle: boolean }
|
||||
>;
|
||||
const buttons = document.getElementsByClassName("menuitem");
|
||||
for (let i = 0; i < buttons.length; i++) {
|
||||
let id = buttons[i].id as string | undefined;
|
||||
if (menuItems[id as keyof typeof menuItems]) {
|
||||
(buttons[i] as HTMLInputElement).checked =
|
||||
menuItems[id as keyof typeof menuItems].toggle;
|
||||
} else {
|
||||
(buttons[i] as HTMLInputElement).checked = true;
|
||||
const id = buttons[i].id;
|
||||
(buttons[i] as HTMLInputElement).checked = id
|
||||
? (menuItems[id]?.toggle ?? true)
|
||||
: true;
|
||||
}
|
||||
}
|
||||
|
||||
let sortable: Sortable | undefined;
|
||||
function createMenuSortable(): Sortable | undefined {
|
||||
try {
|
||||
var el = document.querySelector("#menu > ul");
|
||||
const el = document.querySelector("#menu > ul");
|
||||
if (!el) return undefined;
|
||||
let sortable: Sortable | undefined;
|
||||
sortable = Sortable.create(el as HTMLElement, {
|
||||
draggable: ".draggable",
|
||||
dataIdAttr: "data-key",
|
||||
animation: 150,
|
||||
easing: "cubic-bezier(.5,0,.5,1)",
|
||||
onEnd: function () {
|
||||
saveNewOrder(sortable);
|
||||
},
|
||||
onEnd: () => saveNewOrder(sortable),
|
||||
});
|
||||
return sortable;
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
function changeDisplayProperty(element: any) {
|
||||
function changeMenuItemDisplay(element: HTMLInputElement) {
|
||||
const row = element.parentNode?.parentNode as HTMLElement | null;
|
||||
if (!row) return;
|
||||
if (!element.checked) {
|
||||
element.parentNode.parentNode.style.display = "var(--menuHidden)";
|
||||
}
|
||||
if (element.checked) {
|
||||
element.parentNode.parentNode.style.setProperty(
|
||||
"display",
|
||||
"flex",
|
||||
"important",
|
||||
);
|
||||
row.style.display = "var(--menuHidden)";
|
||||
return;
|
||||
}
|
||||
row.style.setProperty("display", "flex", "important");
|
||||
}
|
||||
|
||||
function StoreMenuSettings() {
|
||||
let menu = document.getElementById("menu");
|
||||
const menuItems: any = {};
|
||||
let menubuttons = menu!.firstChild!.childNodes;
|
||||
const button = document.getElementsByClassName("menuitem");
|
||||
for (let i = 0; i < menubuttons.length; i++) {
|
||||
const id = (menubuttons[i] as HTMLElement).dataset.key;
|
||||
const element: any = {};
|
||||
element.toggle = (button[i] as HTMLInputElement).checked;
|
||||
function storeMenuSettings() {
|
||||
const menu = document.getElementById("menu");
|
||||
if (!menu) return;
|
||||
|
||||
menuItems[id as keyof typeof menuItems] = element;
|
||||
const menuItems: Record<string, { toggle: boolean }> = {};
|
||||
const menuButtons = menu.firstChild!.childNodes;
|
||||
const toggles = document.getElementsByClassName("menuitem");
|
||||
for (let i = 0; i < menuButtons.length; i++) {
|
||||
const id = (menuButtons[i] as HTMLElement).dataset.key;
|
||||
if (!id) continue;
|
||||
menuItems[id] = { toggle: (toggles[i] as HTMLInputElement).checked };
|
||||
}
|
||||
settingsState.menuitems = menuItems;
|
||||
}
|
||||
|
||||
for (let i = 0; i < menubuttons.length; i++) {
|
||||
const element = menubuttons[i];
|
||||
element.addEventListener("change", () => {
|
||||
element.parentElement.parentElement.getAttribute("data-key");
|
||||
StoreMenuSettings();
|
||||
changeDisplayProperty(element);
|
||||
});
|
||||
}
|
||||
|
||||
function closeAll() {
|
||||
menusettings?.remove();
|
||||
cover?.remove();
|
||||
MenuOptionsOpen = false;
|
||||
menu!.style.setProperty("--menuHidden", "none");
|
||||
|
||||
for (let i = 0; i < ListItems.length; i++) {
|
||||
const element1 = ListItems[i];
|
||||
const element = element1 as HTMLElement;
|
||||
function restoreMenuItemsFromEditMode(menu: HTMLElement, listItems: NodeListOf<ChildNode>) {
|
||||
for (let i = 0; i < listItems.length; i++) {
|
||||
const element = listItems[i] as HTMLElement;
|
||||
element.classList.remove("draggable");
|
||||
element.setAttribute("draggable", "false");
|
||||
|
||||
if (!element.dataset.betterseqta) {
|
||||
const a = document.createElement("li");
|
||||
cloneAttributes(a, element);
|
||||
while (element.firstChild) {
|
||||
a.appendChild(element.firstChild);
|
||||
}
|
||||
menu!.firstChild!.insertBefore(a, element);
|
||||
if (element.dataset.betterseqta) continue;
|
||||
|
||||
const listItem = document.createElement("li");
|
||||
cloneAttributes(listItem, element);
|
||||
while (element.firstChild) listItem.appendChild(element.firstChild);
|
||||
menu.firstChild!.insertBefore(listItem, element);
|
||||
element.remove();
|
||||
}
|
||||
|
||||
menu.querySelectorAll(".onoffswitch").forEach((toggle) => toggle.remove());
|
||||
}
|
||||
|
||||
let switches = menu!.querySelectorAll(".onoffswitch");
|
||||
for (let i = 0; i < switches.length; i++) {
|
||||
switches[i].remove();
|
||||
}
|
||||
}
|
||||
export function OpenMenuOptions() {
|
||||
if (MenuOptionsOpen) return;
|
||||
|
||||
cover?.addEventListener("click", closeAll);
|
||||
savebutton?.addEventListener("click", closeAll);
|
||||
const container = document.getElementById("container");
|
||||
const menu = document.getElementById("menu");
|
||||
if (!container || !menu) return;
|
||||
|
||||
defaultbutton?.addEventListener("click", function () {
|
||||
const options = settingsState.defaultmenuorder;
|
||||
settingsState.menuorder = options;
|
||||
syncDefaultMenuOrder(menu);
|
||||
MenuOptionsOpen = true;
|
||||
|
||||
ChangeMenuItemPositions(options);
|
||||
const { cover, menusettings, defaultbutton, savebutton } = createMenuEditControls(
|
||||
menu,
|
||||
container,
|
||||
);
|
||||
const listItems = prepareMenuItemsForEdit(menu);
|
||||
ensureMenuItemSettings(menu);
|
||||
applySavedMenuToggleStates();
|
||||
|
||||
const menubuttons = document.getElementsByClassName("menuitem");
|
||||
const sortable = createMenuSortable();
|
||||
|
||||
for (let i = 0; i < menubuttons.length; i++) {
|
||||
const element = menubuttons[i];
|
||||
const element = menubuttons[i] as HTMLInputElement;
|
||||
element.addEventListener("change", () => {
|
||||
storeMenuSettings();
|
||||
changeMenuItemDisplay(element);
|
||||
});
|
||||
}
|
||||
|
||||
const closeAll = () => {
|
||||
menusettings.remove();
|
||||
cover.remove();
|
||||
MenuOptionsOpen = false;
|
||||
menu.style.setProperty("--menuHidden", "none");
|
||||
restoreMenuItemsFromEditMode(menu, listItems);
|
||||
};
|
||||
|
||||
cover.addEventListener("click", closeAll);
|
||||
savebutton.addEventListener("click", closeAll);
|
||||
|
||||
defaultbutton.addEventListener("click", () => {
|
||||
settingsState.menuorder = settingsState.defaultmenuorder;
|
||||
ChangeMenuItemPositions(settingsState.defaultmenuorder);
|
||||
|
||||
for (let i = 0; i < menubuttons.length; i++) {
|
||||
const element = menubuttons[i] as HTMLInputElement;
|
||||
element.checked = true;
|
||||
element.parentNode.parentNode.style.setProperty(
|
||||
"display",
|
||||
"flex",
|
||||
"important",
|
||||
);
|
||||
changeMenuItemDisplay(element);
|
||||
}
|
||||
if (sortable) saveNewOrder(sortable);
|
||||
});
|
||||
|
||||
@@ -5,28 +5,42 @@ const ALLOWED_HOST_SUFFIXES = [
|
||||
"github.com",
|
||||
] as const;
|
||||
|
||||
function isPrivateOrLocalHost(hostname: string): boolean {
|
||||
const host = hostname.toLowerCase().replace(/^\[|\]$/g, "");
|
||||
if (host === "localhost" || host.endsWith(".localhost")) return true;
|
||||
if (host === "127.0.0.1" || host.startsWith("127.")) return true;
|
||||
if (host === "::1" || host === "0.0.0.0") return true;
|
||||
function normalizeHost(hostname: string): string {
|
||||
return hostname.toLowerCase().replace(/^\[|\]$/g, "");
|
||||
}
|
||||
|
||||
function isNamedLocalHost(host: string): boolean {
|
||||
return (
|
||||
host === "localhost" ||
|
||||
host.endsWith(".localhost") ||
|
||||
host === "127.0.0.1" ||
|
||||
host.startsWith("127.") ||
|
||||
host === "::1" ||
|
||||
host === "0.0.0.0"
|
||||
);
|
||||
}
|
||||
|
||||
function isPrivateIpv4(host: string): boolean {
|
||||
const ipv4 = host.match(/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})$/);
|
||||
if (ipv4) {
|
||||
if (!ipv4) return false;
|
||||
|
||||
const [a, b] = [Number(ipv4[1]), Number(ipv4[2])];
|
||||
if (a === 10) return true;
|
||||
if (a === 172 && b >= 16 && b <= 31) return true;
|
||||
if (a === 192 && b === 168) return true;
|
||||
if (a === 169 && b === 254) return true;
|
||||
if (a === 127 || a === 0) return true;
|
||||
return a === 127 || a === 0;
|
||||
}
|
||||
|
||||
if (host.includes(":")) {
|
||||
function isPrivateIpv6(host: string): boolean {
|
||||
if (!host.includes(":")) return false;
|
||||
const h = host.split("%")[0];
|
||||
if (h.startsWith("fe80") || h.startsWith("fc") || h.startsWith("fd")) return true;
|
||||
return h.startsWith("fe80") || h.startsWith("fc") || h.startsWith("fd");
|
||||
}
|
||||
|
||||
return false;
|
||||
function isPrivateOrLocalHost(hostname: string): boolean {
|
||||
const host = normalizeHost(hostname);
|
||||
return isNamedLocalHost(host) || isPrivateIpv4(host) || isPrivateIpv6(host);
|
||||
}
|
||||
|
||||
function isAllowedHost(hostname: string): boolean {
|
||||
|
||||
Reference in New Issue
Block a user