Configurable levels of TOC nesting, up to h6

lourheroes · Oct 31, 2017 · bf40831 · bf40831
1 parent c9390ae
commit bf40831
Show file tree

Hide file tree

Showing 5 changed files with 52 additions and 4 deletions.
diff --git a/index.html b/index.html
@@ -24,7 +24,7 @@
 <script src="source/javascripts/app/_toc.js"></script>
 <script type="text/javascript">
 $(function() {
-  loadToc($('#toc'), '.toc-link', '.toc-list-h2', 10);
+  loadToc($('#toc'), '.toc-link', '.toc-list-h2, .toc-list-h3, .toc-list-h4, .toc-list-h5, .toc-list-h6', 10);
   setupLanguages($('body').data('languages'));
   $('.content').imagesLoaded( function() {
     recacheHeights();

diff --git a/index.js b/index.js
@@ -166,7 +166,7 @@ function render(inputStr, options, callback) {
         locals.page_content = content;
         locals.toc_data = function(content) {
             var result = [];
-            var h1,h2,h3;
+            var h1,h2,h3,h4,h5;
             var headingLevel = header.headingLevel || 2;
             $(':header').each(function(e){
                 var tag = $(this).get(0).tagName.toLowerCase();
@@ -198,8 +198,24 @@ function render(inputStr, options, callback) {
                     let child = {};
                     child.id = $(this).attr('id');
                     child.content = $(this).text();
+                    child.children = [];
+                    h4 = child;
                     h3.children.push(child);
                 }
+                if ((headingLevel >= 5) && (tag === 'h5')) {
+                    let child = {};
+                    child.id = $(this).attr('id');
+                    child.content = $(this).text();
+                    child.children = [];
+                    h5 = child;
+                    h4.children.push(child);
+                }
+                if ((headingLevel >= 6) && (tag === 'h6')) {
+                    let child = {};
+                    child.id = $(this).attr('id');
+                    child.content = $(this).text();
+                    h5.children.push(child);
+                }
             });
             return result; //[{id:'test',content:'hello',children:[]}];
         };

diff --git a/pub/css/screen_overrides.css b/pub/css/screen_overrides.css
@@ -6,3 +6,35 @@ div .highlight {
 	overflow-y: auto;
 	overflow-x: hidden;
 }
+.toc-list-h3 {
+    display: none;
+    background-color: #1E2224;
+}
+.toc-h3 {
+    padding-left: 35px;
+    font-size: 11px;
+}
+.toc-list-h4 {
+    display: none;
+    background-color: #1E2224;
+}
+.toc-h4 {
+    padding-left: 45px;
+    font-size: 10px;
+}
+.toc-list-h5 {
+    display: none;
+    background-color: #1E2224;
+}
+.toc-h5 {
+    padding-left: 55px;
+    font-size: 9px;
+}
+.toc-list-h6 {
+    display: none;
+    background-color: #1E2224;
+}
+.toc-h6 {
+    padding-left: 65px;
+    font-size: 8px;
+}
diff --git a/source/javascripts/all.inc b/source/javascripts/all.inc
@@ -8,7 +8,7 @@
 <script src="source/javascripts/app/_toc.js"></script>
 <script type="text/javascript">
 $(function() {
-  loadToc($('#toc'), '.toc-link', '.toc-list-h2', 10);
+  loadToc($('#toc'), '.toc-link', '.toc-list-h2, .toc-list-h3, .toc-list-h4, .toc-list-h5, .toc-list-h6', 10);
   setupLanguages($('body').data('languages'));
   $('.content').imagesLoaded( function() {
     recacheHeights();

diff --git a/source/javascripts/all_nosearch.inc b/source/javascripts/all_nosearch.inc
@@ -4,7 +4,7 @@
 <script src="source/javascripts/app/_toc.js"></script>
 <script type="text/javascript">
 $(function() {
-  loadToc($('#toc'), '.toc-link', '.toc-list-h2', 10);
+  loadToc($('#toc'), '.toc-link', '.toc-list-h2, .toc-list-h3, .toc-list-h4, .toc-list-h5, .toc-list-h6', 10);
   setupLanguages($('body').data('languages'));
   $('.content').imagesLoaded( function() {
     recacheHeights();