Power+ Userscript Loader

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

当前为 2022-01-14 提交的版本,查看 最新版本

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

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

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==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
        })
    }
})();