Site index dropdown contains categories like on docs.step

Author: tjgrathwell

lib/site_index.rb

@@ -2,11 +2,24 @@ class SiteIndex < Erector::Widget
   needs :site_name, :locale
   attr_accessor :site_name
 
+  def categorized_sites
+    {
+      'setup' => ['installfest'],
+      'rails' => ['intro-to-rails', 'job-board', 'intermediate-rails'],
+      'frontend' => ['frontend', 'intro-to-javascript'],
+      'ruby' => ['learn-to-code', 'ruby']
+    }
+  end
+
   def sites
     return @sites if @sites
     @sites = Dir.glob("#{Site.sites_dir(@locale)}/**").map { |filename| File.basename(filename) }.sort
   end
 
+  def site_category category
+    li Titleizer.title_for_page(category), class: 'category'
+  end
+
   def site_link site
     if site == site_name
       return li Titleizer.title_for_page(site_name), class: 'current'
@@ -20,7 +33,14 @@ def site_link site
 
   def content
     ul :class => "dropdown-menu" do
-      sites.each do |site|
+      categorized_sites.each do |category, category_sites|
+        site_category category
+        category_sites.each do |site|
+          site_link site
+        end
+      end
+      site_category I18n.t('sites.other_categories')
+      (sites - categorized_sites.values.flatten).each do |site|
         site_link site
       end
     end

locales/en.yml

@@ -29,3 +29,6 @@ en:
     challenge: "Challenge(s)"
     tools_and_references: "Tools and References"
     requirements: "Requirements to advance"
+
+  sites:
+    other_categories: Other Stuff

public/css/header.scss

@@ -54,6 +54,10 @@ nav *, nav *:before, nav *:after {
       font-weight: bold;
       color: #333;
     }
+    &.category {
+      padding: 0 5px;
+      font-weight: bold;
+    }
 
     a {
       color: #333;

spec/site_index_spec.rb

@@ -13,6 +13,10 @@
     @site_index.sites.should =~  all_sites
   end
 
+  it "only references existing sites in the 'categorized_sites' method" do
+    @site_index.sites.should include(*@site_index.categorized_sites.values.flatten)
+  end
+
   it "emboldens the current site, links other sites" do
     index_html = Nokogiri.parse(@site_index.to_html)