separate chapter items into its own template, for reuse inside of pop-out navigation. add active classes to current chapter and item.

Author: ajpiano

layouts/chapter_contents.html

@@ -0,0 +1,9 @@
+<% myFolder = @item[:filename].split('/')[1] %>
+<% folderItems = @items.group_by {|item| item[:filename].split('/')[1] } %>
+<ul>
+  <% folderItems[ myFolder ].sort_by {|i| i[:section] || 0 }. each do |i| %>
+    <% if i[:title] && !(i[:filename] =~ /\/dex\.md$/) %>
+    <li <% if item[:filename] == i[:filename] %>class="active"<% end %>><a href="<%= i.path %>"><%= i[:title] %></a></li>
+    <% end %>
+  <% end %>
+</ul>

layouts/dex.html

@@ -11,15 +11,8 @@ <h2 class="title"><%= @item[:title] %></h2>
 
 			<%= yield %>
 
-			<% myFolder = @item[:filename].split('/')[1] %>
-			<% folderItems = @items.group_by {|item| item[:filename].split('/')[1] } %>
-			<ul>
-				<% folderItems[ myFolder ].sort_by {|item| item[:section] || 0 }. each do |item| %>
-					<% if item[:title] && !(item[:filename] =~ /\/dex\.md$/) %>
-					<li><a href="<%= item.path %>"><%= item[:title] %></a></li>
-					<% end %>
-				<% end %>
-			</ul>
+                        <%= render 'chapter_contents' %>
+
 		</div>
 
 		<%= render 'sidebar' %>

layouts/sidebar.html

@@ -1,10 +1,10 @@
 <!-- sidebar -->
 <aside id="sidebar" class="clearfix autoHeight">
-	
-	<h2>Categories</h2>
-	<hr>
-	
-	<ul class="nav">
+        
+        <h2>Categories</h2>
+        <hr>
+        
+        <ul class="nav">
           <% chapters = [ 
             "getting-started",
             "javascript-101",
@@ -19,21 +19,20 @@ <h2>Categories</h2>
             "custom-events",
             "how-to"
           ] %>
-	<% folders = @items.group_by {|item| item[:filename].split('/')[1] } %>
-	<% chapters.each do |section| %>
-            <li><a href="/<%= section %>"><%= section.gsub(/-/, " ").upcase %></a></li>
-	<% end %>
-	</ul>
-	
-	<div class="paper subnav">
-		<div class="shadow"></div>
-		<a href="#" class="paper_edges">Open</a>
-		<div class="inner">
-			<ul>
-			<li></li>
-			</ul>
-		</div>
-	</div>
-	
+        <% currentChapter = @item[:filename].split('/')[1] %>
+        <% folders = @items.group_by {|item| item[:filename].split('/')[1] } %>
+        <% chapters.each do |chapter| %>
+          <li <% if chapter == currentChapter %>class="active"<% end %>><a href="/<%= chapter %>"><%= chapter.gsub(/-/, " ").upcase %></a></li>
+        <% end %>
+        </ul>
+        
+        <div class="paper subnav">
+                <div class="shadow"></div>
+                <a href="#" class="paper_edges">Open</a>
+                <div class="inner">
+                  <%= render 'chapter_contents' %>
+                </div>
+        </div>
+        
 </aside>
 <!-- sidebar -->