Power+ Userscript Loader

An alternate, customizable loader for Power+ (powerplus.app)

Od 14.01.2022.. Pogledajte najnovija verzija.

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

// ==UserScript==
// @name         Power+ Userscript Loader
// @namespace    https://powerplus.app/
// @version      1.2
// @description  An alternate, customizable loader for Power+ (powerplus.app)
// @author       jottocraft
// @license      MIT
// @icon         https://powerplus.app/favicon.png
// @grant        none
// @run-at       document-start
// @match        https://*.instructure.com/*
// ==/UserScript==

(function () {
    'use strict';

    if ((window.location.pathname === "/power+/") || (window.location.pathname === "/power+")) {
        var s;

        //Check for light or dark theme
        var light = false;
        if (window.localStorage.fluidTheme == "light") {
            light = true;
        } else if (((window.localStorage.fluidTheme == "system") || (window.localStorage.fluidTheme == "auto")) && !window.matchMedia("(prefers-color-scheme: dark)").matches) {
            light = true;
        }

        //Replace canvas 404 page with Power+
        const observer = new MutationObserver(mutations => {
            mutations.forEach(({ addedNodes }) => {
                addedNodes.forEach(node => {
                    //Power+ preloader
                    if (node.nodeType === 1 && node.tagName === 'BODY') {
                        node.innerHTML = /*html*/`
                          <div dtps="true" id="dtpsNativeOverlay" style="background-color: inherit; position: fixed; top: 0px; left: 0px; width: 100%; height: 100vh; z-index: 99;text-align: center;z-index: 999;transition: opacity 0.2s;">
                            <img dtps="true" style="height: 100px; margin-top: 132px;" src="${light ? "https://i.imgur.com/0WzWwb1.png" : "https://i.imgur.com/7dDUVh2.png"}" />
		                	        <br dtps="true" />
                            <div dtps="true" class="progress"><div id="dtpsLoadingScreenBar" dtps="true" class="indeterminate"></div></div>
                            <style dtps="true">body {background-color: ${light ? "white" : "#151515"}; --crxElements: ${light ? "#ececec" : "#2b2b2b"}; --crxText: ${light ? "#333" : "#efefef"}; overflow: hidden;}*,:after,:before{box-sizing:border-box}.progress{background:var(--crxElements);position:relative;width:600px;height:5px;overflow:hidden;border-radius:12px;backdrop-filter:opacity(.4);display:inline-block;margin-top:75px}.progress .indeterminate{position:absolute;background:#e3ba4b;height:5px;animation:indeterminate 1.4s infinite;animation-timing-function:linear}@keyframes indeterminate{0%{width:5%;left:-15%}to{width:100%;left:110%}}p{font-family:BlinkMacSystemFont,-apple-system,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",Helvetica,Arial,sans-serif;color: var(--crxText);margin-top: 24px;}</style>
                          </div>
                        `;
                    } else if (node.nodeType === 1 && node.tagName === 'HEAD') {
                        node.innerHTML = /*html*/`
                             <link dtps="true" rel="shortcut icon" href="https://powerplus.app/favicon.png" type="image/png">
                             <meta dtps="true" name="viewport" content="width=device-width, initial-scale=1">
                             <meta dtps="true" charset="utf-8">
                             <title dtps="true">Power+</title>
                             <meta dtps="true" name="description" content="A better UI for Canvas LMS">
                             <meta dtps="true" name="author" content="jottocraft">
                        `;
                    } else if (node.nodeType === 1 && node.tagName === 'SCRIPT' && (node.textContent && node.textContent.includes('"current_user"'))) {
                        //Do nothing for node containing enviornment data for faster load times
                    } else if (node.nodeType === 1 && node.getAttribute("dtps") != "true") {
                        //Node is not added by dtps
                        node.remove();
                    }
                })
            })
        })

        //Start MutationObserver
        observer.observe(document.documentElement, {
            childList: true,
            subtree: true
        });

        //Get Power+ base URL
        var baseURL = "https://powerplus.app";
        if (window.localStorage.dtpsLoaderPref === "local") {
            baseURL = "http://localhost:2750";
        }

        //Set DTPS loader parameters
        s = document.createElement("script");
        s.textContent = "window.dtpsPreLoader = true;window.dtpsBaseURL = '" + baseURL + "'";
        s.async = false;
        s.setAttribute("dtps", "true");
        document.documentElement.appendChild(s);

        //Load jQuery
        s = document.createElement("script");
        s.src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js";
        s.async = false;
        s.setAttribute("dtps", "true");
        document.documentElement.appendChild(s);

        //Wait for page to load
        window.onload = function () {
            //Stop observer
            observer.disconnect();

            //Determine LMS script to load
            var lmsScript = null;
            if (window.location.hostname.startsWith("dtechhs")) {
                lmsScript = "dtech";
            } else {
                lmsScript = "canvas";
            }

            //Check for debugging LMS overrides
            if (window.localStorage.dtpsLMSOverride) lmsScript = window.localStorage.dtpsLMSOverride;

            //Add script to DOM
            s = document.createElement("script");
            s.src = baseURL + "/scripts/lms/" + lmsScript + ".js";
            s.async = false;
            s.setAttribute("dtps", "true");
            document.documentElement.appendChild(s);
            s.onerror = function () {
                //Couldn't load debugging script, fallback to production
                if (window.localStorage.dtpsLoaderPref && (window.localStorage.dtpsLoaderPref !== "prod")) {
                    console.log("[DTPS CHROME] Failed to load debugging script. Falling back to production.");
                    window.localStorage.dtpsLoaderPref = "prod";
                    window.location.reload();
                } else {
                    document.getElementById("dtpsLoadingScreenBar").style.animationPlayState = "paused";
                    document.getElementById("dtpsLoadingScreenStatus").innerText = "Could not load Power+. Please try again later.";
                }
            };
        }
    } else {
        var releaseType = null;
        if (window.localStorage.dtpsLoaderPref == "local") releaseType = "Power+ (local)";

        const observer = new MutationObserver(mutations => {
            mutations.forEach(({ addedNodes }) => {
                addedNodes.forEach(node => {
                    //Power+ button
                    if (node.nodeType === 1 && node.id == "menu") {
                        node.insertAdjacentHTML("beforeend", /*html*/`
                          <li class="menu-item ic-app-header__menu-list-item ">
                            <a id="global_nav_dtps_link" role="button" href="/power+/" class="ic-app-header__menu-list-link">
                              <div class="menu-item-icon-container" aria-hidden="true">
                                <svg xmlns="http://www.w3.org/2000/svg" class="ic-icon-svg ic-icon-svg--dtps" version="1.1" viewBox="0 0 48 63.999"><path d="m5.333 0c-2.946 0-5.333 2.4-5.333 5.333v48c0 2.933 2.388 5.333 5.333 5.333h5.333v5.333l6.667-5.333 6.667 5.333v-5.333h18.667c2.947 0 5.333-2.4 5.333-5.333v-2.667c0 2.933-2.387 5.333-5.333 5.333h-18.667v-5.333h-13.333v5.333h-4c-2.209 0-4-1.867-4-4 0-2.4 1.791-4 4-4h36c2.947 0 5.333-2.4 5.333-5.333v-37.333c0-2.933-2.387-5.333-5.333-5.333h-37.333z"/></svg>
                              </div>
                              <div class="menu-item__text">${releaseType || "Power+"}</div>
                            </a>
                          </li>
                        `);
                    }
                })
            })
        })

        // Starts the monitoring
        observer.observe(document.documentElement, {
            childList: true,
            subtree: true
        })
    }
})();