const intersectionObserverRegistry = new Object();

function setIntersectionObserverRegistry(parametre, valeur)

{

  intersectionObserverRegistry[parametre] = valeur;

}

function getIntersectionObserverRegistry(parametre)

{

  return intersectionObserverRegistry[parametre];

}

function entryVisiblity(_id, _visible) {

    let entry=getIntersectionObserverRegistry(_id);

    if (entry) return entry(_visible);

    return consoleLog(_id, _visible)

}

// Create a function that will handle any intersection between some elements and the viewport.

const handleIntersectionObserverEntries = function (entries) {

  entries.forEach(entry => {

    if (typeof entryVisiblity === 'function') entryVisiblity(entry.target.id, entry.isIntersecting);

  });

}

const intersectionObserver = new IntersectionObserver(handleIntersectionObserverEntries);

function addIntersectionObserverEntry(_id, _func)

{

    let item = document.querySelector('#'+_id);

    if ((item) && (intersectionObserver)) {

        setIntersectionObserverRegistry(_id, _func);

        intersectionObserver.observe(item);

    }

}

function consoleLog(_id, _visible) {

    if (_visible) {

        console.log(_id + ' is Visible');

    } else {

        console.log(_id + ' is NOT Visible');

    }

}

function scrollToElement(elementSelector) {

    let element = document.querySelector(elementSelector);

    if (element) element.scrollIntoView({ behavior: 'smooth' });

}

function beforeHeaderVisibility(_visible) {

    console.log('TRIGGER beforeHeaderVisibility');

    if (_visible) {

        console.log('HEADER is Visible');

    } else {

        console.log('HEADER is NOT Visible');

        scrollToElement('#before_nav');

    }

}

function afterHeaderVisibility(_visible) {

    console.log('TRIGGER afterHeaderVisibility');

    if (_visible) {

        scrollToElement('#before_header');

    } else {

        console.log('HEADER is NOT Visible');

    }

}

function beforeNavVisibility(_visible) {

    console.log('TRIGGER beforeNavVisibility');

    let synthese=document.querySelector('#synthese');

    if (synthese) {

        if (_visible) {

            synthese.style.display="block";

        } else {

            synthese.style.display="none";

        }

    }

}

/*

addIntersectionObserverEntry("before_header", beforeHeaderVisibility);

addIntersectionObserverEntry("after_header", afterHeaderVisibility);

addIntersectionObserverEntry("before_nav", beforeNavVisibility);

*/