Module: Asciidoctor::Html::Sidebar

Defined in:
lib/asciidoctor/html/sidebar.rb

Overview

Toggle behaviour of sidebar

Constant Summary collapse

TOGGLE =
<<~JS
  (function() {
    const page = document.getElementById('page');
    const sidebar = document.getElementById('sidebar');
    const dismissBtn = document.getElementById('sidebar-dismiss-btn');
    function hideSidebar() {
      sidebar && sidebar.classList.remove('shown');
      page.classList.remove('noscroll');
    }

    // Sidebar should be hidden on any local link click
    document.querySelectorAll('a[href^="#"]').forEach(el => {
      el.addEventListener('click', hideSidebar);
    });
    addEventListener('resize', hideSidebar);
    dismissBtn && dismissBtn.addEventListener('click', hideSidebar);

    const menuBtn = document.getElementById('menu-btn');
    if(!menuBtn) return;

    // Nudge menuBtn in case there is a scrollbar
    const main = document.getElementById('main');
    const scrollbarWidth = page.offsetWidth - main.offsetWidth;
    menuBtn.style.right = (scrollbarWidth + 12) + 'px';

    // Add click listener to toggle sidebar
    menuBtn.addEventListener('click', function() {
      sidebar && sidebar.classList.toggle('shown');
      if(scrollbarWidth > 0) page.classList.toggle('noscroll');
    });
  })();
JS