website/assets/js/page.js

import Cookies from 'js-cookie';
import '/assets/scss/page.scss';

document.addEventListener("readystatechange", event => {
    if(event.target.readyState === 'complete') {
        initOverflow();
        initExternalLinks();
        initNinetiesToggle();
    }
});

function initOverflow() {
    let body = document.querySelector('body');
    let nineties = document.querySelector('.nineties-toggle');
    let container = document.querySelector('.container');
    container.style.height = (body.scrollHeight > window.outerHeight) ? 'auto' : body.scrollHeight - nineties.scrollHeight + 'px';
}

function initNinetiesToggle() {
    let nineties = document.querySelector('.nineties-toggle');
    let container = document.querySelector('.container');
    nineties.addEventListener('click', function() {
        let body = document.querySelector('body');
        if (body.classList.contains('nineties')) {
            body.classList.remove('nineties');
            Cookies.remove('nineties');
        } else {
            body.classList.add('nineties');
            Cookies.set('nineties', true, { sameSite: 'strict' });
        }
    })

    if(
        nineties.getBoundingClientRect().left < container.getBoundingClientRect().right &&
        nineties.getBoundingClientRect().bottom > container.getBoundingClientRect().top
    ) {
        nineties.style.position = 'initial';
        nineties.style.textAlign = 'right';
    }
}

function initExternalLinks() {
    document.querySelectorAll('a').forEach(elem => {
        if(isExternalURL(elem.getAttribute('href'))) {
            elem.setAttribute('target', '_blank');
        }
    })
}

const isExternalURL = (url) => {
    if(url.startsWith('/')) return false;
    return new URL(url).origin !== location.origin;
}