mirror of
https://github.com/GuySandler/CanvasRefined.git
synced 2026-08-05 02:37:10 +02:00
some bug fixes and attempted widget
This commit is contained in:
Guy Sandler
parent
b366ec6e23
commit
fb5651eda9
@ -65,6 +65,12 @@
|
||||
"24hrformat": {
|
||||
"message": "Use 24 hr Format"
|
||||
},
|
||||
"widgets": {
|
||||
"message": "Widgets"
|
||||
},
|
||||
"widget_clock": {
|
||||
"message": "Clock"
|
||||
},
|
||||
"dashboard_notes": {
|
||||
"message": "Dashboard Notes"
|
||||
},
|
||||
|
||||
@ -50,6 +50,10 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M22 9l-10 -4l-10 4l10 4l10 -4v6"></path><path d="M6 10.6v5.4a6 3 0 0 0 12 0v-5.4"></path></svg>
|
||||
<span data-i18n="gpa_settings">GPA Settings</span>
|
||||
</button>
|
||||
<button id="widgets-btn" class="big-button tab-btn">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 5m0 1a1 1 0 0 1 1 -1h12a1 1 0 0 1 1 1v12a1 1 0 0 1 -1 1h-12a1 1 0 0 1 -1 -1z"/><path d="M9 9h6v6h-6z"/><path d="M3 10h2m-2 4h2m10 -10v2m-4 -2v2m-4 -2v2m10 8h2m-2 4h2"/></svg>
|
||||
<span data-i18n="widgets">Widgets</span>
|
||||
</button>
|
||||
<button id="report-issue-btn" class="big-button tab-btn">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M12 9v4"></path><path d="M10.363 3.591l-8.106 13.534a1.914 1.914 0 0 0 1.636 2.871h16.214a1.914 1.914 0 0 0 1.636 -2.87l-8.106 -13.536a1.914 1.914 0 0 0 -3.274 0z"></path><path d="M12 16h.01"></path></svg>
|
||||
<span data-i18n="report_issue">Report issue</span>
|
||||
@ -955,6 +959,28 @@
|
||||
|
||||
</div>
|
||||
|
||||
<div class="widgets-container tab" style="display:none">
|
||||
<div class="tab-header">
|
||||
<div>
|
||||
<h2 style="margin-top: 0" data-i18n="widgets">Widgets</h2>
|
||||
</div>
|
||||
<button class="big-button back-btn" data-i18n="back">Back</button>
|
||||
</div>
|
||||
<div class="options">
|
||||
<div class="option-container">
|
||||
<div class="option" id="widget_clock">
|
||||
<input type="radio" id="off" name="widget_clock">
|
||||
<input type="radio" id="on" name="widget_clock">
|
||||
<div class="slider">
|
||||
<div class="sliderknob"></div>
|
||||
<div class="sliderbg"></div>
|
||||
</div>
|
||||
<span class="option-name">Clock</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="report-issue-container tab">
|
||||
<div class="tab-header">
|
||||
<div>
|
||||
|
||||
@ -35,6 +35,7 @@ chrome.runtime.onInstalled.addListener(function () {
|
||||
"assignments_done": [],
|
||||
"dashboard_grades": true,
|
||||
"assignment_date_format": false,
|
||||
"widget_clock": false,
|
||||
"dashboard_notes": false,
|
||||
"dashboard_notes_text": "",
|
||||
"better_todo": false,
|
||||
|
||||
146
js/content.js
146
js/content.js
@ -501,6 +501,9 @@ function applyOptionsChanges(changes) {
|
||||
case "gradient_cards":
|
||||
changeGradientCards();
|
||||
break;
|
||||
case "widget_clock":
|
||||
loadWidgets();
|
||||
break;
|
||||
case "dashboard_notes":
|
||||
loadDashboardNotes();
|
||||
break;
|
||||
@ -884,12 +887,19 @@ function checkDashboardReady() {
|
||||
if (mutation.type !== "childList") continue;
|
||||
if (current_page == "/" || current_page == "" || current_page.match(/^\/courses\/(\d+)(?:\/|$)/)) {
|
||||
if (dashboardReadyTimer) continue;
|
||||
dashboardReadyTimer = setTimeout(() => {
|
||||
dashboardReadyTimer = null;
|
||||
|
||||
const dashboardCards = document.querySelector("#DashboardCard_Container");
|
||||
if (dashboardCards) {
|
||||
loadWidgets();
|
||||
}
|
||||
|
||||
dashboardReadyTimer = setTimeout(() => {
|
||||
dashboardReadyTimer = null;
|
||||
|
||||
const c = document.querySelector("#DashboardCard_Container");
|
||||
if (c) {
|
||||
let cards = document.querySelectorAll(".ic-DashboardCard");
|
||||
loadWidgets();
|
||||
changeGradientCards();
|
||||
setupCardAssignments();
|
||||
loadCardAssignments();
|
||||
@ -3059,6 +3069,7 @@ async function changeColorPreset(colors) {
|
||||
let cards = document.querySelectorAll(".ic-DashboardCard__header");
|
||||
let sortedCards = [];
|
||||
cards.forEach(card => {
|
||||
if (card.closest('.canvasrefined-widget-clock')) return;
|
||||
sortedCards.push({ "href": card.querySelector(".ic-DashboardCard__link").href, "el": card });
|
||||
});
|
||||
sortedCards.sort((a, b) => a.href > b.href ? 1 : -1);
|
||||
@ -3283,6 +3294,7 @@ function insertGrades() {
|
||||
let cards = document.querySelectorAll('.ic-DashboardCard');
|
||||
if (cards.length === 0 || cards[0].querySelectorAll(".ic-DashboardCard__link").length === 0) return;
|
||||
for (let i = 0; i < cards.length; i++) {
|
||||
if (cards[i].classList.contains('canvasrefined-widget-clock')) continue;
|
||||
let course_id = parseInt(cards[i].querySelector(".ic-DashboardCard__link").href.split("courses/")[1]);
|
||||
data.forEach(grade => {
|
||||
if (course_id === grade.id) {
|
||||
@ -3394,6 +3406,7 @@ function loadCardAssignments() {
|
||||
const now = new Date();
|
||||
|
||||
cards.forEach(card => {
|
||||
if (card.classList.contains('canvasrefined-widget-clock')) return;
|
||||
let count = 0;
|
||||
let link = card.querySelector(".ic-DashboardCard__link");
|
||||
if (!link) return;
|
||||
@ -3486,9 +3499,12 @@ function loadCardAssignments2(c = null) {
|
||||
function setupCardAssignments() {
|
||||
if (options.assignments_due !== true) return;
|
||||
try {
|
||||
if (document.querySelectorAll('.ic-DashboardCard').length > 0 && document.querySelectorAll('.canvasrefined-card-container').length > 0) return;
|
||||
let widgetsCount = document.querySelectorAll('.canvasrefined-widget-clock .canvasrefined-card-container').length;
|
||||
let containersCount = document.querySelectorAll('.canvasrefined-card-container').length - widgetsCount;
|
||||
if (document.querySelectorAll('.ic-DashboardCard').length > 0 && containersCount > 0) return;
|
||||
let cards = document.querySelectorAll('.ic-DashboardCard');
|
||||
cards.forEach(card => {
|
||||
if (card.classList.contains('canvasrefined-widget-clock')) return;
|
||||
let assignmentContainer = card.querySelector(".canvasrefined-card-assignment") || makeElement("div", card, { "className": "canvasrefined-card-assignment" });
|
||||
let assignmentsDueHeader = card.querySelector(".canvasrefined-card-header-container") || makeElement("div", assignmentContainer, { "className": "canvasrefined-card-header-container" });
|
||||
let assignmentsDueLabel = card.querySelector(".canvasrefined-card-header") || makeElement("h3", assignmentsDueHeader, { "className": "canvasrefined-card-header", "textContent": chrome.i18n.getMessage("due") });
|
||||
@ -3505,7 +3521,12 @@ Card customization
|
||||
*/
|
||||
|
||||
function getCardId(card) {
|
||||
let id = card.querySelector(".ic-DashboardCard__link").href.split("courses/")[1];
|
||||
let link = card.querySelector(".ic-DashboardCard__link");
|
||||
if (!link) return -1;
|
||||
let href = link.href;
|
||||
if (!href || !href.includes("courses/")) return -1;
|
||||
let id = href.split("courses/")[1];
|
||||
if (!id) return -1;
|
||||
// no ~
|
||||
if (!id.includes("~")) return id;
|
||||
|
||||
@ -3778,7 +3799,8 @@ function setupGPACalc() {
|
||||
try {
|
||||
grades?.then(result => {
|
||||
|
||||
const dashboardContainer = document.querySelector(".ic-DashboardCard__box__container");
|
||||
const sortableContainer = document.querySelector(".ic-DashboardCard__box__container");
|
||||
const dashboardContainer = document.querySelector("#DashboardCard_Container");
|
||||
if (!dashboardContainer) return;
|
||||
|
||||
let container2 = document.querySelector(".canvasrefined-gpa-card");
|
||||
@ -3853,6 +3875,12 @@ function setupGPACalc() {
|
||||
}
|
||||
}
|
||||
|
||||
try {
|
||||
if (sortableContainer && window.jQuery && window.jQuery.fn && window.jQuery.fn.sortable) {
|
||||
window.jQuery(sortableContainer).sortable('refresh');
|
||||
}
|
||||
} catch (e) {}
|
||||
|
||||
calculateGPA2();
|
||||
});
|
||||
} catch (e) {
|
||||
@ -3899,6 +3927,114 @@ function loadDashboardNotes() {
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
Widgets
|
||||
*/
|
||||
|
||||
let clockInterval;
|
||||
|
||||
function loadWidgets() {
|
||||
if (options.widget_clock === true) {
|
||||
let card = document.querySelector('.canvasrefined-widget-clock');
|
||||
if (!card) {
|
||||
let container = document.querySelector(".ic-DashboardCard__box__container");
|
||||
if (!container) return;
|
||||
let realCard = container.querySelector(".ic-DashboardCard");
|
||||
if (realCard) {
|
||||
card = realCard.cloneNode(false);
|
||||
card.className = "ic-DashboardCard canvasrefined-widget-clock";
|
||||
} else {
|
||||
card = document.createElement("div");
|
||||
card.className = "ic-DashboardCard canvasrefined-widget-clock";
|
||||
}
|
||||
card.setAttribute("aria-label", "Clock widget");
|
||||
card.setAttribute("data-testid", "draggable-card");
|
||||
card.setAttribute("draggable", "true");
|
||||
card.style.cssText = "opacity: 1; display: inline-block; vertical-align: top;";
|
||||
card.innerHTML = `
|
||||
<div class="ic-DashboardCard__header">
|
||||
<span class="screenreader-only">Clock</span>
|
||||
<div class="ic-DashboardCard__header_image">
|
||||
<div class="ic-DashboardCard__header_hero" aria-hidden="true" style="background-color:#2d3b45;opacity:0.6"></div>
|
||||
</div>
|
||||
<a href="#" class="ic-DashboardCard__link">
|
||||
<div class="ic-DashboardCard__header_content">
|
||||
<h2 class="ic-DashboardCard__header-title ellipsis" title="Clock" data-testid="dashboard-card-title"><span style="color:#2d3b45">Clock</span></h2>
|
||||
<div class="canvasrefined-clock-display ic-DashboardCard__header-subtitle ellipsis" style="font-size:22px;font-weight:700;font-variant-numeric:tabular-nums;color:#2d3b45"></div>
|
||||
<div class="canvasrefined-clock-date ic-DashboardCard__header-term ellipsis" style="font-size:12px;color:#666"></div>
|
||||
</div>
|
||||
</a>
|
||||
<div>
|
||||
<div class="ic-DashboardCard__header-button-bg" style="background-color:#2d3b45;opacity:0"></div>
|
||||
<span data-position="Popover___1" data-cid="Position Popover" class="css-1ihz85b-position">
|
||||
<button type="button" class="Button Button--icon-action-rev ic-DashboardCard__header-button" aria-expanded="false" data-popover-trigger="true" data-position-target="Popover___1">
|
||||
<i class="icon-more" aria-hidden="true"></i>
|
||||
<span class="screenreader-only">Clock widget</span>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<nav class="ic-DashboardCard__action-container" aria-label="Actions for Clock">
|
||||
<a class="ic-DashboardCard__action" style="display:inherit"><img class="canvasrefined-link-image" style="display:none"></a>
|
||||
<a class="ic-DashboardCard__action" style="display:inherit"><img class="canvasrefined-link-image" style="display:none"></a>
|
||||
<a class="ic-DashboardCard__action" style="display:inherit"><img class="canvasrefined-link-image" style="display:none"></a>
|
||||
<a class="ic-DashboardCard__action" style="display:inherit"><img class="canvasrefined-link-image" style="display:none"></a>
|
||||
</nav>
|
||||
<div class="canvasrefined-card-assignment" style="display:none">
|
||||
<div class="canvasrefined-card-header-container"><h3 class="canvasrefined-card-header">Due</h3></div>
|
||||
<div class="canvasrefined-card-container"><div class="canvasrefined-assignment-container"><a class="canvasrefined-assignment-link">None</a></div></div>
|
||||
</div>
|
||||
`;
|
||||
container.appendChild(card);
|
||||
try {
|
||||
if (window.jQuery && window.jQuery.fn && window.jQuery.fn.sortable) {
|
||||
let $c = window.jQuery(container);
|
||||
if ($c.sortable('instance')) {
|
||||
let opts = $c.sortable('option');
|
||||
$c.sortable('destroy');
|
||||
$c.sortable(window.jQuery.extend({}, opts));
|
||||
}
|
||||
}
|
||||
} catch (e) {}
|
||||
card.addEventListener('dragstart', function (e) {
|
||||
e.dataTransfer.setData('text', 'canvasrefined-widget-clock');
|
||||
e.dataTransfer.effectAllowed = 'move';
|
||||
});
|
||||
setTimeout(() => {
|
||||
try {
|
||||
let $c = window.jQuery && window.jQuery(container);
|
||||
if ($c && $c.sortable && $c.sortable('instance')) {
|
||||
$c.sortable('refresh');
|
||||
}
|
||||
} catch (e) {}
|
||||
}, 500);
|
||||
updateClock();
|
||||
clockInterval = setInterval(updateClock, 1000);
|
||||
}
|
||||
} else {
|
||||
let card = document.querySelector('.canvasrefined-widget-clock');
|
||||
if (card) card.remove();
|
||||
if (clockInterval) {
|
||||
clearInterval(clockInterval);
|
||||
clockInterval = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function updateClock() {
|
||||
let display = document.querySelector('.canvasrefined-clock-display');
|
||||
let dateEl = document.querySelector('.canvasrefined-clock-date');
|
||||
if (!display) return;
|
||||
let now = new Date();
|
||||
let hours = String(now.getHours()).padStart(2, '0');
|
||||
let minutes = String(now.getMinutes()).padStart(2, '0');
|
||||
let seconds = String(now.getSeconds()).padStart(2, '0');
|
||||
display.textContent = `${hours}:${minutes}:${seconds}`;
|
||||
if (dateEl) {
|
||||
dateEl.textContent = now.toLocaleDateString(undefined, { weekday: 'long', month: 'long', day: 'numeric' });
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
Custom font
|
||||
*/
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
const syncedSwitches = ['remind', 'tab_icons', 'hide_feedback', 'dark_mode', 'remlogo', 'full_width', 'auto_dark', 'assignments_due', 'gpa_calc', 'gradient_cards', 'disable_color_overlay', 'dashboard_grades', 'dashboard_notes', 'better_todo', 'better_sidebar', 'condensed_cards'];
|
||||
const syncedSwitches = ['remind', 'tab_icons', 'hide_feedback', 'dark_mode', 'remlogo', 'full_width', 'auto_dark', 'assignments_due', 'gpa_calc', 'gradient_cards', 'disable_color_overlay', 'dashboard_grades', 'dashboard_notes', 'better_todo', 'better_sidebar', 'condensed_cards', 'widget_clock'];
|
||||
const syncedSubOptions = [
|
||||
"todo_hide_feedback",
|
||||
"todo_full_height",
|
||||
@ -133,6 +133,7 @@ const defaultOptions = {
|
||||
"customCardStyles": false,
|
||||
"customBackgroundLink": "",
|
||||
"customBackgroundScale": 100,
|
||||
"widget_clock": false,
|
||||
}
|
||||
};
|
||||
|
||||
@ -401,6 +402,10 @@ function setup() {
|
||||
setup: displayThemeList,
|
||||
tab: ".import-export",
|
||||
},
|
||||
"widgets-btn": {
|
||||
setup: null,
|
||||
tab: ".widgets-container",
|
||||
},
|
||||
"report-issue-btn": {
|
||||
setup: displayErrors,
|
||||
tab: ".report-issue-container",
|
||||
|
||||
Loading…
Reference in New Issue
Block a user