Merge pull request #306 from aopell/develop

Version 7.8

css/all.css

@@ -168,6 +168,41 @@ video.easter-egg {
     overflow: auto;
 }
 
+.splus-modal-contents.ui-tabs {
+    border: none !important;
+    background: none !important;
+}
+
+.splus-modal-contents select {
+    font-size: 16px !important;
+}
+
+.splus-modal-contents .ui-tabs-nav {
+    background-color: var(--primary-color) !important;
+    border: none !important;
+    border-bottom: 1px solid var(--primary-color) !important;
+}
+
+.splus-modal-contents.ui-tabs .ui-tab {
+    background-color: var(--primary-color) !important;
+    border: none !important;
+}
+
+.splus-modal-contents.ui-tabs .ui-tab .ui-tabs-anchor {
+    color: var(--contrast-text-color) !important;
+    font-size: 14px;
+    text-decoration: underline;
+}
+
+.splus-modal-contents.ui-tabs .ui-tab.ui-tabs-active {
+    background-color: var(--background-color) !important;
+}
+
+.splus-underline-heading {
+    text-decoration: underline;
+    margin-bottom: 5px;
+}
+
 @-webkit-keyframes animatetop {
     from {
         top: -300px;
@@ -276,6 +311,7 @@ video.easter-egg {
     display: flex;
     align-items: center;
     justify-content: space-between;
+    margin: 0 10px;
 }
 
 .settings-actions-wrapper {
@@ -324,6 +360,39 @@ input[type=text].setting-item {
     font-size: 80%;
 }
 
+.sortable-container {
+    display: flex;
+}
+
+.sortable-container .sidebar-sortable {
+    background-color: var(--primary-color) !important;
+    min-height: 200px;
+    padding: 5px;
+}
+
+.sortable-container .sortable-list {
+    margin: 10px;
+    width: 50%;
+}
+
+.sortable-container .sortable-list .sortable-item::before {
+    content: "⡇";
+    padding-right: 5px;
+}
+
+.sortable-container .sortable-list .sortable-item {
+    background-color: var(--background-color);
+    color: var(--contrast-text-color) !important;
+    font-size: 14px;
+    padding: 7px 5px 5px 5px;
+    margin: 5px;
+    cursor: grab;
+}
+
+.sortable-container .sortable-list .ui-sortable-helper {
+    cursor: grabbing;
+}
+
 .hierarchical-grading-report.show-title.interactive {
     padding: 10px 0 !important;
 }
@@ -347,6 +416,14 @@ input[type=text].setting-item {
     padding-top: 5px !important;
 }
 
+.grade-active-color {
+    color: #3aa406;
+}
+
+.grade-none-color {
+    color: #767676;
+}
+
 .profile-picture img.imagecache-profile_sm {
     width: 50px !important;
     height: 50px !important;
@@ -528,18 +605,6 @@ the selector matches inside notifications in the new notifs dropdown
     visibility: var(--help-center-fab-visibility) !important;
 }
 
-.overdue-submissions-wrapper {
-    display: var(--overdue-assignments-display) !important;
-}
-
-.upcoming-events-wrapper {
-    display: var(--upcoming-assignments-display) !important;
-}
-
-.quick-access-wrapper {
-    display: var(--quick-access-display) !important;
-}
-
 .quick-link-wrapper {
     padding-top: 5px;
 }
@@ -766,6 +831,21 @@ a._3_bfp {
     display: none !important;
 }
 
+/* ---- Hotfix for missized timer icons ---- */
+.upcoming-list .upcoming-event {
+    align-items: flex-start !important;
+}
+
+.upcoming-list .upcoming-event * {
+    flex-basis: fit-content;
+}
+
+.upcoming-list .upcoming-event > .infotip.submission-infotip {
+    margin-top: 2rem !important;
+    display: var(--to-do-list-icons-display, "block");
+}
+/* ---------------------------------------- */
+
 .splus-mark-completed-check .infotip {
     width: 90% !important;
 }

css/grades.css

@@ -4,14 +4,6 @@
     font-size: 14px;
 }
 
-.grade-active-color {
-    color: #3aa406;
-}
-
-.grade-none-color {
-    color: #767676;
-}
-
 tr.item-row td.grade-column div.td-content-wrapper {
     padding: 7px 10px 5px !important;
     text-align: center;

css/modern/all.css

@@ -3386,3 +3386,11 @@ variable-intellisense {
 [modern=true]:root #grade-comment-field {
   background-color: var(--primary);
 }
+
+[modern=true]:root .splus-modern-border-radius {
+  border-radius: var(--border-radius);
+}
+
+[modern=true]:root .splus-modern-padding {
+  padding: var(--padding);
+}

css/theme-editor.css

@@ -805,4 +805,8 @@ a[href].link-color {
 
 #modern-wrapper .row .input-field.col.s12.m6 {
     padding-top: 5px;
+}
+
+input::placeholder {
+    color: rgba(42, 42, 42, 0.5);
 }

js/all-idle.js

@@ -402,7 +402,11 @@ function parseSettingsHash() {
         if (hashes.length > 2) {
             setTimeout(() => {
                 location.hash = hashes[2];
-                document.getElementById(hashes[2]).parentElement.parentElement.classList.add("setting-highlight");
+                let settingEntry = document.getElementById(hashes[2]).parentElement.parentElement;
+                let settingTab = settingEntry.parentElement;
+                let tabIndex = Array.from(settingTab.parentElement.children).indexOf(settingTab) - 1;
+                $(".splus-settings-tabs").tabs("option", "active", tabIndex);
+                settingEntry.classList.add("setting-highlight");
                 location.hash = "";
             }, 500);
         }

js/all.js

@@ -286,6 +286,7 @@ let modals = [
                         { name: "@jetline0", url: "https://github.com/jetline0" },
                         { name: "@dsnsgithub", url: "https://github.com/dsnsgithub" },
                         { name: "@senoj26", url: "https://github.com/senoj26" },
+                        { name: "@TheThonos", url: "https://github.com/TheThonos" },
                     ])
                 }),
             ]),
@@ -661,6 +662,11 @@ function openOptionsMenu(settingsModal) {
         settingsModal.body.appendChild(getModalContents());
         settingsModal.element.querySelector("#open-changelog").addEventListener("click", () => openModal("changelog-modal"), { once: true });
         settingsModal.element.querySelector("#open-contributors").addEventListener("click", () => openModal("contributors-modal"), { once: true });
+        Setting.onShown();
+        $(".splus-settings-tabs").tabs({
+            active: 0,
+            heightStyle: "fill"
+        });
     });
 }
 
@@ -1142,7 +1148,7 @@ async function createQuickAccess() {
             createSvgLogo("splus-logo-inline"),
             // createElement("img", ["splus-logo-inline"], { src: chrome.runtime.getURL("imgs/plus-icon.png"), title: "Provided by Schoology Plus" }),
             createElement("span", [], { textContent: "Quick Access" }),
-            createElement("a", ["quick-right-link", "splus-track-clicks"], { id: "quick-access-splus-settings", textContent: "Settings", href: "#splus-settings#setting-input-quickAccessVisibility" })
+            createElement("a", ["quick-right-link", "splus-track-clicks"], { id: "quick-access-splus-settings", textContent: "Customize Sidebar", href: "#splus-settings#setting-input-sidebarSectionOrder" })
         ]),
         createElement("div", ["date-header", "first"], {}, [
             createElement("h4", [], { textContent: "Pages" })
@@ -1216,17 +1222,7 @@ async function createQuickAccess() {
         }
     }
 
-    switch (Setting.getValue("quickAccessVisibility")) {
-        case "belowOverdue":
-            rightCol.querySelector(".overdue-submissions").insertAdjacentElement("afterend", wrapper);
-            break;
-        case "bottom":
-            rightCol.append(wrapper);
-            break;
-        default:
-            rightCol.prepend(wrapper);
-            break;
-    }
+    rightCol.append(wrapper);
 }
 
 function indicateSubmittedAssignments() {
@@ -1383,7 +1379,18 @@ function indicateSubmittedAssignments() {
         // check if reload is present and visible on page
         let reloadButton = upcomingList.querySelector("button.button-reset.refresh-button");
         if (reloadButton && reloadButton.offsetParent !== null) {
-            reloadButton.addEventListener("click", () => setTimeout(indicateSubmitted, 500));
+            reloadButton.addEventListener("click", () => setTimeout(() => {
+                indicateSubmitted();
+
+                try {
+                    document.getElementById("todo")?.remove();
+                    let overdueHeading = document.querySelector(`${SIDEBAR_SECTIONS_MAP["Overdue"].selector} h4`);
+                    overdueHeading?.replaceWith(createElement("h3", [], {style: {textTransform: "capitalize"}, textContent: overdueHeading.textContent.toLowerCase()}));
+                    let upcomingHeading = document.querySelector(`${SIDEBAR_SECTIONS_MAP["Upcoming"].selector} h4`);
+                    upcomingHeading?.replaceWith(createElement("h3", [], {style: {textTransform: "capitalize"}, textContent: upcomingHeading.textContent.toLowerCase()}));
+                }
+                catch {}
+            }, 500));
         } else {
             // loaded properly
             // clear out old assignments from local cache which aren't relevant anymore

js/default-themes.js

@@ -6,6 +6,9 @@
     await loadDependencies("default-themes", []);
 })();
 
+const LAUSD_THEMES = ["LAUSD Orange", "LAUSD Dark Blue", "LAUSD 2019"];
+const CLASSIC_THEMES = ["Schoology Plus", "Rainbow"]
+
 let __defaultThemes = [
     {
         "name": "Schoology Plus Modern Light",

js/home.js

@@ -101,18 +101,7 @@ function formatDateAsString(date) {
 
 if (homeFeedContainer && Setting.getValue("broadcasts") !== "disabled") {
     (async function () {
-        try {
-            let onlineBroadcasts = await (await fetch("https://schoologypl.us/alert.json")).json();
-
-            let readBroadcasts = localStorage.getItem("splus-readBroadcasts");
-            readBroadcasts = readBroadcasts === null ? [] : JSON.parse(readBroadcasts);
-
-            saveBroadcasts(onlineBroadcasts.filter(b => !readBroadcasts.includes(b.id)));
-        } catch (err) {
-            // Ignore
-        }
-
-        let observer = new MutationObserver(function (mutations) {
+        let observer = new MutationObserver(async function (mutations) {
             if (mutations.length == 0) {
                 return;
             }
@@ -121,16 +110,34 @@ if (homeFeedContainer && Setting.getValue("broadcasts") !== "disabled") {
             // style is set on homeFeedContainer whenever Schoology decides to unhide it (static CSS sets display: none), i.e. when it's finished loading
             // once this happens, we can do our thing
 
-            let unreadBroadcasts = Setting.getValue("unreadBroadcasts");
-            for (let broadcast of unreadBroadcasts || []) {
-                if (!broadcast.expires || broadcast.expires > Date.now()) {
+            let unreadBroadcasts = Setting.getValue("unreadBroadcasts") || [];
+            let onlineBroadcasts = [];
+
+            try {
+                onlineBroadcasts = await (await fetch("https://schoologypl.us/alert.json")).json();
+
+                let readBroadcasts = localStorage.getItem("splus-readBroadcasts");
+                readBroadcasts = readBroadcasts === null ? [] : JSON.parse(readBroadcasts);
+
+                onlineBroadcasts = onlineBroadcasts.filter(b => !readBroadcasts.includes(b.id) && !unreadBroadcasts.map(u => u.id).includes(b.id));
+            } catch (err) {
+                // Ignore
+            }
+
+            let unexpiredBroadcasts = [];
+            for (let broadcast of [...unreadBroadcasts, ...onlineBroadcasts]) {
+                if (
+                    (!broadcast.expires || broadcast.expires > Date.now())
+                    && (!broadcast.version || compareVersions(chrome.runtime.getManifest().version, broadcast.version) >= 0)
+                ) {
                     feed.insertAdjacentElement("afterbegin", postFromBroadcast(broadcast));
-                } else {
-                    unreadBroadcasts.splice(unreadBroadcasts.findIndex(x => x.id == broadcast.id), 1);
-                    Setting.setValue("unreadBroadcasts", unreadBroadcasts);
+                    unexpiredBroadcasts.push(broadcast);
                 }
             }
 
+            // remove expired broadcasts
+            Setting.setValue("unreadBroadcasts", unexpiredBroadcasts);
+
             // then disconnect
             observer.disconnect();
         });
@@ -142,9 +149,59 @@ if (homeFeedContainer && Setting.getValue("broadcasts") !== "disabled") {
     })();
 }
 
+function reorderSidebar() {
+    let sidebar = document.getElementById("right-column-inner");
+    let sidebarOrder = Setting.getValue("sidebarSectionOrder");
+    let excluded = sidebarOrder?.exclude || [];
+    let included = (Array.from(sidebarOrder?.include || [])).reverse();
+
+    for (let section of Array.from(SIDEBAR_SECTIONS).reverse()) {
+        if (!included.includes(section.name) && !excluded.includes(section.name)) {
+            if (section) {
+                let element = document.querySelector(section.selector);
+                if (element) {
+                    sidebar.insertAdjacentElement("afterbegin", element);
+                }
+            }
+        }
+    }
+
+    for (let sectionName of included) {
+        let section = SIDEBAR_SECTIONS_MAP[sectionName];
+        if (section) {
+            let element = document.querySelector(section.selector);
+            if (element) {
+                sidebar.insertAdjacentElement("afterbegin", element);
+            }
+        }
+    }
+
+    for (let sectionName of excluded) {
+        let section = SIDEBAR_SECTIONS_MAP[sectionName];
+        if (section) {
+            let element = document.querySelector(section.selector);
+            if (element) {
+                element.style.display = "none";
+            }
+        }
+    }
+
+    try {
+        document.getElementById("todo")?.remove();
+        let overdueHeading = document.querySelector(`${SIDEBAR_SECTIONS_MAP["Overdue"].selector} h4`);
+        overdueHeading?.replaceWith(createElement("h3", [], {style: {textTransform: "capitalize"}, textContent: overdueHeading.textContent.toLowerCase()}));
+        let upcomingHeading = document.querySelector(`${SIDEBAR_SECTIONS_MAP["Upcoming"].selector} h4`);
+        upcomingHeading?.replaceWith(createElement("h3", [], {style: {textTransform: "capitalize"}, textContent: upcomingHeading.textContent.toLowerCase()}));
+    }
+    catch {}
+}
+
 (function () {
     indicateSubmittedAssignments();
     createQuickAccess();
+    setTimeout(() => {
+        reorderSidebar();
+    }, 500);
 })();
 
 Logger.debug("Finished loading home.js");