diff --git a/frontend/protos/index.html b/frontend/protos/index.html index bdde887..671f142 100644 --- a/frontend/protos/index.html +++ b/frontend/protos/index.html @@ -92,6 +92,10 @@ addClassToElement('#div_principale','principale'); addClassToElement('#div_footer','footer'); + function etatSectionLog(message) { + logMsg('etatSection', message); + } + const section_header=document.querySelector('#div_header'); const section_navbar=document.querySelector('#div_navbar'); const section_synthese=document.querySelector('#div_synthese'); @@ -110,13 +114,13 @@ // ---- // ---- La page est une machine à états // ---- - let currentEtat = 1; + let currentEtatSection = 1; let maxEtat = 4; function etatSections(etat) { - //if (currentEtat == etat) return; - currentEtat=etat; - logMsg('etatSection','Etat courant '+currentEtat); - switch (etat) { + if (currentEtatSection == etat) return; + currentEtatSection=etat; + etatSectionLog('Etat courant '+currentEtatSection); + switch (currentEtatSection) { case 1 : scrollToElement('#div_before_header'); section_header.style.display = "block"; @@ -139,47 +143,53 @@ break; } } - function changeEtatUp() { - if (++currentEtat > maxEtat) currentEtat = maxEtat; - etatSections(currentEtat); + function changeEtatSectionUp() { + if (currentEtatSection != maxEtat) + etatSections(currentEtatSection+1); } - function changeEtatDown(){ - if (--currentEtat < 1) currentEtat = 1; - etatSections(currentEtat); + function changeEtatSectionDown(){ + if (currentEtatSection != 1) + etatSections(currentEtatSection-1); } after_section_header.addEventListener("click", function() { - logMsg('etatSection','toggle section_header '); - if (currentEtat!=1) etatSections(1); + etatSectionLog('toggle section_header '); + if (currentEtatSection!=1) etatSections(1); else etatSections(2); }); after_section_synthese.addEventListener("click", function() { - logMsg('etatSection','toggle section_synthese '); - if (currentEtat==3) changeEtatDown(); - else changeEtatUp(); + etatSectionLog('toggle section_synthese '); + if (currentEtatSection!=2) etatSections(2); + else etatSections(2); }); - + + function changeEtatSection(_visible) { + if (!_visible) changeEtatSectionUp(); + if (_visible) changeEtatSectionDown(); + return true; + } + function beforeSection(_visible) { - if (!_visible) changeEtatUp(); + if (!_visible) changeSectionEtatUp(); } function afterSection(_visible) { - if (_visible) changeEtatDown(); + if (_visible) changeEtatSectionDown(); } function beforeNavbarVisibility(_visible) { - intersectionObserverLog('TRIGGER '+arguments.callee.name); - beforeSection(_visible) + etatSectionLog('TRIGGER '+arguments.callee.name); + beforeSection(_visible); } function afterNavbarVisibility(_visible) { - intersectionObserverLog('TRIGGER '+arguments.callee.name); - afterSection(_visible) + etatSectionLog('TRIGGER '+arguments.callee.name); + afterSection(_visible); } function beforeHeaderVisibility(_visible) { - intersectionObserverLog('TRIGGER '+arguments.callee.name); - beforeSection(_visible) + etatSectionLog('TRIGGER '+arguments.callee.name); + beforeSection(_visible); } function afterHeaderVisibility(_visible) { - intersectionObserverLog('TRIGGER '+arguments.callee.name); - afterSection(_visible) + etatSectionLog('TRIGGER '+arguments.callee.name); + afterSection(_visible); } addIntersectionObserverEntry("div_before_header", beforeHeaderVisibility); diff --git a/frontend/protos/styles.css b/frontend/protos/styles.css index dcf930e..8a8c62b 100644 --- a/frontend/protos/styles.css +++ b/frontend/protos/styles.css @@ -89,6 +89,7 @@ body { background-color: aqua; } .navbar { + position: relative; height: var(--section-navbar-height); background-color: yellow; }