collection_nav.html 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <div class="docsNavContainer">
  2. <nav class="toc" id="doc_nav">
  3. <div class="toggleNav" id="collection_nav">
  4. <section class="navWrapper wrapper">
  5. <div class="navBreadcrumb wrapper">
  6. <div class="navToggle" id="collection_nav_toggler">
  7. <i></i>
  8. </div>
  9. <h2>
  10. <a href="{{ include.sectionpath }}">{{ include.sectiontitle }}</a>
  11. {% if include.currentgroup %}
  12. <i>›</i>
  13. <span>{{ include.currentgroup }}</span>
  14. {% endif %}
  15. </h2>
  16. </div>
  17. <div class="navGroups">
  18. {% if include.type == "blog" %}
  19. {% assign grouptitle = "All Posts" %}
  20. {% assign groupitems = include.navdata %}
  21. {% include nav/collection_nav_group.html %}
  22. {% else %}
  23. {% for group in include.navdata %}
  24. {% assign grouptitle = group.title %}
  25. {% for item in group.items %}
  26. {% if item.id == page.docid %}
  27. {% assign currentgroup = group %}
  28. {% endif %}
  29. {% endfor %}
  30. {% include nav/collection_nav_group.html %}
  31. {% endfor %}
  32. {% endif %}
  33. </div>
  34. </section>
  35. </div>
  36. </nav>
  37. </div>
  38. <script>
  39. var docsevent = document.createEvent('Event');
  40. docsevent.initEvent('docs_slide', true, true);
  41. document.addEventListener('docs_slide', function (e) {
  42. document.body.classList.toggle('docsSliderActive');
  43. }, false);
  44. var collectionNav = document.getElementById('collection_nav');
  45. var collectionNavToggler =
  46. document.getElementById('collection_nav_toggler');
  47. collectionNavToggler.addEventListener('click', function(e) {
  48. collectionNav.classList.toggle('toggleNavActive');
  49. document.dispatchEvent(docsevent);
  50. });
  51. var groups = document.getElementsByClassName('navGroup');
  52. for(var i = 0; i < groups.length; i++) {
  53. var thisGroup = groups[i];
  54. thisGroup.onclick = function() {
  55. for(var j = 0; j < groups.length; j++) {
  56. var group = groups[j];
  57. group.classList.remove('navGroupActive');
  58. }
  59. this.classList.add('navGroupActive');
  60. }
  61. }
  62. </script>