From fe657e8d995759da0a63ad866ded5633020871b6 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Mon, 8 Jun 2020 12:10:50 -0700 Subject: [PATCH 01/27] Allow repositioning of Quick Access Closes #191 --- js/home.js | 12 +++++++++++- js/preload.js | 12 ++++++++++-- 2 files changed, 21 insertions(+), 3 deletions(-) diff --git a/js/home.js b/js/home.js index 312a8138..add824dd 100644 --- a/js/home.js +++ b/js/home.js @@ -140,7 +140,17 @@ async function createQuickAccess() { } } - rightCol.prepend(wrapper); + 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; + } } if (Setting.getValue("broadcasts") !== "disabled") { diff --git a/js/preload.js b/js/preload.js index 45a4d9eb..5d8a03d6 100644 --- a/js/preload.js +++ b/js/preload.js @@ -615,15 +615,23 @@ function updateSettings(callback) { new Setting( "quickAccessVisibility", "Quick Access", - "Enables or disables the quick access panel on the home page", + "[Reload Required to Reposition] Changes the visibility of the Quick Access panel on the homepage", "enabled", "select", { options: [ { - text: "Enabled", + text: "Top of Right Sidebar", value: "enabled" }, + { + text: "Between Overdue and Upcoming", + value: "belowOverdue" + }, + { + text: "Bottom of Right Sidebar", + value: "bottom" + }, { text: "Disabled", value: "disabled" From e0af7a23362d1d4e82df8313c7260d347cffc6f4 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Mon, 8 Jun 2020 15:18:25 -0700 Subject: [PATCH 02/27] Added dark theme beta test --- css/all.css | 3 +- css/dark.css | 173 ++++++++++++++++++++++++++++++++++++++++++++++++++ js/all.js | 4 ++ js/preload.js | 2 +- manifest.json | 3 +- 5 files changed, 182 insertions(+), 3 deletions(-) create mode 100644 css/dark.css diff --git a/css/all.css b/css/all.css index 658056b8..0305c573 100644 --- a/css/all.css +++ b/css/all.css @@ -607,7 +607,8 @@ body #grading-group- span.ajax-post-comment, span[role=button], .period-row .title, .category-row .title, -._2mWUT a { +._2mWUT a, +div._3U8Br { color: var(--hover-color) !important; } diff --git a/css/dark.css b/css/dark.css new file mode 100644 index 00000000..8eaf4694 --- /dev/null +++ b/css/dark.css @@ -0,0 +1,173 @@ +* { + --primary: #36393F; + --accent: #2F3136; + --dark: #202225; + --text: #DCDDDE; + --muted-text: #72767D; + --input: #40444B; +} + +/* General */ + +h1, +h2, +h3, +h4, +h5, +h6, +p { + color: var(--text) !important; +} + +textarea, +select, +input[type=text] { + background-color: var(--input) !important; + color: var(--text) !important; + border: none !important; + border-radius: 5px !important; +} + +ul.context-menu-list, +ul.context-menu-list li.context-menu-item { + background-color: var(--dark) !important; + color: var(--text) !important; + border-color: var(--accent) !important; +} + +ul.context-menu-list li.context-menu-item:hover { + color: var(--primary) !important; + background-color: var(--text) !important; +} + +/* Courses and Groups Dropdown */ +.splus-courses-navbar-button div[role=menu], +.splus-groups-navbar-button div[role=menu] { + background-color: var(--accent) !important; +} + +.splus-coursesdropdown-reorder-btn { + filter: invert(1) !important; +} + +.splus-courses-navbar-button article, +.splus-courses-navbar-button article a, +.splus-groups-navbar-button article, +.splus-groups-navbar-button article a { + border: 2px solid transparent !important; + outline: none !important; +} + +.splus-courses-navbar-button article a:hover, +.splus-groups-navbar-button article a:hover { + border: 2px solid var(--text) !important; + border-radius: 5px !important; +} + +.Card-card-image-uV6Bu { + border-top-left-radius: 5px !important; + border-top-right-radius: 5px !important; +} + +.Card-card-data-17m6S, +.Card-card-data-17m6S div { + border-bottom-left-radius: 5px !important; + border-bottom-right-radius: 5px !important; +} + +.splus-courses-navbar-button article a div, +.splus-groups-navbar-button article a div { + background-color: var(--primary) !important; +} + +.splus-courses-navbar-button article a div div._1wP6w, +.splus-groups-navbar-button article a div div._1wP6w { + color: var(--text) !important; +} + +.splus-courses-navbar-button article a div div._2wOCj, +.splus-groups-navbar-button article a div div._2wOCj { + color: var(--muted-text) !important; +} + +/* Footer */ +#site-navigation-footer, +footer, +footer div { + background-color: var(--dark) !important; +} + +/* Modal Red Color */ +.close-button, +.restore-defaults { + color: #f44336 !important; +} + + +/* Home Page */ +#body, +#center div#main, +#main-inner, +.splus-modal-body { + background-color: var(--primary) !important; + color: var(--text) !important; +} + +#right-column-inner div, +#home-feed-container, +.feed-comments { + background-color: var(--accent) !important; + color: var(--text) !important; +} + +.date-header h4 span { + color: var(--text) !important; +} + +.gray, +.upcoming-time { + color: var(--muted-text) !important; +} + +img.splus-logo-inline { + filter: brightness(1) !important; +} + +/* Grades Page */ +#main-content-wrapper, +#center-top { + background-color: var(--primary) !important; + color: var(--text) !important; + border: none !important; +} + +.gradebook-course.hierarchical-grading-report .period-row .grade-column, +.gradebook-course.hierarchical-grading-report .category-row .grade-column, +.gradebook-course.hierarchical-grading-report .item-row .grade-column, +.grade-active-color, +.awarded-grade span { + color: #8bc34a !important; +} + +.due-date, +.max-grade, +.percentage-contrib, +span.comment, +.grade-none-color, +.course-grade-text, +.total-points-wrapper *, +.percentage-grade, +.no-grade { + color: var(--text) !important; +} + +div.summary-course { + background-color: var(--accent) !important; + color: var(--text) !important; + border: none !important; + border-radius: 5px !important; +} + +img.splus-coursegradebox-taint { + filter: brightness(1) !important; +} \ No newline at end of file diff --git a/js/all.js b/js/all.js index e88da94d..32c36b1e 100644 --- a/js/all.js +++ b/js/all.js @@ -14,6 +14,10 @@ } ); } + + if(Setting.getValue("beta") == "darktheme") { + document.head.append(createElement("link", [], {rel: "stylesheet", href: chrome.runtime.getURL("/css/dark.css") })); + } } // Check Schoology domain diff --git a/js/preload.js b/js/preload.js index 5d8a03d6..10a64dd6 100644 --- a/js/preload.js +++ b/js/preload.js @@ -40,7 +40,7 @@ var firstLoad = true; updateSettings(); var beta_tests = { - // "darktheme": "https://schoologypl.us", + "darktheme": "https://schoologypl.us", // "newgrades": "https://schoologypl.us" }; diff --git a/manifest.json b/manifest.json index 4a21a3e9..24639932 100644 --- a/manifest.json +++ b/manifest.json @@ -40,7 +40,8 @@ "imgs/*", "lib/js/pdf.worker.js", "theme-editor.html", - "default-icons.html" + "default-icons.html", + "css/dark.css" ], "content_security_policy": "script-src 'self'; object-src 'self'", "background": { From cf1ff9097fc311e774c5dd72d2db726c7388ddcc Mon Sep 17 00:00:00 2001 From: Glen Husman Date: Mon, 8 Jun 2020 16:08:49 -0700 Subject: [PATCH 03/27] Fix grades denominator fetching Fixes #192 --- js/grades.js | 62 +++++++++++++++++++++++++++++++++++++++++++--------- 1 file changed, 52 insertions(+), 10 deletions(-) diff --git a/js/grades.js b/js/grades.js index 306c6bc9..ef308110 100644 --- a/js/grades.js +++ b/js/grades.js @@ -1011,18 +1011,60 @@ var fetchQueue = []; noGrade.insertAdjacentElement("afterend", maxGrade); let f = async () => { - Logger.log(`Fetching max points for (nonentered) assignment ${assignment.dataset.id.substr(2)}`); - let response = await fetchApi(`users/${getUserId()}/grades?section_id=${courseId}`); - if (!response.ok) { - throw { status: response.status, error: response.statusText }; + let domAssignId = assignment.dataset.id.substr(2); + Logger.log(`Fetching max points for (nonentered) assignment ${domAssignId}`); + + let response = null; + let firstTryError = null; + + try { + response = await fetchApi(`sections/${courseId}/assignments/${domAssignId}`); + } catch (err) { + firstTryError = err; + } + + if (response && !response.ok) { + firstTryError = { status: response.status, error: response.statusText }; + } else if (response) { + try { + let json = await response.json(); + + if (json && json.max_points !== undefined) { + // success case + // note; even if maxGrade is removed from the DOM, this will still work + maxGrade.textContent = " / " + json.max_points; + maxGrade.classList.remove("no-grade"); + } else { + firstTryError = "JSON returned without max points"; + } + } catch (err) { + firstTryError = err; + } + } else if (!firstTryError) { + firstTryError + "Unknown error fetching API response"; } - let json = await response.json(); - if (json && json.section.length > 0) { - // success case - // note; even if maxGrade is removed from the DOM, this will still work - maxGrade.textContent = " / " + json.section[0].period[0].assignment.filter(x => x.assignment_id == Number.parseInt(assignment.dataset.id.substr(2)))[0].max_points; - maxGrade.classList.remove("no-grade"); + if (!firstTryError) return; + + Logger.log(`Error directly fetching max points for (nonentered) assignment ${domAssignId}, reverting to list-search`); + + try { + response = await fetchApi(`users/${getUserId()}/grades?section_id=${courseId}`); + if (!response.ok) { + throw { status: response.status, error: response.statusText }; + } + let json = await response.json(); + + if (json && json.section.length > 0) { + // success case + // note; even if maxGrade is removed from the DOM, this will still work + maxGrade.textContent = " / " + json.section[0].period[0].assignment.filter(x => x.assignment_id == Number.parseInt(domAssignId))[0].max_points; + maxGrade.classList.remove("no-grade"); + } else { + throw "List search failed to obtain meaningful response"; + } + } catch (err) { + throw { listSearchErr: err, firstTryError: firstTryError }; } }; fetchQueue.push(f); From 59f7f94abd8a769a0850c8ce5fac51ba66e21b7b Mon Sep 17 00:00:00 2001 From: Glen Husman Date: Mon, 8 Jun 2020 16:28:39 -0700 Subject: [PATCH 04/27] Clean up a failure on material tooltip generation --- js/materials.js | 38 +++++++++++++++++++++----------------- 1 file changed, 21 insertions(+), 17 deletions(-) diff --git a/js/materials.js b/js/materials.js index 1cfbb703..1b665e17 100644 --- a/js/materials.js +++ b/js/materials.js @@ -271,10 +271,10 @@ // load grade information for this class, call grade hooks // this object contains ALL grades from this Schoology account, "keyed" by annoying IDs - // TODO Schoology API docs say this is paged, we should possible account for that? - let myGrades = await fetchApiJson(`/users/${userId}/grades`); + // they're filtered to this section though + let myGrades = await fetchApiJson(`/users/${userId}/grades?section_id=${classId}`); - let thisClassGrades = myGrades.section.find(x => x.section_id == classId); + let thisClassGrades = myGrades.section[0]; // start building our return object, which will follow a nicer format loadedGradeContainer = {}; @@ -284,23 +284,27 @@ loadedGradeContainer.dropboxes = {}; loadedGradeContainer.gradeDrops = {}; - // gradebook categories - for (let gradeCategory of thisClassGrades.grading_category) { - loadedGradeContainer.categories[gradeCategory.id] = gradeCategory; - Object.freeze(gradeCategory); - } + if (thisClassGrades) { - Object.freeze(loadedGradeContainer.categories); + // gradebook categories + for (let gradeCategory of thisClassGrades.grading_category) { + loadedGradeContainer.categories[gradeCategory.id] = gradeCategory; + Object.freeze(gradeCategory); + } - // assignment grades - // period is an array of object - // period[x].assignment is an array of grade objects (the ones we want to enumerate) - for (let assignment of thisClassGrades.period.reduce((accum, curr) => accum.concat(curr.assignment), [])) { - loadedGradeContainer.grades[assignment.assignment_id] = assignment; - Object.freeze(assignment); - } + Object.freeze(loadedGradeContainer.categories); - Object.freeze(loadedGradeContainer.grades); + // assignment grades + // period is an array of object + // period[x].assignment is an array of grade objects (the ones we want to enumerate) + for (let assignment of thisClassGrades.period.reduce((accum, curr) => accum.concat(curr.assignment), [])) { + loadedGradeContainer.grades[assignment.assignment_id] = assignment; + Object.freeze(assignment); + } + + Object.freeze(loadedGradeContainer.grades); + + } let missingAssignmentCt = 0; let missingAssignmentErrorCt = 0; From e5d3669f71f75c6a626a3b6c4b79d04d928a3d37 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Mon, 8 Jun 2020 16:53:06 -0700 Subject: [PATCH 05/27] Updated dark theme --- css/all.css | 4 ++++ css/dark.css | 35 +++++++++++++++++++++++++++++++++++ js/all-idle.js | 2 +- 3 files changed, 40 insertions(+), 1 deletion(-) diff --git a/css/all.css b/css/all.css index 0305c573..c447e44f 100644 --- a/css/all.css +++ b/css/all.css @@ -649,4 +649,8 @@ div.courses-left-menu, .portfolio-list a.btn, a._3_bfp { color: white !important; +} + +.setting-highlight { + color: lightyellow !important; } \ No newline at end of file diff --git a/css/dark.css b/css/dark.css index 8eaf4694..22947d06 100644 --- a/css/dark.css +++ b/css/dark.css @@ -103,6 +103,9 @@ footer div { color: #f44336 !important; } +.setting-highlight { + background-color: rgb(184, 134, 11, 0.2) !important; +} /* Home Page */ #body, @@ -133,6 +136,10 @@ img.splus-logo-inline { filter: brightness(1) !important; } +.splus-broadcast-post { + background-color: rgba(0, 255, 255, 0.1) !important; +} + /* Grades Page */ #main-content-wrapper, #center-top { @@ -170,4 +177,32 @@ div.summary-course { img.splus-coursegradebox-taint { filter: brightness(1) !important; +} + +/* Mastery Page */ +#s-js-student-mastery-report-view-content { + background-color: var(--primary) !important; +} + +/* Courses Page */ +.course-action-btns, +.group-action-btns { + padding: 10px !important; + border-radius: 5px !important; +} + +#secondary-tabs-wrapper { + border-right: none !important; +} + +/* Search Bar */ +ul.Search-dropdown-3huUv { + border: none !important; + background-color: var(--accent) !important; +} + +.Search-dropdown-3huUv input { + background-color: var(--input) !important; + color: var(--text) !important; + border-bottom: 1px solid transparent !important; } \ No newline at end of file diff --git a/js/all-idle.js b/js/all-idle.js index e3dc81df..3b180040 100644 --- a/js/all-idle.js +++ b/js/all-idle.js @@ -352,7 +352,7 @@ function parseSettingsHash() { if (hashes.length > 2) { setTimeout(() => { location.hash = hashes[2]; - document.getElementById(hashes[2]).parentElement.parentElement.style.backgroundColor = "lightyellow"; + document.getElementById(hashes[2]).parentElement.parentElement.classList.add("setting-highlight"); location.hash = ""; }, 500); } From 1281ea72e5812022775549df6e8d705efe8c1228 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Mon, 8 Jun 2020 21:56:27 -0700 Subject: [PATCH 06/27] Added quick access to dashboard; Force theme with dark theme beta --- css/all.css | 4 ++ js/all.js | 100 +++++++++++++++++++++++++++++++++++++++++++++++- js/dashboard.js | 1 + js/home.js | 78 ------------------------------------- manifest.json | 11 ++++++ 5 files changed, 114 insertions(+), 80 deletions(-) create mode 100644 js/dashboard.js diff --git a/css/all.css b/css/all.css index c447e44f..8b9984e0 100644 --- a/css/all.css +++ b/css/all.css @@ -653,4 +653,8 @@ a._3_bfp { .setting-highlight { color: lightyellow !important; +} + +.course-dashboard section.sgy-card img.injected-course-icon { + height: 80% !important; } \ No newline at end of file diff --git a/js/all.js b/js/all.js index 32c36b1e..12a53b99 100644 --- a/js/all.js +++ b/js/all.js @@ -15,8 +15,26 @@ ); } - if(Setting.getValue("beta") == "darktheme") { - document.head.append(createElement("link", [], {rel: "stylesheet", href: chrome.runtime.getURL("/css/dark.css") })); + if (Setting.getValue("beta") == "darktheme") { + document.head.append(createElement("link", [], { rel: "stylesheet", href: chrome.runtime.getURL("/css/dark.css") })); + + Theme.apply(Theme.loadFromObject({ + "color": + { + "custom": + { + "background": "#36393f", + "border": "#40444b", + "hover": "#6fa8dc", + "primary": "#202225" + } + }, "logo": + { + "preset": "schoology_plus" + }, + "name": "Dark Theme Test", + "version": 2 + })); } } @@ -862,4 +880,82 @@ let siteNavigationTileHelpers = { docObserver.observe(document.body, { childList: true, subtree: true }); })(); +async function createQuickAccess() { + let rightCol = document.getElementById("right-column-inner"); + let linkWrap; + + let wrapper = createElement("div", ["quick-access-wrapper"], {}, [ + createElement("h3", ["h3-med"], {}, [ + 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("div", ["date-header", "first"], {}, [ + createElement("h4", [], { textContent: "Pages" }) + ]), + (linkWrap = createElement("div", ["quick-link-wrapper"])) + ]); + + const PAGES = [ + { textContent: "Grade Report", href: "/grades/grades", id: "quick-access-grades" }, + { textContent: "Courses", href: "/courses", id: "quick-access-courses" }, + { textContent: "Mastery", href: "/mastery", id: "quick-access-mastery" }, + { textContent: "Groups", href: "/groups", id: "quick-access-groups" }, + { textContent: "Messages", href: "/messages", id: "quick-access-messages" }, + ]; + + for (let page of PAGES) { + let a = linkWrap.appendChild(createElement("a", ["quick-link", "splus-track-clicks"], page)); + a.dataset.splusTrackingLabel = "Quick Access"; + } + + wrapper.appendChild( + createElement("div", ["date-header"], {}, [ + createElement("h4", [], {}, [ + createElement("span", [], { textContent: "Courses" }), + createElement("a", ["quick-right-link", "splus-track-clicks"], { id: "quick-access-reorder", textContent: "Reorder", href: "/courses?reorder" }) + ]) + ]) + ); + + let sectionsList = (await fetchApiJson(`users/${getUserId()}/sections`)).section; + + if (!sectionsList || sectionsList.length == 0) { + wrapper.appendChild(createElement("p", ["quick-access-no-courses"], { textContent: "No courses found" })); + } else { + let courseOptionsButton; + let iconImage; + for (let section of sectionsList) { + wrapper.appendChild(createElement("div", ["quick-access-course"], {}, [ + (iconImage = createElement("div", ["splus-course-icon"], { dataset: { courseTitle: `${section.course_title}: ${section.section_title}` } })), + createElement("a", ["splus-track-clicks", "quick-course-link"], { textContent: `${section.course_title}: ${section.section_title}`, href: `/course/${section.id}`, dataset: { splusTrackingTarget: "quick-access-course-link", splusTrackingLabel: "Quick Access" } }), + createElement("div", ["icons-container"], {}, [ + createElement("a", ["icon", "icon-grades", "splus-track-clicks"], { href: `/course/${section.id}/student_grades`, title: "Grades", dataset: { splusTrackingTarget: "quick-access-grades-link", splusTrackingLabel: "Quick Access" } }), + createElement("a", ["icon", "icon-mastery", "splus-track-clicks"], { href: `/course/${section.id}/student_mastery`, title: "Mastery", dataset: { splusTrackingTarget: "quick-access-mastery-link", splusTrackingLabel: "Quick Access" } }), + (courseOptionsButton = createElement("a", ["icon", "icon-settings", "splus-track-clicks"], { href: "#", dataset: { splusTrackingTarget: "quick-access-settings-link", splusTrackingLabel: "Quick Access" } })) + ]) + ])); + + iconImage.style.backgroundImage = `url(${chrome.runtime.getURL("imgs/fallback-course-icon.svg")})`; + + courseOptionsButton.addEventListener("click", () => openModal("course-settings-modal", { + courseId: section.id, + courseName: `${section.course_title}: ${section.section_title}` + })); + } + } + + 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; + } +} + Logger.log("Finished loading all.js"); \ No newline at end of file diff --git a/js/dashboard.js b/js/dashboard.js new file mode 100644 index 00000000..977f23e5 --- /dev/null +++ b/js/dashboard.js @@ -0,0 +1 @@ +createQuickAccess(); \ No newline at end of file diff --git a/js/home.js b/js/home.js index add824dd..64027da0 100644 --- a/js/home.js +++ b/js/home.js @@ -2,7 +2,6 @@ let homeFeedContainer = document.getElementById("home-feed-container"); let feed = homeFeedContainer.querySelector(".feed .item-list .s-edge-feed"); -let rightCol = document.getElementById("right-column-inner"); /** * Creates a post from a broadcast @@ -76,83 +75,6 @@ function formatDateAsString(date) { return `${date.toLocaleString("en-US", { weekday: "short" })} ${date.toLocaleString("en-US", { year: "numeric", month: "long", day: "numeric" })} at ${date.toLocaleString("en-US", { hour: "numeric", minute: "2-digit" }).toLowerCase()}`; } -async function createQuickAccess() { - let linkWrap; - - let wrapper = createElement("div", ["quick-access-wrapper"], {}, [ - createElement("h3", ["h3-med"], {}, [ - 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("div", ["date-header", "first"], {}, [ - createElement("h4", [], { textContent: "Pages" }) - ]), - (linkWrap = createElement("div", ["quick-link-wrapper"])) - ]); - - const PAGES = [ - { textContent: "Grade Report", href: "/grades/grades", id: "quick-access-grades" }, - { textContent: "Courses", href: "/courses", id: "quick-access-courses" }, - { textContent: "Mastery", href: "/mastery", id: "quick-access-mastery" }, - { textContent: "Groups", href: "/groups", id: "quick-access-groups" }, - { textContent: "Messages", href: "/messages", id: "quick-access-messages" }, - ]; - - for (let page of PAGES) { - let a = linkWrap.appendChild(createElement("a", ["quick-link", "splus-track-clicks"], page)); - a.dataset.splusTrackingLabel = "Quick Access"; - } - - wrapper.appendChild( - createElement("div", ["date-header"], {}, [ - createElement("h4", [], {}, [ - createElement("span", [], { textContent: "Courses" }), - createElement("a", ["quick-right-link", "splus-track-clicks"], { id: "quick-access-reorder", textContent: "Reorder", href: "/courses?reorder" }) - ]) - ]) - ); - - let sectionsList = (await fetchApiJson(`users/${getUserId()}/sections`)).section; - - if (!sectionsList || sectionsList.length == 0) { - wrapper.appendChild(createElement("p", ["quick-access-no-courses"], { textContent: "No courses found" })); - } else { - let courseOptionsButton; - let iconImage; - for (let section of sectionsList) { - wrapper.appendChild(createElement("div", ["quick-access-course"], {}, [ - (iconImage = createElement("div", ["splus-course-icon"], { dataset: { courseTitle: `${section.course_title}: ${section.section_title}` } })), - createElement("a", ["splus-track-clicks", "quick-course-link"], { textContent: `${section.course_title}: ${section.section_title}`, href: `/course/${section.id}`, dataset: { splusTrackingTarget: "quick-access-course-link", splusTrackingLabel: "Quick Access" } }), - createElement("div", ["icons-container"], {}, [ - createElement("a", ["icon", "icon-grades", "splus-track-clicks"], { href: `/course/${section.id}/student_grades`, title: "Grades", dataset: { splusTrackingTarget: "quick-access-grades-link", splusTrackingLabel: "Quick Access" } }), - createElement("a", ["icon", "icon-mastery", "splus-track-clicks"], { href: `/course/${section.id}/student_mastery`, title: "Mastery", dataset: { splusTrackingTarget: "quick-access-mastery-link", splusTrackingLabel: "Quick Access" } }), - (courseOptionsButton = createElement("a", ["icon", "icon-settings", "splus-track-clicks"], { href: "#", dataset: { splusTrackingTarget: "quick-access-settings-link", splusTrackingLabel: "Quick Access" } })) - ]) - ])); - - iconImage.style.backgroundImage = `url(${chrome.runtime.getURL("imgs/fallback-course-icon.svg")})`; - - courseOptionsButton.addEventListener("click", () => openModal("course-settings-modal", { - courseId: section.id, - courseName: `${section.course_title}: ${section.section_title}` - })); - } - } - - 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; - } -} - if (Setting.getValue("broadcasts") !== "disabled") { (function () { let observer = new MutationObserver(function (mutations) { diff --git a/manifest.json b/manifest.json index 24639932..68a74f56 100644 --- a/manifest.json +++ b/manifest.json @@ -157,6 +157,17 @@ ], "run_at": "document_end" }, + { + "matches": [ + "https://lms.lausd.net/home/course-dashboard*", + "https://*.schoology.com/home/course-dashboard*" + ], + "js": [ + "js/course.js", + "js/dashboard.js" + ], + "run_at": "document_end" + }, { "matches": [ "https://lms.lausd.net/course/*", From f6e7e716dec2e41664c49c335ecd9b1fcda93b81 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Mon, 8 Jun 2020 21:57:06 -0700 Subject: [PATCH 07/27] Made course dashboard dark theme --- css/dark.css | 32 ++++++++++++++++++++++++++++++++ 1 file changed, 32 insertions(+) diff --git a/css/dark.css b/css/dark.css index 22947d06..58056c20 100644 --- a/css/dark.css +++ b/css/dark.css @@ -195,6 +195,38 @@ img.splus-coursegradebox-taint { border-right: none !important; } +/* Course Dashboard */ +.course-dashboard section { + border: none !important; + border-radius: 5px !important; +} + +.course-dashboard section.sgy-card, +.course-dashboard .sgy-card-lens { + background-color: var(--accent) !important; + border-radius: 5px !important; +} + +.course-dashboard .sgy-card { + border: 2px solid transparent !important; +} + +.course-dashboard .sgy-card:hover { + border: 2px solid var(--text) !important; +} + +.course-dashboard .sgy-card:hover .sgy-card-lens::after { + display: none !important; +} + +.course-dashboard section.sgy-card .sgy-multiline-ellipsis__split-part { + color: var(--text) !important; +} + +.course-dashboard section.sgy-card .sgy-card-subcontext { + color: var(--muted-text) !important; +} + /* Search Bar */ ul.Search-dropdown-3huUv { border: none !important; From 13943eda2ecc0d45746cbcf9bf17f9a1710a0149 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Mon, 8 Jun 2020 23:18:28 -0700 Subject: [PATCH 08/27] More improvements to dark theme --- css/dark.css | 62 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 62 insertions(+) diff --git a/css/dark.css b/css/dark.css index 58056c20..7c0d21d2 100644 --- a/css/dark.css +++ b/css/dark.css @@ -40,6 +40,20 @@ ul.context-menu-list li.context-menu-item:hover { background-color: var(--text) !important; } +/* Schoology Popups */ +.popups-box .popups-body { + background-color: var(--primary) !important; + color: var(--text) !important; +} + +.popups-box .submit-buttons { + background-color: var(--accent) !important; +} + +.popups-box .popups-title { + background-color: var(--dark) !important; +} + /* Courses and Groups Dropdown */ .splus-courses-navbar-button div[role=menu], .splus-groups-navbar-button div[role=menu] { @@ -195,6 +209,54 @@ img.splus-coursegradebox-taint { border-right: none !important; } +/* Resources Page */ +#library-wrapper { + background-color: var(--accent) !important; + border: none !important; +} + +#library-wrapper a.active { + background-color: rgba(0, 255, 255, 0.2) !important; +} + +#library-wrapper .library-collections a:hover, +#library-left td:hover { + background-color: rgba(0, 255, 255, 0.05) !important; +} + +#library-search-form-container div { + background-color: var(--dark) !important; +} + +#library-search-form-container div::before { + display: none !important; +} + +/* Profile Page */ +.right-block-big-wrapper { + padding: 10px !important; + border-radius: 5px !important; +} + +#sidebar-left #left-nav #menu-s-main ul li a.active { + background-color: rgba(0, 255, 255, 0.2) !important; + border: none !important; +} + +th.profile-header { + color: var(--text) !important; +} + +/* School Page */ +#school-events { + padding: 10px !important; + border-radius: 5px !important; +} + +#main { + background-color: var(--accent) !important; +} + /* Course Dashboard */ .course-dashboard section { border: none !important; From 5fb467192e861021328a217a6e87afbaea03d9c1 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Tue, 9 Jun 2020 14:11:11 -0700 Subject: [PATCH 09/27] added more variables to dark theme CSS --- css/dark.css | 62 +++++++++++++++++++++++++++++----------------------- 1 file changed, 35 insertions(+), 27 deletions(-) diff --git a/css/dark.css b/css/dark.css index 7c0d21d2..dc228ef8 100644 --- a/css/dark.css +++ b/css/dark.css @@ -1,10 +1,17 @@ -* { +:root { --primary: #36393F; --accent: #2F3136; --dark: #202225; --text: #DCDDDE; --muted-text: #72767D; --input: #40444B; + --error: #F44336; + --highlight: rgba(184, 134, 11, 0.2); + --active: rgba(0, 255, 255, 0.1); + --grades: #8BC34A; + --border-radius: 5px; + --border-size: 2px; + --padding: 10px; } /* General */ @@ -25,7 +32,7 @@ input[type=text] { background-color: var(--input) !important; color: var(--text) !important; border: none !important; - border-radius: 5px !important; + border-radius: var(--border-radius) !important; } ul.context-menu-list, @@ -68,25 +75,25 @@ ul.context-menu-list li.context-menu-item:hover { .splus-courses-navbar-button article a, .splus-groups-navbar-button article, .splus-groups-navbar-button article a { - border: 2px solid transparent !important; + border: var(--border-size) solid transparent !important; outline: none !important; } .splus-courses-navbar-button article a:hover, .splus-groups-navbar-button article a:hover { - border: 2px solid var(--text) !important; - border-radius: 5px !important; + border: var(--border-size) solid var(--text) !important; + border-radius: var(--border-radius) !important; } .Card-card-image-uV6Bu { - border-top-left-radius: 5px !important; - border-top-right-radius: 5px !important; + border-top-left-radius: var(--border-radius) !important; + border-top-right-radius: var(--border-radius) !important; } .Card-card-data-17m6S, .Card-card-data-17m6S div { - border-bottom-left-radius: 5px !important; - border-bottom-right-radius: 5px !important; + border-bottom-left-radius: var(--border-radius) !important; + border-bottom-right-radius: var(--border-radius) !important; } .splus-courses-navbar-button article a div, @@ -114,11 +121,11 @@ footer div { /* Modal Red Color */ .close-button, .restore-defaults { - color: #f44336 !important; + color: var(--error) !important; } .setting-highlight { - background-color: rgb(184, 134, 11, 0.2) !important; + background-color: var(--highlight) !important; } /* Home Page */ @@ -135,6 +142,7 @@ footer div { .feed-comments { background-color: var(--accent) !important; color: var(--text) !important; + border-radius: var(--border-radius) !important; } .date-header h4 span { @@ -151,7 +159,7 @@ img.splus-logo-inline { } .splus-broadcast-post { - background-color: rgba(0, 255, 255, 0.1) !important; + background-color: var(--active) !important; } /* Grades Page */ @@ -167,7 +175,7 @@ img.splus-logo-inline { .gradebook-course.hierarchical-grading-report .item-row .grade-column, .grade-active-color, .awarded-grade span { - color: #8bc34a !important; + color: var(--grades) !important; } .due-date, @@ -186,7 +194,7 @@ div.summary-course { background-color: var(--accent) !important; color: var(--text) !important; border: none !important; - border-radius: 5px !important; + border-radius: var(--border-radius) !important; } img.splus-coursegradebox-taint { @@ -201,8 +209,8 @@ img.splus-coursegradebox-taint { /* Courses Page */ .course-action-btns, .group-action-btns { - padding: 10px !important; - border-radius: 5px !important; + padding: var(--padding) !important; + border-radius: var(--border-radius) !important; } #secondary-tabs-wrapper { @@ -216,12 +224,12 @@ img.splus-coursegradebox-taint { } #library-wrapper a.active { - background-color: rgba(0, 255, 255, 0.2) !important; + background-color: var(--active) !important; } #library-wrapper .library-collections a:hover, #library-left td:hover { - background-color: rgba(0, 255, 255, 0.05) !important; + background-color: var(--active) !important; } #library-search-form-container div { @@ -234,12 +242,12 @@ img.splus-coursegradebox-taint { /* Profile Page */ .right-block-big-wrapper { - padding: 10px !important; - border-radius: 5px !important; + padding: var(--padding) !important; + border-radius: var(--border-radius) !important; } #sidebar-left #left-nav #menu-s-main ul li a.active { - background-color: rgba(0, 255, 255, 0.2) !important; + background-color: var(--active) !important; border: none !important; } @@ -249,8 +257,8 @@ th.profile-header { /* School Page */ #school-events { - padding: 10px !important; - border-radius: 5px !important; + padding: var(--padding) !important; + border-radius: var(--border-radius) !important; } #main { @@ -260,21 +268,21 @@ th.profile-header { /* Course Dashboard */ .course-dashboard section { border: none !important; - border-radius: 5px !important; + border-radius: var(--border-radius) !important; } .course-dashboard section.sgy-card, .course-dashboard .sgy-card-lens { background-color: var(--accent) !important; - border-radius: 5px !important; + border-radius: var(--border-radius) !important; } .course-dashboard .sgy-card { - border: 2px solid transparent !important; + border: var(--border-size) solid transparent !important; } .course-dashboard .sgy-card:hover { - border: 2px solid var(--text) !important; + border: var(--border-size) solid var(--text) !important; } .course-dashboard .sgy-card:hover .sgy-card-lens::after { From 1a24c63d8a9d956d94214b2d9d60778164aab2b4 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Tue, 9 Jun 2020 14:29:07 -0700 Subject: [PATCH 10/27] Fixed typo in app page blacklist rule --- js/all.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/all.js b/js/all.js index 12a53b99..06d5ae7e 100644 --- a/js/all.js +++ b/js/all.js @@ -43,7 +43,7 @@ const BLACKLISTED_DOMAINS = ["asset-cdn.schoology.com", "developer.schoology.com", "support.schoology.com", "info.schoology.com", "files-cdn.schoology.com", "status.schoology.com", "ui.schoology.com", "www.schoology.com", "api.schoology.com", "developers.schoology.com", "schoology.com", "support.schoology.com"]; let dd = Setting.getValue("defaultDomain"); - if (dd !== window.location.host && !BLACKLISTED_DOMAINS.includes(window.location.host) && !window.location.host.match(/.*\.apps\.schoology\.com/)) { + if (dd !== window.location.host && !BLACKLISTED_DOMAINS.includes(window.location.host) && !window.location.host.match(/.*\.app\.schoology\.com/)) { Setting.setValue("defaultDomain", window.location.host); let bgColor = document.querySelector("#header header").style.backgroundColor; From 89156401bdf576e7f0e4dfa9077c58fd10fe3969 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Tue, 9 Jun 2020 17:06:49 -0700 Subject: [PATCH 11/27] Add page identifier; Improved global dark theme CSS --- css/dark.css | 41 ++++++++++++++++++++++++++++++++--------- js/preload.js | 1 + 2 files changed, 33 insertions(+), 9 deletions(-) diff --git a/css/dark.css b/css/dark.css index dc228ef8..2a68688b 100644 --- a/css/dark.css +++ b/css/dark.css @@ -47,6 +47,24 @@ ul.context-menu-list li.context-menu-item:hover { background-color: var(--text) !important; } +#body { + background-color: var(--primary) !important; +} + +#main-content-wrapper { + background-color: var(--accent) !important; + color: var(--text) !important; + border: none !important; + border-bottom-left-radius: var(--border-radius) !important; + border-bottom-right-radius: var(--border-radius) !important; +} + +#right-column-inner div { + background-color: var(--dark) !important; + border: none !important; + border-radius: var(--border-radius) !important; +} + /* Schoology Popups */ .popups-box .popups-body { background-color: var(--primary) !important; @@ -129,17 +147,23 @@ footer div { } /* Home Page */ -#body, -#center div#main, -#main-inner, +[page^="/home"] #center div#main, +[page^="/home"] #main-inner, +[page^="/home"] #main-content-wrapper, +[page="/"] #center div#main, +[page="/"] #main-inner, +[page="/"] #main-content-wrapper, .splus-modal-body { background-color: var(--primary) !important; color: var(--text) !important; } -#right-column-inner div, -#home-feed-container, -.feed-comments { +[page^="/home"] #right-column-inner div, +[page^="/home"] #home-feed-container, +[page^="/home"] .feed-comments, +[page="/"] #right-column-inner div, +[page="/"] #home-feed-container, +[page="/"] .feed-comments { background-color: var(--accent) !important; color: var(--text) !important; border-radius: var(--border-radius) !important; @@ -163,9 +187,8 @@ img.splus-logo-inline { } /* Grades Page */ -#main-content-wrapper, #center-top { - background-color: var(--primary) !important; + background-color: var(--accent) !important; color: var(--text) !important; border: none !important; } @@ -203,7 +226,7 @@ img.splus-coursegradebox-taint { /* Mastery Page */ #s-js-student-mastery-report-view-content { - background-color: var(--primary) !important; + background-color: var(--accent) !important; } /* Courses Page */ diff --git a/js/preload.js b/js/preload.js index 10a64dd6..76a7a60d 100644 --- a/js/preload.js +++ b/js/preload.js @@ -37,6 +37,7 @@ var Logger = { // Process options Logger.log(`Loaded Schoology Plus version ${chrome.runtime.getManifest().version}${getBrowser() != "Chrome" || chrome.runtime.getManifest().update_url ? '' : ' (development version)'}`); var firstLoad = true; +document.documentElement.setAttribute("page", location.pathname); updateSettings(); var beta_tests = { From 7c72278858eb23924b70fe8391e828f42d44a11f Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Tue, 9 Jun 2020 18:25:33 -0700 Subject: [PATCH 12/27] Added indicator when beta enabled --- css/all.css | 15 +++++++++++++++ js/all.js | 13 ++++++++++++- 2 files changed, 27 insertions(+), 1 deletion(-) diff --git a/css/all.css b/css/all.css index 8b9984e0..ff58517d 100644 --- a/css/all.css +++ b/css/all.css @@ -657,4 +657,19 @@ a._3_bfp { .course-dashboard section.sgy-card img.injected-course-icon { height: 80% !important; +} + +.beta-tag { + position: fixed; + cursor: pointer; + color: white !important; + border: 2px solid white; + background-color: dodgerblue; + left: 3px; + top: 10px; + padding: 5px 8px; + font-size: 20px; + border-radius: 25%; + z-index: 1000; + font-weight: bold; } \ No newline at end of file diff --git a/js/all.js b/js/all.js index 06d5ae7e..02f1765a 100644 --- a/js/all.js +++ b/js/all.js @@ -14,8 +14,19 @@ } ); } +} + +{ + let betaCode = Setting.getValue("beta"); + if (betaCode in beta_tests) { + // Beta Enabled Notice + let betaTag = createElement("span", ["beta-tag", "splus-track-clicks"], { textContent: "β", id: "beta-tag" }); + betaTag.addEventListener("click", event => openModal("beta-modal")); + document.body.append(betaTag); + } - if (Setting.getValue("beta") == "darktheme") { + // Dark Theme Beta + if (betaCode == "darktheme") { document.head.append(createElement("link", [], { rel: "stylesheet", href: chrome.runtime.getURL("/css/dark.css") })); Theme.apply(Theme.loadFromObject({ From c9c41a6f6da75b74c9175a366f7bd1ce778c1226 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Tue, 9 Jun 2020 20:42:06 -0700 Subject: [PATCH 13/27] Improved beta enabled tag --- css/all.css | 12 ++++++++---- js/all.js | 2 +- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/css/all.css b/css/all.css index ff58517d..707ec549 100644 --- a/css/all.css +++ b/css/all.css @@ -659,17 +659,21 @@ a._3_bfp { height: 80% !important; } -.beta-tag { +.splus-beta-tag { position: fixed; cursor: pointer; color: white !important; border: 2px solid white; background-color: dodgerblue; left: 3px; - top: 10px; + top: 12px; padding: 5px 8px; - font-size: 20px; - border-radius: 25%; + font-size: 16px; + border-radius: 10px; z-index: 1000; font-weight: bold; +} + +.splus-beta-tag:hover::after { + content: "eta Enabled"; } \ No newline at end of file diff --git a/js/all.js b/js/all.js index 02f1765a..87ae9f61 100644 --- a/js/all.js +++ b/js/all.js @@ -20,7 +20,7 @@ let betaCode = Setting.getValue("beta"); if (betaCode in beta_tests) { // Beta Enabled Notice - let betaTag = createElement("span", ["beta-tag", "splus-track-clicks"], { textContent: "β", id: "beta-tag" }); + let betaTag = createElement("span", ["splus-beta-tag", "splus-track-clicks"], { textContent: "β", id: "beta-tag" }); betaTag.addEventListener("click", event => openModal("beta-modal")); document.body.append(betaTag); } From 6b6de0a347cefa68b35838c6a4e7f0d1fcc13179 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Tue, 9 Jun 2020 23:39:07 -0700 Subject: [PATCH 14/27] Added much more dark theme --- css/all.css | 14 ++++++ css/dark.css | 118 +++++++++++++++++++++++++++++++++++++++++++-------- js/all.js | 15 ++++++- 3 files changed, 129 insertions(+), 18 deletions(-) diff --git a/css/all.css b/css/all.css index 707ec549..445a3f34 100644 --- a/css/all.css +++ b/css/all.css @@ -676,4 +676,18 @@ a._3_bfp { .splus-beta-tag:hover::after { content: "eta Enabled"; +} + +.dark-theme-toggle { + position: fixed; + color: orangered; + top: 70px; + left: 10px; + z-index: 1000; +} + +.dark-theme-toggle input { + vertical-align: middle; + float: left; + margin-right: 10px; } \ No newline at end of file diff --git a/css/dark.css b/css/dark.css index 2a68688b..fb28c7be 100644 --- a/css/dark.css +++ b/css/dark.css @@ -59,20 +59,30 @@ ul.context-menu-list li.context-menu-item:hover { border-bottom-right-radius: var(--border-radius) !important; } -#right-column-inner div { +#right-column-inner > div { background-color: var(--dark) !important; border: none !important; border-radius: var(--border-radius) !important; + padding: var(--padding) !important; +} + +#center-top { + background: unset !important; + background-color: var(--accent) !important; + color: var(--text) !important; + border: none !important; } /* Schoology Popups */ -.popups-box .popups-body { +.popups-box .popups-body, +#popups-loading div { background-color: var(--primary) !important; color: var(--text) !important; } .popups-box .submit-buttons { background-color: var(--accent) !important; + border-top: none !important; } .popups-box .popups-title { @@ -130,9 +140,7 @@ ul.context-menu-list li.context-menu-item:hover { } /* Footer */ -#site-navigation-footer, -footer, -footer div { +footer._2T2dA { background-color: var(--dark) !important; } @@ -160,16 +168,16 @@ footer div { [page^="/home"] #right-column-inner div, [page^="/home"] #home-feed-container, -[page^="/home"] .feed-comments, [page="/"] #right-column-inner div, [page="/"] #home-feed-container, -[page="/"] .feed-comments { +.feed-comments { background-color: var(--accent) !important; color: var(--text) !important; border-radius: var(--border-radius) !important; } -.date-header h4 span { +.date-header h4 span, +.s-like-sentence { color: var(--text) !important; } @@ -187,12 +195,6 @@ img.splus-logo-inline { } /* Grades Page */ -#center-top { - background-color: var(--accent) !important; - color: var(--text) !important; - border: none !important; -} - .gradebook-course.hierarchical-grading-report .period-row .grade-column, .gradebook-course.hierarchical-grading-report .category-row .grade-column, .gradebook-course.hierarchical-grading-report .item-row .grade-column, @@ -214,7 +216,7 @@ span.comment, } div.summary-course { - background-color: var(--accent) !important; + background-color: var(--dark) !important; color: var(--text) !important; border: none !important; border-radius: var(--border-radius) !important; @@ -241,9 +243,24 @@ img.splus-coursegradebox-taint { } /* Resources Page */ +[page^="/resources"] #main-content-wrapper { + background-color: var(--primary) !important; +} + +#library-main { + border-right: none !important; +} + +#library-main iframe { + /* iframe must be white, because we can't change styles within it */ + background-color: white !important; +} + #library-wrapper { background-color: var(--accent) !important; border: none !important; + border-bottom-left-radius: var(--border-radius) !important; + border-bottom-right-radius: var(--border-radius) !important; } #library-wrapper a.active { @@ -271,14 +288,17 @@ img.splus-coursegradebox-taint { #sidebar-left #left-nav #menu-s-main ul li a.active { background-color: var(--active) !important; - border: none !important; + border: 2px solid var(--accent) !important; + border-right: none !important; + border-top-left-radius: 5px; + border-bottom-left-radius: 5px; } th.profile-header { color: var(--text) !important; } -/* School Page */ +/* School / Group Page */ #school-events { padding: var(--padding) !important; border-radius: var(--border-radius) !important; @@ -288,6 +308,28 @@ th.profile-header { background-color: var(--accent) !important; } +[page^="/school/"] #content-wrapper, +[page^="/school/"] td, +[page^="/group/"] #content-wrapper, +[page^="/group/"] td { + background-color: var(--accent) !important; + color: var(--text) !important; +} + +.left-block dd { + color: var(--text) !important; +} + +.left-block dt { + color: var(--muted-text) !important; +} + +.enrollment-view-wrapper, +.roster-top, +.active-loader { + background-color: var(--accent) !important; +} + /* Course Dashboard */ .course-dashboard section { border: none !important; @@ -330,4 +372,46 @@ ul.Search-dropdown-3huUv { background-color: var(--input) !important; color: var(--text) !important; border-bottom: 1px solid transparent !important; +} + +/* Settings Page */ +ul.primary, +.with-tabs #center-top { + background: unset !important; + background-color: var(--dark) !important; +} + +ul.primary li a { + background: unset !important; + background-color: var(--dark) !important; + color: var(--text) !important; +} + +ul.primary li.active a, +.email-notify, +fieldset { + background-color: var(--accent) !important; + color: var(--text) !important; +} + +.sticky-header *, +.ui-selectmenu-status { + background-color: var(--dark) !important; + color: var(--text) !important; +} + +div.cellphone-container { + background-color: var(--dark) !important; + color: var(--text) !important; + border-radius: var(--border-radius) !important; +} + +#s-user-set-notifications-form thead tr:hover { + background-color: var(--accent) !important; +} + +/* Error Page */ +#error-page { + background-color: var(--dark) !important; + color: var(--text) !important; } \ No newline at end of file diff --git a/js/all.js b/js/all.js index 87ae9f61..d7900679 100644 --- a/js/all.js +++ b/js/all.js @@ -27,7 +27,8 @@ // Dark Theme Beta if (betaCode == "darktheme") { - document.head.append(createElement("link", [], { rel: "stylesheet", href: chrome.runtime.getURL("/css/dark.css") })); + let darkSheet = createElement("link", [], { rel: "stylesheet", href: chrome.runtime.getURL("/css/dark.css") }); + document.head.append(darkSheet); Theme.apply(Theme.loadFromObject({ "color": @@ -46,6 +47,18 @@ "name": "Dark Theme Test", "version": 2 })); + + let darkToggle = createElement("div", ["dark-theme-toggle"], {}, [ + createElement("label", [], { textContent: "Enable dark theme" }), + createElement("input", [], { type: "checkbox", checked: true }) + ]); + + darkToggle.addEventListener("click", event => { + Logger.log(event.target, event.target.checked); + darkSheet.disabled = !event.target.checked; + }); + + document.body.append(darkToggle); } } From 667db48d89302d3d242648cb27927e8f7bf68c97 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Thu, 11 Jun 2020 21:24:12 -0700 Subject: [PATCH 15/27] Added color test --- css/all.css | 10 ++++++++-- css/dark.css | 41 ++++++++++++++++++++++++++++++++++++++++- js/all.js | 12 ++++++++++-- 3 files changed, 58 insertions(+), 5 deletions(-) diff --git a/css/all.css b/css/all.css index 445a3f34..6a7670e7 100644 --- a/css/all.css +++ b/css/all.css @@ -678,7 +678,8 @@ a._3_bfp { content: "eta Enabled"; } -.dark-theme-toggle { +.dark-theme-toggle, +.crazy-theme-toggle { position: fixed; color: orangered; top: 70px; @@ -686,8 +687,13 @@ a._3_bfp { z-index: 1000; } -.dark-theme-toggle input { +.dark-theme-toggle input, +.crazy-theme-toggle input { vertical-align: middle; float: left; margin-right: 10px; +} + +.crazy-theme-toggle { + top: 90px; } \ No newline at end of file diff --git a/css/dark.css b/css/dark.css index fb28c7be..edcb9c4f 100644 --- a/css/dark.css +++ b/css/dark.css @@ -14,6 +14,26 @@ --padding: 10px; } +:root[crazy=true] { + --primary: magenta; + --accent: purple; + --dark: maroon; + + --text: yellow; + --muted-text: orange; + + --input: blue; + --error: red; + --highlight: rgba(0,255,0,0.3); + --active: rgba(0,0,255,0.3); + --grades: aqua; + --border-radius: 5px; + --border-size: 2px; + --padding: 10px; + + --hover-color: lime !important; +} + /* General */ h1, @@ -23,7 +43,7 @@ h4, h5, h6, p { - color: var(--text) !important; + color: var(--text) !important; } textarea, @@ -177,10 +197,29 @@ footer._2T2dA { } .date-header h4 span, +.s-poll-option-title, .s-like-sentence { color: var(--text) !important; } +.s-polls-poll-option, +#edge-filters-menu { + background: none !important; + background-color: var(--dark) !important; + color: var(--text) !important; + border: none !important; + border-radius: var(--border-radius) !important; +} + +#edge-filters-menu .edge-filter-option { + background-position: 0 -257px !important; +} + +#edge-filters-menu .edge-filter-option:hover, +#edge-filters-menu .edge-filter-option.active:hover { + background-color: var(--active) !important; +} + .gray, .upcoming-time { color: var(--muted-text) !important; diff --git a/js/all.js b/js/all.js index d7900679..3db924ed 100644 --- a/js/all.js +++ b/js/all.js @@ -54,11 +54,19 @@ ]); darkToggle.addEventListener("click", event => { - Logger.log(event.target, event.target.checked); darkSheet.disabled = !event.target.checked; }); - document.body.append(darkToggle); + let crazyToggle = createElement("div", ["crazy-theme-toggle"], {}, [ + createElement("label", [], { textContent: "Enable color test" }), + createElement("input", [], { type: "checkbox" }) + ]); + + crazyToggle.addEventListener("click", event => { + document.documentElement.setAttribute("crazy", event.target.checked); + }); + + document.body.append(darkToggle, crazyToggle); } } From adf55c04824e72fc7187d30971d450fa4112970b Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Fri, 12 Jun 2020 14:12:32 -0700 Subject: [PATCH 16/27] Improved dark theme more --- css/dark.css | 118 ++++++++++++++++++++++++++++++++++++++++++++++++--- js/all.js | 2 +- js/theme.js | 10 ++--- 3 files changed, 118 insertions(+), 12 deletions(-) diff --git a/css/dark.css b/css/dark.css index edcb9c4f..3c49d99e 100644 --- a/css/dark.css +++ b/css/dark.css @@ -4,6 +4,7 @@ --dark: #202225; --text: #DCDDDE; --muted-text: #72767D; + --light-border: #DCDDDE; --input: #40444B; --error: #F44336; --highlight: rgba(184, 134, 11, 0.2); @@ -12,6 +13,7 @@ --border-radius: 5px; --border-size: 2px; --padding: 10px; + --theme-is-dark: 1; } :root[crazy=true] { @@ -22,6 +24,7 @@ --text: yellow; --muted-text: orange; + --light-border: gold; --input: blue; --error: red; --highlight: rgba(0,255,0,0.3); @@ -30,6 +33,7 @@ --border-radius: 5px; --border-size: 2px; --padding: 10px; + --theme-is-dark: 1; --hover-color: lime !important; } @@ -93,6 +97,26 @@ ul.context-menu-list li.context-menu-item:hover { border: none !important; } +body a.link-btn, +body button.link-btn { + background: none !important; + background-color: var(--dark) !important; + color: var(--text) !important; + border: none !important; + border-radius: var(--border-radius) !important; +} + +.inline-popup-wrapper { + background-color: var(--dark) !important; + color: var(--text) !important; + border: var(--border-size) solid var(--light-border) !important; + border-radius: var(--border-radius) !important; +} + +.inline-popup-wrapper .arrow-top { + display: none !important; +} + /* Schoology Popups */ .popups-box .popups-body, #popups-loading div { @@ -116,7 +140,7 @@ ul.context-menu-list li.context-menu-item:hover { } .splus-coursesdropdown-reorder-btn { - filter: invert(1) !important; + filter: invert(var(--theme-is-dark)) !important; } .splus-courses-navbar-button article, @@ -129,7 +153,7 @@ ul.context-menu-list li.context-menu-item:hover { .splus-courses-navbar-button article a:hover, .splus-groups-navbar-button article a:hover { - border: var(--border-size) solid var(--text) !important; + border: var(--border-size) solid var(--light-border) !important; border-radius: var(--border-radius) !important; } @@ -203,6 +227,7 @@ footer._2T2dA { } .s-polls-poll-option, +#edge-filters, #edge-filters-menu { background: none !important; background-color: var(--dark) !important; @@ -211,6 +236,14 @@ footer._2T2dA { border-radius: var(--border-radius) !important; } +#edge-filters-btn { + background-color: var(--dark) !important; + color: var(--text) !important; + border: none !important; + border-radius: var(--border-radius) !important; + opacity: unset !important; +} + #edge-filters-menu .edge-filter-option { background-position: 0 -257px !important; } @@ -226,7 +259,7 @@ footer._2T2dA { } img.splus-logo-inline { - filter: brightness(1) !important; + filter: brightness(var(--theme-is-dark)) !important; } .splus-broadcast-post { @@ -262,7 +295,7 @@ div.summary-course { } img.splus-coursegradebox-taint { - filter: brightness(1) !important; + filter: brightness(var(--theme-is-dark)) !important; } /* Mastery Page */ @@ -281,6 +314,36 @@ img.splus-coursegradebox-taint { border-right: none !important; } +body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div { + background-color: var(--primary) !important; +} + +body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div button { + filter: grayscale(var(--theme-is-dark)) invert(var(--theme-is-dark)); +} + +body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div .Card-card-2rORL { + background-color: var(--accent) !important; + border: none !important; + border-radius: var(--border-radius) !important; +} + +body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div div { + color: var(--text) !important; +} + +body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div div._2wOCj { + color: var(--muted-text) !important; +} + +#reorder-ui button.link-btn { + background-color: var(--primary) !important; +} + +#reorder-ui button.link-btn span { + filter: invert(var(--theme-is-dark)) !important; +} + /* Resources Page */ [page^="/resources"] #main-content-wrapper { background-color: var(--primary) !important; @@ -327,7 +390,7 @@ img.splus-coursegradebox-taint { #sidebar-left #left-nav #menu-s-main ul li a.active { background-color: var(--active) !important; - border: 2px solid var(--accent) !important; + border: var(--border-size) solid var(--light-border) !important; border-right: none !important; border-top-left-radius: 5px; border-bottom-left-radius: 5px; @@ -369,6 +432,11 @@ th.profile-header { background-color: var(--accent) !important; } +#s-user-realm-profile-notification-setting-form label:hover { + background: none !important; + background-color: var(--active) !important; +} + /* Course Dashboard */ .course-dashboard section { border: none !important; @@ -386,7 +454,7 @@ th.profile-header { } .course-dashboard .sgy-card:hover { - border: var(--border-size) solid var(--text) !important; + border: var(--border-size) solid var(--light-border) !important; } .course-dashboard .sgy-card:hover .sgy-card-lens::after { @@ -401,12 +469,21 @@ th.profile-header { color: var(--muted-text) !important; } +.course-dashboard .ui-state-highlight { + border: var(--border-size) dashed var(--light-border) !important; + background-color: var(--dark) !important; +} + /* Search Bar */ ul.Search-dropdown-3huUv { border: none !important; background-color: var(--accent) !important; } +.Search-dropdown-3huUv svg { + filter: invert(var(--theme-is-dark)) !important; +} + .Search-dropdown-3huUv input { background-color: var(--input) !important; color: var(--text) !important; @@ -453,4 +530,33 @@ div.cellphone-container { #error-page { background-color: var(--dark) !important; color: var(--text) !important; +} + +/* Calendar */ +.fc-state-highlight { + background: var(--active) !important; +} + +.fc-view-month td:hover { + background-color: var(--highlight) !important; +} + +table.fc-border-separate td { + border: var(--border-size) solid var(--light-border) !important; +} + +table.fc-border-separate .fc-widget-header { + border-bottom: var(--border-size) solid var(--light-border) !important; +} + +.fc-agenda-slots td, +.fc-agenda-slots th, +body .fc-widget-header, +.fc-agenda-allday th { + border-color: var(--light-border) !important; +} + +body .fc-widget-header .fc-agenda-divider-inner { + background: var(--light-border) !important; + border-color: var(--light-border) !important; } \ No newline at end of file diff --git a/js/all.js b/js/all.js index 3db924ed..20a935bc 100644 --- a/js/all.js +++ b/js/all.js @@ -75,7 +75,7 @@ const BLACKLISTED_DOMAINS = ["asset-cdn.schoology.com", "developer.schoology.com", "support.schoology.com", "info.schoology.com", "files-cdn.schoology.com", "status.schoology.com", "ui.schoology.com", "www.schoology.com", "api.schoology.com", "developers.schoology.com", "schoology.com", "support.schoology.com"]; let dd = Setting.getValue("defaultDomain"); - if (dd !== window.location.host && !BLACKLISTED_DOMAINS.includes(window.location.host) && !window.location.host.match(/.*\.app\.schoology\.com/)) { + if (dd !== window.location.host && !BLACKLISTED_DOMAINS.includes(window.location.host) && !window.location.host.match(/.*[-\.]app\.schoology\.com/)) { Setting.setValue("defaultDomain", window.location.host); let bgColor = document.querySelector("#header header").style.backgroundColor; diff --git a/js/theme.js b/js/theme.js index 7ac04864..bc21fdfe 100644 --- a/js/theme.js +++ b/js/theme.js @@ -202,12 +202,12 @@ class Theme { return themes.find(x => x.name == name) || Theme.byName("Schoology Plus"); } - static setBackgroundColor(primaryColor, primaryLight, primaryDark, primaryVeryDark) { - if (primaryColor && primaryLight && primaryDark && primaryVeryDark) { + static setBackgroundColor(primaryColor, backgroundColor, hoverColor, borderColor) { + if (primaryColor && backgroundColor && hoverColor && borderColor) { document.documentElement.style.setProperty("--primary-color", primaryColor); - document.documentElement.style.setProperty("--background-color", primaryLight); - document.documentElement.style.setProperty("--hover-color", primaryDark); - document.documentElement.style.setProperty("--border-color", primaryVeryDark); + document.documentElement.style.setProperty("--background-color", backgroundColor); + document.documentElement.style.setProperty("--hover-color", hoverColor); + document.documentElement.style.setProperty("--border-color", borderColor); } } From 966658b4748d3bc67575db75a271e970bcd7a035 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Fri, 12 Jun 2020 23:39:54 -0700 Subject: [PATCH 17/27] More dark theme improvements --- css/dark.css | 40 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 40 insertions(+) diff --git a/css/dark.css b/css/dark.css index 3c49d99e..2245c15f 100644 --- a/css/dark.css +++ b/css/dark.css @@ -298,6 +298,10 @@ img.splus-coursegradebox-taint { filter: brightness(var(--theme-is-dark)) !important; } +.grade-edit-indicator { + filter: grayscale(var(--theme-is-dark)) invert(var(--theme-is-dark)) !important; +} + /* Mastery Page */ #s-js-student-mastery-report-view-content { background-color: var(--accent) !important; @@ -400,6 +404,42 @@ th.profile-header { color: var(--text) !important; } +/* Course Page */ +.action-links { + background-color: var(--dark) !important; + border: var(--border-size) solid var(--light-border) !important; + border-radius: var(--border-radius) !important; +} + +.action-links .selected { + background-position: 0 -257px !important; +} + +body .action-links a:hover { + background-color: var(--active) !important; + color: var(--text) !important; +} + +.materials-top, +#folder-contents-table td, +#right-column h3 { + border: none !important; + border-bottom: var(--border-size) solid var(--light-border) !important; +} + +.s-edge-feed li { + border-top: var(--border-size) solid var(--light-border) !important; +} + +.s-like-sentence { + border-bottom: var(--border-size) solid var(--light-border) !important; +} + +.pre-fill, +.upcoming-list .empty { + color: var(--muted-text) !important; +} + /* School / Group Page */ #school-events { padding: var(--padding) !important; From 45289de1c64616515575a362de053319ef02d297 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Sat, 13 Jun 2020 00:49:26 -0700 Subject: [PATCH 18/27] Made course switcher dark --- css/dark.css | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/css/dark.css b/css/dark.css index 2245c15f..eac4dd18 100644 --- a/css/dark.css +++ b/css/dark.css @@ -440,6 +440,28 @@ body .action-links a:hover { color: var(--muted-text) !important; } +#edit-course-switcher-select-nid-menu { + border: var(--border-size) solid var(--light-border) !important; + background-color: var(--dark); + border-radius: var(--border-radius) !important; +} + +#edit-course-switcher-select-nid-menu .ui-selectmenu-group li a:hover { + color: var(--text) !important; + background-color: var(--active) !important; +} + +#edit-course-switcher-select-nid-button { + border: none !important; + background: none !important; + background-color: var(--dark) !important; + border-radius: var(--border-radius) !important; +} + +#edit-course-switcher-select-nid-button:not(.ui-state-active) .edit-course-inline-dropdown-arrow { + filter: invert(var(--theme-is-dark)) !important; +} + /* School / Group Page */ #school-events { padding: var(--padding) !important; From a3969811030bdd48de7fe046c91d490be2b5f59d Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Sun, 14 Jun 2020 14:52:03 -0700 Subject: [PATCH 19/27] More minor dark theme tweaks --- css/dark.css | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/css/dark.css b/css/dark.css index eac4dd18..30e5bb42 100644 --- a/css/dark.css +++ b/css/dark.css @@ -405,10 +405,12 @@ th.profile-header { } /* Course Page */ -.action-links { +.action-links, +.comment.no-comments { background-color: var(--dark) !important; border: var(--border-size) solid var(--light-border) !important; border-radius: var(--border-radius) !important; + color: var(--text) !important; } .action-links .selected { @@ -436,7 +438,8 @@ body .action-links a:hover { } .pre-fill, -.upcoming-list .empty { +.upcoming-list .empty, +.no-attendance-status-dates { color: var(--muted-text) !important; } From db64448f547091918a54695bc4e7bdec41a40992 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Mon, 15 Jun 2020 13:04:03 -0700 Subject: [PATCH 20/27] Changed logo to SVG; Updated dark theme' --- css/dark.css | 73 +++++++++++++++++++++++++++++++++--------- imgs/new-plus-icon.svg | 6 ++-- js/all.js | 13 +++++--- js/preload.js | 31 ++++++++++++++++++ theme-editor.html | 7 ++-- 5 files changed, 104 insertions(+), 26 deletions(-) diff --git a/css/dark.css b/css/dark.css index 30e5bb42..def8a529 100644 --- a/css/dark.css +++ b/css/dark.css @@ -27,8 +27,8 @@ --light-border: gold; --input: blue; --error: red; - --highlight: rgba(0,255,0,0.3); - --active: rgba(0,0,255,0.3); + --highlight: rgba(0, 255, 0, 0.3); + --active: rgba(0, 0, 255, 0.3); --grades: aqua; --border-radius: 5px; --border-size: 2px; @@ -47,7 +47,7 @@ h4, h5, h6, p { - color: var(--text) !important; + color: var(--text) !important; } textarea, @@ -67,8 +67,7 @@ ul.context-menu-list li.context-menu-item { } ul.context-menu-list li.context-menu-item:hover { - color: var(--primary) !important; - background-color: var(--text) !important; + background-color: var(--active) !important; } #body { @@ -83,7 +82,7 @@ ul.context-menu-list li.context-menu-item:hover { border-bottom-right-radius: var(--border-radius) !important; } -#right-column-inner > div { +#right-column-inner>div { background-color: var(--dark) !important; border: none !important; border-radius: var(--border-radius) !important; @@ -117,6 +116,25 @@ body button.link-btn { display: none !important; } +.splus-modal-title, +.submit-span-wrapper input[type="button"], +.submit-span-wrapper input[type="submit"], +:not(.submit-span-wrapper)>input[type="button"], +:not(.submit-span-wrapper)>input[type="submit"], +footer li a, +header li a, +.splus-modal-footer-text a, +body a.link-btn.active, +div.courses-left-menu, +.portfolio-list a.btn, +a._3_bfp, +footer, +footer button, +.Header-header-button-1EE8Y, +.LGaPf svg { + color: var(--text) !important; +} + /* Schoology Popups */ .popups-box .popups-body, #popups-loading div { @@ -232,7 +250,7 @@ footer._2T2dA { background: none !important; background-color: var(--dark) !important; color: var(--text) !important; - border: none !important; + border: var(--border-size) solid var(--light-border) !important; border-radius: var(--border-radius) !important; } @@ -245,7 +263,7 @@ footer._2T2dA { } #edge-filters-menu .edge-filter-option { - background-position: 0 -257px !important; + background-position: 0 calc(-237px - 20px * var(--theme-is-dark)) !important; } #edge-filters-menu .edge-filter-option:hover, @@ -302,6 +320,23 @@ img.splus-coursegradebox-taint { filter: grayscale(var(--theme-is-dark)) invert(var(--theme-is-dark)) !important; } +.gradebook-course.hierarchical-grading-report .item-row .td-content-wrapper { + border-top: var(--border-size) dotted var(--light-border) !important; +} + +.gradebook-course.hierarchical-grading-report .period-row .td-content-wrapper, +.gradebook-course.hierarchical-grading-report .final-row .td-content-wrapper { + border-top: var(--border-size) solid var(--light-border) !important; +} + +.item-row.added-fake-assignment { + background-color: var(--highlight) !important; +} + +.splus-grade-help-btn .icon-help { + background-position: calc(0px - 22px * var(--theme-is-dark)) -127px !important; +} + /* Mastery Page */ #s-js-student-mastery-report-view-content { background-color: var(--accent) !important; @@ -318,25 +353,25 @@ img.splus-coursegradebox-taint { border-right: none !important; } -body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div { +body>div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ>div>div { background-color: var(--primary) !important; } -body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div button { +body>div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ>div>div button { filter: grayscale(var(--theme-is-dark)) invert(var(--theme-is-dark)); } -body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div .Card-card-2rORL { +body>div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ>div>div .Card-card-2rORL { background-color: var(--accent) !important; border: none !important; border-radius: var(--border-radius) !important; } -body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div div { +body>div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ>div>div div { color: var(--text) !important; } -body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div div._2wOCj { +body>div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ>div>div div._2wOCj { color: var(--muted-text) !important; } @@ -393,7 +428,7 @@ body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div div._2wOCj { } #sidebar-left #left-nav #menu-s-main ul li a.active { - background-color: var(--active) !important; + background-color: var(--accent) !important; border: var(--border-size) solid var(--light-border) !important; border-right: none !important; border-top-left-radius: 5px; @@ -406,15 +441,21 @@ th.profile-header { /* Course Page */ .action-links, -.comment.no-comments { +.comment.no-comments, +.materials-filter-wrapper { background-color: var(--dark) !important; border: var(--border-size) solid var(--light-border) !important; border-radius: var(--border-radius) !important; color: var(--text) !important; } +.materials-filter-wrapper .action-links-wrapper .action-links-unfold, +.action-links-wrapper-gearless .action-links-unfold.active, .action-links-wrapper-gearless .action-links-unfold:active { + color: var(--text) !important; +} + .action-links .selected { - background-position: 0 -257px !important; + background-position: 0 calc(-237px - 20px * var(--theme-is-dark)) !important; } body .action-links a:hover { diff --git a/imgs/new-plus-icon.svg b/imgs/new-plus-icon.svg index 8aa361e1..ef403891 100644 --- a/imgs/new-plus-icon.svg +++ b/imgs/new-plus-icon.svg @@ -1,5 +1,5 @@ - - - + + + \ No newline at end of file diff --git a/js/all.js b/js/all.js index 20a935bc..c43b8bd3 100644 --- a/js/all.js +++ b/js/all.js @@ -30,7 +30,7 @@ let darkSheet = createElement("link", [], { rel: "stylesheet", href: chrome.runtime.getURL("/css/dark.css") }); document.head.append(darkSheet); - Theme.apply(Theme.loadFromObject({ + var darkThemeTheme = Theme.loadFromObject({ "color": { "custom": @@ -46,7 +46,9 @@ }, "name": "Dark Theme Test", "version": 2 - })); + }); + + Theme.apply(darkThemeTheme); let darkToggle = createElement("div", ["dark-theme-toggle"], {}, [ createElement("label", [], { textContent: "Enable dark theme" }), @@ -55,6 +57,7 @@ darkToggle.addEventListener("click", event => { darkSheet.disabled = !event.target.checked; + Theme.apply(event.target.checked ? darkThemeTheme : Theme.byName(Setting.getValue("theme"))); }); let crazyToggle = createElement("div", ["crazy-theme-toggle"], {}, [ @@ -425,11 +428,11 @@ document.body.onkeydown = (data) => { document.querySelector("#header > header > nav > ul:nth-child(2)").prepend(createElement("li", ["_24avl", "_3Rh90", "_349XD"], {}, [ createElement( - "a", + "button", ["_1SIMq", "_2kpZl", "_3OAXJ", "_13cCs", "_3_bfp", "_2M5aC", "_24avl", "_3v0y7", "_2s0LQ", "_3ghFm", "_3LeCL", "_31GLY", "_9GDcm", "_1D8fw", "util-height-six-3PHnk", "util-line-height-six-3lFgd", "util-text-decoration-none-1n0lI", "Header-header-button-active-state-3AvBm", "Header-header-button-1EE8Y", "sExtlink-processed"], - { href: "#", onclick: () => openModal("settings-modal") }, + { onclick: () => openModal("settings-modal") }, [ - createElement("img", ["Header-two-point-two-ONgMZ", "Header-two-point-two-ONgMZ", "_1I3mg"], { src: chrome.runtime.getURL("imgs/new-plus-icon.svg") }) + createSvgLogo("_3ESp2", "dlCBz", "_1I3mg", "fjQuT", "uQOmx") ] ) ])); diff --git a/js/preload.js b/js/preload.js index 76a7a60d..2a7feac2 100644 --- a/js/preload.js +++ b/js/preload.js @@ -1017,6 +1017,37 @@ function setCSSVariable(name, val) { document.documentElement.style.setProperty(`--${name}`, val); } +function createSvgLogo(...classes) { + let circle = document.createElementNS("http://www.w3.org/2000/svg", "circle"); + circle.setAttribute("cx", 250); + circle.setAttribute("cy", 250); + circle.setAttribute("r", 230); + circle.setAttribute("style", "fill: none; stroke-width: 35px; stroke: currentColor;"); + let line1 = document.createElementNS("http://www.w3.org/2000/svg", "line"); + line1.setAttribute("x1", 250); + line1.setAttribute("y1", 125); + line1.setAttribute("x2", 250); + line1.setAttribute("y2", 375); + line1.setAttribute("style", "stroke-linecap: round; stroke-width: 35px; stroke: currentColor;"); + let line2 = document.createElementNS("http://www.w3.org/2000/svg", "line"); + line2.setAttribute("x1", 125); + line2.setAttribute("y1", 250); + line2.setAttribute("x2", 375); + line2.setAttribute("y2", 250); + line2.setAttribute("style", "stroke-linecap: round; stroke-width: 35px; stroke: currentColor;"); + + let svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); + svg.setAttribute("viewBox", "0 0 500 500"); + + svg.append(circle, line1, line2); + + if (classes) { + svg.classList.add(...classes); + } + + return svg; +} + new Setting( "defaultDomain", "Default Schoology Domain", diff --git a/theme-editor.html b/theme-editor.html index fce13c2d..120fcc76 100644 --- a/theme-editor.html +++ b/theme-editor.html @@ -393,8 +393,11 @@

You are not currently enrolled in any
  • - + + + + +
  • From 67a840ac85ace3233d5eae43bbf1d9a79e2f6e47 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Mon, 15 Jun 2020 19:50:35 -0700 Subject: [PATCH 21/27] Improved beta menu; Added light theme test; Updated themes --- css/all.css | 61 ++++++----- css/{dark.css => modern.css} | 192 +++++++++++++++++++++++++---------- js/all.js | 56 +++++----- js/preload.js | 2 +- manifest.json | 2 +- 5 files changed, 208 insertions(+), 105 deletions(-) rename css/{dark.css => modern.css} (75%) diff --git a/css/all.css b/css/all.css index 6a7670e7..efcafb9d 100644 --- a/css/all.css +++ b/css/all.css @@ -3,6 +3,7 @@ --primary-color: hsl(var(--color-hue), 50%, 50%); --background-color: hsl(var(--color-hue), 60%, 30%); --hover-color: hsl(var(--color-hue), 55%, 40%); + --link-color: var(--hover-color); --border-color: hsl(var(--color-hue), 60%, 25%); --cursor: auto; --background-url: none; @@ -54,7 +55,7 @@ footer button { } footer._2T2dA { - background-color: rgb(51, 51, 51) !important; + background-color: var(--primary-color) !important; } /* Logo */ @@ -584,8 +585,8 @@ the selector matches inside notifications in the new notifs dropdown } .splus-logo-inline { - height: 22px; - filter: brightness(0.4); + height: 18px; + color: currentColor; vertical-align: middle; padding-right: 3px; } @@ -609,7 +610,7 @@ span[role=button], .category-row .title, ._2mWUT a, div._3U8Br { - color: var(--hover-color) !important; + color: var(--link-color) !important; } body #nav ul li a:hover, @@ -632,7 +633,7 @@ body .search-toggle:hover, body #primary-settings .unfold:hover, ul.tabs li a.active, #nav ul li a:hover { - background-color: var(--hover-color) !important; + background-color: var(--link-color) !important; color: white !important; } @@ -659,41 +660,51 @@ a._3_bfp { height: 80% !important; } -.splus-beta-tag { +.splus-beta-container { position: fixed; - cursor: pointer; + left: 3px; + top: 12px; + z-index: 1000; color: white !important; border: 2px solid white; + border-radius: 10px; background-color: dodgerblue; - left: 3px; - top: 12px; padding: 5px 8px; + width: 10px; + height: 20px; +} + +.splus-beta-container:hover { + width: unset; + height: unset; +} + +.splus-beta-container h3 { + color: white !important; + border-bottom: 1px solid white !important; +} + +.splus-beta-tag { + cursor: pointer; font-size: 16px; - border-radius: 10px; - z-index: 1000; font-weight: bold; } -.splus-beta-tag:hover::after { +.splus-beta-container:hover .splus-beta-tag::after { content: "eta Enabled"; } -.dark-theme-toggle, -.crazy-theme-toggle { - position: fixed; - color: orangered; - top: 70px; - left: 10px; - z-index: 1000; +.splus-beta-container div { + display: none; +} + +.splus-beta-container:hover div { + display: block; + padding-top: 5px; } -.dark-theme-toggle input, -.crazy-theme-toggle input { +.splus-beta-container div input[type=checkbox] { vertical-align: middle; float: left; margin-right: 10px; -} - -.crazy-theme-toggle { - top: 90px; } \ No newline at end of file diff --git a/css/dark.css b/css/modern.css similarity index 75% rename from css/dark.css rename to css/modern.css index def8a529..0e3f4ff1 100644 --- a/css/dark.css +++ b/css/modern.css @@ -1,39 +1,78 @@ :root { --primary: #36393F; --accent: #2F3136; - --dark: #202225; + --secondary: #202225; --text: #DCDDDE; + --contrast-text: #EEEEEE; --muted-text: #72767D; - --light-border: #DCDDDE; + --contrast-border: #DCDDDE; --input: #40444B; --error: #F44336; --highlight: rgba(184, 134, 11, 0.2); --active: rgba(0, 255, 255, 0.1); --grades: #8BC34A; --border-radius: 5px; - --border-size: 2px; + --border-size: 1px; --padding: 10px; --theme-is-dark: 1; } -:root[crazy=true] { +:root[dark=false] { + --primary: #EEEEEE; + --accent: white; + --secondary: #DDD; + --text: #2A2A2A; + --contrast-text: white; + --muted-text: #677583; + --contrast-border: #BABABA; + --input: #CCCCCC; + --error: #F44336; + --highlight: rgba(255, 183, 2, 0.2); + --active: #98d4e4; + --grades: #009400; + --border-radius: 5px; + --border-size: 1px; + --padding: 10px; + --theme-is-dark: 0; +} + +:root[test=true] { + --primary: black; + --accent: black; + --secondary: black; + + --text: black; + --contrast-text: black; + --muted-text: black; + + --contrast-border: black; + --input: black; + --error: black; + --highlight: black; + --active: black; + --grades: black; + --border-radius: 5px; + --border-size: 1px; + --padding: 10px; + + --hover-color: black !important; +} + +:root[test=true][test-mode=crazy] { --primary: magenta; --accent: purple; - --dark: maroon; + --secondary: maroon; --text: yellow; + --contrast-text: mediumspringgreen; --muted-text: orange; - --light-border: gold; + --contrast-border: gold; --input: blue; --error: red; --highlight: rgba(0, 255, 0, 0.3); --active: rgba(0, 0, 255, 0.3); --grades: aqua; - --border-radius: 5px; - --border-size: 2px; - --padding: 10px; - --theme-is-dark: 1; --hover-color: lime !important; } @@ -61,7 +100,7 @@ input[type=text] { ul.context-menu-list, ul.context-menu-list li.context-menu-item { - background-color: var(--dark) !important; + background-color: var(--secondary) !important; color: var(--text) !important; border-color: var(--accent) !important; } @@ -83,7 +122,7 @@ ul.context-menu-list li.context-menu-item:hover { } #right-column-inner>div { - background-color: var(--dark) !important; + background-color: var(--secondary) !important; border: none !important; border-radius: var(--border-radius) !important; padding: var(--padding) !important; @@ -99,16 +138,16 @@ ul.context-menu-list li.context-menu-item:hover { body a.link-btn, body button.link-btn { background: none !important; - background-color: var(--dark) !important; + background-color: var(--secondary) !important; color: var(--text) !important; border: none !important; border-radius: var(--border-radius) !important; } .inline-popup-wrapper { - background-color: var(--dark) !important; + background-color: var(--secondary) !important; color: var(--text) !important; - border: var(--border-size) solid var(--light-border) !important; + border: var(--border-size) solid var(--contrast-border) !important; border-radius: var(--border-radius) !important; } @@ -123,6 +162,7 @@ body button.link-btn { :not(.submit-span-wrapper)>input[type="submit"], footer li a, header li a, +.splus-modal-footer-text, .splus-modal-footer-text a, body a.link-btn.active, div.courses-left-menu, @@ -131,8 +171,11 @@ a._3_bfp, footer, footer button, .Header-header-button-1EE8Y, +[class*="Header-header-drop-menu-item-"], +[class*="Header-header-drop-menu-"] li a *, +.Header-header-button-active-GnvKh, .LGaPf svg { - color: var(--text) !important; + color: var(--contrast-text) !important; } /* Schoology Popups */ @@ -148,10 +191,10 @@ footer button, } .popups-box .popups-title { - background-color: var(--dark) !important; + background-color: var(--secondary) !important; } -/* Courses and Groups Dropdown */ +/* Courses and `ropdown */ .splus-courses-navbar-button div[role=menu], .splus-groups-navbar-button div[role=menu] { background-color: var(--accent) !important; @@ -171,7 +214,7 @@ footer button, .splus-courses-navbar-button article a:hover, .splus-groups-navbar-button article a:hover { - border: var(--border-size) solid var(--light-border) !important; + border: var(--border-size) solid var(--contrast-border) !important; border-radius: var(--border-radius) !important; } @@ -201,9 +244,16 @@ footer button, color: var(--muted-text) !important; } -/* Footer */ -footer._2T2dA { - background-color: var(--dark) !important; +header div.Je0RK button._1SIMq { + background-color: var(--secondary) !important; + color: var(--text) !important; + border-radius: var(--border-radius) !important; +} + +._1DD87, +._3gfrT:focus:not(:active), +.oUq3j:hover:not(:active) { + border: var(--border-size) solid var(--contrast-border) !important; } /* Modal Red Color */ @@ -248,14 +298,14 @@ footer._2T2dA { #edge-filters, #edge-filters-menu { background: none !important; - background-color: var(--dark) !important; + background-color: var(--secondary) !important; color: var(--text) !important; - border: var(--border-size) solid var(--light-border) !important; + border: var(--border-size) solid var(--contrast-border) !important; border-radius: var(--border-radius) !important; } #edge-filters-btn { - background-color: var(--dark) !important; + background-color: var(--secondary) !important; color: var(--text) !important; border: none !important; border-radius: var(--border-radius) !important; @@ -269,6 +319,7 @@ footer._2T2dA { #edge-filters-menu .edge-filter-option:hover, #edge-filters-menu .edge-filter-option.active:hover { background-color: var(--active) !important; + color: var(--text) !important; } .gray, @@ -284,6 +335,24 @@ img.splus-logo-inline { background-color: var(--active) !important; } +.theme-2016 .date-header h4 { + border-bottom: var(--border-size) solid var(--contrast-border) !important; +} + +.view-file-popup, +.view-btn-disabled, +.edit-external-tool-attachment { + border-left: var(--border-size) solid var(--contrast-border) !important; +} + +.sgy-tabbed-navigation { + border-bottom: var(--border-size) solid var(--contrast-border) !important; +} + +.sgy-tabbed-navigation li.active { + border-bottom: 5px solid var(--secondary) !important; +} + /* Grades Page */ .gradebook-course.hierarchical-grading-report .period-row .grade-column, .gradebook-course.hierarchical-grading-report .category-row .grade-column, @@ -294,7 +363,7 @@ img.splus-logo-inline { } .due-date, -.max-grade, +.gradebook-course.hierarchical-grading-report .grade-column .max-grade, .percentage-contrib, span.comment, .grade-none-color, @@ -306,7 +375,7 @@ span.comment, } div.summary-course { - background-color: var(--dark) !important; + background-color: var(--secondary) !important; color: var(--text) !important; border: none !important; border-radius: var(--border-radius) !important; @@ -321,12 +390,13 @@ img.splus-coursegradebox-taint { } .gradebook-course.hierarchical-grading-report .item-row .td-content-wrapper { - border-top: var(--border-size) dotted var(--light-border) !important; + border-top: var(--border-size) dotted var(--contrast-border) !important; } .gradebook-course.hierarchical-grading-report .period-row .td-content-wrapper, -.gradebook-course.hierarchical-grading-report .final-row .td-content-wrapper { - border-top: var(--border-size) solid var(--light-border) !important; +.gradebook-course.hierarchical-grading-report .final-row .td-content-wrapper, +.gradebook-course.hierarchical-grading-report .td-content-wrapper { + border-top: var(--border-size) solid var(--contrast-border) !important; } .item-row.added-fake-assignment { @@ -342,6 +412,10 @@ img.splus-coursegradebox-taint { background-color: var(--accent) !important; } +.s-js-chart-and-pager-area .empty { + border-top: var(--border-size) solid var(--contrast-border) !important; +} + /* Courses Page */ .course-action-btns, .group-action-btns { @@ -414,7 +488,7 @@ body>div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ>div>div div._2wOCj { } #library-search-form-container div { - background-color: var(--dark) !important; + background-color: var(--secondary) !important; } #library-search-form-container div::before { @@ -429,7 +503,7 @@ body>div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ>div>div div._2wOCj { #sidebar-left #left-nav #menu-s-main ul li a.active { background-color: var(--accent) !important; - border: var(--border-size) solid var(--light-border) !important; + border: var(--border-size) solid var(--contrast-border) !important; border-right: none !important; border-top-left-radius: 5px; border-bottom-left-radius: 5px; @@ -443,14 +517,15 @@ th.profile-header { .action-links, .comment.no-comments, .materials-filter-wrapper { - background-color: var(--dark) !important; - border: var(--border-size) solid var(--light-border) !important; + background-color: var(--secondary) !important; + border: var(--border-size) solid var(--contrast-border) !important; border-radius: var(--border-radius) !important; color: var(--text) !important; } .materials-filter-wrapper .action-links-wrapper .action-links-unfold, -.action-links-wrapper-gearless .action-links-unfold.active, .action-links-wrapper-gearless .action-links-unfold:active { +.action-links-wrapper-gearless .action-links-unfold.active, +.action-links-wrapper-gearless .action-links-unfold:active { color: var(--text) !important; } @@ -467,15 +542,15 @@ body .action-links a:hover { #folder-contents-table td, #right-column h3 { border: none !important; - border-bottom: var(--border-size) solid var(--light-border) !important; + border-bottom: var(--border-size) solid var(--contrast-border) !important; } .s-edge-feed li { - border-top: var(--border-size) solid var(--light-border) !important; + border-top: var(--border-size) solid var(--contrast-border) !important; } .s-like-sentence { - border-bottom: var(--border-size) solid var(--light-border) !important; + border-bottom: var(--border-size) solid var(--contrast-border) !important; } .pre-fill, @@ -485,8 +560,8 @@ body .action-links a:hover { } #edit-course-switcher-select-nid-menu { - border: var(--border-size) solid var(--light-border) !important; - background-color: var(--dark); + border: var(--border-size) solid var(--contrast-border) !important; + background-color: var(--secondary); border-radius: var(--border-radius) !important; } @@ -498,7 +573,7 @@ body .action-links a:hover { #edit-course-switcher-select-nid-button { border: none !important; background: none !important; - background-color: var(--dark) !important; + background-color: var(--secondary) !important; border-radius: var(--border-radius) !important; } @@ -506,6 +581,15 @@ body .action-links a:hover { filter: invert(var(--theme-is-dark)) !important; } +/* User Page */ +.info-tab th { + color: var(--muted-text) !important; +} + +.info-tab .profile-header { + color: var(--text) !important; +} + /* School / Group Page */ #school-events { padding: var(--padding) !important; @@ -560,7 +644,7 @@ body .action-links a:hover { } .course-dashboard .sgy-card:hover { - border: var(--border-size) solid var(--light-border) !important; + border: var(--border-size) solid var(--contrast-border) !important; } .course-dashboard .sgy-card:hover .sgy-card-lens::after { @@ -576,8 +660,8 @@ body .action-links a:hover { } .course-dashboard .ui-state-highlight { - border: var(--border-size) dashed var(--light-border) !important; - background-color: var(--dark) !important; + border: var(--border-size) dashed var(--contrast-border) !important; + background-color: var(--secondary) !important; } /* Search Bar */ @@ -600,12 +684,12 @@ ul.Search-dropdown-3huUv { ul.primary, .with-tabs #center-top { background: unset !important; - background-color: var(--dark) !important; + background-color: var(--secondary) !important; } ul.primary li a { background: unset !important; - background-color: var(--dark) !important; + background-color: var(--secondary) !important; color: var(--text) !important; } @@ -618,12 +702,12 @@ fieldset { .sticky-header *, .ui-selectmenu-status { - background-color: var(--dark) !important; + background-color: var(--secondary) !important; color: var(--text) !important; } div.cellphone-container { - background-color: var(--dark) !important; + background-color: var(--secondary) !important; color: var(--text) !important; border-radius: var(--border-radius) !important; } @@ -634,7 +718,7 @@ div.cellphone-container { /* Error Page */ #error-page { - background-color: var(--dark) !important; + background-color: var(--secondary) !important; color: var(--text) !important; } @@ -648,21 +732,21 @@ div.cellphone-container { } table.fc-border-separate td { - border: var(--border-size) solid var(--light-border) !important; + border: var(--border-size) solid var(--contrast-border) !important; } table.fc-border-separate .fc-widget-header { - border-bottom: var(--border-size) solid var(--light-border) !important; + border-bottom: var(--border-size) solid var(--contrast-border) !important; } .fc-agenda-slots td, .fc-agenda-slots th, body .fc-widget-header, .fc-agenda-allday th { - border-color: var(--light-border) !important; + border-color: var(--contrast-border) !important; } body .fc-widget-header .fc-agenda-divider-inner { - background: var(--light-border) !important; - border-color: var(--light-border) !important; + background: var(--contrast-border) !important; + border-color: var(--contrast-border) !important; } \ No newline at end of file diff --git a/js/all.js b/js/all.js index c43b8bd3..4423b3c6 100644 --- a/js/all.js +++ b/js/all.js @@ -18,17 +18,35 @@ { let betaCode = Setting.getValue("beta"); + let betaSection = null; if (betaCode in beta_tests) { // Beta Enabled Notice let betaTag = createElement("span", ["splus-beta-tag", "splus-track-clicks"], { textContent: "β", id: "beta-tag" }); betaTag.addEventListener("click", event => openModal("beta-modal")); - document.body.append(betaTag); + let betaContainer = createElement("div", ["splus-beta-container"], {}, [betaTag]); + document.body.append(betaContainer); + betaSection = createBetaSection(betaCode); + betaContainer.append(betaSection); + } + + function createBetaSection(name) { + return createElement("div", ["splus-beta-section"], { id: `splus-beta-section-${name}` }, [ + createElement("h3", [], { textContent: name }) + ]); + } + + function createBetaToggleCheckbox(name, onchange, checked = false, nestingLevel = 1) { + return createElement("div", ["splus-beta-toggle"], { style: { paddingLeft: `${(nestingLevel - 1) * 10}px` } }, [ + createElement("label", [], { textContent: name }), + createElement("input", [], { type: "checkbox", checked: checked, onchange: onchange }) + ]); } // Dark Theme Beta if (betaCode == "darktheme") { - let darkSheet = createElement("link", [], { rel: "stylesheet", href: chrome.runtime.getURL("/css/dark.css") }); - document.head.append(darkSheet); + let newThemeSheet = createElement("link", [], { rel: "stylesheet", href: chrome.runtime.getURL("/css/modern.css") }); + document.head.append(newThemeSheet); + document.documentElement.setAttribute("test-mode", "crazy"); var darkThemeTheme = Theme.loadFromObject({ "color": @@ -50,26 +68,15 @@ Theme.apply(darkThemeTheme); - let darkToggle = createElement("div", ["dark-theme-toggle"], {}, [ - createElement("label", [], { textContent: "Enable dark theme" }), - createElement("input", [], { type: "checkbox", checked: true }) - ]); - - darkToggle.addEventListener("click", event => { - darkSheet.disabled = !event.target.checked; - Theme.apply(event.target.checked ? darkThemeTheme : Theme.byName(Setting.getValue("theme"))); - }); - - let crazyToggle = createElement("div", ["crazy-theme-toggle"], {}, [ - createElement("label", [], { textContent: "Enable color test" }), - createElement("input", [], { type: "checkbox" }) - ]); - - crazyToggle.addEventListener("click", event => { - document.documentElement.setAttribute("crazy", event.target.checked); - }); - - document.body.append(darkToggle, crazyToggle); + betaSection.append( + createBetaToggleCheckbox("Enable new theme engine", event => newThemeSheet.disabled = !event.target.checked, true), + createBetaToggleCheckbox("Enable dark theme", event => { + document.documentElement.setAttribute("dark", event.target.checked); + Theme.apply(event.target.checked ? darkThemeTheme : Theme.byName(Setting.getValue("theme"))); + }, true), + createBetaToggleCheckbox("Enable color test", event => document.documentElement.setAttribute("test", event.target.checked)), + createBetaToggleCheckbox("Crazy mode", event => document.documentElement.setAttribute("test-mode", event.target.checked ? "crazy" : "standard"), true, 2) + ); } } @@ -921,7 +928,8 @@ async function createQuickAccess() { let wrapper = createElement("div", ["quick-access-wrapper"], {}, [ createElement("h3", ["h3-med"], {}, [ - createElement("img", ["splus-logo-inline"], { src: chrome.runtime.getURL("imgs/plus-icon.png"), title: "Provided by Schoology Plus" }), + 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" }) ]), diff --git a/js/preload.js b/js/preload.js index 2a7feac2..8f0c43ef 100644 --- a/js/preload.js +++ b/js/preload.js @@ -42,7 +42,7 @@ updateSettings(); var beta_tests = { "darktheme": "https://schoologypl.us", - // "newgrades": "https://schoologypl.us" + "newgrades": "https://schoologypl.us" }; var defaultCourseIconUrlRegex = /\/sites\/[a-zA-Z0-9_-]+\/themes\/[%a-zA-Z0-9_-]+\/images\/course-default.(?:svg|png|jpe?g|gif)(\?[a-zA-Z0-9_%-]+(=[a-zA-Z0-9_%-]+)?(&[a-zA-Z0-9_%-]+(=[a-zA-Z0-9_%-]+)?)*)?$/; diff --git a/manifest.json b/manifest.json index 68a74f56..5f04f752 100644 --- a/manifest.json +++ b/manifest.json @@ -41,7 +41,7 @@ "lib/js/pdf.worker.js", "theme-editor.html", "default-icons.html", - "css/dark.css" + "css/modern.css" ], "content_security_policy": "script-src 'self'; object-src 'self'", "background": { From 0faeb98b2d3eb5817adb781757db7434aa8e30e3 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Mon, 15 Jun 2020 19:58:18 -0700 Subject: [PATCH 22/27] Added exclude matches for some domains --- manifest.json | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/manifest.json b/manifest.json index 5f04f752..24dfe5f1 100644 --- a/manifest.json +++ b/manifest.json @@ -60,7 +60,19 @@ "https://*.schoology.com/*" ], "exclude_matches": [ - "https://*.schoology.com/login*" + "https://*.schoology.com/login*", + "*://asset-cdn.schoology.com", + "*://developer.schoology.com", + "*://support.schoology.com", + "*://info.schoology.com", + "*://files-cdn.schoology.com", + "*://status.schoology.com", + "*://ui.schoology.com", + "*://www.schoology.com", + "*://api.schoology.com", + "*://developers.schoology.com", + "*://schoology.com", + "*://support.schoology.com" ], "css": [ "css/all.css" From ab2835304004c4e937cecb776e126709a2466771 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Tue, 16 Jun 2020 16:03:50 -0700 Subject: [PATCH 23/27] more dark theme improvements --- css/all.css | 3 +- css/grades.css | 9 ++-- css/modern.css | 110 +++++++++++++++++++++++++++++++++++++------ css/theme-editor.css | 7 +-- js/course.js | 3 +- js/grades.js | 2 +- manifest.json | 24 +++++----- 7 files changed, 121 insertions(+), 37 deletions(-) diff --git a/css/all.css b/css/all.css index efcafb9d..93801372 100644 --- a/css/all.css +++ b/css/all.css @@ -357,6 +357,7 @@ section.sgy-card .sgy-card-lens img.injected-course-icon { background-color: var(--hover-color) !important; } +.submit-span-wrapper, .submit-span-wrapper input[type=button], .submit-span-wrapper input[type=submit] { height: 25px !important; @@ -664,7 +665,7 @@ a._3_bfp { position: fixed; left: 3px; top: 12px; - z-index: 1000; + z-index: 9999; color: white !important; border: 2px solid white; border-radius: 10px; diff --git a/css/grades.css b/css/grades.css index 81ee1460..c4cb6387 100644 --- a/css/grades.css +++ b/css/grades.css @@ -218,12 +218,11 @@ input#enable-modify { letter-spacing:normal; } -img.splus-coursegradebox-taint { - width: 1em; - height: 1em; +svg.splus-coursegradebox-taint { + width: 1.2em; + height: 1.2em; vertical-align: middle; - filter: brightness(0.0625); /* 1/16; corresponds with Schoology's #111111 */ - padding-right: 0.1em; + padding-right: 0.2em; } .splus-weighted-gradebook-indicator { diff --git a/css/modern.css b/css/modern.css index 0e3f4ff1..ce9defff 100644 --- a/css/modern.css +++ b/css/modern.css @@ -121,7 +121,7 @@ ul.context-menu-list li.context-menu-item:hover { border-bottom-right-radius: var(--border-radius) !important; } -#right-column-inner>div { +#right-column-inner>div:not(:empty) { background-color: var(--secondary) !important; border: none !important; border-radius: var(--border-radius) !important; @@ -156,6 +156,7 @@ body button.link-btn { } .splus-modal-title, +.submit-span-wrapper, .submit-span-wrapper input[type="button"], .submit-span-wrapper input[type="submit"], :not(.submit-span-wrapper)>input[type="button"], @@ -178,11 +179,23 @@ footer button, color: var(--contrast-text) !important; } +.close { + color: var(--contrast-text) !important; + opacity: 0.8 !important; +} + +.close:hover, +.close:focus { + opacity: 1 !important; + color: var(--contrast-text) !important; +} + /* Schoology Popups */ .popups-box .popups-body, #popups-loading div { background-color: var(--primary) !important; color: var(--text) !important; + border: none !important; } .popups-box .submit-buttons { @@ -192,9 +205,19 @@ footer button, .popups-box .popups-title { background-color: var(--secondary) !important; + color: var(--text) !important; + border: none !important; +} + +.popups-close a { + background-position-y: calc(-80px - (20px * var(--theme-is-dark))) !important; +} + +.likers li:not(.last) { + border-bottom: var(--border-size) solid var(--contrast-border) !important; } -/* Courses and `ropdown */ +/* Courses and Groups Dropdown */ .splus-courses-navbar-button div[role=menu], .splus-groups-navbar-button div[role=menu] { background-color: var(--accent) !important; @@ -281,8 +304,7 @@ header div.Je0RK button._1SIMq { [page^="/home"] #right-column-inner div, [page^="/home"] #home-feed-container, [page="/"] #right-column-inner div, -[page="/"] #home-feed-container, -.feed-comments { +[page="/"] #home-feed-container { background-color: var(--accent) !important; color: var(--text) !important; border-radius: var(--border-radius) !important; @@ -304,7 +326,8 @@ header div.Je0RK button._1SIMq { border-radius: var(--border-radius) !important; } -#edge-filters-btn { +#edge-filters-btn, +.feed-comments { background-color: var(--secondary) !important; color: var(--text) !important; border: none !important; @@ -335,7 +358,8 @@ img.splus-logo-inline { background-color: var(--active) !important; } -.theme-2016 .date-header h4 { +.theme-2016 .date-header h4, +#home-feed-container #smart-box { border-bottom: var(--border-size) solid var(--contrast-border) !important; } @@ -350,7 +374,7 @@ img.splus-logo-inline { } .sgy-tabbed-navigation li.active { - border-bottom: 5px solid var(--secondary) !important; + border-bottom: 5px solid var(--contrast-border) !important; } /* Grades Page */ @@ -381,10 +405,6 @@ div.summary-course { border-radius: var(--border-radius) !important; } -img.splus-coursegradebox-taint { - filter: brightness(var(--theme-is-dark)) !important; -} - .grade-edit-indicator { filter: grayscale(var(--theme-is-dark)) invert(var(--theme-is-dark)) !important; } @@ -407,6 +427,38 @@ img.splus-coursegradebox-taint { background-position: calc(0px - 22px * var(--theme-is-dark)) -127px !important; } +.gradebook-course.hierarchical-grading-report .childrenCollapsed .title-column:hover .expandable-icon-grading-report { + position: absolute !important; + clip: rect(calc(15px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), 0) !important; + top: calc(0px + (16px * var(--theme-is-dark))) !important; + left: -20px !important; + opacity: 1 !important; +} + +.gradebook-course.hierarchical-grading-report .childrenCollapsed .title-column .expandable-icon-grading-report { + position: absolute !important; + clip: rect(calc(15px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), 0) !important; + top: calc(0px + (16px * var(--theme-is-dark))) !important; + left: -20px !important; + opacity: 0.8 !important; +} + +.gradebook-course.hierarchical-grading-report .title-column .expandable-icon-grading-report { + position: absolute !important; + clip: rect(calc(46px - (11px * var(--theme-is-dark))), calc(60px - (45px * var(--theme-is-dark))), calc(80px - (30px * var(--theme-is-dark))), 0) !important; + top: calc(-32px + (16px * var(--theme-is-dark))) !important; + left: -20px !important; + opacity: 0.8 !important; +} + +.gradebook-course.hierarchical-grading-report .title-column:hover .expandable-icon-grading-report { + position: absolute !important; + clip: rect(calc(46px - (11px * var(--theme-is-dark))), calc(60px - (45px * var(--theme-is-dark))), calc(80px - (30px * var(--theme-is-dark))), 0) !important; + top: calc(-32px + (16px * var(--theme-is-dark))) !important; + left: -20px !important; + opacity: 1 !important; +} + /* Mastery Page */ #s-js-student-mastery-report-view-content { background-color: var(--accent) !important; @@ -449,7 +501,8 @@ body>div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ>div>div div._2wOCj { color: var(--muted-text) !important; } -#reorder-ui button.link-btn { +body #right-column-inner button.link-btn, +body #right-column-inner a.link-btn { background-color: var(--primary) !important; } @@ -457,6 +510,29 @@ body>div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ>div>div div._2wOCj { filter: invert(var(--theme-is-dark)) !important; } +.course-list-view #secondary-tabs-wrapper ul { + border-bottom: none !important; +} + +.no-courses { + color: var(--muted-text) !important; +} + +.tabs.secondary li a { + background: var(--secondary) !important; + color: var(--text) !important; + border: none !important; + border-radius: var(--border-radius) !important; +} + +.tabs.secondary li.active a { + background: none !important; + color: var(--text) !important; + background-color: var(--active) !important; + border-radius: var(--border-radius) !important; + border: none !important; +} + /* Resources Page */ [page^="/resources"] #main-content-wrapper { background-color: var(--primary) !important; @@ -540,7 +616,8 @@ body .action-links a:hover { .materials-top, #folder-contents-table td, -#right-column h3 { +#right-column h3, +.left-block-wrapper h3 { border: none !important; border-bottom: var(--border-size) solid var(--contrast-border) !important; } @@ -549,7 +626,7 @@ body .action-links a:hover { border-top: var(--border-size) solid var(--contrast-border) !important; } -.s-like-sentence { +.s-like-sentence:not(:last-child) { border-bottom: var(--border-size) solid var(--contrast-border) !important; } @@ -581,6 +658,11 @@ body .action-links a:hover { filter: invert(var(--theme-is-dark)) !important; } +.messages.warning { + background: var(--highlight) !important; + color: var(--text) !important; +} + /* User Page */ .info-tab th { color: var(--muted-text) !important; diff --git a/css/theme-editor.css b/css/theme-editor.css index 58082f3b..91737e80 100644 --- a/css/theme-editor.css +++ b/css/theme-editor.css @@ -3,6 +3,7 @@ --primary-color: hsl(var(--color-hue), 50%, 50%); --background-color: hsl(var(--color-hue), 60%, 30%); --hover-color: hsl(var(--color-hue), 55%, 40%); + --link-color: var(--hover-color); --border-color: hsl(var(--color-hue), 60%, 25%); --cursor: auto; --lausd-visible: block; @@ -490,7 +491,7 @@ input[type=button] { } .tabs>li>a.active { - color: var(--hover-color) !important; + color: var(--link-color) !important; } .tabs>li>a { @@ -498,7 +499,7 @@ input[type=button] { } .tabs>li>a:hover:not(.active) { - color: var(--hover-color) !important; + color: var(--link-color) !important; } .tabs a:focus.active { @@ -651,7 +652,7 @@ textarea#json-output[readonly] { } .setting-link { - color: var(--hover-color); + color: var(--link-color); } .show-lausd { diff --git a/js/course.js b/js/course.js index 41c82459..99724536 100644 --- a/js/course.js +++ b/js/course.js @@ -4,7 +4,8 @@ let courseSettingsCourseName; let sidebar = document.querySelector(".course-info-wrapper dl"); if (sidebar) { let button = createButton("splus-course-options", "Course Options"); - let img = createElement("img", [], { src: chrome.runtime.getURL("imgs/plus-icon.png"), width: 19, style: { verticalAlign: "middle", paddingLeft: "4px" } }); + let img = createSvgLogo(); + Object.assign(img.style, { verticalAlign: "middle", paddingLeft: "4px", width: "18px" }); button.prepend(img); button.querySelector("input").style.paddingLeft = "4px"; button.style.cursor = "pointer"; diff --git a/js/grades.js b/js/grades.js index ef308110..56979c59 100644 --- a/js/grades.js +++ b/js/grades.js @@ -427,7 +427,7 @@ var fetchQueue = []; // we put our tweaks here in the first place because it makes sense in the UI, and because it doesn't change with grade edits // yet we want to be clear this is unofficial // TODO discuss potentially better alternatives to either this particular or any img in general for making this clarification - return createElement("img", ["splus-coursegradebox-taint"], { src: chrome.runtime.getURL("imgs/plus-icon.png"), title: "Predicted by Schoology Plus" }); + return createSvgLogo("splus-coursegradebox-taint"); } // points needed for next highest grade diff --git a/manifest.json b/manifest.json index 24dfe5f1..521f9591 100644 --- a/manifest.json +++ b/manifest.json @@ -61,18 +61,18 @@ ], "exclude_matches": [ "https://*.schoology.com/login*", - "*://asset-cdn.schoology.com", - "*://developer.schoology.com", - "*://support.schoology.com", - "*://info.schoology.com", - "*://files-cdn.schoology.com", - "*://status.schoology.com", - "*://ui.schoology.com", - "*://www.schoology.com", - "*://api.schoology.com", - "*://developers.schoology.com", - "*://schoology.com", - "*://support.schoology.com" + "*://asset-cdn.schoology.com/*", + "*://developer.schoology.com/*", + "*://support.schoology.com/*", + "*://info.schoology.com/*", + "*://files-cdn.schoology.com/*", + "*://status.schoology.com/*", + "*://ui.schoology.com/*", + "*://www.schoology.com/*", + "*://api.schoology.com/*", + "*://developers.schoology.com/*", + "*://schoology.com/*", + "*://support.schoology.com/*" ], "css": [ "css/all.css" From 7fd775d022086810149dbd991f8b96fe8892301a Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Sun, 28 Jun 2020 20:31:45 -0700 Subject: [PATCH 24/27] More dark theme changes --- css/modern.css | 91 +++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 90 insertions(+), 1 deletion(-) diff --git a/css/modern.css b/css/modern.css index ce9defff..c33650d1 100644 --- a/css/modern.css +++ b/css/modern.css @@ -137,6 +137,7 @@ ul.context-menu-list li.context-menu-item:hover { body a.link-btn, body button.link-btn { + box-shadow: none !important; background: none !important; background-color: var(--secondary) !important; color: var(--text) !important; @@ -459,6 +460,32 @@ div.summary-course { opacity: 1 !important; } +.empty.grades-empty { + color: var(--muted-text) !important; +} + +.download-grade-wrapper a.link-btn { + background-color: var(--primary) !important; +} + +#past-selector .item-list a.link-btn.active { + background-color: var(--active) !important; +} + +body ul.primary li.active a, +body ul.primary li.active a:hover, +body ul.primary li a, +body ul.primary li a:hover, +body ul.primary li a:visited, +body ul.primary { + border-color: var(--contrast-border) !important; + border-width: var(--border-size) !important; +} + +.gradebook-course, .attendance-course { + border-top: var(--border-size) solid var(--contrast-border) !important; +} + /* Mastery Page */ #s-js-student-mastery-report-view-content { background-color: var(--accent) !important; @@ -477,6 +504,7 @@ div.summary-course { #secondary-tabs-wrapper { border-right: none !important; + background-color: var(--accent) !important; } body>div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ>div>div { @@ -533,6 +561,15 @@ body #right-column-inner a.link-btn { border: none !important; } +.listing .course-item.list-item, +.courses-listing.mycourses h3 { + border-bottom: var(--border-size) solid var(--contrast-border) !important; +} + +#main .courses-listing.listing { + border-top: var(--border-size) solid var(--contrast-border) !important; +} + /* Resources Page */ [page^="/resources"] #main-content-wrapper { background-color: var(--primary) !important; @@ -571,6 +608,50 @@ body #right-column-inner a.link-btn { display: none !important; } +#collection-view-contents .collection-row-empty td { + color: var(--text) !important; +} + +body.library-view #library-main { + border-left: var(--border-size) solid var(--contrast-border) !important; +} + +#collection-toolbar, +#collection-view-contents { + border-top: var(--border-size) solid var(--contrast-border) !important; +} + +#collection-view-contents th, +#collection-view-contents td, +#library-left .collections-list-wrapper { + border-bottom: var(--border-size) solid var(--contrast-border) !important; +} + +body.library-view #library-left { + border-right: var(--border-size) solid var(--contrast-border) !important; +} + +#collection-toolbar .action-links-unfold { + box-shadow: none !important; + border: none !important; + background: var(--secondary) !important; + border-radius: var(--border-radius) !important; + color: var(--text) !important; +} + +.action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text { + color: var(--text) !important; +} + +#reorder-collections-btn { + color: var(--text) !important; +} + +#reorder-collections-btn:hover { + background-color: var(--active) !important; + color: var(--text) !important; +} + /* Profile Page */ .right-block-big-wrapper { padding: var(--padding) !important; @@ -664,8 +745,12 @@ body .action-links a:hover { } /* User Page */ -.info-tab th { +.info-tab th, +.info-tab td, +.enrollment-view-wrapper td, +.enrollment-view-wrapper th { color: var(--muted-text) !important; + border-bottom: var(--border-size) solid var(--contrast-border) !important; } .info-tab .profile-header { @@ -709,6 +794,10 @@ body .action-links a:hover { background-color: var(--active) !important; } +#content-left .s-enrollment-realm-actions { + border-top: var(--border-size) solid var(--contrast-border) !important; +} + /* Course Dashboard */ .course-dashboard section { border: none !important; From 0e69dbf3ad8658bd716922117f2076f73c3da878 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Sun, 9 Aug 2020 22:03:09 -0700 Subject: [PATCH 25/27] More dark theme improvements --- css/modern.css | 47 +++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 45 insertions(+), 2 deletions(-) diff --git a/css/modern.css b/css/modern.css index c33650d1..817b1851 100644 --- a/css/modern.css +++ b/css/modern.css @@ -318,7 +318,6 @@ header div.Je0RK button._1SIMq { } .s-polls-poll-option, -#edge-filters, #edge-filters-menu { background: none !important; background-color: var(--secondary) !important; @@ -327,11 +326,17 @@ header div.Je0RK button._1SIMq { border-radius: var(--border-radius) !important; } +#edge-filters { + background: none !important; + border: none !important; +} + #edge-filters-btn, .feed-comments { + background-position-y: calc(-576px - 18px * var(--theme-is-dark)) !important; background-color: var(--secondary) !important; color: var(--text) !important; - border: none !important; + border: var(--border-size) solid var(--contrast-border) !important; border-radius: var(--border-radius) !important; opacity: unset !important; } @@ -486,6 +491,16 @@ body ul.primary { border-top: var(--border-size) solid var(--contrast-border) !important; } +[page*="/student_attendance"] table thead th { + border-color: var(--contrast-border) !important; + border-width: var(--border-size) 0 !important; +} + +.attendance-course-attendance table th, +.attendance-course-attendance table td { + border: var(--border-size) solid var(--contrast-border) !important; +} + /* Mastery Page */ #s-js-student-mastery-report-view-content { background-color: var(--accent) !important; @@ -570,6 +585,34 @@ body #right-column-inner a.link-btn { border-top: var(--border-size) solid var(--contrast-border) !important; } +/* Members Page */ +.enrollment-search .go-btn { + background-color: inherit !important; +} + +.roster-top { + border-bottom: var(--border-size) solid var(--contrast-border) !important; +} + +body .enrollment-filters span.active, body .grading-groups-list .grading-group.active { + background-color: var(--active) !important; +} + +.enrollment-filters span:hover { + background-color: var(--active) !important; +} + +/* Breadcrumbs */ + +#site-navigation-breadcrumbs nav { + background-color: var(--accent) !important; +} + +#site-navigation-breadcrumbs nav li a, +#site-navigation-breadcrumbs nav li span { + color: var(--text) !important; +} + /* Resources Page */ [page^="/resources"] #main-content-wrapper { background-color: var(--primary) !important; From 063a6c899c1c76345d792f242d67e1dcaee02369 Mon Sep 17 00:00:00 2001 From: Aaron Opell Date: Sun, 16 Aug 2020 22:29:48 -0700 Subject: [PATCH 26/27] Update contextmenu to 2.9.2 --- lib/css/contextmenu.css | 10 +++++----- lib/js/contextmenu.js | 4 ++-- lib/sources.txt | 6 +++--- 3 files changed, 10 insertions(+), 10 deletions(-) diff --git a/lib/css/contextmenu.css b/lib/css/contextmenu.css index 0cfdc951..5b2a2932 100644 --- a/lib/css/contextmenu.css +++ b/lib/css/contextmenu.css @@ -1,16 +1,16 @@ @charset "UTF-8";/*! * jQuery contextMenu - Plugin for simple contextMenu handling * - * Version: v2.9.0 + * Version: v2.9.2 * * Authors: Björn Brala (SWIS.nl), Rodney Rehm, Addy Osmani (patches for FF) * Web: http://swisnl.github.io/jQuery-contextMenu/ * - * Copyright (c) 2011-2019 SWIS BV and contributors + * Copyright (c) 2011-2020 SWIS BV and contributors * * Licensed under * MIT License http://www.opensource.org/licenses/mit-license * - * Date: 2019-10-13T13:09:56.297Z - */@-webkit-keyframes cm-spin{0%{-webkit-transform:translateY(-50%) rotate(0);transform:translateY(-50%) rotate(0)}100%{-webkit-transform:translateY(-50%) rotate(359deg);transform:translateY(-50%) rotate(359deg)}}@-o-keyframes cm-spin{0%{-webkit-transform:translateY(-50%) rotate(0);-o-transform:translateY(-50%) rotate(0);transform:translateY(-50%) rotate(0)}100%{-webkit-transform:translateY(-50%) rotate(359deg);-o-transform:translateY(-50%) rotate(359deg);transform:translateY(-50%) rotate(359deg)}}@keyframes cm-spin{0%{-webkit-transform:translateY(-50%) rotate(0);-o-transform:translateY(-50%) rotate(0);transform:translateY(-50%) rotate(0)}100%{-webkit-transform:translateY(-50%) rotate(359deg);-o-transform:translateY(-50%) rotate(359deg);transform:translateY(-50%) rotate(359deg)}}@font-face{font-family:context-menu-icons;font-style:normal;font-weight:400;src:url(font/context-menu-icons.eot?4f0ru);src:url(font/context-menu-icons.eot?4f0ru#iefix) format("embedded-opentype"),url(font/context-menu-icons.woff2?4f0ru) format("woff2"),url(font/context-menu-icons.woff?4f0ru) format("woff"),url(font/context-menu-icons.ttf?4f0ru) format("truetype")}.context-menu-icon-add:before{content:"\EA01"}.context-menu-icon-copy:before{content:"\EA02"}.context-menu-icon-cut:before{content:"\EA03"}.context-menu-icon-delete:before{content:"\EA04"}.context-menu-icon-edit:before{content:"\EA05"}.context-menu-icon-loading:before{content:"\EA06"}.context-menu-icon-paste:before{content:"\EA07"}.context-menu-icon-quit:before{content:"\EA08"}.context-menu-icon::before{position:absolute;top:50%;left:0;width:2em;font-family:context-menu-icons;font-size:1em;font-style:normal;font-weight:400;line-height:1;color:#2980b9;text-align:center;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.context-menu-icon.context-menu-hover:before{color:#fff}.context-menu-icon.context-menu-disabled::before{color:#bbb}.context-menu-icon.context-menu-icon-loading:before{-webkit-animation:cm-spin 2s infinite;-o-animation:cm-spin 2s infinite;animation:cm-spin 2s infinite}.context-menu-icon.context-menu-icon--fa{display:list-item;font-family:inherit;line-height:inherit}.context-menu-icon.context-menu-icon--fa::before{position:absolute;top:50%;left:0;width:2em;font-family:FontAwesome;font-size:1em;font-style:normal;font-weight:400;line-height:1;color:#2980b9;text-align:center;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.context-menu-icon.context-menu-icon--fa.context-menu-hover:before{color:#fff}.context-menu-icon.context-menu-icon--fa.context-menu-disabled::before{color:#bbb}.context-menu-icon.context-menu-icon--fa5{display:list-item;font-family:inherit;line-height:inherit}.context-menu-icon.context-menu-icon--fa5 i,.context-menu-icon.context-menu-icon--fa5 svg{position:absolute;top:.3em;left:.5em;color:#2980b9}.context-menu-icon.context-menu-icon--fa5.context-menu-hover>i,.context-menu-icon.context-menu-icon--fa5.context-menu-hover>svg{color:#fff}.context-menu-icon.context-menu-icon--fa5.context-menu-disabled i,.context-menu-icon.context-menu-icon--fa5.context-menu-disabled svg{color:#bbb}.context-menu-list{position:absolute;display:inline-block;min-width:13em;max-width:26em;padding:.25em 0;margin:.3em;font-family:inherit;font-size:inherit;list-style-type:none;background:#fff;border:1px solid #bebebe;border-radius:.2em;-webkit-box-shadow:0 2px 5px rgba(0,0,0,.5);box-shadow:0 2px 5px rgba(0,0,0,.5)}.context-menu-item{position:relative;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;padding:.2em 2em;color:#2f2f2f;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:#fff}.context-menu-separator{padding:0;margin:.35em 0;border-bottom:1px solid #e6e6e6}.context-menu-item>label>input,.context-menu-item>label>textarea{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.context-menu-item.context-menu-hover{color:#fff;cursor:pointer;background-color:#2980b9}.context-menu-item.context-menu-disabled{color:#bbb;cursor:default;background-color:#fff}.context-menu-input.context-menu-hover{color:#2f2f2f;cursor:default}.context-menu-submenu:after{position:absolute;top:50%;right:.5em;z-index:1;width:0;height:0;content:'';border-color:transparent transparent transparent #2f2f2f;border-style:solid;border-width:.25em 0 .25em .25em;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%)}.context-menu-item.context-menu-input{padding:.3em .6em}.context-menu-input>label>*{vertical-align:top}.context-menu-input>label>input[type=checkbox],.context-menu-input>label>input[type=radio]{position:relative;top:.12em;margin-right:.4em}.context-menu-input>label{margin:0}.context-menu-input>label,.context-menu-input>label>input[type=text],.context-menu-input>label>select,.context-menu-input>label>textarea{display:block;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.context-menu-input>label>textarea{height:7em}.context-menu-item>.context-menu-list{top:.3em;right:-.3em;display:none}.context-menu-item.context-menu-visible>.context-menu-list{display:block}.context-menu-accesskey{text-decoration:underline} -/*# sourceMappingURL=jquery.contextMenu.min.css.map */ + * Date: 2020-05-13T13:55:37.023Z + */@-webkit-keyframes cm-spin{0%{-webkit-transform:translateY(-50%) rotate(0);transform:translateY(-50%) rotate(0)}100%{-webkit-transform:translateY(-50%) rotate(359deg);transform:translateY(-50%) rotate(359deg)}}@-o-keyframes cm-spin{0%{-webkit-transform:translateY(-50%) rotate(0);-o-transform:translateY(-50%) rotate(0);transform:translateY(-50%) rotate(0)}100%{-webkit-transform:translateY(-50%) rotate(359deg);-o-transform:translateY(-50%) rotate(359deg);transform:translateY(-50%) rotate(359deg)}}@keyframes cm-spin{0%{-webkit-transform:translateY(-50%) rotate(0);-o-transform:translateY(-50%) rotate(0);transform:translateY(-50%) rotate(0)}100%{-webkit-transform:translateY(-50%) rotate(359deg);-o-transform:translateY(-50%) rotate(359deg);transform:translateY(-50%) rotate(359deg)}}@font-face{font-family:context-menu-icons;font-style:normal;font-weight:400;src:url(font/context-menu-icons.eot?33lxn);src:url(font/context-menu-icons.eot?33lxn#iefix) format("embedded-opentype"),url(font/context-menu-icons.woff2?33lxn) format("woff2"),url(font/context-menu-icons.woff?33lxn) format("woff"),url(font/context-menu-icons.ttf?33lxn) format("truetype")}.context-menu-icon-add:before{content:"\EA01"}.context-menu-icon-copy:before{content:"\EA02"}.context-menu-icon-cut:before{content:"\EA03"}.context-menu-icon-delete:before{content:"\EA04"}.context-menu-icon-edit:before{content:"\EA05"}.context-menu-icon-loading:before{content:"\EA06"}.context-menu-icon-paste:before{content:"\EA07"}.context-menu-icon-quit:before{content:"\EA08"}.context-menu-icon::before{position:absolute;top:50%;left:0;width:2em;font-family:context-menu-icons;font-size:1em;font-style:normal;font-weight:400;line-height:1;color:#2980b9;text-align:center;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.context-menu-icon.context-menu-hover:before{color:#fff}.context-menu-icon.context-menu-disabled::before{color:#bbb}.context-menu-icon.context-menu-icon-loading:before{-webkit-animation:cm-spin 2s infinite;-o-animation:cm-spin 2s infinite;animation:cm-spin 2s infinite}.context-menu-icon.context-menu-icon--fa{display:list-item;font-family:inherit;line-height:inherit}.context-menu-icon.context-menu-icon--fa::before{position:absolute;top:50%;left:0;width:2em;font-family:FontAwesome;font-size:1em;font-style:normal;font-weight:400;line-height:1;color:#2980b9;text-align:center;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.context-menu-icon.context-menu-icon--fa.context-menu-hover:before{color:#fff}.context-menu-icon.context-menu-icon--fa.context-menu-disabled::before{color:#bbb}.context-menu-icon.context-menu-icon--fa5{display:list-item;font-family:inherit;line-height:inherit}.context-menu-icon.context-menu-icon--fa5 i,.context-menu-icon.context-menu-icon--fa5 svg{position:absolute;top:.3em;left:.5em;color:#2980b9}.context-menu-icon.context-menu-icon--fa5.context-menu-hover>i,.context-menu-icon.context-menu-icon--fa5.context-menu-hover>svg{color:#fff}.context-menu-icon.context-menu-icon--fa5.context-menu-disabled i,.context-menu-icon.context-menu-icon--fa5.context-menu-disabled svg{color:#bbb}.context-menu-list{position:absolute;display:inline-block;min-width:13em;max-width:26em;padding:.25em 0;margin:.3em;font-family:inherit;font-size:inherit;list-style-type:none;background:#fff;border:1px solid #bebebe;border-radius:.2em;-webkit-box-shadow:0 2px 5px rgba(0,0,0,.5);box-shadow:0 2px 5px rgba(0,0,0,.5)}.context-menu-item{position:relative;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;padding:.2em 2em;color:#2f2f2f;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:#fff}.context-menu-separator{padding:0;margin:.35em 0;border-bottom:1px solid #e6e6e6}.context-menu-item>label>input,.context-menu-item>label>textarea{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.context-menu-item.context-menu-hover{color:#fff;cursor:pointer;background-color:#2980b9}.context-menu-item.context-menu-disabled{color:#bbb;cursor:default;background-color:#fff}.context-menu-input.context-menu-hover{color:#2f2f2f;cursor:default}.context-menu-submenu:after{position:absolute;top:50%;right:.5em;z-index:1;width:0;height:0;content:'';border-color:transparent transparent transparent #2f2f2f;border-style:solid;border-width:.25em 0 .25em .25em;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%)}.context-menu-item.context-menu-input{padding:.3em .6em}.context-menu-input>label>*{vertical-align:top}.context-menu-input>label>input[type=checkbox],.context-menu-input>label>input[type=radio]{position:relative;top:.12em;margin-right:.4em}.context-menu-input>label{margin:0}.context-menu-input>label,.context-menu-input>label>input[type=text],.context-menu-input>label>select,.context-menu-input>label>textarea{display:block;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.context-menu-input>label>textarea{height:7em}.context-menu-item>.context-menu-list{top:.3em;right:-.3em;display:none}.context-menu-item.context-menu-visible>.context-menu-list{display:block}.context-menu-accesskey{text-decoration:underline} +/*# sourceMappingURL=jquery.contextMenu.min.css.map */ \ No newline at end of file diff --git a/lib/js/contextmenu.js b/lib/js/contextmenu.js index f88a79c2..94f4a13b 100644 --- a/lib/js/contextmenu.js +++ b/lib/js/contextmenu.js @@ -1,2 +1,2 @@ -!function(e){"function"==typeof define&&define.amd?define(["jquery"],e):"object"==typeof exports?e(require("jquery")):e(jQuery)}(function(m){"use strict";var a;m.support.htmlMenuitem="HTMLMenuItemElement"in window,m.support.htmlCommand="HTMLCommandElement"in window,m.support.eventSelectstart="onselectstart"in document.documentElement,m.ui&&m.widget||(m.cleanData=(a=m.cleanData,function(e){var t,n,o;for(o=0;null!=e[o];o++){n=e[o];try{(t=m._data(n,"events"))&&t.remove&&m(n).triggerHandler("remove")}catch(e){}}a(e)}));var c=null,d=!1,p=m(window),f=0,h={},x={},v={},g={selector:null,appendTo:null,trigger:"right",autoHide:!1,delay:200,reposition:!0,hideOnSecondTrigger:!1,selectableSubMenu:!1,classNames:{hover:"context-menu-hover",disabled:"context-menu-disabled",visible:"context-menu-visible",notSelectable:"context-menu-not-selectable",icon:"context-menu-icon",iconEdit:"context-menu-icon-edit",iconCut:"context-menu-icon-cut",iconCopy:"context-menu-icon-copy",iconPaste:"context-menu-icon-paste",iconDelete:"context-menu-icon-delete",iconAdd:"context-menu-icon-add",iconQuit:"context-menu-icon-quit",iconLoadingClass:"context-menu-icon-loading"},determinePosition:function(e){if(m.ui&&m.ui.position)e.css("display","block").position({my:"center top",at:"center bottom",of:this,offset:"0 5",collision:"fit"}).css("display","none");else{var t=this.offset();t.top+=this.outerHeight(),t.left+=this.outerWidth()/2-e.outerWidth()/2,e.css(t)}},position:function(e,t,n){var o;if(t||n){if("maintain"===t&&"maintain"===n)o=e.$menu.position();else{var a=e.$menu.offsetParent().offset();o={top:n-a.top,left:t-a.left}}var s=p.scrollTop()+p.height(),i=p.scrollLeft()+p.width(),c=e.$menu.outerHeight(),l=e.$menu.outerWidth();o.top+c>s&&(o.top-=c),o.top<0&&(o.top=0),o.left+l>i&&(o.left-=l),o.left<0&&(o.left=0),e.$menu.css(o)}else e.determinePosition.call(this,e.$menu)},positionSubmenu:function(e){if(void 0!==e)if(m.ui&&m.ui.position)e.css("display","block").position({my:"left top-5",at:"right top",of:this,collision:"flipfit fit"}).css("display","");else{var t={top:-9,left:this.outerWidth()-5};e.css(t)}},zIndex:1,animation:{duration:50,show:"slideDown",hide:"slideUp"},events:{preShow:m.noop,show:m.noop,hide:m.noop,activated:m.noop},callback:null,items:{}},s={timer:null,pageX:null,pageY:null},b={abortevent:function(e){e.preventDefault(),e.stopImmediatePropagation()},contextmenu:function(e){var t=m(this);if(!1!==e.data.events.preShow(t,e)&&("right"===e.data.trigger&&(e.preventDefault(),e.stopImmediatePropagation()),!("right"!==e.data.trigger&&"demand"!==e.data.trigger&&e.originalEvent||!(void 0===e.mouseButton||!e.data||"left"===e.data.trigger&&0===e.mouseButton||"right"===e.data.trigger&&2===e.mouseButton)||t.hasClass("context-menu-active")||t.hasClass("context-menu-disabled")))){if(c=t,e.data.build){var n=e.data.build(c,e);if(!1===n)return;if(e.data=m.extend(!0,{},g,e.data,n||{}),!e.data.items||m.isEmptyObject(e.data.items))throw window.console&&(console.error||console.log).call(console,"No items specified to show in contextMenu"),new Error("No Items specified");e.data.$trigger=c,$.create(e.data)}$.show.call(t,e.data,e.pageX,e.pageY)}},click:function(e){e.preventDefault(),e.stopImmediatePropagation(),m(this).trigger(m.Event("contextmenu",{data:e.data,pageX:e.pageX,pageY:e.pageY}))},mousedown:function(e){var t=m(this);c&&c.length&&!c.is(t)&&c.data("contextMenu").$menu.trigger("contextmenu:hide"),2===e.button&&(c=t.data("contextMenuActive",!0))},mouseup:function(e){var t=m(this);t.data("contextMenuActive")&&c&&c.length&&c.is(t)&&!t.hasClass("context-menu-disabled")&&(e.preventDefault(),e.stopImmediatePropagation(),(c=t).trigger(m.Event("contextmenu",{data:e.data,pageX:e.pageX,pageY:e.pageY}))),t.removeData("contextMenuActive")},mouseenter:function(e){var t=m(this),n=m(e.relatedTarget),o=m(document);n.is(".context-menu-list")||n.closest(".context-menu-list").length||c&&c.length||(s.pageX=e.pageX,s.pageY=e.pageY,s.data=e.data,o.on("mousemove.contextMenuShow",b.mousemove),s.timer=setTimeout(function(){s.timer=null,o.off("mousemove.contextMenuShow"),(c=t).trigger(m.Event("contextmenu",{data:s.data,pageX:s.pageX,pageY:s.pageY}))},e.data.delay))},mousemove:function(e){s.pageX=e.pageX,s.pageY=e.pageY},mouseleave:function(e){var t=m(e.relatedTarget);if(!t.is(".context-menu-list")&&!t.closest(".context-menu-list").length){try{clearTimeout(s.timer)}catch(e){}s.timer=null}},layerClick:function(a){var s,i,c=m(this).data("contextMenuRoot"),l=a.button,r=a.pageX,u=a.pageY,d=void 0===r;a.preventDefault(),setTimeout(function(){if(d)null!=c&&null!==c.$menu&&void 0!==c.$menu&&c.$menu.trigger("contextmenu:hide");else{var e,t="left"===c.trigger&&0===l||"right"===c.trigger&&2===l;if(document.elementFromPoint&&c.$layer){if(c.$layer.hide(),(s=document.elementFromPoint(r-p.scrollLeft(),u-p.scrollTop())).isContentEditable){var n=document.createRange(),o=window.getSelection();n.selectNode(s),n.collapse(!0),o.removeAllRanges(),o.addRange(n)}m(s).trigger(a),c.$layer.show()}if(c.hideOnSecondTrigger&&t&&null!==c.$menu&&void 0!==c.$menu)c.$menu.trigger("contextmenu:hide");else{if(c.reposition&&t)if(document.elementFromPoint){if(c.$trigger.is(s))return void c.position.call(c.$trigger,c,r,u)}else if(i=c.$trigger.offset(),e=m(window),i.top+=e.scrollTop(),i.top<=a.pageY&&(i.left+=e.scrollLeft(),i.left<=a.pageX&&(i.bottom=i.top+c.$trigger.outerHeight(),i.bottom>=a.pageY&&(i.right=i.left+c.$trigger.outerWidth(),i.right>=a.pageX))))return void c.position.call(c.$trigger,c,r,u);s&&t&&c.$trigger.one("contextmenu:hidden",function(){m(s).contextMenu({x:r,y:u,button:l})}),null!=c&&null!==c.$menu&&void 0!==c.$menu&&c.$menu.trigger("contextmenu:hide")}}},50)},keyStop:function(e,t){t.isInput||e.preventDefault(),e.stopPropagation()},key:function(e){var t={};c&&(t=c.data("contextMenu")||{}),void 0===t.zIndex&&(t.zIndex=0);var n=0,o=function(e){""!==e.style.zIndex?n=e.style.zIndex:null!==e.offsetParent&&void 0!==e.offsetParent?o(e.offsetParent):null!==e.parentElement&&void 0!==e.parentElement&&o(e.parentElement)};if(o(e.target),!(t.$menu&&parseInt(n,10)>parseInt(t.$menu.css("zIndex"),10))){switch(e.keyCode){case 9:case 38:if(b.keyStop(e,t),t.isInput){if(9===e.keyCode&&e.shiftKey)return e.preventDefault(),t.$selected&&t.$selected.find("input, textarea, select").blur(),void(null!==t.$menu&&void 0!==t.$menu&&t.$menu.trigger("prevcommand"));if(38===e.keyCode&&"checkbox"===t.$selected.find("input, textarea, select").prop("type"))return void e.preventDefault()}else if(9!==e.keyCode||e.shiftKey)return void(null!==t.$menu&&void 0!==t.$menu&&t.$menu.trigger("prevcommand"));break;case 40:if(b.keyStop(e,t),!t.isInput)return void(null!==t.$menu&&void 0!==t.$menu&&t.$menu.trigger("nextcommand"));if(9===e.keyCode)return e.preventDefault(),t.$selected&&t.$selected.find("input, textarea, select").blur(),void(null!==t.$menu&&void 0!==t.$menu&&t.$menu.trigger("nextcommand"));if(40===e.keyCode&&"checkbox"===t.$selected.find("input, textarea, select").prop("type"))return void e.preventDefault();break;case 37:if(b.keyStop(e,t),t.isInput||!t.$selected||!t.$selected.length)break;if(t.$selected.parent().hasClass("context-menu-root"))break;var a=t.$selected.parent().parent();return t.$selected.trigger("contextmenu:blur"),void(t.$selected=a);case 39:if(b.keyStop(e,t),t.isInput||!t.$selected||!t.$selected.length)break;var s=t.$selected.data("contextMenu")||{};if(s.$menu&&t.$selected.hasClass("context-menu-submenu"))return t.$selected=null,s.$selected=null,void s.$menu.trigger("nextcommand");break;case 35:case 36:return t.$selected&&t.$selected.find("input, textarea, select").length?void 0:((t.$selected&&t.$selected.parent()||t.$menu).children(":not(."+t.classNames.disabled+", ."+t.classNames.notSelectable+")")[36===e.keyCode?"first":"last"]().trigger("contextmenu:focus"),void e.preventDefault());case 13:if(b.keyStop(e,t),t.isInput){if(t.$selected&&!t.$selected.is("textarea, select"))return void e.preventDefault();break}return void(void 0!==t.$selected&&null!==t.$selected&&t.$selected.trigger("mouseup"));case 32:case 33:case 34:return void b.keyStop(e,t);case 27:return b.keyStop(e,t),void(null!==t.$menu&&void 0!==t.$menu&&t.$menu.trigger("contextmenu:hide"));default:var i=String.fromCharCode(e.keyCode).toUpperCase();if(t.accesskeys&&t.accesskeys[i])return void t.accesskeys[i].$node.trigger(t.accesskeys[i].$menu?"contextmenu:focus":"mouseup")}e.stopPropagation(),void 0!==t.$selected&&null!==t.$selected&&t.$selected.trigger(e)}},prevItem:function(e){e.stopPropagation();var t=m(this).data("contextMenu")||{},n=m(this).data("contextMenuRoot")||{};if(t.$selected){var o=t.$selected;(t=t.$selected.parent().data("contextMenu")||{}).$selected=o}for(var a=t.$menu.children(),s=t.$selected&&t.$selected.prev().length?t.$selected.prev():a.last(),i=s;s.hasClass(n.classNames.disabled)||s.hasClass(n.classNames.notSelectable)||s.is(":hidden");)if((s=s.prev().length?s.prev():a.last()).is(i))return;t.$selected&&b.itemMouseleave.call(t.$selected.get(0),e),b.itemMouseenter.call(s.get(0),e);var c=s.find("input, textarea, select");c.length&&c.focus()},nextItem:function(e){e.stopPropagation();var t=m(this).data("contextMenu")||{},n=m(this).data("contextMenuRoot")||{};if(t.$selected){var o=t.$selected;(t=t.$selected.parent().data("contextMenu")||{}).$selected=o}for(var a=t.$menu.children(),s=t.$selected&&t.$selected.next().length?t.$selected.next():a.first(),i=s;s.hasClass(n.classNames.disabled)||s.hasClass(n.classNames.notSelectable)||s.is(":hidden");)if((s=s.next().length?s.next():a.first()).is(i))return;t.$selected&&b.itemMouseleave.call(t.$selected.get(0),e),b.itemMouseenter.call(s.get(0),e);var c=s.find("input, textarea, select");c.length&&c.focus()},focusInput:function(){var e=m(this).closest(".context-menu-item"),t=e.data(),n=t.contextMenu,o=t.contextMenuRoot;o.$selected=n.$selected=e,o.isInput=n.isInput=!0},blurInput:function(){var e=m(this).closest(".context-menu-item").data(),t=e.contextMenu;e.contextMenuRoot.isInput=t.isInput=!1},menuMouseenter:function(){m(this).data().contextMenuRoot.hovering=!0},menuMouseleave:function(e){var t=m(this).data().contextMenuRoot;t.$layer&&t.$layer.is(e.relatedTarget)&&(t.hovering=!1)},itemMouseenter:function(e){var t=m(this),n=t.data(),o=n.contextMenu,a=n.contextMenuRoot;a.hovering=!0,e&&a.$layer&&a.$layer.is(e.relatedTarget)&&(e.preventDefault(),e.stopImmediatePropagation()),(o.$menu?o:a).$menu.children("."+a.classNames.hover).trigger("contextmenu:blur").children(".hover").trigger("contextmenu:blur"),t.hasClass(a.classNames.disabled)||t.hasClass(a.classNames.notSelectable)?o.$selected=null:t.trigger("contextmenu:focus")},itemMouseleave:function(e){var t=m(this),n=t.data(),o=n.contextMenu,a=n.contextMenuRoot;if(a!==o&&a.$layer&&a.$layer.is(e.relatedTarget))return void 0!==a.$selected&&null!==a.$selected&&a.$selected.trigger("contextmenu:blur"),e.preventDefault(),e.stopImmediatePropagation(),void(a.$selected=o.$selected=o.$node);o&&o.$menu&&o.$menu.hasClass("context-menu-visible")||t.trigger("contextmenu:blur")},itemClick:function(e){var t,n=m(this),o=n.data(),a=o.contextMenu,s=o.contextMenuRoot,i=o.contextMenuKey;if(!(!a.items[i]||n.is("."+s.classNames.disabled+", .context-menu-separator, ."+s.classNames.notSelectable)||n.is(".context-menu-submenu")&&!1===s.selectableSubMenu)){if(e.preventDefault(),e.stopImmediatePropagation(),m.isFunction(a.callbacks[i])&&Object.prototype.hasOwnProperty.call(a.callbacks,i))t=a.callbacks[i];else{if(!m.isFunction(s.callback))return;t=s.callback}!1!==t.call(s.$trigger,i,s,e)?s.$menu.trigger("contextmenu:hide"):s.$menu.parent().length&&$.update.call(s.$trigger,s)}},inputClick:function(e){e.stopImmediatePropagation()},hideMenu:function(e,t){var n=m(this).data("contextMenuRoot");$.hide.call(n.$trigger,n,t&&t.force)},focusItem:function(e){e.stopPropagation();var t=m(this),n=t.data(),o=n.contextMenu,a=n.contextMenuRoot;t.hasClass(a.classNames.disabled)||t.hasClass(a.classNames.notSelectable)||(t.addClass([a.classNames.hover,a.classNames.visible].join(" ")).parent().find(".context-menu-item").not(t).removeClass(a.classNames.visible).filter("."+a.classNames.hover).trigger("contextmenu:blur"),o.$selected=a.$selected=t,o&&o.$node&&o.$node.hasClass("context-menu-submenu")&&o.$node.addClass(a.classNames.hover),o.$node&&a.positionSubmenu.call(o.$node,o.$menu))},blurItem:function(e){e.stopPropagation();var t=m(this),n=t.data(),o=n.contextMenu,a=n.contextMenuRoot;o.autoHide&&t.removeClass(a.classNames.visible),t.removeClass(a.classNames.hover),o.$selected=null}},$={show:function(n,e,t){var o=m(this),a={};if(m("#context-menu-layer").trigger("mousedown"),n.$trigger=o,!1!==n.events.show.call(o,n))if(!1!==$.update.call(o,n)){if(n.position.call(o,n,e,t),n.zIndex){var s=n.zIndex;"function"==typeof n.zIndex&&(s=n.zIndex.call(o,n)),a.zIndex=function(e){for(var t=0,n=e;t=Math.max(t,parseInt(n.css("z-index"),10)||0),(n=n.parent())&&n.length&&!(-1<"html body".indexOf(n.prop("nodeName").toLowerCase())););return t}(o)+s}$.layer.call(n.$menu,n,a.zIndex),n.$menu.find("ul").css("zIndex",a.zIndex+1),n.$menu.css(a)[n.animation.show](n.animation.duration,function(){o.trigger("contextmenu:visible"),$.activated(n),n.events.activated(n)}),o.data("contextMenu",n).addClass("context-menu-active"),m(document).off("keydown.contextMenu").on("keydown.contextMenu",b.key),n.autoHide&&m(document).on("mousemove.contextMenuAutoHide",function(e){var t=o.offset();t.right=t.left+o.outerWidth(),t.bottom=t.top+o.outerHeight(),!n.$layer||n.hovering||e.pageX>=t.left&&e.pageX<=t.right&&e.pageY>=t.top&&e.pageY<=t.bottom||setTimeout(function(){n.hovering||null===n.$menu||void 0===n.$menu||n.$menu.trigger("contextmenu:hide")},50)})}else c=null;else c=null},hide:function(t,e){var n=m(this);if(t=t||(n.data("contextMenu")||{}),e||!t.events||!1!==t.events.hide.call(n,t)){if(n.removeData("contextMenu").removeClass("context-menu-active"),t.$layer){setTimeout((o=t.$layer,function(){o.remove()}),10);try{delete t.$layer}catch(e){t.$layer=null}}var o;c=null,t.$menu.find("."+t.classNames.hover).trigger("contextmenu:blur"),t.$selected=null,t.$menu.find("."+t.classNames.visible).removeClass(t.classNames.visible),m(document).off(".contextMenuAutoHide").off("keydown.contextMenu"),t.$menu&&t.$menu[t.animation.hide](t.animation.duration,function(){t.build&&(t.$menu.remove(),m.each(t,function(e){switch(e){case"ns":case"selector":case"build":case"trigger":return!0;default:t[e]=void 0;try{delete t[e]}catch(e){}return!0}})),setTimeout(function(){n.trigger("contextmenu:hidden")},10)})}},create:function(r,u){function d(e){var t=m("");if(e._accesskey)e._beforeAccesskey&&t.append(document.createTextNode(e._beforeAccesskey)),m("").addClass("context-menu-accesskey").text(e._accesskey).appendTo(t),e._afterAccesskey&&t.append(document.createTextNode(e._afterAccesskey));else if(e.isHtmlName){if(void 0!==e.accesskey)throw new Error("accesskeys are not compatible with HTML names and cannot be used together in the same item");t.html(e.name)}else t.text(e.name);return t}void 0===u&&(u=r),r.$menu=m('
      ').addClass(r.className||"").data({contextMenu:r,contextMenuRoot:u}),r.dataAttr&&m.each(r.dataAttr,function(e,t){r.$menu.attr("data-"+r.key,t)}),m.each(["callbacks","commands","inputs"],function(e,t){r[t]={},u[t]||(u[t]={})}),u.accesskeys||(u.accesskeys={}),m.each(r.items,function(n,o){var e=m('
    • ').addClass(o.className||""),t=null,a=null;if(e.on("click",m.noop),"string"!=typeof o&&"cm_separator"!==o.type||(o={type:"cm_seperator"}),o.$node=e.data({contextMenu:r,contextMenuRoot:u,contextMenuKey:n}),void 0!==o.accesskey)for(var s,i=function(e){for(var t,n=e.split(/\s+/),o=[],a=0;t=n[a];a++)t=t.charAt(0).toUpperCase(),o.push(t);return o}(o.accesskey),c=0;s=i[c];c++)if(!u.accesskeys[s]){var l=(u.accesskeys[s]=o).name.match(new RegExp("^(.*?)("+s+")(.*)$","i"));l&&(o._beforeAccesskey=l[1],o._accesskey=l[2],o._afterAccesskey=l[3]);break}if(o.type&&v[o.type])v[o.type].call(e,o,r,u),m.each([r,u],function(e,t){t.commands[n]=o,!m.isFunction(o.callback)||void 0!==t.callbacks[n]&&void 0!==r.type||(t.callbacks[n]=o.callback)});else{switch("cm_seperator"===o.type?e.addClass("context-menu-separator "+u.classNames.notSelectable):"html"===o.type?e.addClass("context-menu-html "+u.classNames.notSelectable):"sub"!==o.type&&o.type?(t=m("").appendTo(e),d(o).appendTo(t),e.addClass("context-menu-input"),r.hasTypes=!0,m.each([r,u],function(e,t){t.commands[n]=o,t.inputs[n]=o})):o.items&&(o.type="sub"),o.type){case"cm_seperator":break;case"text":a=m('').attr("name","context-menu-input-"+n).val(o.value||"").appendTo(t);break;case"textarea":a=m('').attr("name","context-menu-input-"+n).val(o.value||"").appendTo(t),o.height&&a.height(o.height);break;case"checkbox":a=m('').attr("name","context-menu-input-"+n).val(o.value||"").prop("checked",!!o.selected).prependTo(t);break;case"radio":a=m('').attr("name","context-menu-input-"+o.radio).val(o.value||"").prop("checked",!!o.selected).prependTo(t);break;case"select":a=m('').attr("name","context-menu-input-"+n).appendTo(t),o.options&&(m.each(o.options,function(e,t){m("").val(e).text(t).appendTo(a)}),a.val(o.selected));break;case"sub":d(o).appendTo(e),o.appendTo=o.$node,e.data("contextMenu",o).addClass("context-menu-submenu"),o.callback=null,"function"==typeof o.items.then?$.processPromises(o,u,o.items):$.create(o,u);break;case"html":m(o.html).appendTo(e);break;default:m.each([r,u],function(e,t){t.commands[n]=o,!m.isFunction(o.callback)||void 0!==t.callbacks[n]&&void 0!==r.type||(t.callbacks[n]=o.callback)}),d(o).appendTo(e)}o.type&&"sub"!==o.type&&"html"!==o.type&&"cm_seperator"!==o.type&&(a.on("focus",b.focusInput).on("blur",b.blurInput),o.events&&a.on(o.events,r)),o.icon&&(m.isFunction(o.icon)?o._icon=o.icon.call(this,this,e,n,o):"string"!=typeof o.icon||"fab "!==o.icon.substring(0,4)&&"fas "!==o.icon.substring(0,4)&&"fad "!==o.icon.substring(0,4)&&"far "!==o.icon.substring(0,4)&&"fal "!==o.icon.substring(0,4)?"string"==typeof o.icon&&"fa-"===o.icon.substring(0,3)?o._icon=u.classNames.icon+" "+u.classNames.icon+"--fa fa "+o.icon:o._icon=u.classNames.icon+" "+u.classNames.icon+"-"+o.icon:(e.addClass(u.classNames.icon+" "+u.classNames.icon+"--fa5"),o._icon=m('')),"string"==typeof o._icon?e.addClass(o._icon):e.prepend(o._icon))}o.$input=a,o.$label=t,e.appendTo(r.$menu),!r.hasTypes&&m.support.eventSelectstart&&e.on("selectstart.disableTextSelect",b.abortevent)}),r.$node||r.$menu.css("display","none").addClass("context-menu-root"),r.$menu.appendTo(r.appendTo||document.body)},resize:function(e,t){var n;e.css({position:"absolute",display:"block"}),e.data("width",(n=e.get(0)).getBoundingClientRect?Math.ceil(n.getBoundingClientRect().width):e.outerWidth()+1),e.css({position:"static",minWidth:"0px",maxWidth:"100000px"}),e.find("> li > ul").each(function(){$.resize(m(this),!0)}),t||e.find("ul").addBack().css({position:"",display:"",minWidth:"",maxWidth:""}).outerWidth(function(){return m(this).data("width")})},update:function(i,c){var l=this;void 0===c&&(c=i,$.resize(i.$menu));var r=!1;return i.$menu.children().each(function(){var e,t=m(this),n=t.data("contextMenuKey"),o=i.items[n],a=m.isFunction(o.disabled)&&o.disabled.call(l,n,c)||!0===o.disabled;if((e=m.isFunction(o.visible)?o.visible.call(l,n,c):void 0===o.visible||!0===o.visible)&&(r=!0),t[e?"show":"hide"](),t[a?"addClass":"removeClass"](c.classNames.disabled),m.isFunction(o.icon)){t.removeClass(o._icon);var s=o.icon.call(this,l,t,n,o);"string"==typeof s?t.addClass(s):t.prepend(s)}if(o.type)switch(t.find("input, select, textarea").prop("disabled",a),o.type){case"text":case"textarea":o.$input.val(o.value||"");break;case"checkbox":case"radio":o.$input.val(o.value||"").prop("checked",!!o.selected);break;case"select":o.$input.val((0===o.selected?"0":o.selected)||"")}o.$menu&&$.update.call(l,o,c)&&(r=!0)}),r},layer:function(e,t){var n=e.$layer=m('
      ').css({height:p.height(),width:p.width(),display:"block",position:"fixed","z-index":t,top:0,left:0,opacity:0,filter:"alpha(opacity=0)","background-color":"#000"}).data("contextMenuRoot",e).insertBefore(this).on("contextmenu",b.abortevent).on("mousedown",b.layerClick);return void 0===document.body.style.maxWidth&&n.css({position:"absolute",height:m(document).height()}),n},processPromises:function(e,t,n){function o(e,t,n){void 0===n?(n={error:{name:"No items and no error item",icon:"context-menu-icon context-menu-icon-quit"}},window.console&&(console.error||console.log).call(console,'When you reject a promise, provide an "items" object, equal to normal sub-menu items')):"string"==typeof n&&(n={error:{name:n}}),a(e,t,n)}function a(e,t,n){void 0!==t.$menu&&t.$menu.is(":visible")&&(e.$node.removeClass(t.classNames.iconLoadingClass),e.items=n,$.create(e,t,!0),$.update(e,t),t.positionSubmenu.call(e.$node,e.$menu))}e.$node.addClass(t.classNames.iconLoadingClass),n.then(function(e,t,n){void 0===n&&o(void 0),a(e,t,n)}.bind(this,e,t),o.bind(this,e,t))},activated:function(e){var t=e.$menu,n=t.offset(),o=m(window).height(),a=m(window).scrollTop(),s=t.height();oa+o)&&t.css({top:a+"px"})}};function l(e){return e.id&&m('label[for="'+e.id+'"]').val()||e.name}m.fn.contextMenu=function(e){var t=this,n=e;if(0s&&(o.top-=c),o.top<0&&(o.top=0),o.left+l>i&&(o.left-=l),o.left<0&&(o.left=0),e.$menu.css(o)}else e.determinePosition.call(this,e.$menu)},positionSubmenu:function(e){if(void 0!==e)if(m.ui&&m.ui.position)e.css("display","block").position({my:"left top-5",at:"right top",of:this,collision:"flipfit fit"}).css("display","");else{var t={top:-9,left:this.outerWidth()-5};e.css(t)}},zIndex:1,animation:{duration:50,show:"slideDown",hide:"slideUp"},events:{preShow:m.noop,show:m.noop,hide:m.noop,activated:m.noop},callback:null,items:{}},s={timer:null,pageX:null,pageY:null},b={abortevent:function(e){e.preventDefault(),e.stopImmediatePropagation()},contextmenu:function(e){var t=m(this);if(!1!==e.data.events.preShow(t,e)&&("right"===e.data.trigger&&(e.preventDefault(),e.stopImmediatePropagation()),!("right"!==e.data.trigger&&"demand"!==e.data.trigger&&e.originalEvent||!(void 0===e.mouseButton||!e.data||"left"===e.data.trigger&&0===e.mouseButton||"right"===e.data.trigger&&2===e.mouseButton)||t.hasClass("context-menu-active")||t.hasClass("context-menu-disabled")))){if(c=t,e.data.build){var n=e.data.build(c,e);if(!1===n)return;if(e.data=m.extend(!0,{},g,e.data,n||{}),!e.data.items||m.isEmptyObject(e.data.items))throw window.console&&(console.error||console.log).call(console,"No items specified to show in contextMenu"),new Error("No Items specified");e.data.$trigger=c,$.create(e.data)}$.show.call(t,e.data,e.pageX,e.pageY)}},click:function(e){e.preventDefault(),e.stopImmediatePropagation(),m(this).trigger(m.Event("contextmenu",{data:e.data,pageX:e.pageX,pageY:e.pageY}))},mousedown:function(e){var t=m(this);c&&c.length&&!c.is(t)&&c.data("contextMenu").$menu.trigger("contextmenu:hide"),2===e.button&&(c=t.data("contextMenuActive",!0))},mouseup:function(e){var t=m(this);t.data("contextMenuActive")&&c&&c.length&&c.is(t)&&!t.hasClass("context-menu-disabled")&&(e.preventDefault(),e.stopImmediatePropagation(),(c=t).trigger(m.Event("contextmenu",{data:e.data,pageX:e.pageX,pageY:e.pageY}))),t.removeData("contextMenuActive")},mouseenter:function(e){var t=m(this),n=m(e.relatedTarget),o=m(document);n.is(".context-menu-list")||n.closest(".context-menu-list").length||c&&c.length||(s.pageX=e.pageX,s.pageY=e.pageY,s.data=e.data,o.on("mousemove.contextMenuShow",b.mousemove),s.timer=setTimeout(function(){s.timer=null,o.off("mousemove.contextMenuShow"),(c=t).trigger(m.Event("contextmenu",{data:s.data,pageX:s.pageX,pageY:s.pageY}))},e.data.delay))},mousemove:function(e){s.pageX=e.pageX,s.pageY=e.pageY},mouseleave:function(e){var t=m(e.relatedTarget);if(!t.is(".context-menu-list")&&!t.closest(".context-menu-list").length){try{clearTimeout(s.timer)}catch(e){}s.timer=null}},layerClick:function(a){var s,i,c=m(this).data("contextMenuRoot"),l=a.button,r=a.pageX,u=a.pageY,d=void 0===r;a.preventDefault(),setTimeout(function(){if(d)null!=c&&null!==c.$menu&&void 0!==c.$menu&&c.$menu.trigger("contextmenu:hide");else{var e,t="left"===c.trigger&&0===l||"right"===c.trigger&&2===l;if(document.elementFromPoint&&c.$layer){if(c.$layer.hide(),null!==(s=document.elementFromPoint(r-p.scrollLeft(),u-p.scrollTop()))&&s.isContentEditable){var n=document.createRange(),o=window.getSelection();n.selectNode(s),n.collapse(!0),o.removeAllRanges(),o.addRange(n)}m(s).trigger(a),c.$layer.show()}if(c.hideOnSecondTrigger&&t&&null!==c.$menu&&void 0!==c.$menu)c.$menu.trigger("contextmenu:hide");else{if(c.reposition&&t)if(document.elementFromPoint){if(c.$trigger.is(s))return void c.position.call(c.$trigger,c,r,u)}else if(i=c.$trigger.offset(),e=m(window),i.top+=e.scrollTop(),i.top<=a.pageY&&(i.left+=e.scrollLeft(),i.left<=a.pageX&&(i.bottom=i.top+c.$trigger.outerHeight(),i.bottom>=a.pageY&&(i.right=i.left+c.$trigger.outerWidth(),i.right>=a.pageX))))return void c.position.call(c.$trigger,c,r,u);s&&t&&c.$trigger.one("contextmenu:hidden",function(){m(s).contextMenu({x:r,y:u,button:l})}),null!=c&&null!==c.$menu&&void 0!==c.$menu&&c.$menu.trigger("contextmenu:hide")}}},50)},keyStop:function(e,t){t.isInput||e.preventDefault(),e.stopPropagation()},key:function(e){var t={};c&&(t=c.data("contextMenu")||{}),void 0===t.zIndex&&(t.zIndex=0);var n=0,o=function(e){""!==e.style.zIndex?n=e.style.zIndex:null!==e.offsetParent&&void 0!==e.offsetParent?o(e.offsetParent):null!==e.parentElement&&void 0!==e.parentElement&&o(e.parentElement)};if(o(e.target),!(t.$menu&&parseInt(n,10)>parseInt(t.$menu.css("zIndex"),10))){switch(e.keyCode){case 9:case 38:if(b.keyStop(e,t),t.isInput){if(9===e.keyCode&&e.shiftKey)return e.preventDefault(),t.$selected&&t.$selected.find("input, textarea, select").blur(),void(null!==t.$menu&&void 0!==t.$menu&&t.$menu.trigger("prevcommand"));if(38===e.keyCode&&"checkbox"===t.$selected.find("input, textarea, select").prop("type"))return void e.preventDefault()}else if(9!==e.keyCode||e.shiftKey)return void(null!==t.$menu&&void 0!==t.$menu&&t.$menu.trigger("prevcommand"));break;case 40:if(b.keyStop(e,t),!t.isInput)return void(null!==t.$menu&&void 0!==t.$menu&&t.$menu.trigger("nextcommand"));if(9===e.keyCode)return e.preventDefault(),t.$selected&&t.$selected.find("input, textarea, select").blur(),void(null!==t.$menu&&void 0!==t.$menu&&t.$menu.trigger("nextcommand"));if(40===e.keyCode&&"checkbox"===t.$selected.find("input, textarea, select").prop("type"))return void e.preventDefault();break;case 37:if(b.keyStop(e,t),t.isInput||!t.$selected||!t.$selected.length)break;if(t.$selected.parent().hasClass("context-menu-root"))break;var a=t.$selected.parent().parent();return t.$selected.trigger("contextmenu:blur"),void(t.$selected=a);case 39:if(b.keyStop(e,t),t.isInput||!t.$selected||!t.$selected.length)break;var s=t.$selected.data("contextMenu")||{};if(s.$menu&&t.$selected.hasClass("context-menu-submenu"))return t.$selected=null,s.$selected=null,void s.$menu.trigger("nextcommand");break;case 35:case 36:return t.$selected&&t.$selected.find("input, textarea, select").length?void 0:((t.$selected&&t.$selected.parent()||t.$menu).children(":not(."+t.classNames.disabled+", ."+t.classNames.notSelectable+")")[36===e.keyCode?"first":"last"]().trigger("contextmenu:focus"),void e.preventDefault());case 13:if(b.keyStop(e,t),t.isInput){if(t.$selected&&!t.$selected.is("textarea, select"))return void e.preventDefault();break}return void(void 0!==t.$selected&&null!==t.$selected&&t.$selected.trigger("mouseup"));case 32:case 33:case 34:return void b.keyStop(e,t);case 27:return b.keyStop(e,t),void(null!==t.$menu&&void 0!==t.$menu&&t.$menu.trigger("contextmenu:hide"));default:var i=String.fromCharCode(e.keyCode).toUpperCase();if(t.accesskeys&&t.accesskeys[i])return void t.accesskeys[i].$node.trigger(t.accesskeys[i].$menu?"contextmenu:focus":"mouseup")}e.stopPropagation(),void 0!==t.$selected&&null!==t.$selected&&t.$selected.trigger(e)}},prevItem:function(e){e.stopPropagation();var t=m(this).data("contextMenu")||{},n=m(this).data("contextMenuRoot")||{};if(t.$selected){var o=t.$selected;(t=t.$selected.parent().data("contextMenu")||{}).$selected=o}for(var a=t.$menu.children(),s=t.$selected&&t.$selected.prev().length?t.$selected.prev():a.last(),i=s;s.hasClass(n.classNames.disabled)||s.hasClass(n.classNames.notSelectable)||s.is(":hidden");)if((s=s.prev().length?s.prev():a.last()).is(i))return;t.$selected&&b.itemMouseleave.call(t.$selected.get(0),e),b.itemMouseenter.call(s.get(0),e);var c=s.find("input, textarea, select");c.length&&c.focus()},nextItem:function(e){e.stopPropagation();var t=m(this).data("contextMenu")||{},n=m(this).data("contextMenuRoot")||{};if(t.$selected){var o=t.$selected;(t=t.$selected.parent().data("contextMenu")||{}).$selected=o}for(var a=t.$menu.children(),s=t.$selected&&t.$selected.next().length?t.$selected.next():a.first(),i=s;s.hasClass(n.classNames.disabled)||s.hasClass(n.classNames.notSelectable)||s.is(":hidden");)if((s=s.next().length?s.next():a.first()).is(i))return;t.$selected&&b.itemMouseleave.call(t.$selected.get(0),e),b.itemMouseenter.call(s.get(0),e);var c=s.find("input, textarea, select");c.length&&c.focus()},focusInput:function(){var e=m(this).closest(".context-menu-item"),t=e.data(),n=t.contextMenu,o=t.contextMenuRoot;o.$selected=n.$selected=e,o.isInput=n.isInput=!0},blurInput:function(){var e=m(this).closest(".context-menu-item").data(),t=e.contextMenu;e.contextMenuRoot.isInput=t.isInput=!1},menuMouseenter:function(){m(this).data().contextMenuRoot.hovering=!0},menuMouseleave:function(e){var t=m(this).data().contextMenuRoot;t.$layer&&t.$layer.is(e.relatedTarget)&&(t.hovering=!1)},itemMouseenter:function(e){var t=m(this),n=t.data(),o=n.contextMenu,a=n.contextMenuRoot;a.hovering=!0,e&&a.$layer&&a.$layer.is(e.relatedTarget)&&(e.preventDefault(),e.stopImmediatePropagation()),(o.$menu?o:a).$menu.children("."+a.classNames.hover).trigger("contextmenu:blur").children(".hover").trigger("contextmenu:blur"),t.hasClass(a.classNames.disabled)||t.hasClass(a.classNames.notSelectable)?o.$selected=null:t.trigger("contextmenu:focus")},itemMouseleave:function(e){var t=m(this),n=t.data(),o=n.contextMenu,a=n.contextMenuRoot;if(a!==o&&a.$layer&&a.$layer.is(e.relatedTarget))return void 0!==a.$selected&&null!==a.$selected&&a.$selected.trigger("contextmenu:blur"),e.preventDefault(),e.stopImmediatePropagation(),void(a.$selected=o.$selected=o.$node);o&&o.$menu&&o.$menu.hasClass("context-menu-visible")||t.trigger("contextmenu:blur")},itemClick:function(e){var t,n=m(this),o=n.data(),a=o.contextMenu,s=o.contextMenuRoot,i=o.contextMenuKey;if(!(!a.items[i]||n.is("."+s.classNames.disabled+", .context-menu-separator, ."+s.classNames.notSelectable)||n.is(".context-menu-submenu")&&!1===s.selectableSubMenu)){if(e.preventDefault(),e.stopImmediatePropagation(),m.isFunction(a.callbacks[i])&&Object.prototype.hasOwnProperty.call(a.callbacks,i))t=a.callbacks[i];else{if(!m.isFunction(s.callback))return;t=s.callback}!1!==t.call(s.$trigger,i,s,e)?s.$menu.trigger("contextmenu:hide"):s.$menu.parent().length&&$.update.call(s.$trigger,s)}},inputClick:function(e){e.stopImmediatePropagation()},hideMenu:function(e,t){var n=m(this).data("contextMenuRoot");$.hide.call(n.$trigger,n,t&&t.force)},focusItem:function(e){e.stopPropagation();var t=m(this),n=t.data(),o=n.contextMenu,a=n.contextMenuRoot;t.hasClass(a.classNames.disabled)||t.hasClass(a.classNames.notSelectable)||(t.addClass([a.classNames.hover,a.classNames.visible].join(" ")).parent().find(".context-menu-item").not(t).removeClass(a.classNames.visible).filter("."+a.classNames.hover).trigger("contextmenu:blur"),o.$selected=a.$selected=t,o&&o.$node&&o.$node.hasClass("context-menu-submenu")&&o.$node.addClass(a.classNames.hover),o.$node&&a.positionSubmenu.call(o.$node,o.$menu))},blurItem:function(e){e.stopPropagation();var t=m(this),n=t.data(),o=n.contextMenu,a=n.contextMenuRoot;o.autoHide&&t.removeClass(a.classNames.visible),t.removeClass(a.classNames.hover),o.$selected=null}},$={show:function(n,e,t){var o=m(this),a={};if(m("#context-menu-layer").trigger("mousedown"),n.$trigger=o,!1!==n.events.show.call(o,n))if(!1!==$.update.call(o,n)){if(n.position.call(o,n,e,t),n.zIndex){var s=n.zIndex;"function"==typeof n.zIndex&&(s=n.zIndex.call(o,n)),a.zIndex=function(e){for(var t=0,n=e;t=Math.max(t,parseInt(n.css("z-index"),10)||0),(n=n.parent())&&n.length&&!(-1<"html body".indexOf(n.prop("nodeName").toLowerCase())););return t}(o)+s}$.layer.call(n.$menu,n,a.zIndex),n.$menu.find("ul").css("zIndex",a.zIndex+1),n.$menu.css(a)[n.animation.show](n.animation.duration,function(){o.trigger("contextmenu:visible"),$.activated(n),n.events.activated(n)}),o.data("contextMenu",n).addClass("context-menu-active"),m(document).off("keydown.contextMenu").on("keydown.contextMenu",b.key),n.autoHide&&m(document).on("mousemove.contextMenuAutoHide",function(e){var t=o.offset();t.right=t.left+o.outerWidth(),t.bottom=t.top+o.outerHeight(),!n.$layer||n.hovering||e.pageX>=t.left&&e.pageX<=t.right&&e.pageY>=t.top&&e.pageY<=t.bottom||setTimeout(function(){n.hovering||null===n.$menu||void 0===n.$menu||n.$menu.trigger("contextmenu:hide")},50)})}else c=null;else c=null},hide:function(t,e){var n=m(this);if(t=t||(n.data("contextMenu")||{}),e||!t.events||!1!==t.events.hide.call(n,t)){if(n.removeData("contextMenu").removeClass("context-menu-active"),t.$layer){setTimeout((o=t.$layer,function(){o.remove()}),10);try{delete t.$layer}catch(e){t.$layer=null}}var o;c=null,t.$menu.find("."+t.classNames.hover).trigger("contextmenu:blur"),t.$selected=null,t.$menu.find("."+t.classNames.visible).removeClass(t.classNames.visible),m(document).off(".contextMenuAutoHide").off("keydown.contextMenu"),t.$menu&&t.$menu[t.animation.hide](t.animation.duration,function(){t.build&&(t.$menu.remove(),m.each(t,function(e){switch(e){case"ns":case"selector":case"build":case"trigger":return!0;default:t[e]=void 0;try{delete t[e]}catch(e){}return!0}})),setTimeout(function(){n.trigger("contextmenu:hidden")},10)})}},create:function(r,u){function d(e){var t=m("");if(e._accesskey)e._beforeAccesskey&&t.append(document.createTextNode(e._beforeAccesskey)),m("").addClass("context-menu-accesskey").text(e._accesskey).appendTo(t),e._afterAccesskey&&t.append(document.createTextNode(e._afterAccesskey));else if(e.isHtmlName){if(void 0!==e.accesskey)throw new Error("accesskeys are not compatible with HTML names and cannot be used together in the same item");t.html(e.name)}else t.text(e.name);return t}void 0===u&&(u=r),r.$menu=m('
        ').addClass(r.className||"").data({contextMenu:r,contextMenuRoot:u}),r.dataAttr&&m.each(r.dataAttr,function(e,t){r.$menu.attr("data-"+r.key,t)}),m.each(["callbacks","commands","inputs"],function(e,t){r[t]={},u[t]||(u[t]={})}),u.accesskeys||(u.accesskeys={}),m.each(r.items,function(n,o){var e=m('
      • ').addClass(o.className||""),t=null,a=null;if(e.on("click",m.noop),"string"!=typeof o&&"cm_separator"!==o.type||(o={type:"cm_seperator"}),o.$node=e.data({contextMenu:r,contextMenuRoot:u,contextMenuKey:n}),void 0!==o.accesskey)for(var s,i=function(e){for(var t,n=e.split(/\s+/),o=[],a=0;t=n[a];a++)t=t.charAt(0).toUpperCase(),o.push(t);return o}(o.accesskey),c=0;s=i[c];c++)if(!u.accesskeys[s]){var l=(u.accesskeys[s]=o).name.match(new RegExp("^(.*?)("+s+")(.*)$","i"));l&&(o._beforeAccesskey=l[1],o._accesskey=l[2],o._afterAccesskey=l[3]);break}if(o.type&&v[o.type])v[o.type].call(e,o,r,u),m.each([r,u],function(e,t){t.commands[n]=o,!m.isFunction(o.callback)||void 0!==t.callbacks[n]&&void 0!==r.type||(t.callbacks[n]=o.callback)});else{switch("cm_seperator"===o.type?e.addClass("context-menu-separator "+u.classNames.notSelectable):"html"===o.type?e.addClass("context-menu-html "+u.classNames.notSelectable):"sub"!==o.type&&o.type?(t=m("").appendTo(e),d(o).appendTo(t),e.addClass("context-menu-input"),r.hasTypes=!0,m.each([r,u],function(e,t){t.commands[n]=o,t.inputs[n]=o})):o.items&&(o.type="sub"),o.type){case"cm_seperator":break;case"text":a=m('').attr("name","context-menu-input-"+n).val(o.value||"").appendTo(t);break;case"textarea":a=m('').attr("name","context-menu-input-"+n).val(o.value||"").appendTo(t),o.height&&a.height(o.height);break;case"checkbox":a=m('').attr("name","context-menu-input-"+n).val(o.value||"").prop("checked",!!o.selected).prependTo(t);break;case"radio":a=m('').attr("name","context-menu-input-"+o.radio).val(o.value||"").prop("checked",!!o.selected).prependTo(t);break;case"select":a=m('').attr("name","context-menu-input-"+n).appendTo(t),o.options&&(m.each(o.options,function(e,t){m("").val(e).text(t).appendTo(a)}),a.val(o.selected));break;case"sub":d(o).appendTo(e),o.appendTo=o.$node,e.data("contextMenu",o).addClass("context-menu-submenu"),o.callback=null,"function"==typeof o.items.then?$.processPromises(o,u,o.items):$.create(o,u);break;case"html":m(o.html).appendTo(e);break;default:m.each([r,u],function(e,t){t.commands[n]=o,!m.isFunction(o.callback)||void 0!==t.callbacks[n]&&void 0!==r.type||(t.callbacks[n]=o.callback)}),d(o).appendTo(e)}o.type&&"sub"!==o.type&&"html"!==o.type&&"cm_seperator"!==o.type&&(a.on("focus",b.focusInput).on("blur",b.blurInput),o.events&&a.on(o.events,r)),o.icon&&(m.isFunction(o.icon)?o._icon=o.icon.call(this,this,e,n,o):"string"!=typeof o.icon||"fab "!==o.icon.substring(0,4)&&"fas "!==o.icon.substring(0,4)&&"fad "!==o.icon.substring(0,4)&&"far "!==o.icon.substring(0,4)&&"fal "!==o.icon.substring(0,4)?"string"==typeof o.icon&&"fa-"===o.icon.substring(0,3)?o._icon=u.classNames.icon+" "+u.classNames.icon+"--fa fa "+o.icon:o._icon=u.classNames.icon+" "+u.classNames.icon+"-"+o.icon:(e.addClass(u.classNames.icon+" "+u.classNames.icon+"--fa5"),o._icon=m('')),"string"==typeof o._icon?e.addClass(o._icon):e.prepend(o._icon))}o.$input=a,o.$label=t,e.appendTo(r.$menu),!r.hasTypes&&m.support.eventSelectstart&&e.on("selectstart.disableTextSelect",b.abortevent)}),r.$node||r.$menu.css("display","none").addClass("context-menu-root"),r.$menu.appendTo(r.appendTo||document.body)},resize:function(e,t){var n;e.css({position:"absolute",display:"block"}),e.data("width",(n=e.get(0)).getBoundingClientRect?Math.ceil(n.getBoundingClientRect().width):e.outerWidth()+1),e.css({position:"static",minWidth:"0px",maxWidth:"100000px"}),e.find("> li > ul").each(function(){$.resize(m(this),!0)}),t||e.find("ul").addBack().css({position:"",display:"",minWidth:"",maxWidth:""}).outerWidth(function(){return m(this).data("width")})},update:function(i,c){var l=this;void 0===c&&(c=i,$.resize(i.$menu));var r=!1;return i.$menu.children().each(function(){var e,t=m(this),n=t.data("contextMenuKey"),o=i.items[n],a=m.isFunction(o.disabled)&&o.disabled.call(l,n,c)||!0===o.disabled;if((e=m.isFunction(o.visible)?o.visible.call(l,n,c):void 0===o.visible||!0===o.visible)&&(r=!0),t[e?"show":"hide"](),t[a?"addClass":"removeClass"](c.classNames.disabled),m.isFunction(o.icon)){t.removeClass(o._icon);var s=o.icon.call(this,l,t,n,o);"string"==typeof s?t.addClass(s):t.prepend(s)}if(o.type)switch(t.find("input, select, textarea").prop("disabled",a),o.type){case"text":case"textarea":o.$input.val(o.value||"");break;case"checkbox":case"radio":o.$input.val(o.value||"").prop("checked",!!o.selected);break;case"select":o.$input.val((0===o.selected?"0":o.selected)||"")}o.$menu&&$.update.call(l,o,c)&&(r=!0)}),r},layer:function(e,t){var n=e.$layer=m('
        ').css({height:p.height(),width:p.width(),display:"block",position:"fixed","z-index":t-1,top:0,left:0,opacity:0,filter:"alpha(opacity=0)","background-color":"#000"}).data("contextMenuRoot",e).appendTo(document.body).on("contextmenu",b.abortevent).on("mousedown",b.layerClick);return void 0===document.body.style.maxWidth&&n.css({position:"absolute",height:m(document).height()}),n},processPromises:function(e,t,n){function o(e,t,n){void 0===n?(n={error:{name:"No items and no error item",icon:"context-menu-icon context-menu-icon-quit"}},window.console&&(console.error||console.log).call(console,'When you reject a promise, provide an "items" object, equal to normal sub-menu items')):"string"==typeof n&&(n={error:{name:n}}),a(e,t,n)}function a(e,t,n){void 0!==t.$menu&&t.$menu.is(":visible")&&(e.$node.removeClass(t.classNames.iconLoadingClass),e.items=n,$.create(e,t,!0),$.update(e,t),t.positionSubmenu.call(e.$node,e.$menu))}e.$node.addClass(t.classNames.iconLoadingClass),n.then(function(e,t,n){void 0===n&&o(void 0),a(e,t,n)}.bind(this,e,t),o.bind(this,e,t))},activated:function(e){var t=e.$menu,n=t.offset(),o=m(window).height(),a=m(window).scrollTop(),s=t.height();oa+o)&&t.css({top:a+"px"})}};function l(e){return e.id&&m('label[for="'+e.id+'"]').val()||e.name}m.fn.contextMenu=function(e){var t=this,n=e;if(0 Date: Mon, 17 Aug 2020 00:21:01 -0700 Subject: [PATCH 27/27] Dark theme polish; bump version --- css/modern.css | 69 ++++++++++++++++++++++++++++++++++++++++++ js/all.js | 2 +- js/preload.js | 2 +- js/version-specific.js | 10 ++++++ manifest.json | 2 +- 5 files changed, 82 insertions(+), 3 deletions(-) diff --git a/css/modern.css b/css/modern.css index 817b1851..6e7e9172 100644 --- a/css/modern.css +++ b/css/modern.css @@ -280,6 +280,35 @@ header div.Je0RK button._1SIMq { border: var(--border-size) solid var(--contrast-border) !important; } +/* Navbar menus */ +div.les2- { + background-color: var(--secondary) !important; +} + +div.les2- ._3skcp { + border-color: var(--contrast-border) !important; +} + +div.les2- ._1wP6w { + color: var(--text) !important; +} + +div.les2- ._2wOCj { + color: var(--muted-text) !important; +} + +.util-hover-background-color-cloud-grey-wHghL:hover { + background-color: var(--active) !important; +} + +._33zXx { + background-color: var(--text) !important; +} + +div.les2- h3 { + color: var(--text) !important; +} + /* Modal Red Color */ .close-button, .restore-defaults { @@ -787,6 +816,11 @@ body .action-links a:hover { color: var(--text) !important; } +span#updates-count { + color: var(--text) !important; + background-color: var(--active) !important; +} + /* User Page */ .info-tab th, .info-tab td, @@ -800,6 +834,16 @@ body .action-links a:hover { color: var(--text) !important; } +.private-profile { + background-color: var(--secondary) !important; + color: var(--text) !important; + border-color: var(--contrast-border) !important; +} + +.private-profile h3 { + border-color: var(--contrast-border) !important; +} + /* School / Group Page */ #school-events { padding: var(--padding) !important; @@ -930,6 +974,31 @@ div.cellphone-container { background-color: var(--accent) !important; } +.ui-selectmenu { + border: none !important; + border-radius: var(--border-radius) !important; + background: none !important; +} + +.ui-selectmenu-menu { + background: var(--secondary) !important; + border: var(--border-size) solid var(--contrast-border) !important; + border-radius: var(--border-radius) !important; +} + +.ui-selectmenu-menu li a { + color: var(--text) !important; +} + +.ui-selectmenu-menu li:hover a, .ui-selectmenu-menu .ui-selectmenu-item-focus a { + background-color: var(--active) !important; +} + +.ui-selectmenu-menu .ui-selectmenu-item-selected a:after { + background-position: 0 calc(-242px - 20px * var(--theme-is-dark)) !important; +} + + /* Error Page */ #error-page { background-color: var(--secondary) !important; diff --git a/js/all.js b/js/all.js index 4423b3c6..7f166c64 100644 --- a/js/all.js +++ b/js/all.js @@ -927,7 +927,7 @@ async function createQuickAccess() { let linkWrap; let wrapper = createElement("div", ["quick-access-wrapper"], {}, [ - createElement("h3", ["h3-med"], {}, [ + createElement("h3", ["h3-med"], { title: "Added by Schoology Plus" }, [ 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" }), diff --git a/js/preload.js b/js/preload.js index 8f0c43ef..43522893 100644 --- a/js/preload.js +++ b/js/preload.js @@ -41,7 +41,7 @@ document.documentElement.setAttribute("page", location.pathname); updateSettings(); var beta_tests = { - "darktheme": "https://schoologypl.us", + "darktheme": "https://schoologypl.us/docs/beta/darktheme", "newgrades": "https://schoologypl.us" }; diff --git a/js/version-specific.js b/js/version-specific.js index d866b989..8d6d57a3 100644 --- a/js/version-specific.js +++ b/js/version-specific.js @@ -196,6 +196,16 @@ let migrationsTo = { } }, 10); } + }, + "6.4": function (currentVersion, previousVersion) { + saveBroadcasts([ + createBroadcast( + 640, + "Schoology Plus Dark Theme Beta", + "Schoology Plus is beta testing a new dark theme option! Join our Discord if you want to participate! Click here to join!", + new Date(2020, 7 /* August */, 16) + ) + ]); } }; diff --git a/manifest.json b/manifest.json index 521f9591..18b7eea6 100644 --- a/manifest.json +++ b/manifest.json @@ -8,7 +8,7 @@ "id": "schoology.plus@aopell.me" } }, - "version": "6.3.1", + "version": "6.4", "icons": { "128": "imgs/icon@128.png", "64": "imgs/icon@64.png",