window.addEventListener('load', () => {

    const header = document.querySelector('.header');
    const blockBlack = document.querySelector('.welcome');
    const blockBlack1 = document.querySelector('.slider-info');
    const mainScreen = document.querySelector('.main-screen');
    const partnershipWelcome = document.querySelector('.partnership-welcome');
    const managementWelcome = document.querySelector('.management-welcome');
    const mainScreenAbout = document.querySelector('.main-screen--about');
    const link = document.querySelectorAll('.dropdown__link');
    const breakpoint = window.matchMedia('(min-width: 1200px)');

    let scrollpos = window.scrollY
    let scrollChange = 0;

    const ghost = document.querySelector('.js-sustainability-animation');
    const partnership = document.querySelector('.js-partnership-animation');
    const ubo = document.querySelector('.js-ubo-animation');
    const about = document.querySelector('.js-about-animation');
    const manager = document.querySelector('.js-manager-animation');

    if (ghost || managementWelcome || ubo) {
        header.classList.add("header_ghost");
    }

    const add_class_on_scroll = () => {
        header.classList.add("header_white");
        link.forEach(item => {
            item.style.color = '#141414';
        })
    };
    const remove_class_on_scroll = () => {
        header.classList.remove("header_white")
        link.forEach(item => {
            item.style.color = 'white';
        })
    };

    const active_class = () => {

        let realScrollHeight;
        realScrollHeight = window.scrollY;

        if (ghost || partnership || about) {
            if (!breakpoint.matches) {
                realScrollHeight >= scrollChange ? add_class_on_scroll() : remove_class_on_scroll();
            }
        } else {
            realScrollHeight >= scrollChange ? add_class_on_scroll() : remove_class_on_scroll();
        }
    }

    if (blockBlack && blockBlack1) {
        scrollChange = blockBlack.scrollHeight + blockBlack1.scrollHeight - 350;
    }

    if (mainScreen) {
        scrollChange = mainScreen.scrollHeight;
    }

    if (managementWelcome || ubo) {
        scrollChange = 50;
    }

    if (partnershipWelcome) {
        scrollChange = partnershipWelcome.scrollHeight;
    }

    if (mainScreenAbout) {
        scrollChange = mainScreenAbout.scrollHeight * 2;
    }

    active_class();

    window.addEventListener('scroll', function () {
        scrollpos = window.scrollY;
        active_class();

        // if (window.scrollY > window.screen.height) {
        //     header.classList.add('hideTabs')
        // } else {
        //     header.classList.remove('hideTabs')
        // }
    })

    if (manager) {
        add_class_on_scroll();
    }
});

export const headerWhite = () => {
    const header = document.querySelector('.header');
    const link = document.querySelectorAll('.dropdown__link');

    header.classList.add("header_white");

    link.forEach(item => {
        item.style.color = '#141414';
    })
}

export const headerRemoveWhite = () => {
    const header = document.querySelector('.header');
    const link = document.querySelectorAll('.dropdown__link');

    header.classList.remove("header_white");

    link.forEach(item => {
        item.style.color = 'white';
    })
}