Merge pull request #602 from docker/htmltre

Pre-render left nav so it's immediately visible

_includes/tree.html

@@ -1,4 +1,4 @@
-{% for item in tree %}{% if item.heading %}{% else %}{% if item.sectiontitle %}<li class="leaf menu-closed"><a href="/" class="expand-menu "><span class="menu-icon" aria-hidden="true"></span>{{ item.sectiontitle }}</a>
+{% for item in tree %}{% if item.heading %}{% else %}{% if item.sectiontitle %}<li class="leaf menu-closed"><a href="#" class="expand-menu "><span class="menu-icon" aria-hidden="true"></span>{{ item.sectiontitle }}</a>
 <ul class="nav-sub">
   {% assign tree = item.section %}{% include tree.html %}
 </ul>

_layouts/docs.html

@@ -187,7 +187,8 @@ ng\:form {
           <div class="row">
             <div class="col-xs-12 col-sm-3 col-md-2 col-xl-2 docsidebarnav_section">
               <div class="region region-hero-sub"><ul class="nav-sub">
-
+								{% assign tree = site.data.toc.toc %}
+								{% include tree.html %}
 							</ul>
               </div>
             </div>

js/menu.js

@@ -1,26 +1,4 @@
 var tocData;
-var treeOutput = new Array();
-function renderTree(tree)
-{
-  for (var i=0; i < tree.length; i++)
-  {
-    if (tree[i].heading)
-    {
-      // render a heading
-    } else {
-      if (tree[i].sectiontitle) {
-        treeOutput.push('<li class="leaf menu-closed"><a href="#" class="expand-menu "><span class="menu-icon" aria-hidden="true"></span>' + tree[i].sectiontitle + '</a>');
-        treeOutput.push('<ul class="nav-sub">');
-        renderTree(tree[i].section);
-        treeOutput.push('</ul>');
-      } else {
-        treeOutput.push('<li class="leaf"><a href="' + tree[i].path +'" class="');
-        if (tree[i].path == window.location.pathname) treeOutput.push('active currentPage');
-        treeOutput.push('">' + tree[i].title + '</a></li>');
-      }
-    }
-  }
-}
 function hookupTOCEvents()
 {
   // do after tree render
@@ -41,12 +19,7 @@ function hookupTOCEvents()
   });
 }
 jQuery(document).ready(function(){
-    $.getJSON( "/toc.txt", function( data ) {
-      tocData = data;
-      renderTree(data.toc);
-      $(".nav-sub").html(treeOutput.join(''));
-      hookupTOCEvents();
-    });
+    hookupTOCEvents();
     $("#TableOfContents ul").empty();
 
     var prevH2Item = null;

toc.txt

@@ -1,4 +0,0 @@
----
-layout: null
----
-{{ site.data.toc | jsonify }}