<!-- @tuanphan Section Archive Toggle -->
<script>
window.SectionArchiveToggleConfig = {
  sectionSelector: 'section[data-section-id="6a4b926de8920c18bcfda9b8"]',
  triggerSelector: '#block-yui_3_17_2_1_1783337438194_5175 a',
  startHidden: true,
  allowToggle: false,
  scrollToReveal: true,
  scrollOffset: 0
};
</script>
<script>
(function () {
  var CFG = window.SectionArchiveToggleConfig;
  if (!CFG) return;

  var STATE_ATTR = 'data-archive-state';
  var STYLE_ID = 'section-archive-toggle-style';

  // FOUC guard: inject the hide rule synchronously so the target section
  // never flashes before the visitor clicks the trigger.
  if (CFG.startHidden && !document.getElementById(STYLE_ID)) {
    var style = document.createElement('style');
    style.id = STYLE_ID;
    style.textContent =
      CFG.sectionSelector + ':not([' + STATE_ATTR + '="shown"]){display:none !important;}';
    (document.head || document.documentElement).appendChild(style);
  }

  function getSections() {
    return Array.prototype.slice.call(document.querySelectorAll(CFG.sectionSelector));
  }

  function reveal(sections) {
    sections.forEach(function (s) { s.setAttribute(STATE_ATTR, 'shown'); });
    if (CFG.scrollToReveal && sections[0]) {
      var top = sections[0].getBoundingClientRect().top + window.pageYOffset - (CFG.scrollOffset || 0);
      window.scrollTo({ top: top, behavior: 'smooth' });
    }
  }

  function isShown(sections) {
    return sections.length > 0 && sections[0].getAttribute(STATE_ATTR) === 'shown';
  }

  function bind() {
    var triggers = document.querySelectorAll(CFG.triggerSelector);
    if (!triggers.length) return;

    triggers.forEach(function (trigger) {
      if (trigger.dataset.archiveToggleBound === 'true') return;
      trigger.dataset.archiveToggleBound = 'true';
      trigger.setAttribute('aria-expanded', CFG.startHidden ? 'false' : 'true');

      trigger.addEventListener('click', function (e) {
        e.preventDefault();
        var sections = getSections();
        if (!sections.length) return;

        if (isShown(sections)) {
          if (CFG.allowToggle) {
            sections.forEach(function (s) { s.setAttribute(STATE_ATTR, 'hidden'); });
            trigger.setAttribute('aria-expanded', 'false');
          }
        } else {
          reveal(sections);
          trigger.setAttribute('aria-expanded', 'true');
        }
      });
    });
  }

  window.addEventListener('load', bind);
  window.addEventListener('mercury:load', bind);
})();
</script>

 

Buy me a coffee