window.onload = () => {
    const anchors = document.querySelectorAll('a');
    const header = document.querySelector('header');
    const background = document.querySelector('.background');
    const main = document.querySelector('main');

    anchors.forEach((anchor) => {
        if (anchor.classList.contains("notransition"))
            return;
            
        anchor.addEventListener('click', e => {
            e.preventDefault();
            let target = e.target.href;
            if (target[target.length - 1] == '#')
                return;

            let dest = `${target}`

            if (dest.includes('nf')) {
                document.documentElement.style.setProperty('--targetheadercolor', getComputedStyle(document.documentElement).getPropertyValue('--nfheadercolor'))
            } else if (dest.includes('winchat')) {
                document.documentElement.style.setProperty('--targetheadercolor', getComputedStyle(document.documentElement).getPropertyValue('--wcheadercolor'))
            } else if (dest.includes('mainspring')) {
                document.documentElement.style.setProperty('--targetheadercolor', getComputedStyle(document.documentElement).getPropertyValue('--msheadercolor'))
            } else if (dest.includes('about')) {
                document.documentElement.style.setProperty('--targetheadercolor', getComputedStyle(document.documentElement).getPropertyValue('--aboutheadercolor'))
            } else {
                document.documentElement.style.setProperty('--targetheadercolor', getComputedStyle(document.documentElement).getPropertyValue('--indexheadercolor'))
            }

            header.classList.add('out');
            background.classList.add('out');
            main.classList.add('out');

            setTimeout(() => {
                window.location.href = target;
            }, 500);
        });
    });
}