USOS deadlines page date highlighter

README.md

USOS deadlines page date highlighter [Userscript]

A script that highlights single date deadlines that happend to fall on a weekend (for part time students) and deadlines that are longer than a 1 day.

*The regex in this script may not work due to how other Unis write their pages!!!

Instructions

1. Install a Userscript browser extension

• Tampermonkey (I use this one)
• Violentmonkey
• etc.

*It should work fine with most extensions (if not, write a comment)
2. Add the script

Tampermonkey

1. Click on the extension icon (in the top right corner of the browser - you may have to click the puzzle icon first to see it)
2. Click Control panel
3. Click Utilities
4. At the bottom in to Import from URL paste in this URL: https://gist.githubusercontent.com/ErykDarnowski/470bbbb14f6beb8de1b2c8ec18b9c906/raw/3f58dbf12dcf9e7caa42161f782c8d939eba52fe/script.js
5. Click Install
6. Click Install again

Violentmonkey

1. Click on the extension icon (in the top right corner of the browser - you may have to click the puzzle icon first to see it)
2. Click the cog icon
3. Click +
4. Click Install from URL
5. Paste in this URL: <>
6. Click Confirm
7. Click Close

*The script should auto update!
*Remember, you can turn the script ON / OFF whenever you like by just flipping the switch next to it's name

script.js

// ==UserScript==
// @name         USOS deadlines page date highlighter
// @description  A script that highlights single date deadlines that happend to fall on a weekend (for part time students) and deadlines that are longer than a 1 day.
// @version      1.3.4
// @author       Eryk Darnowski (GH: ErykDarnowski TW: @erykdarnowski)
// @match        *://usosweb.ansb.pl/kontroler.php?_action=news/default
// @run-at       document-idle
// @grant        none
// @namespace    https://gist.github.com/ErykDarnowski/470bbbb14f6beb8de1b2c8ec18b9c906
// @supportURL   https://gist.github.com/ErykDarnowski/470bbbb14f6beb8de1b2c8ec18b9c906
// @updateURL    https://gist.githubusercontent.com/ErykDarnowski/470bbbb14f6beb8de1b2c8ec18b9c906/raw/e6eb9796239aa934e42629f06608a8df70b67d36/script.js
// @downloadURL  https://gist.githubusercontent.com/ErykDarnowski/470bbbb14f6beb8de1b2c8ec18b9c906/raw/e6eb9796239aa934e42629f06608a8df70b67d36/script.js
// ==/UserScript==

/* Releases
- 1.0.0 Initial
- 1.1.0 Add sorting
- 1.2.0 Add year separation
- 1.2.1 Fix incorrect selector (page change)
- 1.2.2 Fix incorrect selector (page change)
- 1.2.3 Fix incorrect selector (page change)
- 1.3.0 Add automatic date table finding
- 1.3.1 Update and lower child length requirements for selector
- 1.3.2 Fix missing <br> on passed dates and few other bugs
- 1.3.3 Fix bug with <br>s and not being able to find the container el
- 1.3.4 Add `use strict`
*/

/* TODO
- Change it so it classifies a range element as 'passed' based on end (not start) date?
- Add some sort of divider between 'passed' and upcoming els?
*/

(() => {
	"use strict";

    // 1. get first <p> element with a lot of children (at lest 5 - arbitrary)
    const pEls = [...document.querySelectorAll('#layout-c22 > div.usos-ui > p')];
    let lastChildCount = 0;
    let baseEl = null;

    for (let i in pEls) {
        const childCount = pEls[i].children.length;

        if (childCount > lastChildCount + 5) { // 20 - seemed like a bit too much
            lastChildCount = childCount;
            baseEl = pEls[i];
            break;
        };
    };

    // 2. injest els
    const elsContainer = baseEl;
    let brs = [...baseEl.querySelectorAll(`br`)];
    let els = [...baseEl.querySelectorAll(`span`)];

    const regexSpan   = /([\d.]+)(?: r\.)?(?: ?\W )(?:[\d.]+)/;
    const regexSingle = /([\d.]+)(?: r\.)?(?: ?\W )/;

    const dateStrToISO = str => str.split('.').reverse().join('-');

    els = els.map(el => {
        const title = el.textContent;

        // check if span of time
        let date;
        const regexSpanRes = regexSpan.test(title);
        if (regexSpanRes) {
            date = new Date(dateStrToISO(regexSpan.exec(title)[1]));
        } else {
            date = new Date(dateStrToISO(regexSingle.exec(title)[1]));
        };

        // check if old
        if (date.getTime() >= new Date().getTime()) {
            // highlight
            if (regexSpanRes) {
                el.style.color = 'blueviolet';
            } else {
                const dayNum = date.getDay();
                const isWeekend = dayNum === 6 || dayNum === 0;

                if (isWeekend) {
                    el.style.color = 'green';
                    el.style.fontWeight = 'bold';
                };
            };
        } else {
            el.style.color = '#c0c0c0';
        };

        return [date, el];
    });

    // 3. sort by date
    els.sort((a, b) => a[0].getTime() - b[0].getTime());

    // 4. remove <br> as they'll be left behind when inserting new els
    //brs = brs.slice(brs.length - els.length, brs.length - 1);
    brs.map(el => el.remove());

    // 5. insert updated els
    for (let i = 0; i < els.length; i++) {
        const elHtml = els[i][1].outerHTML;

        els[i][1].remove();
        elsContainer.insertAdjacentHTML('beforeend', elHtml + '<br>');

        // separate years
        if (i < els.length - 1 && els[i][0].getYear() !== els[i + 1][0].getYear()) {
            elsContainer.insertAdjacentHTML('beforeend', '<br>');
        };
    };
})();