78 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			78 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!-- https://stackoverflow.com/a/34481639 -->
 | |
| <!-- Generate a nice TOC -->
 | |
| <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
 | |
| <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
 | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tocify/1.9.0/javascripts/jquery.tocify.min.js"></script>
 | |
| <!-- We do not need the tocify CSS because the asciidoc CSS already provides most of what we neeed -->
 | |
| 
 | |
| <style>
 | |
| .tocify-header {
 | |
|     font-style: italic;
 | |
| }
 | |
| 
 | |
| .tocify-subheader {
 | |
|     font-style: normal;
 | |
|     font-size: 90%;
 | |
| }
 | |
| 
 | |
| .tocify ul {
 | |
|     margin: 0;
 | |
|  }
 | |
| 
 | |
| .tocify-focus {
 | |
|     color: #7a2518; 
 | |
|     background-color: rgba(0, 0, 0, 0.1);
 | |
| }
 | |
| 
 | |
| .tocify-focus > a {
 | |
|     color: #7a2518; 
 | |
| }
 | |
| </style>
 | |
| 
 | |
| <script type="text/javascript">
 | |
|     $(function () {
 | |
|         // Add a new container for the tocify toc into the existing toc so we can re-use its
 | |
|         // styling
 | |
|         $("#toc").append("<div id='generated-toc'></div>");
 | |
|         $("#generated-toc").tocify({
 | |
|             extendPage: true,
 | |
|             context: "#content",
 | |
|             highlightOnScroll: true,
 | |
|             hideEffect: "slideUp",
 | |
|             // Use the IDs that asciidoc already provides so that TOC links and intra-document
 | |
|             // links are the same. Anything else might confuse users when they create bookmarks.
 | |
|             hashGenerator: function(text, element) {
 | |
|                 return $(element).attr("id");
 | |
|             },
 | |
|             // Smooth scrolling doesn't work properly if we use the asciidoc IDs
 | |
|             smoothScroll: false,
 | |
|             // Set to 'none' to use the tocify classes
 | |
|             theme: "none",
 | |
|             // Handle book (may contain h1) and article (only h2 deeper)
 | |
|             selectors: $( "#content" ).has( "h1" ).size() > 0 ? "h1,h2,h3,h4,h5" : "h2,h3,h4,h5",
 | |
|             ignoreSelector: ".discrete"
 | |
|         });
 | |
| 
 | |
|         // Switch between static asciidoc toc and dynamic tocify toc based on browser size
 | |
|         // This is set to match the media selectors in the asciidoc CSS
 | |
|         // Without this, we keep the dynamic toc even if it is moved from the side to preamble
 | |
|         // position which will cause odd scrolling behavior
 | |
|         var handleTocOnResize = function() {
 | |
|             if ($(document).width() < 768) {
 | |
|                 $("#generated-toc").hide();
 | |
|                 $(".sectlevel0").show();
 | |
|                 $(".sectlevel1").show();
 | |
|             }
 | |
|             else {
 | |
|                 $("#generated-toc").show();
 | |
|                 $(".sectlevel0").hide();
 | |
|                 $(".sectlevel1").hide();
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         $(window).resize(handleTocOnResize);
 | |
|         handleTocOnResize();
 | |
|     });
 | |
| </script>
 | |
| 
 |