schoolbox web extension :)
1import { injectStyles } from "@/utils"; 2import type { Period } from "@/utils/periodUtils"; 3import { getListOfPeriods } from "@/utils/periodUtils"; 4import { definePlugin } from "@/utils/plugin"; 5import styleText from "./styles.css?inline"; 6 7export default function init() { 8 definePlugin( 9 "progressBar", 10 () => { 11 if (window.location.pathname === "/" && document.querySelector(".timetable")) { 12 const periodList = getListOfPeriods(); 13 14 const progressRow = document.createElement("tr"); 15 progressRow.classList.add("progress-container"); 16 document.querySelector(".timetable > thead")?.insertAdjacentElement("beforeend", progressRow); 17 18 injectStyles(styleText); 19 insertProgressBars(periodList, progressRow); 20 } 21 }, 22 [".timetable"], 23 ); 24} 25 26function insertProgressBars(periodList: Period[], container: HTMLElement) { 27 periodList.forEach((period) => { 28 const td = document.createElement("td"); 29 const progressBar = document.createElement("progress"); 30 const progress = period.getProgress(); 31 progressBar.className = "progress-bar"; 32 progressBar.max = 100; 33 progressBar.style.width = "100%"; 34 progressBar.value = progress; 35 36 if (progress < 100) { 37 const intervalId = setInterval(() => { 38 progressBar.value = period.getProgress(); 39 if (progressBar.value === 100) { 40 clearInterval(intervalId); 41 } 42 }, 10000); 43 } 44 45 td.appendChild(progressBar); 46 container.appendChild(td); 47 }); 48}