// Every time the page scroll run these functions
window.addEventListener("scroll", function () {
  reveal();
});

/**
 * Activates the reveal effect when scrolling through the page.
 */
function reveal() {
    // Section needs to pass the 20% mark from the bottom of the window to show.
    const elementVisible = window.innerHeight * 0.8;
    // Get top page element.
    const siteTop = document.getElementById("top").getBoundingClientRect().top;
    // Get bottom page element.
    const siteBottom = document.getElementById("footer").getBoundingClientRect().bottom;
    // Check if user at bottom of page.
    if (siteBottom < window.innerHeight + 1) {
        // If user at bottom of page, show all sections
        $.each($(".reveal"), (_, val) => {
            val.classList.add("active");
            if (val.getAttribute('id') === 'tech-section') {
                toggleBars("open");
            }
        });
        // Check to see if user at top of page.
    }
    else if (siteTop > 10) {
        // If at top of page hide all but top section
        $.each($(".reveal"), (_, val) => {
            val.classList.remove("active");
            if (val.getAttribute('id') === 'tech-section') {
                toggleBars("close");
            }
            ;
        });
        // If user not at bottom of page.
    }
    else {
        // As scroll check each element.
        $.each($(".reveal"), (_, val) => {
            if (val.getBoundingClientRect().top < elementVisible && siteTop !== 0) {
                val.classList.add("active");
                if (val.getAttribute('id') === 'tech-section') {
                    toggleBars("open");
                }
            }
            else {
                val.classList.remove("active");
                if (val.getAttribute('id') === 'tech-section') {
                    // Tech sections is not currently being shown
                    toggleBars("close");
                }
            }
        });
    }
    if (siteTop === 0) {
        $("#scroll_flash")
            .find("h3")
            .delay(2000)
            .fadeIn("slow", () => {
            $("#scroll_flash").removeClass("d-none");
        });
    }
    else {
        $("#scroll_flash")
            .find("h3")
            .fadeOut("fast", () => {
            $("#scroll_flash").addClass("d-none");
        });
    }
}