Syllabus/static/js/sandpoints.js

window.addEventListener('scroll', function(e) {
    console.log(document.querySelector('body').clientWidth);
    if (document.querySelector('body').clientWidth > 1024) {
        let rightcolumn = document.querySelector('.rightcolumn');
        let topicstitle = document.querySelector('.topicstitle')
        let topicbar = document.querySelector('.topicbar')
        let grid = document.querySelector('.grid')
        let gridrect = topicstitle.getBoundingClientRect();
        if (gridrect.top < 12 && !grid.classList.contains('moved')) {
            grid.classList.add('moved');
            topicbar.style.display = "inline";
            topicstitle.style.visibility = "hidden";
            grid.style.display = "none";
                window.scrollBy({top: grid.clientHeight + topicstitle.clientHeight, behavior: 'smooth'})
        }
    }
})


window.addEventListener('DOMContentLoaded', (e) => {
    if (document.querySelector('.syllabusgrid')) {
        if (document.querySelector('body').clientWidth > 1024) {
            document.querySelector('.syllabusgrid').classList.remove('syllabusgrid')
        } else {
            toggle('syllabus/');
        }
    }

    let par = document.querySelector("#TableOfContents > ol:first-child > li:first-child");
    let s = document.createElement("span");
    s.appendChild(par.cloneNode(true))
    par.remove()
    document.querySelector("#TableOfContents > ol:first-child").insertBefore(s, document.querySelector("#TableOfContents > ol:first-child").firstChild)
})


var toggle = function(ts) {
    let rightcolumn = document.querySelector('.rightcolumn');
    let grid = document.querySelector('.grid');

    if (grid) {
        grid.classList.remove('grid')
        grid.classList.add('mobilegrid')
    }

    if (rightcolumn.classList.contains('shown')) {
        rightcolumn.classList.remove('shown');
        rightcolumn.style.display = "none";
        document.querySelector('.mobilegrid').style.display = "none";
    } else {
        rightcolumn.classList.add('shown');
        rightcolumn.style.display = "grid";
        document.querySelector('.mobilegrid').style.display = "block";
    }
}