EGO Forum Enhancement.ts

// ==UserScript==
// @name         EdgeGamers Forum Enhancement%RELEASE_TYPE%
// @namespace    https://github.com/blankdvth/eGOScripts/blob/master/src/EGO%20Forum%20Enhancement.ts
// @version      4.11.7
// @description  Add various enhancements & QOL additions to the EdgeGamers Forums that are beneficial for Leadership members.
// @author       blank_dvth, Skle, MSWS, PixeL
// @match        https://www.edgegamers.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=edgegamers.com
// @require      https://peterolson.github.io/BigInteger.js/BigInteger.min.js
// @require      https://s3.blankdvth.com/mirror-steamid-converter-min.js
// @require      https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.4/moment-with-locales.min.js
// @require      https://raw.githubusercontent.com/pieroxy/lz-string/861d3feda0c9a8b7a48aaf3c028ab57606f1c02f/libs/lz-string.min.js
// @require      https://raw.githubusercontent.com/sizzlemctwizzle/GM_config/2207c5c1322ebb56e401f03c2e581719f909762a/gm_config.js
// @connect      maul.edgegamers.com
// @connect      api.findsteamid.com
// @grant        GM_getValue
// @grant        GM_setValue
// @grant        GM_xmlhttpRequest
// ==/UserScript==
/// <reference path="../types/config/index.d.ts" />
/// <reference path="../types/moment.d.ts" />
/// <reference path="../types/lz-string.d.ts" />
/// <reference path="../types/forum_maul_c.d.ts" />

// Declare TypeScript types
interface Completed_Map {
    originId: string;
    completedId: string;
}

interface NavbarURL_Map {
    text: string;
    url: string;
}

interface CannedResponse {
    name: string;
    response: string;
}

const completedMap: Completed_Map[] = [];
const signatureBlockList: string[] = [];
const navbarURLs: NavbarURL_Map[] = [];
const navbarRemovals: string[] = [];
const autoMentionForums: string[] = [];
const cannedResponses: { [category: string]: CannedResponse[] } = {};
const appealForums: string[] = ["1234", "1236"];
const reportForums: string[] = ["1233", "1235"];
const countingURL: string = "https://www.edgegamers.com/threads/333944/";

/**
 * Creates a preset button
 * @param {string} text Button text
 * @param {function(HTMLElementEventMap)} callback Function to call on click
 * @returns {HTMLSpanElement} Button
 */
function createForumsPresetButton(
    text: string,
    id: string,
    callback: (event: MouseEvent) => void,
): HTMLSpanElement {
    const button = document.createElement("span");
    button.classList.add("button");
    button.innerHTML = text;
    button.onclick = callback;
    button.style.marginLeft = "4px";
    button.style.marginTop = "4px";
    button.dataset.presetId = id;
    return button;
}

/**
 * Adds a preset button to the div
 * @param {string} name Name of button
 * @param {HTMLDivElement} div Div to add to
 * @param {function(HTMLElementEventMap)} func Function to call on click
 */
function addForumsPreset(
    name: string,
    id: string,
    div: HTMLDivElement,
    func: (event: MouseEvent) => void,
) {
    div.appendChild(createForumsPresetButton(name, id, func));
}

/**
 * Creates a button and adds it to the given div
 * @param {string} href URL that button should link to
 * @param {string} text Buttons' text
 * @param {HTMLDivElement} div Div to add/append to
 * @param {string} target Meta target for button
 * @param {boolean} append True to append, false to insert
 * @param {HTMLElement} ins_el Element to insert before, only used if append is false
 */
function createButton(
    href: string,
    text: string,
    div: HTMLDivElement,
    target: string = "_blank",
    append: boolean = false,
    ins_el: HTMLElement | null = null,
) {
    const button = document.createElement("a");
    button.href = href;
    button.target = target;
    button.classList.add("button--link", "button");

    const button_text = document.createElement("span"); // Create button text
    button_text.classList.add("button-text");
    button_text.innerHTML = text;

    // Add all elements to their respective parents
    button.appendChild(button_text);
    append
        ? div.appendChild(button)
        : div.insertBefore(button, ins_el ?? div.lastElementChild);
}

/**
 * Setup the configuration manager and create an event to find and add a button to open it
 */
function setupForumsConfig() {
    // Initialize the configuration manager
    GM_config.init({
        id: "forums-config",
        title: "Forums Enhancement Script Configuration",
        fields: {
            "maul-dropdown": {
                label: "Use dropdown for MAUL links",
                section: ["Feature Settings"],
                title: "When checked, all additional MAUL links will be in a dropdown in the original MAUL button. When unchecked, all MAUL buttons will be added to the navigation bar after the MAUL button.",
                type: "checkbox",
                default: true,
            },
            "show-confidential-watermark": {
                label: "Show confidential watermarks on LE forums",
                title: "When checked, all LE forums will have a red confidential watermark on them.",
                type: "checkbox",
                default: true,
            },
            "confidential-reports": {
                label: "Show confidential watermark on reports",
                title: "When checked, reports will have a red confidential watermark on them. This only works if the above setting is enabled.",
                type: "checkbox",
                default: true,
            },
            "lookup-unknown-ids": {
                label: "Lookup unknown Steam IDs",
                title: "When checked, the script will attempt to lookup unknown IDs automatically by reaching out to an external API. Please ensure the ID is correct before taking any action, this is not always accurate.",
                type: "checkbox",
                default: true,
            },
            "show-list-bans-unknown": {
                label: "Show List Bans for unknown Steam IDs",
                title: "Whether to show the List Bans button alongside Lookup ID if the Steam ID is in an unknown format.",
                type: "checkbox",
                default: true,
            },
            "confirm-trash": {
                label: "Confirm Trash",
                title: "Whether to show a confirmation dialog when clicking the trash button.",
                type: "checkbox",
                default: true,
            },
            "maul-reauth-enable": {
                label: "Enable MAUL Reauthenthication",
                title: "When checked, the script will automatically reauthenthicate with MAUL in the background if it's been a while since the last authenthication (see timeout below).",
                type: "checkbox",
                default: true,
            },
            "maul-reauth": {
                label: "MAUL Reauthenthication Timeout",
                title: "The minimum duration to wait before automatically reauthenthicating MAUL in the background (in milliseconds).",
                type: "int",
                default: 1800000, // half an hour
                min: 300000, // 5 minutes, we don't want to spam the server
            },
            "autofill-counting": {
                label: "Autofill Counting",
                title: " Autofill the next number in the counting thread on click.",
                type: "checkbox",
                default: true,
            },
            "logo-link": {
                label: "Logo Link",
                title: "Replace the link the eGO logo (top-left) links to with the given URL. Leave empty to disable.",
                type: "text",
                default: "",
            },
            "enable-post-unapprove-btn": {
                label: "Enable post & unapprove button",
                title: "Whether to add a button that will safely post an unapproved reply.",
                type: "checkbox",
                default: true,
            },
            "rich-override": {
                label: "Allow post & unapprove in rich editor (NOT SUPPORTED)",
                title: "The post & unapprove button in the rich editor is not supported, and will cause formatting issues in your message. If you want to use it anyway, check this box, no support will be provided.",
                type: "checkbox",
                default: false,
            },
            "move-to-completed-unchecked": {
                label: "Completed Forums Map",
                section: [
                    "Move to Completed",
                    'One map (forum -> completed) per line, use the format "origin id;completed id". The ID is usually present in the URL bar when viewing that subforum list (/forums/ID here), otherwise, open Inspect Element and look for the number after "node-" in "data-container-key" in the <html> tag. For example: "1234;1236".<br>Note: This will not apply until the page is refreshed (your updated maps also won\'t show if you reopen the config popup until you refresh).',
                ],
                type: "textarea",
                save: false,
                default: "1234;1236\n1233;1235\n852;853",
            },
            "move-to-completed": {
                type: "hidden",
                default: "1234;1236\n1233;1235\n852;853",
            },
            "signature-block-unchecked": {
                label: "Signature Block List",
                section: [
                    "Signature Block List",
                    "List of User IDs whose signatures will be blocked from loading automatically, separated by newlines.",
                ],
                type: "textarea",
                save: false,
                default: "",
            },
            "signature-block": {
                type: "hidden",
                default: "",
            },
            "navbar-urls-unchecked": {
                label: "Navigation Bar URLs",
                section: [
                    "Navigation Bar URLs",
                    "List of URLs to add to the navigation bar, separated by newlines. Each line should be in the format 'text;url'. Your URLs cannot have a semicolon in them.",
                ],
                type: "textarea",
                save: false,
                default:
                    "GitLab;https://gitlab.edgegamers.io/\nGameME;https://edgegamers.gameme.com/",
            },
            "navbar-urls": {
                type: "hidden",
                default:
                    "GitLab;https://gitlab.edgegamers.io/\nGameME;https://edgegamers.gameme.com/",
            },
            "navbar-removals": {
                label: "Navigation Bar Removals",
                section: [
                    "Navigation Bar Removals",
                    "List of entries to remove from the navigation bar, separated by newlines. This removes the first full match for the text in the button, case-insensitive.",
                ],
                type: "textarea",
                default: "",
            },
            "auto-mention-unchecked": {
                label: "Auto Mention (Subforum IDs)",
                section: [
                    "Automention",
                    "Automatically mention the OP in the editor in certain forums. This is not guaranteed to work on the Rich Text editor (although it should).",
                ],
                type: "textarea",
                save: false,
                default: "",
            },
            "auto-mention": {
                type: "hidden",
                default: "",
            },
            "auto-mention-newlines": {
                label: "Number of newlines to add after mention",
                title: "This may be off by one when using the Rich Text editor.",
                type: "int",
                min: 0,
                default: 2,
            },
            "auto-mention-onclick": {
                label: "Fill on click instead of on load",
                type: "checkbox",
                default: true,
            },
            "auto-mention-focus": {
                label: "Focus after mentioning (only on load mode)",
                type: "checkbox",
                default: false,
            },
            "canned-responses-unchecked": {
                label: "Canned Responses",
                section: [
                    "Canned Responses",
                    "See <a href='https://github.com/blankdvth/eGOScripts/wiki/Canned-Responses' target='_blank'>this guide</a> on how to format your canned responses.",
                ],
                type: "textarea",
                save: false,
                default: "",
            },
            "canned-responses": {
                type: "hidden",
                default: "",
            },
            "canned-response-min-width": {
                label: "Minimum width of dropdown (in pixels)",
                type: "int",
                min: 0,
                default: 125,
            },
            "canned-response-focus": {
                label: "Focus after inserting canned response",
                type: "checkbox",
                default: true,
            },
            "canned-response-trigger-automention": {
                label: "Attempt to trigger automention before inserting canned response",
                type: "checkbox",
                default: true,
            },
            "canned-responses-hide-scrollbar": {
                label: "Hide scrollbars (scrolling will still work)",
                title: "May not work on all browsers.",
                type: "checkbox",
                default: false,
            },
            "ban-display-enable": {
                label: "Enable",
                section: [
                    "Ban Display",
                    "Automatically retrieve and display ban info in appeals. Only works when MAUL is authenticated.",
                ],
                type: "checkbox",
                default: true,
            },
            "ban-display-hidden": {
                label: "Hide behind button",
                title: "Whether to hide the ban display behind a button.",
                type: "checkbox",
                default: false,
            },
            "ban-display-silent-fail": {
                label: "Silently fail",
                title: "Whether to silently fail when a ban cannot be retrieved. No error message will be shown.",
                type: "checkbox",
                default: false,
            },
            "ban-display-hyperlink": {
                label: "Hyperlink",
                title: "Whether to hyperlink URLs in ban notes.",
                type: "checkbox",
                default: true,
            },
            "ban-display-steamid": {
                label: "Link Steam IDs",
                title: "Whether to link Steam IDs to their MAUL List Bans page. This is a bit finnicky, turn it off if you're experiencing problems.",
                type: "checkbox",
                default: true,
            },
            "ban-display-show-expired": {
                label: "Show expired bans",
                title: "Whether to show bans info if the latest ban is expired.",
                type: "checkbox",
                default: false,
            },
            "ban-display-expiration-format": {
                label: "Expiration Format",
                title: "Format used to show expiration date",
                type: "text",
                default: "YYYY-MM-DD HH:mm",
            },
            "ban-display-show-date": {
                label: "Show date",
                title: "Whether to show the date of the ban in the display table.",
                type: "checkbox",
                default: true,
            },
            "ban-display-show-handle": {
                label: "Show handle",
                title: "Whether to show the handle in the display table.",
                type: "checkbox",
                default: true,
            },
            "ban-display-show-id": {
                label: "Show Steam ID",
                title: "Whether to show the Steam ID in the display table.",
                type: "checkbox",
                default: false,
            },
            "ban-display-show-division": {
                label: "Show division",
                title: "Whether to show the division in the display table.",
                type: "checkbox",
                default: false,
            },
            "ban-display-show-banning-admin": {
                label: "Show banning admin",
                title: "Whether to show the banning admin in the display table.",
                type: "checkbox",
                default: true,
            },
            "ban-display-show-admins-online": {
                label: "Show admins online",
                title: "Whether to show the admins online in the display table.",
                type: "checkbox",
                default: false,
            },
            "ban-display-show-duration": {
                label: "Show duration",
                title: "Whether to show the duration of the ban in the display table. The expiration is shown on hover.",
                type: "checkbox",
                default: true,
            },
            "ban-display-show-expiration": {
                label: "Show expiration",
                title: "Whether to show the expiration datetime of the ban in the display table. The duration is shown on hover.",
                type: "checkbox",
                default: false,
            },
            "ban-display-show-reason": {
                label: "Show reason",
                title: "Whether to show the reason for the ban in the display table.",
                type: "checkbox",
                default: true,
            },
        },
        events: {
            init: function () {
                GM_config.set(
                    "move-to-completed-unchecked",
                    GM_config.get("move-to-completed"),
                );
                GM_config.set(
                    "signature-block-unchecked",
                    GM_config.get("signature-block"),
                );
                GM_config.set(
                    "navbar-urls-unchecked",
                    GM_config.get("navbar-urls"),
                );
                GM_config.set(
                    "auto-mention-unchecked",
                    GM_config.get("auto-mention"),
                );
                GM_config.set(
                    "canned-responses-unchecked",
                    GM_config.get("canned-responses"),
                );
            },
            open: function (doc) {
                GM_config.fields[
                    "move-to-completed-unchecked"
                ].node?.addEventListener(
                    "change",
                    function () {
                        const maps = GM_config.get(
                            "move-to-completed-unchecked",
                            true,
                        ) as string;
                        if (
                            maps.length == 0 ||
                            maps
                                .split(/\r?\n/)
                                .every((map) => map.match(/^\d+;\d+$/))
                        )
                            GM_config.set("move-to-completed", maps);
                    },
                    false,
                );
                GM_config.fields[
                    "signature-block-unchecked"
                ].node?.addEventListener("change", function () {
                    const ids = GM_config.get(
                        "signature-block-unchecked",
                        true,
                    ) as string;
                    if (ids.split(/\r?\n/).every((id) => id.match(/^\d+$/)))
                        GM_config.set("signature-block", ids);
                });
                GM_config.fields[
                    "navbar-urls-unchecked"
                ].node?.addEventListener("change", function () {
                    const urls = GM_config.get(
                        "navbar-urls-unchecked",
                        true,
                    ) as string;
                    if (
                        urls.length == 0 ||
                        urls
                            .split(/\r?\n/)
                            .every((url) =>
                                url.match(
                                    /^[^;\r\n]+;https?:\/\/(www\.)?[-a-zA-Z0-9.]{1,256}\.[a-zA-Z0-9]{2,6}\b(?:\/[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/,
                                ),
                            )
                    )
                        GM_config.set("navbar-urls", urls);
                });
                GM_config.fields[
                    "auto-mention-unchecked"
                ].node?.addEventListener("change", function () {
                    const autoMention = GM_config.get(
                        "auto-mention-unchecked",
                        true,
                    ) as string;
                    if (
                        autoMention.length == 0 ||
                        autoMention
                            .split(/\r?\n/)
                            .every((id) => id.match(/^\d+$/))
                    )
                        GM_config.set("auto-mention", autoMention);
                });
                GM_config.fields[
                    "canned-responses-unchecked"
                ].node?.addEventListener("change", function () {
                    const cannedResponses = GM_config.get(
                        "canned-responses-unchecked",
                        true,
                    ) as string;
                    // Check if entire config matches the regex by matching all and rejoining the matches, then comparing to the original
                    if (
                        [
                            ...cannedResponses.matchAll(
                                /(?:===\n|^)- (?<name>.+)\n- (?<category>.+)\n(?<response>(?:.|\n)+?)\n===/gm,
                            ),
                        ]
                            .map((i) => i[0])
                            .join("\n") === cannedResponses
                    )
                        GM_config.set("canned-responses", cannedResponses);
                });
            },
            save: function (forgotten) {
                if (
                    forgotten["move-to-completed-unchecked"] !==
                    GM_config.get("move-to-completed")
                )
                    alert(
                        'Invalid move to completed map, verify that all lines are in the format "origin id:completed id".',
                    );
                if (
                    forgotten["signature-block-unchecked"] !==
                    GM_config.get("signature-block")
                )
                    alert(
                        "Invalid signature block ID list. Ensure each ID is on it's own line and all IDs are numerical.",
                    );
                if (
                    forgotten["navbar-urls-unchecked"] !==
                    GM_config.get("navbar-urls")
                )
                    alert(
                        "Invalid navbar URL list. Ensure each URL is valid, on it's own line, and all URLs are in the format 'text;url'.",
                    );
                if (
                    forgotten["auto-mention-unchecked"] !==
                    GM_config.get("auto-mention")
                )
                    alert(
                        "Invalid auto mention list. Ensure each ID is on it's own line and all IDs are numerical.",
                    );
                if (
                    forgotten["canned-responses-unchecked"] !==
                    GM_config.get("canned-responses")
                )
                    alert(
                        "Invalid canned responses list. Ensure each response is in the proper format (see the wiki for more information).",
                    );
            },
        },
        css: "textarea {width: 100%; height: 160px; resize: vertical;}",
    });

    const profileMenu = document.querySelector("div.js-visitorMenuBody");
    if (profileMenu) {
        const profileMenuObserver = new MutationObserver(() => {
            // Manually performing querySelector here due to odd failure to identify added node by MutationObserver
            const tabPanes = profileMenu.querySelector("ul.tabPanes");
            if (tabPanes) {
                // Found tabbed menu (forum mod w/ bookmarks tab)
                const insertParent = tabPanes.querySelector("li.is-active");
                const insertBefore = insertParent?.querySelector(
                    ":scope > a.menu-linkRow",
                );
                if (insertBefore)
                    insertConfigButton(
                        insertParent as HTMLElement,
                        insertBefore as HTMLElement,
                    );
            } else if (profileMenu.querySelector("a.menu-linkRow")) {
                // Didn't find, but has menu buttons now (normal direct menu)
                const insertParent = profileMenu;
                const insertBefore = insertParent.querySelector(
                    ":scope > a.menu-linkRow",
                );
                if (insertBefore)
                    insertConfigButton(
                        insertParent as HTMLElement,
                        insertBefore as HTMLElement,
                    );
            } else return; // Still didn't find, wait for next mutation

            profileMenuObserver.disconnect();
        });
        profileMenuObserver.observe(profileMenu, {
            childList: true,
            subtree: true,
        });
    }
}

/**
 * Automatically authenthicates with MAUL in the background if it's been a while since the last authenthication
 */
function autoMAULAuth() {
    console.warn(
        "MAUL reauth feature is currently disabled due to issues with the feature. Your config settings have been preserved, and the feature will return once fixed.",
    );
    // if (!GM_config.get("maul-reauth-enable")) return;
    // const lastAuth = GM_getValue("lastMAULAuth", 0);
    // if (Date.now() - lastAuth < (GM_config.get("maul-reauth") as number))
    //     return;
    // const authLink = document.querySelector(
    //     'a.p-navEl-link[href^="/maul"]',
    // ) as HTMLAnchorElement;
    // if (!authLink) return;
    // GM_xmlhttpRequest({
    //     method: "GET",
    //     url: authLink.href,
    //     onload: function () {
    //         GM_setValue("lastMAULAuth", Date.now());
    //     },
    // });
}

/**
 * Loads completed threads map from config
 */
function loadCompletedMap() {
    const completedMapRaw = GM_config.get("move-to-completed") as string;
    if (completedMapRaw.length == 0) return;
    completedMapRaw.split(/\r?\n/).forEach((map) => {
        const parts = map.split(";");
        if (parts.length != 2) {
            alert("Invalid completed map: " + map);
            return;
        } else if (!parts[1].match(/\d+/)) {
            alert("Invalid ID: " + parts[1]);
        } else if (!parts[0].match(/\d+/)) {
            // Separate to provide update notice
            alert(
                `Invalid ID: ${parts[0]}.\nThe completed map format has been changed to use IDs instead of regexes. Please update your config.`,
            );
        }
        completedMap.push({
            originId: parts[0],
            completedId: parts[1],
        });
    });
}

/**
 * Loads the signature block list IDs from config
 */
function loadSignatureBlockList() {
    const signatureBlockListRaw = GM_config.get("signature-block") as string;
    signatureBlockListRaw.split(/\r?\n/).forEach((id) => {
        signatureBlockList.push(id);
    });
}

/**
 * Loads the navbar URL list from config
 */
function loadNavbarURLs() {
    const navbarURLsRaw = GM_config.get("navbar-urls") as string;
    if (navbarURLsRaw.length == 0) return;
    navbarURLsRaw.split(/\r?\n/).forEach((url) => {
        const parts = url.split(";");
        if (parts.length != 2) {
            alert("Invalid URL: " + url);
            return;
        }
        navbarURLs.push({
            text: parts[0],
            url: parts[1],
        });
    });
}

/**
 * Loads the navbar removals from config
 */
function loadNavbarRemovals() {
    const navbarRemovalsRaw = GM_config.get("navbar-removals") as string;
    if (navbarRemovalsRaw.length == 0) return;
    navbarRemovalsRaw.split(/\r?\n/).forEach((removal) => {
        navbarRemovals.push(removal.toLowerCase());
    });
}

/**
 * Loads the auto mention list from config
 */
function loadAutoMentionList() {
    const autoMentionListRaw = GM_config.get("auto-mention") as string;
    autoMentionListRaw.split(/\r?\n/).forEach((id) => {
        autoMentionForums.push(id);
    });
}

/**
 * Loads the canned responses from config
 */
function loadCannedResponses() {
    const cannedResponsesRaw = GM_config.get("canned-responses") as string;
    [
        ...cannedResponsesRaw.matchAll(
            /(?:===\n|^)- (?<name>.+)\n- (?<category>.+)\n(?<response>(?:.|\n)+?)\n===/gm,
        ),
    ].forEach((match) => {
        const category = match.groups!.category;
        if (!cannedResponses[category]) cannedResponses[category] = [];
        cannedResponses[category].push({
            name: match.groups!.name,
            response: match.groups!.response,
        });
    });
}

/**
 * Adds a MAUL profile button to the given div
 * @param {HTMLDivElement} div Div to add to
 * @param {number} member_id Member's ID
 */
function addMAULProfileButton(div: HTMLDivElement, member_id: number | string) {
    createButton(
        "https://maul.edgegamers.com/index.php?page=home&id=" + member_id,
        "MAUL",
        div,
        "_blank",
    );
}

/**
 * Adds a "Add Ban" button to the div
 * @param {HTMLDivElement} div Div to add to
 * @param {data} data Data to pass to the ban page
 */
function addAddBanButton(div: HTMLDivElement, data: AddBan_Data) {
    const urlData = LZString.compressToEncodedURIComponent(
        JSON.stringify(data),
    );
    createButton(
        `https://maul.edgegamers.com/index.php?page=editban#${urlData}`,
        "Add Ban",
        div,
        "_blank",
        false,
        document.querySelector(
            "a.button--link.button[href*='move']",
        ) as HTMLAnchorElement | null,
    );
}

/**
 * Adds a "List Bans" button to the div
 * @param {HTMLDivElement} div Div to add to
 * @param {number} steam_id_64 Steam ID to check
 * TODO: Add support for other game IDs
 */
function addBansButton(div: HTMLDivElement, steam_id_64: string) {
    createButton(
        "https://maul.edgegamers.com/index.php?page=bans&qType=gameId&q=" +
            steam_id_64,
        "List Bans",
        div,
        "_blank",
        false,
        document.querySelector(
            "a.button--link.button[href*='move']",
        ) as HTMLAnchorElement | null,
    );
}

/**
 * Adds a "Lookup ID" button to the div
 * @param {HTMLDivElement} div Div to add to
 * @param {string} post_title Title of the post
 */
function addLookupButton(div: HTMLDivElement, post_title: string) {
    const steam_id_unknown = post_title.match(
        /^.* - .* - (?<game_id>[\w\d\/\[\]\-\.:]*)$/,
    );
    if (steam_id_unknown)
        createButton(
            "https://steamid.io/lookup/" + steam_id_unknown.groups!.game_id,
            "Lookup ID",
            div,
            "_blank",
            false,
            document.querySelector(
                "a.button--link.button[href*='move']",
            ) as HTMLAnchorElement | null,
        );
}

/**
 * Adds a Move button to the div {@see handleThreadMovePage}
 * @param {HTMLDivElement} div Div to add to
 * @param {string} url URL to move to
 * @param {string} text Text for the button
 * @param {string} id Movement ID, this is a parameter in the URL that is used to determine where to move in the movement handling page
 */
function addMoveButton(
    div: HTMLDivElement,
    url: string,
    text = "Move to Completed",
    id = "to_completed",
) {
    const post_id = url.match(/threads\/(?<post_id>\d+)/);
    if (post_id)
        createButton(
            "https://www.edgegamers.com/threads/" +
                post_id.groups!.post_id +
                "/move#" +
                id,
            text,
            div,
            "_self",
        );
}

/**
 * Adds a button to move a thread to the trash, with a confirmation dialog (if enabled)
 * @param {HTMLDivElement} before Element to add button before
 */
function addTrashButton(before: HTMLDivElement) {
    const trashButton = document.createElement("a");
    const post_id = window.location.href.match(/threads\/(?<post_id>\d+)/);
    if (!post_id) return;
    trashButton.innerHTML = "Trash thread";
    trashButton.style.cursor = "pointer";
    trashButton.onclick = function () {
        if (!GM_config.get("confirm-trash") || confirm("Trash this thread?"))
            window.location.href =
                "https://www.edgegamers.com/threads/" +
                post_id!.groups!.post_id +
                "/move#685";
    };
    trashButton.classList.add("menu-linkRow");
    before.parentElement?.insertBefore(trashButton, before);
}

/**
 * Adds additional buttons to post action bars to make it easier to perform some actions.
 */
function addPostActionBarButtons() {
    const threadId = getThreadId();
    if (!threadId || threadId.length == 0) return;

    const posts = document.querySelectorAll(
        ".message.message--post",
    ) as NodeListOf<HTMLElement>;
    if (posts.length == 0) return;

    const isThreadUnapproved = document.querySelector(
        ".blockStatus-message--moderated",
    );

    for (let i = 0; i < posts.length; i++) {
        const post = posts[i] as HTMLElement;
        if (!post) continue;

        const actionBarSet = post.querySelector(
            ".actionBar-set.actionBar-set--internal",
        );

        if (!actionBarSet) continue;

        // There is no point in adding additional buttons on deleted posts currently.
        const isDeleted =
            post.classList.contains("message--deleted") ||
            post.querySelector(".messageNotice--deleted");
        if (isDeleted) continue;

        const postId = post.dataset.content?.substring(5);
        if (!postId) continue;

        let isUnapproved = post.querySelector(".messageNotice--moderated")
            ? true
            : false;

        let isThreadOP = false;

        // Check the post counter to see if it is the original post so we can make sure we change the button action correctly.
        if (i == 0) {
            const attributionListElements = post.querySelectorAll(
                ".message-attribution-opposite.message-attribution-opposite--list li",
            );
            for (let j = 0; j < attributionListElements.length; j++) {
                const element = attributionListElements[j] as HTMLElement;

                if (element.innerText == "#1") {
                    isThreadOP = true;
                    break;
                }
            }
        }

        if (isThreadOP && isThreadUnapproved) isUnapproved = true;

        const approvalButton = document.createElement("a");
        approvalButton.classList.add(
            "actionBar-action",
            "actionBar-action--menuItem",
        );
        approvalButton.setAttribute("tabindex", "0");

        if (isThreadOP) {
            approvalButton.innerText = isUnapproved
                ? "Approve Thread"
                : "Unapprove Thread";
        } else {
            approvalButton.innerText = isUnapproved ? "Approve" : "Unapprove";
        }

        approvalButton.onclick = () => {
            setPostApprovalStatus(threadId[1], postId, isUnapproved);
        };

        actionBarSet.appendChild(approvalButton);
    }
}

/**
 * Handles (un)approving a thread post by ID.
 */
async function setPostApprovalStatus(
    threadId: string,
    postId: string,
    approve: boolean,
    reload: boolean = true,
) {
    const xfToken = getXFToken();
    if (!xfToken) {
        console.error("Failed to get XF token");
        return;
    }

    // cookies cannot be set in the request unfortunately.
    document.cookie = `xf_inlinemod_post=${postId}; Path=/; Secure=true;`;

    const searchParams = new URLSearchParams({
        type: "post",
        _xfRequestUri: `/threads/${threadId}/`,
        _xfWithData: "1",
        _xfToken: xfToken,
        _xfResponseType: "json",
    });

    // First we send a GET to signify we want to do moderation actions with the given post.
    let response = await fetch(
        `https://www.edgegamers.com/inline-mod/?${searchParams.toString()}`,
        {
            credentials: "same-origin",
        },
    );

    if (!response.ok) {
        console.error("Failed to fetch inline-mod");
        document.cookie =
            "xf_inlinemod_post=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;";
        return;
    }

    searchParams.set("action", approve ? "approve" : "unapprove");

    // Then we send the POST with the actual mod actions
    response = await fetch("https://www.edgegamers.com/inline-mod/", {
        method: "POST",
        headers: {
            "Content-Type": "application/x-www-form-urlencoded",
        },
        credentials: "same-origin",
        body: searchParams,
    });

    document.cookie =
        "xf_inlinemod_post=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;";
    if (!response.ok) {
        console.error("Failed to change post approval status");
        return;
    }

    const data = await response.json();

    if (data.status != "ok") {
        console.error("Server rejected post approval change");
        console.log(data);
        return;
    }

    if (reload) window.location.reload();
}

async function editPost(
    threadId: string,
    postId: string,
    message: string,
    silent: boolean = false,
    clearEdits: boolean = false,
) {
    const xfToken = getXFToken();
    if (!xfToken) {
        console.error("Failed to get XF token");
        return;
    }

    const formdata = new FormData();
    formdata.append("_xfToken", xfToken);
    formdata.append("_xfInlineEdit", "1");
    formdata.append("_xfRequestUri", `/threads/${threadId}/`);
    formdata.append("_xfWithData", "1");
    formdata.append("_xfResponseType", "json");
    formdata.append("message", message);
    if (silent) formdata.append("silent", "1");
    if (clearEdits) formdata.append("clear_edit", "1");

    const response = await fetch(
        `https://www.edgegamers.com/posts/${postId}/edit`,
        {
            method: "POST",
            credentials: "same-origin",
            body: formdata,
        },
    );
    if (!response.ok) {
        console.error("Failed to edit post");
        return;
    }

    const data = await response.json();
    if (data.status != "ok") {
        console.error("Server rejected post edit");
        console.log(data);
        return;
    }
}

/**
 * Adds a NAV item to the website's nav bar
 * @param {string} href URL to link to
 * @param {string} text Text for button
 * @param {HTMLElement} nav Nav to add to
 * @returns void
 */
function addNav(href: string, text: string, nav: HTMLElement) {
    const li = document.createElement("li");
    const div = document.createElement("div");
    const a = document.createElement("a");
    a.href = href;
    a.innerHTML = text;
    a.target = "_blank";
    a.classList.add("p-navEl-link");
    div.classList.add("p-navEl");
    div.appendChild(a);
    li.appendChild(div);
    nav.insertBefore(li, nav.childNodes[nav.childNodes.length - 5]);
}

/**
 * Adds all nav buttons to the navbar
 */
function addNavButtons(urls: NavbarURL_Map[], nav: HTMLElement) {
    urls.forEach((url) => {
        addNav(url.url, url.text, nav);
    });
}

/**
 * Removes nav buttons from the navbar
 */
function removeNavButtons(removals: string[], nav: HTMLElement) {
    (
        nav.querySelectorAll(
            "li > div > a:first-of-type",
        ) as NodeListOf<HTMLAnchorElement>
    ).forEach((a) => {
        if (removals.includes(a.innerText.toLowerCase()))
            a.parentElement?.parentElement?.remove();
    });
}

/**
 * Replaces the logo link with a new one
 */
function replaceLogoLink() {
    if ((GM_config.get("logo-link") as string).length == 0) return;
    (
        document.querySelectorAll(
            "div.p-header-logo > a, div.p-nav-smallLogo > a",
        ) as NodeListOf<HTMLAnchorElement>
    ).forEach((a: HTMLAnchorElement) => {
        a.href = GM_config.get("logo-link") as string;
    });
}

/**
 * Adds dropdown options for MAUL specifically
 * @param {HTMLElement} nav_list Site's navbar
 * @returns void
 */
function addMAULNav(nav_list: HTMLUListElement) {
    if (GM_config.get("maul-dropdown")) {
        // MAUL DIV
        const maul_div = nav_list.childNodes[11].childNodes[1] as HTMLElement;
        maul_div
            .querySelector("a.p-navEl-link")
            ?.classList.add("p-navEl-link--splitMenu");
        maul_div.setAttribute("data-has-children", "true");
        const dropdown = document.createElement("a");

        dropdown.setAttribute("data-xf-key", "3");
        dropdown.setAttribute("data-xf-click", "menu");
        dropdown.setAttribute("data-menu-pos-ref", "< .p-navEl");
        dropdown.setAttribute("class", "p-navEl-splitTrigger");
        dropdown.setAttribute("role", "button");
        dropdown.setAttribute("tabindex", "0");
        dropdown.setAttribute("aria-label", "Toggle expanded");
        dropdown.setAttribute("aria-expanded", "false");
        dropdown.setAttribute("aria-haspopup", "true");

        maul_div.append(dropdown);

        const maul_dropdown = document.createElement("div");
        maul_dropdown.setAttribute("class", "menu menu--structural");
        maul_dropdown.setAttribute("data-menu", "menu");
        maul_dropdown.setAttribute("aria-hidden", "true");

        const dropdownhtml =
            '<div class="menu-content"> \
        <a href="https://maul.edgegamers.com/index.php?page=bans" target="_blank" class="menu-linkRow u-indentDepth0 js-offCanvasCopy " data-nav-id="maulBans">Bans</a> \
        <a href="https://maul.edgegamers.com/index.php?page=users" target="_blank" class="menu-linkRow u-indentDepth0 js-offCanvasCopy " data-nav-id="newProfilePosts">Users</a> \
        <hr class="menu-separator"> \
        </div>';

        maul_dropdown.innerHTML = dropdownhtml;
        maul_div.append(maul_dropdown);
    } else {
        addNav(
            "https://maul.edgegamers.com/index.php?page=bans",
            "Bans",
            nav_list,
        );
        addNav(
            "https://maul.edgegamers.com/index.php?page=users",
            "Users",
            nav_list,
        );
    }
}

/**
 * Get the content of the post box
 */
function getPostBox() {
    if (
        document.querySelector("#xfBbCode-1")?.classList.contains("fr-active")
    ) {
        // BBCode Editor
        const editors = document.querySelectorAll(
            'textarea.input[name="message"]',
        ) as NodeListOf<HTMLTextAreaElement>;
        return editors[editors.length - 1]?.value;
    } else {
        // Rich Editor
        const editors = document.querySelectorAll(
            "div.fr-element.fr-view",
        ) as NodeListOf<HTMLDivElement>;
        return editors[editors.length - 1]?.innerText;
    }
}

/**
 * Get the post box element
 * @returns The post box element
 */
function getPostBoxEl() {
    if (
        document.querySelector("#xfBbCode-1")?.classList.contains("fr-active")
    ) {
        // BBCode Editor
        const editors = document.querySelectorAll(
            'textarea.input[name="message"]',
        ) as NodeListOf<HTMLTextAreaElement>;
        return editors[editors.length - 1];
    } else {
        // Rich Editor
        const editors = document.querySelectorAll(
            "div.fr-element.fr-view",
        ) as NodeListOf<HTMLDivElement>;
        return editors[editors.length - 1];
    }
}

/**
 * Gets Steam ID 64 from an unknown format
 */
function getSteamID_F(unparsed_id: string): Promise<string> {
    return new Promise((resolve, reject) => {
        const steam_id_match = unparsed_id.match(
            /(\d{17})|(STEAM_\d:\d:\d+)|(\[U:\d:\d+\])/,
        );
        if (steam_id_match)
            try {
                const steam_id = steam_id_match[0];
                return resolve(
                    SteamIDConverter.isSteamID64(steam_id)
                        ? steam_id
                        : SteamIDConverter.toSteamID64(steam_id),
                );
            } catch (TypeError) {}
        if (!GM_config.get("lookup-unknown-ids"))
            return reject("Could not find Steam ID");
        const profile_id = unparsed_id.match(
            /^(.*id\/)?(?<game_id>[^\/\n\s]*)\/?$/,
        )?.groups?.game_id;
        if (!profile_id) return reject("Could not find Steam ID");
        GM_xmlhttpRequest({
            method: "GET",
            url: `https://api.findsteamid.com/steam/api/summary/${encodeURIComponent(
                profile_id as string,
            )}`,
            anonymous: true,
            timeout: 2500,
            responseType: "json",
            onload: (response) => {
                const data = response.response;
                if (data && data.length == 1) return resolve(data[0].steamid);
                reject("Could not find Steam ID");
            },
            onerror: (error) => {
                reject(error);
            },
            ontimeout: () => {
                reject("Timeout");
            },
        });
    });
}

function getXFToken() {
    return document.getElementById("XF")?.dataset.csrf;
}

/**
 * Add or append text to the post editor box
 * @param text Text to add to post box
 * @param append True to append text, false to replace
 */
function editPostBox(text: string, append: boolean = false) {
    if (
        document.querySelector("#xfBbCode-1")?.classList.contains("fr-active")
    ) {
        // BBCode Editor
        const editors = document.querySelectorAll(
            'div.message textarea.input[name="message"]',
        );
        const editor = editors[editors.length - 1] as HTMLTextAreaElement;
        editor.value = append ? editor.value + text : text;
    } else {
        // Rich Editor
        const editors = document.querySelectorAll("div.fr-element.fr-view");
        const editor = editors[editors.length - 1] as HTMLDivElement;
        editor.innerText = append ? editor.innerText.trim() + text : text;
        editor.dispatchEvent(new Event("mouseup"));
    }
}

/**
 * Get the ID of the current forum
 * @returns {string} Forum ID
 */
function getForumId() {
    return document
        .getElementById("XF")!
        .dataset.containerKey?.replace("node-", "");
}

/**
 * Gets the ID of the current thread
 * @returns {string} Thread ID
 */
function getThreadId() {
    return document
        .getElementById("XF")!
        .dataset.contentKey?.replace("thread-", "");
}

/**
 * Get the username of the current user
 * @returns {string} Username of current user
 */
function getUsername() {
    return (
        document.querySelector(
            "a.p-navgroup-link--user > span.p-navgroup-linkText",
        ) as HTMLSpanElement | null
    )?.innerText;
}

/**
 * Get the username of the OP of the current thread
 * @returns {string} Username of the OP
 */
function getOP() {
    return document.querySelector("a.username") as HTMLAnchorElement | null;
}

/**
 * Retrieves and displays ban information for a user
 */
function displayBanInfo(steam_id_64: string, insertBefore: HTMLElement) {
    GM_xmlhttpRequest({
        method: "GET",
        url: `https://maul.edgegamers.com/index.php?q=${steam_id_64}&qType=gameId&page=bans`,
        onload: function (res) {
            const display = document.createElement("div");
            display.style.textAlign = "center";
            display.style.marginBottom = "8px";
            insertBefore.parentElement?.insertBefore(display, insertBefore);

            if (
                !res.responseText ||
                res.responseText.includes("<title>Login | MAUL</title>")
            ) {
                if (!GM_config.get("ban-display-silent-fail"))
                    display.innerHTML =
                        "<i>Error retrieving ban information, not authenticated?</i>";
                return;
            }
            const html = new DOMParser().parseFromString(
                res.responseText,
                "text/html",
            );
            const latestBan = html.querySelector("table.table > tbody > tr") as
                | HTMLTableRowElement
                | undefined
                | null;
            if (!latestBan) {
                if (!GM_config.get("ban-display-silent-fail"))
                    display.innerHTML = "<i>No bans found.</i>";
                return;
            }

            display.style.display = "flex";
            const left = document.createElement("div");
            display.appendChild(left);
            left.style.flex = "1";
            left.style.paddingRight = "5px";
            const right = document.createElement("div");
            display.appendChild(right);
            right.style.flex = "3";
            right.style.paddingLeft = "5px";
            right.style.paddingTop = "2px";
            right.style.paddingBottom = "2px";
            right.style.border = "1px solid #3e3e42";
            right.style.borderRadius = "3px";

            const dataList = document.createElement("div");
            left.appendChild(dataList).classList.add("dataList");
            const table = document.createElement("table");
            dataList.appendChild(table).classList.add("dataList-table");
            const tableBody = document.createElement("tbody");
            table.appendChild(tableBody);

            /*
                0 - Date
                1 - Handle
                2 - Game ID
                3 - Admin Name
                4 - Duration
                5 - Reason (may be truncated with ...)
                6 - Actions (don't touch)
            */
            const cols = latestBan.querySelectorAll(
                "td",
            ) as NodeListOf<HTMLTableCellElement>;
            // Indexes change, there is always Division and Admins Online, but additional rows may be added if overflowed in the table
            const expand = html.getElementById(
                "expand_" + latestBan.dataset.num,
            )!;
            const expandColsHeader = expand.querySelectorAll(
                "span.pull-left:not(.col-xs-9)",
            ) as NodeListOf<HTMLSpanElement>;
            const expandColsData = expand.querySelectorAll(
                "span.pull-left.col-xs-9",
            ) as NodeListOf<HTMLSpanElement>;
            const expandCols: { [key: string]: string } = {};
            for (var i = 0; i < expandColsHeader.length; i++) {
                expandCols[expandColsHeader[i].innerText.replace(":", "")] =
                    expandColsData[i].innerText;
            }

            var expire = "Never";
            if (expandCols["Duration"] ?? cols[4].innerText != "Permanent") {
                expire = moment(expandCols["Date"] ?? cols[0].innerText)
                    .add(
                        Number(
                            (
                                (expandCols["Duration"] as string | null) ??
                                (cols[4].innerText as string)
                            )
                                .replaceAll("(", "")
                                .replaceAll(")", "")
                                .split(" ")
                                .slice(-1)[0],
                        ),
                        "minutes",
                    )
                    .format(
                        GM_config.get(
                            "ban-display-expiration-format",
                        ) as string,
                    );
            }

            if (
                !(
                    GM_config.get("ban-display-show-expired") ||
                    (expandCols["Duration"] ?? cols[4].innerText).includes(
                        "(",
                    ) ||
                    (expandCols["Duration"] ?? cols[4].innerText) == "Permanent"
                )
            ) {
                display.style.display = "block";
                if (GM_config.get("ban-display-silent-fail"))
                    display.innerHTML = "";
                else {
                    display.innerHTML = `<i>Not currently banned, last ban was <code>${
                        expandCols["Duration"] ?? cols[4].innerText
                    }</code> minutes for <code>${
                        new Option(expandCols["Reason"] ?? cols[5].innerText)
                            .innerHTML
                    }</code> and expired at <span title="placed ${
                        expandCols["Date"] ?? cols[0].innerText
                    }">${expire}</span></i>`;
                }
            }

            const banData: { [key: string]: string } = {};
            const allowedHTMLData = ["Banning Admin", "Duration", "Expires"]; // Only add sanitized or known safe fields
            // We're checking expandCols for everything on the off-chance they overflow, but the only ones that actually have before are Handle, Game ID, and Reason.
            if (GM_config.get("ban-display-show-date"))
                banData["Date"] = expandCols["Date"] ?? cols[0].innerText;
            if (GM_config.get("ban-display-show-handle"))
                banData["Handle"] = expandCols["Handle"] ?? cols[1].innerText;
            if (GM_config.get("ban-display-show-id"))
                banData["Game ID"] = expandCols["Game ID"] ?? cols[2].innerText;
            if (GM_config.get("ban-display-show-division"))
                banData["Division"] = expandCols["Division"];
            if (GM_config.get("ban-display-show-banning-admin"))
                banData["Banning Admin"] = (
                    expandCols["Banning Admin"] ?? cols[3].innerHTML
                ).replace(
                    'href="',
                    'target="_blank" href="https://maul.edgegamers.com/',
                ); // Hyperlink it
            if (GM_config.get("ban-display-show-admins-online"))
                banData["Admins Online"] = expandCols["Admins Online"];
            if (GM_config.get("ban-display-show-duration"))
                banData["Duration"] = `<span title="expires ${expire}">${
                    expandCols["Duration"] ?? cols[4].innerText
                }</span>`;
            if (GM_config.get("ban-display-show-expiration"))
                banData["Expires"] = `<span title="${
                    expandCols["Duration"] ?? cols[4].innerText
                } minutes">${expire}</span>`;
            if (GM_config.get("ban-display-show-reason"))
                banData["Reason"] = expandCols["Reason"] ?? cols[5].innerText;

            for (const [key, value] of Object.entries(banData)) {
                const row = document.createElement("tr");
                tableBody.appendChild(row).classList.add("dataList-row");
                const keyCell = document.createElement("td");
                row.appendChild(keyCell).classList.add(
                    "dataList-cell",
                    "small-cell",
                );
                keyCell.innerText = key;
                keyCell.style.textAlign = "left";
                const valueCell = document.createElement("td");
                row.appendChild(valueCell).classList.add(
                    "dataList-cell",
                    "small-cell",
                );
                if (allowedHTMLData.includes(key)) valueCell.innerHTML = value;
                else valueCell.innerText = value;
                valueCell.style.textAlign = "right";
            }

            const notes = html.getElementById(
                "notes_" + latestBan.dataset.num,
            )!.innerHTML;
            if (
                [...notes.matchAll(/<(.+?)>/g)].some(
                    (match) => match[1] != "br",
                )
            ) {
                // Failsafe checking, MAUL should always replace these with &lt; and &gt;, if they don't, something is wrong.
                display.style.display = "block";
                if (GM_config.get("ban-display-silent-fail"))
                    display.innerHTML = "";
                else
                    display.innerHTML =
                        "<i>Potential injection detected, aborting</i>";
                return;
            }
            const notesDiv = document.createElement("div");
            right.appendChild(notesDiv);
            var replacedNotes = notes;
            if (GM_config.get("ban-display-hyperlink")) {
                replacedNotes = replacedNotes
                    .replaceAll(/&amp;/g, "&")
                    .replaceAll(
                        /https?:\/\/(www\.)?[-a-zA-Z0-9.]{1,256}\.[a-zA-Z0-9]{2,6}\b(\/[-a-zA-Z0-9@:%_\+.~#?&\/=]*)/g,
                        '<a href="$&" target="_blank" rel="external"><u>$&</u></a>',
                    );
            }
            if (GM_config.get("ban-display-steamid"))
                // TODO: Allow user to customize this (like MAUL)
                replacedNotes = replacedNotes.replaceAll(
                    /(^|\s|[!"#$%&'()*+,\-.:;<=>?@[\]^`{|}~])(\d{17})($|\s|[!"#$%&'()*+,\-.:;<=>?@[\]^`{|}~])/g,
                    '$1<a href="https://maul.edgegamers.com/index.php?page=bans&qType=gameId&q=$2" target="_blank"><u>$2</u></a>$3',
                );
            notesDiv.innerHTML = replacedNotes;
            notesDiv.style.textAlign = "left";
            notesDiv.style.maxHeight = table.offsetHeight + "px";
            notesDiv.style.overflowY = "auto";
        },
    });
}

/**
 * Generates large, transparent text (basically a watermark)
 * @param {string} top CSS Top Style
 * @param {string} str Text to display
 */
function generateRedText(top: string, str: string = "Confidential") {
    const text = document.createElement("div");
    document.body.appendChild(text);

    text.innerHTML = str;
    text.style.color = "rgba(255,0,0,0.25)";
    text.style.fontSize = "100px";
    text.style.position = "fixed";
    text.style.top = top;
    text.style.left = "50%";
    text.style.transform = "translateX(-50%)";
    text.style.pointerEvents = "none";
    text.style.zIndex = "999";
}

/**
 * Fills in placeholders in a canned response string with the proper data then returns it
 */
function generateResponseText(response: string) {
    return response
        .replaceAll("{{{username}}}", getUsername() ?? "")
        .replaceAll("{{{op username}}}", getOP()?.innerText ?? "");
}

/**
 * Moves and auto-fills out the moving prompt for a thread.
 * @param {string} hash The hash of the URL, should be the thread ID only
 * @returns void
 */
function handleThreadMovePage(hash: string) {
    const completedId = hash.substring(1);
    if (!completedId) return;
    const form = document.forms[1];
    const drop = form.querySelector("select.js-nodeList") as HTMLSelectElement;
    const checkArr = Array.from(form.querySelectorAll(".inputChoices-choice"));
    const optArr = Array.from(drop.options);
    drop.selectedIndex = optArr.indexOf(
        optArr.find((el) => el.value == completedId!) as HTMLOptionElement,
    );
    if (drop.selectedIndex == -1) {
        throw "Could not find forum ID";
    }
    try {
        // These buttons may not exist if you created the post yourself, this is just to prevent edge cases.
        (
            checkArr
                .find(
                    (el) =>
                        el.textContent ===
                        "Notify members watching the destination forum",
                )
                ?.querySelector("label > input") as HTMLInputElement
        ).checked = false;
        (
            checkArr
                .find((el) =>
                    el.textContent?.startsWith(
                        "Notify thread starter of this action.",
                    ),
                )
                ?.querySelector("label > input") as HTMLInputElement
        ).checked = false;
    } catch {}
    form.submit();
}

/**
 * Checks if a given breadcrumbs string contains LE threads
 * @param {string} str
 * @returns true if LE, false otherwise
 */
function isLeadership(str: string) {
    return GM_config.get("confidential-reports")
        ? str.match(/(Leadership|Report a Player|Report Completed)/)
        : str.match(/Leadership/);
}

/**
 * Adds misc. threads to main thread list
 */
function handleForumsList() {
    const private_category = document.querySelector(
        ".block--category1240 > .block-container > .block-body",
    );

    const subforum = document.createElement("div");
    subforum.classList.add("node", "node--forum", "node--id685");

    const forumHtml = document.createElement("html");
    fetch("https://www.edgegamers.com/forums/685/").then(function (response) {
        response.text().then(function (text) {
            forumHtml.innerHTML = text;
            const thread = forumHtml.querySelector(
                ".js-threadList > :first-child",
            );

            // If the last thread in the bin is unread, mark the forum as unread
            if (thread?.classList.contains("is-unread")) {
                subforum.classList.add("node--unread");
            }
            const userHref = thread?.querySelector(
                ".structItem-cell--main > .structItem-minor > .structItem-parts > li > a",
            )?.outerHTML;
            const threadTitle = thread?.querySelector(
                ".structItem-cell--main > .structItem-title",
            )?.innerHTML; // Queryselector gets the parent and var references all children in case of prefixes
            const date = thread?.querySelector(
                ".structItem-cell--latest > a > time",
            )?.outerHTML;
            const icon = thread?.querySelector(
                ".structItem-cell--icon > .structItem-iconContainer > a",
            )?.outerHTML;

            subforum.innerHTML =
                '<div class="node-body"> <span class="node-icon" aria-hidden="true"> <i class="fa--xf far fa-comments" aria-hidden="true"></i> </span> <div class="node-main js-nodeMain"> <h3 class="node-title"> <a href="/forums/685/" data-xf-init="element-tooltip" data-shortcut="node-description" id="js-XFUniqueId87">Moderator Trash Bin</a> </h3> <div class="node-description node-description--tooltip js-nodeDescTooltip">Planes, Trains, and Plantains</div> <div class="node-meta"> <div class="node-statsMeta"> <dl class="pairs pairs--inline"> <dt>Threads</dt> <dd>18.2K</dd> </dl> <dl class="pairs pairs--inline"> <dt>Messages</dt> <dd>69.6K</dd> </dl> </div> </div> <div class="node-subNodesFlat"> <span class="node-subNodesLabel">Sub-forums:</span> </div> </div> <div class="node-stats"> <dl class="pairs pairs--rows"> <dt>Threads</dt> <dd>18.1K</dd> </dl> <dl class="pairs pairs--rows"> <dt>Messages</dt> <dd>98.4K</dd> </dl> </div> <div class="node-extra"> <div class="node-extra-icon">' +
                icon +
                '</div> <div class="node-extra-row">' +
                threadTitle +
                '</div> <div class="node-extra-row"> <ul class="listInline listInline--bullet"> <li> ' +
                date +
                '</li> <li class="node-extra-user">' +
                userHref +
                "</li> </ul> </div> </div> </div>";
            private_category?.appendChild(subforum);
        });
    });
}

/**
 * Handles generic/nonspecific threads
 */
function handleGenericThread() {
    const breadcrumbs = (
        document.querySelector(".p-breadcrumbs") as HTMLUListElement
    ).innerText;
    const forumId = getForumId();
    if (forumId) {
        if (appealForums.includes(forumId) || reportForums.includes(forumId))
            // Ban appeal or Report
            handleBanAppealReport(reportForums.includes(forumId));

        const button_group = document.querySelector("div.buttonGroup");
        for (var i = 0; i < completedMap.length; i++) {
            if (forumId == completedMap[i].originId) {
                addMoveButton(
                    button_group as HTMLDivElement,
                    window.location.href,
                    "Move to Completed",
                    completedMap[i].completedId,
                );
                break;
            }
        }

        if (forumId !== "685")
            // Trash Bin
            addTrashButton(
                button_group?.querySelector(
                    "div.menu > div.menu-content > a[href$=move]",
                ) as HTMLDivElement,
            );
    }
    if (isLeadership(breadcrumbs))
        // LE Forums
        handleLeadership();

    const observer = new MutationObserver((mutations) => {
        mutations.every((mutation) => {
            // Using every so that we can return false to stop observing
            if (!mutation.addedNodes) return true;

            for (let i = 0; i < mutation.addedNodes.length; i++) {
                const node = mutation.addedNodes[i];
                if (node.nodeName === "DIV") {
                    handlePostBox(observer);
                    return false;
                }
            }

            return true;
        });
    });
    observer.observe(document.body, {
        childList: true,
        subtree: true,
        attributes: false,
        characterData: false,
    });

    blockSignatures();
    addPostActionBarButtons();
}

/**
 * Adds "View Bans" or "Lookup ID" button on appeal/report threads.
 * TODO: Add support for other game IDs
 */
function handleBanAppealReport(report: boolean = false) {
    const post_title = (document.querySelector(".p-title") as HTMLDivElement)
        .innerText;
    const button_group = document.querySelector(
        "div.buttonGroup",
    ) as HTMLDivElement;
    addMAULProfileButton(
        button_group,
        (
            document.querySelector(
                ".message-name > a.username",
            ) as HTMLAnchorElement
        ).href.substring(35),
    );

    const title_match = post_title.match(
        /^(?<game>.*) - (?<handle>.*) - (.*?\/?(?<game_id>[\w\d\/\[\]\-\.: ]*).*)$/,
    );
    if (title_match) {
        getSteamID_F(title_match.groups!.game_id)
            ?.then((steam_id_64) => {
                if (report)
                    addAddBanButton(button_group, {
                        name: title_match.groups!.handle,
                        id: steam_id_64,
                        threadId: document
                            .getElementById("XF")!
                            .dataset.contentKey?.replace("thread-", ""),
                        reporter: getOP()?.innerText,
                        game: title_match.groups!.game,
                    });
                else if (GM_config.get("ban-display-enable")) {
                    if (GM_config.get("ban-display-hidden")) {
                        const button = document.createElement("a");
                        button.classList.add("button--link", "button");
                        button.onclick = () => {
                            button.remove();
                            displayBanInfo(
                                steam_id_64 as string,
                                document.querySelector(".p-body-main")!,
                            );
                        };

                        const button_text = document.createElement("span"); // Create button text
                        button_text.classList.add("button-text");
                        button_text.innerHTML = "Get Ban Info";

                        // Add all elements to their respective parents
                        button.appendChild(button_text);
                        button_group.insertBefore(
                            button,
                            button_group.lastElementChild,
                        );
                    } else
                        displayBanInfo(
                            steam_id_64,
                            document.querySelector(".p-body-main")!,
                        );
                }
                addBansButton(button_group, steam_id_64);
            })
            .catch(() => {
                if (GM_config.get("show-list-bans-unknown"))
                    addBansButton(button_group, post_title.split(" - ")[2]);
                addLookupButton(button_group, post_title);
            });
    } else {
        if (GM_config.get("show-list-bans-unknown"))
            addBansButton(button_group, post_title.split(" - ")[2]);
        addLookupButton(button_group, post_title);
    }
}

/**
 * Adds a button to open the script config in the user dropdown menu
 * @param insertParent The parent element to insert into
 * @param insertBefore The element to insert before
 * @returns void
 */
function insertConfigButton(
    insertParent: HTMLElement,
    insertBefore: HTMLElement,
) {
    const btn = document.createElement("a");
    btn.classList.add("menu-linkRow");
    btn.innerHTML = "Forum Enhancement Script Config";
    btn.style.cursor = "pointer";
    btn.onclick = function () {
        GM_config.open();
    };
    insertParent.insertBefore(btn, insertBefore);
}

/**
 * Adds Confidential banners on top and bottom of page
 * @returns void
 */
function handleLeadership() {
    if (GM_config.get("show-confidential-watermark")) {
        generateRedText("5%");
        generateRedText("80%");
    }
}

/**
 * Mention the original poster in a thread
 * @param focus Whether to focus the post box after mentioning the user
 */
function autoMention(focus: boolean) {
    const user = getOP();
    if (!user) return;
    const username = user.innerText;
    const userId = user.dataset.userId;
    if (username && userId && getPostBox()?.trim().length == 0) {
        editPostBox(
            `[USER=${userId}]@${username}[/USER]${"\n".repeat(
                GM_config.get("auto-mention-newlines") as number,
            )}`,
        );
        if (focus) getPostBoxEl().focus();
    }
}

/**
 * Handles adding auto counting functionality to the post box
 */
function autoCount() {
    if (getPostBox()?.trim().length != 0) return;
    // For some reason using a[class=""] doesn't work, so we have to use a:not(a[class])
    const posts = document.querySelectorAll(
        "header.message-attribution > ul.message-attribution-opposite > li > a:not(a[class])",
    ) as NodeListOf<HTMLAnchorElement>;
    if (posts.length == 0) return;
    const lastNum = Number(
        posts[posts.length - 1].innerText.substring(1).replaceAll(",", ""),
    ); // Remove the # and commas from the post number
    editPostBox(`${lastNum + 1}`);
}

/**
 * Handles operations that should be performed when the post box is loaded
 * @param observer
 */
function handlePostBox(observer: MutationObserver) {
    const postBox = document.querySelector("div.fr-box") as HTMLDivElement;
    if (!postBox) return;
    const forumId = getForumId();
    observer.disconnect();

    if (forumId && autoMentionForums.includes(forumId)) handleAutoMention();
    if (
        GM_config.get("autofill-counting") &&
        window.location.href.startsWith(countingURL)
    )
        handleAutoCount();
    handleCannedResponses();
    if (GM_config.get("enable-post-unapprove-btn"))
        handleUnapprovePost(postBox);
}

/**
 * Handles adding auto mention functionality to the post box
 */
function handleAutoMention() {
    const postBox = document.querySelector("div.fr-box") as HTMLDivElement;
    if (GM_config.get("auto-mention-onclick")) {
        function autoMentionListener() {
            autoMention(true);
            postBox.removeEventListener("click", autoMentionListener);
        }
        postBox.addEventListener("click", autoMentionListener);
    } else {
        postBox.click();
        autoMention(GM_config.get("auto-mention-focus") as boolean);
    }
}

/**
 * Handles automatic counting
 */
function handleAutoCount() {
    const postBox = document.querySelector("div.fr-box") as HTMLDivElement;
    function autoCountListener() {
        autoCount();
        postBox.removeEventListener("click", autoCountListener);
    }
    postBox.addEventListener("click", autoCountListener);
}

/**
 * Handles adding canned responses to the post box
 */
function handleCannedResponses() {
    const bar = document.querySelector(
        "div.formButtonGroup-extra",
    ) as HTMLDivElement;
    if (!bar) {
        console.warn("Could not find post box button bar");
        return;
    }
    if (GM_config.get("canned-responses-hide-scrollbar")) {
        // @ts-ignore - Firefox only
        bar.style.scrollbarWidth = "none";
        // @ts-ignore - Webkit only
        bar.style.webkitScrollbar = "none";
    }
    bar.style.whiteSpace = "nowrap";
    bar.style.overflowX = "auto";
    Object.entries(cannedResponses).forEach((cannedResponse) => {
        const [category, responses] = cannedResponse;
        const dropdown = document.createElement("span");
        dropdown.classList.add("p-navEl-splitTrigger"); // Adds various styling for dropdowns, technically for the navbar but it works here
        dropdown.style.float = "none"; // Class makes it float left, so we need to override it
        dropdown.style.textAlign = "center";
        dropdown.style.lineHeight = bar.clientHeight + "px";
        dropdown.style.paddingLeft = "8px";
        dropdown.dataset.category = category;
        dropdown.innerText = category;

        const dropdownMenu = document.createElement("div");
        dropdownMenu.classList.add(
            "menu",
            "menu--structural",
            "menu--potentialFixed",
            "menu--left",
        );
        dropdownMenu.style.zIndex = "800";
        dropdownMenu.style.display = "none";
        dropdownMenu.style.position = "fixed";
        dropdownMenu.style.minWidth =
            GM_config.get("canned-response-min-width") + "px";
        dropdownMenu.style.overflow = "auto";
        if (GM_config.get("canned-responses-hide-scrollbar")) {
            // @ts-ignore - Firefox only
            dropdownMenu.style.scrollbarWidth = "none";
            // @ts-ignore - Webkit only
            dropdownMenu.style.webkitScrollbar = "none";
        }
        dropdownMenu.hidden = true;

        dropdown.append(dropdownMenu);
        dropdown.addEventListener("mouseover", function () {
            var rect = dropdown.getBoundingClientRect();
            dropdownMenu.hidden = false;
            dropdownMenu.style.display = "block";
            dropdownMenu.style.top = rect.bottom + "px";
            dropdownMenu.style.left = rect.left + "px";
            dropdownMenu.style.maxHeight =
                window.innerHeight - rect.top - 25 + "px";
            dropdownMenu.style.maxWidth =
                window.innerWidth - rect.left - 25 + "px";
            dropdownContent.style.maxHeight = dropdownMenu.style.maxHeight;
            dropdownMenu.classList.add("is-active");
        });
        dropdown.addEventListener("mouseout", function () {
            dropdownMenu.hidden = true;
            dropdownMenu.style.display = "none";
            dropdownMenu.classList.remove("is-active");
        });

        const dropdownContent = document.createElement("div");
        dropdownContent.classList.add("menu-content");
        dropdownContent.style.overflow = "none";
        if (GM_config.get("canned-responses-hide-scrollbar")) {
            // @ts-ignore - Firefox only
            dropdownContent.style.scrollbarWidth = "none";
            // @ts-ignore - Webkit only
            dropdownContent.style.webkitScrollbar = "none";
        }
        dropdownMenu.append(dropdownContent);
        bar.append(dropdown);

        responses.forEach((response) => {
            const btn = document.createElement("a");
            btn.classList.add("menu-linkRow", "u-indentDepth0");
            btn.innerText = response.name;
            btn.style.cursor = "pointer";
            btn.style.paddingLeft = "4px";
            btn.style.paddingRight = "0px";
            btn.style.paddingTop = "1px";
            btn.style.paddingBottom = "1px";
            btn.addEventListener("click", function () {
                const postBox = getPostBoxEl();
                if (GM_config.get("canned-response-trigger-automention")) {
                    const forumId = getForumId();
                    if (forumId && autoMentionForums.includes(forumId))
                        autoMention(false);
                }
                editPostBox(generateResponseText(response.response), true);
                dropdown.dispatchEvent(new MouseEvent("mouseout"));
                postBox.dispatchEvent(new Event("autosize:update"));
                if (GM_config.get("canned-response-focus")) postBox.focus();
            });
            dropdownContent.append(btn);
        });
    });
}

/**
 * Handles adding a post & unapprove button to the postbox
 */
function handleUnapprovePost(postBox: HTMLDivElement) {
    if (
        !document.querySelector("#xfBbCode-1")?.classList.contains("fr-active")
    ) {
        if (GM_config.get("rich-override"))
            console.warn(
                "Post box is in rich editor mode, but rich editor override is enabled. The rich editor is NOT supported.",
            );
        else return;
    }
    const threadId = getThreadId();
    const threadBody = document.querySelector(
        "div.block-body.js-replyNewMessageContainer",
    ) as HTMLDivElement;
    const postButton = document.querySelector(
        "button.button--icon--reply:not(#post-unapprove-button)",
    ) as HTMLButtonElement;
    const postUnapproveButton = document.createElement("a"); // Using a so that it doesn't submit the form
    postUnapproveButton.classList.add(
        "button--primary",
        "button",
        "button--icon",
        "button--icon--reply",
    );
    postUnapproveButton.style.marginRight = "4px";
    postUnapproveButton.id = "post-unapprove-button";
    postUnapproveButton.innerHTML = '<span class="button-text">UA</span>';
    postUnapproveButton.title = "Post & Unapprove";

    postUnapproveButton.addEventListener("click", function () {
        const postBoxContent = getPostBox();
        if (!postBoxContent) return;
        editPostBox("🐰🥚", false);
        postButton.click();

        const observer = new MutationObserver((mutations) => {
            mutations.every((mutation) => {
                if (!mutation.addedNodes) return true;
                for (let i = 0; i < mutation.addedNodes.length; i++) {
                    const node = mutation.addedNodes[i] as HTMLElement;
                    if (node.nodeName === "ARTICLE") {
                        const postId = node.dataset.content?.replaceAll(
                            "post-",
                            "",
                        );
                        if (threadId && postId)
                            setPostApprovalStatus(
                                threadId,
                                postId,
                                false,
                                false,
                            ).then(() => {
                                editPost(
                                    threadId,
                                    postId,
                                    postBoxContent,
                                    true,
                                ).then(() => {
                                    window.location.reload();
                                });
                            });
                        observer.disconnect();
                        return false;
                    }
                }
            });
        });
        observer.observe(threadBody, {
            childList: true,
            subtree: true,
            attributes: false,
            characterData: false,
        });
    });

    postButton.parentElement?.insertBefore(postUnapproveButton, postButton);
}

/**
 * Changes the target of the application links to open in a new tab
 * @returns void
 */
function handleApplicationPage() {
    const children = (
        document.querySelector(
            ".dataList-row > .dataList-cell > a",
        ) as HTMLAnchorElement
    ).parentElement?.children;
    if (!children) return;
    Array.from(children).forEach(function (button) {
        button.setAttribute("target", "_blank");
    });
}

/**
 * Hides signatures behind a button, and prevents loading of most content (img, video, iframe)
 */
function blockSignatures() {
    if (signatureBlockList.length == 0) return;
    document.querySelectorAll("div.message-inner").forEach((post) => {
        const userId = (
            post.querySelector("a.username[data-user-id]") as
                | HTMLAnchorElement
                | undefined
        )?.dataset.userId;
        if (userId != null && signatureBlockList.includes(userId)) {
            const signature = post.querySelector(
                "aside.message-signature > div",
            ) as HTMLDivElement;
            // iframe's are added after page load, using a MutationObserver to work around that
            function signatureEvent(target: HTMLElement) {
                if (!(target.nodeName === "IFRAME")) return;
                (target as HTMLIFrameElement).dataset.src = (
                    target as HTMLIFrameElement
                ).src;
                (target as HTMLIFrameElement).src = "about:blank";
            }
            const signatureObserver = new MutationObserver((mutations) => {
                mutations.every((mutation) => {
                    mutation.addedNodes.forEach((node) => {
                        signatureEvent(node as HTMLElement);
                    });
                });
            });
            signatureObserver.observe(signature, {
                childList: true,
                subtree: true,
            });
            // Set the SRC of content to nothing (data:,), empty string is not used as it may cause additional requests to the page
            // Issue originated back in 2009, unsure if it is still a problem but best to lean on the safe side.
            // Was fixed in FireFox a while ago, not sure about Chrome
            (
                signature.querySelectorAll(
                    "img[src]",
                ) as NodeListOf<HTMLImageElement>
            ).forEach((img) => (img.src = "data:,"));
            (
                signature.querySelectorAll(
                    "video[poster]",
                ) as NodeListOf<HTMLVideoElement>
            ).forEach((video) => {
                video.dataset.poster = video.poster;
                video.poster = "data:,";
            });
            (
                signature.querySelectorAll(
                    "source[src]",
                ) as NodeListOf<HTMLSourceElement>
            ).forEach((source) => {
                source.dataset.src = source.src;
                source.src = "data:,";
            });
            signature.style.display = "none";
            const btn = document.createElement("button");
            // Button to restore everything
            btn.onclick = function () {
                signature.style.display = "";
                (
                    signature.querySelectorAll(
                        "img[src][data-url]",
                    ) as NodeListOf<HTMLImageElement>
                ).forEach((img) => {
                    img.src = img.dataset.url as string;
                });
                (
                    signature.querySelectorAll(
                        "iframe[src][data-src]",
                    ) as NodeListOf<HTMLIFrameElement>
                ).forEach((iframe) => {
                    iframe.src = iframe.dataset.src as string;
                    delete iframe.dataset.src;
                });
                (
                    signature.querySelectorAll(
                        "video[poster][data-poster]",
                    ) as NodeListOf<HTMLVideoElement>
                ).forEach((video) => {
                    video.poster = video.dataset.poster as string;
                    delete video.dataset.poster;
                });
                (
                    signature.querySelectorAll(
                        "source[src][data-src]",
                    ) as NodeListOf<HTMLSourceElement>
                ).forEach((source) => {
                    source.src = source.dataset.src as string;
                    delete source.dataset.src;
                });
                signatureObserver.disconnect();
                btn.remove();
            };
            btn.innerHTML = "Load Signature";
            btn.classList.add("button--link", "button");
            btn.style.cursor = "pointer";
            btn.style.display = "block";
            btn.style.margin = "auto";
            signature.parentElement?.appendChild(btn);
        }
    });
}

(function () {
    // Setup configuration
    setupForumsConfig();
    loadCompletedMap();
    loadSignatureBlockList();
    loadNavbarURLs();
    loadNavbarRemovals();
    loadAutoMentionList();
    loadCannedResponses();

    // Determine what page we're on
    const url = window.location.href;
    const hash = window.location.hash;

    // Add Helpful Links to the Navigation Bar
    const nav_list = document.querySelector(".p-nav-list") as HTMLUListElement;
    addMAULNav(nav_list);
    // Reauthenthicate with MAUL if need be
    autoMAULAuth();

    addNavButtons(navbarURLs, nav_list);
    removeNavButtons(navbarRemovals, nav_list);
    replaceLogoLink();

    if (
        url.match(
            /^^https:\/\/www\.edgegamers\.com\/threads\/\d+\/move(?:#\d+)?$/,
        ) &&
        hash != ""
    )
        // Thread Move Page
        handleThreadMovePage(hash);
    else if (url.match(/^https:\/\/www\.edgegamers\.com\/forums\/?$/))
        // Forums List
        handleForumsList();
    else if (url.match(/^https:\/\/www\.edgegamers\.com\/application\/\d+\/?$/))
        // Application Page
        handleApplicationPage();
    else if (!url.match(/^https:\/\/(www\.)?edgegamers\.com\/-\/$/))
        handleGenericThread();
})();