userscripts/Compass QoL Enhancer.user.js

// ==UserScript==
// @name        Compass QoL Enhancer
// @namespace   blankie-scripts
// @match       http*://*.compass.education/*
// @version     1.2.0
// @author      blankie
// @description A userscript that adds small but useful features for Compass, such as the ability to close windows by clicking on the background
// @inject-into page
// @run-at      document-end
// ==/UserScript==

"use strict";

let qolTabOpened = false;
// needed because .toString() adds a trailing = for empty values
function serializeURLSearchParams(query) {
    let out = "";
    for (let [key, value] of query) {
        if (out) {
            out += "&";
        }
        // required for session/... or activity/...
        out += encodeURIComponent(key).replaceAll("%2F", "/");
        if (value) {
            out += `=${encodeURIComponent(value)}`;
        }
    }
    return out;
}
function getPanelItemHash(panelId, isDefault) {
    if (window.location.pathname === "/Organise/Activities/Activity.aspx") {
        let query = new URLSearchParams(window.location.hash.substring(1));
        if (panelId === "learningtasks") {
            query.delete("qol_open_tab");
            query.set("openLearningTaskTab", "");
        } else if (isDefault) {
            query.delete("qol_open_tab");
            query.delete("openLearningTaskTab");
        } else {
            query.set("qol_open_tab", panelId);
            query.delete("openLearningTaskTab");
        }
        return `#${serializeURLSearchParams(query)}`;
    }

    return `#${encodeURIComponent(panelId)}`;
}

let observer = new MutationObserver(function(mutations) {
    for (let mutation of mutations) {
        if (mutation.type !== "childList") {
            continue;
        }
        for (let node of mutation.addedNodes) {
            handleNewNode(node);
        }
    }
});
observer.observe(document.body, {childList: true, subtree: true});

function handleNewNode(node) {
    if (node.nodeType !== 1) {
        return;
    }

    if (node.localName === "div" && node.classList.contains("ext-cal-evt")) {
        handleNewCalendarEvent(node);
    } else if (node.classList.contains("ext-cal-hd-ct")) {
        // learning tasks need to be handled seperately for some reason
        for (let element of node.querySelectorAll("div.ext-cal-evt")) {
            handleNewCalendarEvent(element);
        }
    } else if (!qolTabOpened && node.classList.contains("x-panel")) {
        qolTabOpened = true;
        let tabToOpen = window.location.hash.substring(1);
        if (window.location.pathname === "/Organise/Activities/Activity.aspx") {
            tabToOpen = (new URLSearchParams(tabToOpen)).get("qol_open_tab");
        }
        let panel = unsafeWindow.Ext.getCmp(node.id);
        for (let i = 0; i < panel.items.items.length; i++) {
            handlePanelItem(panel, panel.items.items[i], i === 0, tabToOpen);
        }
    }
}

document.body.addEventListener("click", function(event) {
    // Add the ability to close windows by clicking on the background
    if (!event.target.classList.contains("x-mask")) {
        return;
    }
    let maskZIndex = BigInt(event.target.style.zIndex);
    for (let maskMsg of document.querySelectorAll(".x-mask-msg")) {
        if (BigInt(maskMsg.style.zIndex) >= maskZIndex && maskMsg.style.display !== "none") {
            return;
        }
    }

    document.querySelector(".x-window-closable.x-window-active .x-tool-close").click();
}, {passive: true});

function handleNewCalendarEvent(element) {
    // Turn each calendar event into a link so that Link Hints can recognize it
    let a = document.createElement("a");
    for (let attr of element.attributes) {
        a.setAttribute(attr.name, attr.value);
    }
    // fix learning tasks shrinking for some reason
    a.style.display = "block";
    a.replaceChildren(...element.childNodes);
    let preventCompassHandler = false;

    if (a.classList.contains("activity-type-1")) {
        // Add a link for activities/"standard classes"
        // missing targetUserId parameter, shouldn't matter too much if you're a student
        let eventId = /\bcalendar-event-(\d+)\b/.exec(a.className)[1];
        a.href = `/Organise/Activities/Activity.aspx#session/${eventId}`;
        preventCompassHandler = true;
    } else if (a.classList.contains("activity-type-10")) {
        // Add a link for learning tasks
        // missing userId parameter, shouldn't matter too much if you're a student
        a.href = "/Records/User.aspx#learningTasks";
        preventCompassHandler = true;
    }

    // prevent ctrl-clicking from changing the current tab
    // it seems like the link thing actually effectively killed the default handler anyway
    if (preventCompassHandler) {
        a.addEventListener("click", function(event) {
            event.stopImmediatePropagation();
        }, {passive: true});
    }

    element.replaceWith(a);
}

function handlePanelItem(panel, panelItem, isDefault, tabToOpen) {
    let panelId = panelItem.itemId || panelItem.id;
    // i don't know why but dashboard is dsh
    if (window.location.pathname === "/Records/User.aspx" && panelId === "dashboard") {
        panelId = "dsh";
    }

    // Automatically open tab specified in fragment
    if (panelId === tabToOpen) {
        panel.setActiveTab(panelItem);
    }

    panelItem.tab.preventDefault = false;
    let panelItemHash = getPanelItemHash(panelId, isDefault);
    panelItem.tab.el.dom.href = panelItemHash;

    panelItem.tab.el.dom.addEventListener("click", function(event) {
        if (event.ctrlKey) {
            event.stopImmediatePropagation();
            return;
        }
        // prevent the browser from scrolling to the body
        event.preventDefault();
        if (panelItemHash !== window.location.hash) {
            // Automatically add a reference to the tab when it is clicked
            history.pushState("", "", panelItemHash);
        }
    });
}

// Suppress that annoying barebones context menu that only has Copy
// why is it not obvious that you can just hold ctrl or shift to suppress it???
// i know it's compass' fault but i'm still frustrated
// unsafeWindow.CKEDITOR may not be set if you're on the login page, for example
if (unsafeWindow.CKEDITOR) {
    let originalOn = unsafeWindow.CKEDITOR.dom.domObject.prototype.on;
    unsafeWindow.CKEDITOR.dom.domObject.prototype.on = function(type, listener) {
        // https://stackoverflow.com/a/10815581
        if (type !== "contextmenu") {
            return originalOn.apply(this, arguments);
        }
    };
}

// Uncheck the Remember Me button by default
if (window.location.pathname === "/login.aspx") {
    document.querySelector("#rememberMeChk").checked = false;
}