Add automatic hash generation with redcarpet dev, and change tocify s…

…crollHistory to be compatible with the ids
HerveCaumont · Sep 24, 2013 · 28f442e · 28f442e
1 parent 7ba798c
commit 28f442e
Show file tree

Hide file tree

Showing 6 changed files with 31 additions and 14 deletions.
diff --git a/Gemfile b/Gemfile
@@ -13,7 +13,8 @@ gem 'middleman-gh-pages'
 # Live-reloading plugin
 gem "middleman-livereload", "~> 3.1.0"
 
-gem "redcarpet"
+gem 'redcarpet', git: 'https://github.com/vmg/redcarpet.git'
+
 gem "github-linguist"
 
 # For faster file watcher updates on Windows:

diff --git a/Gemfile.lock b/Gemfile.lock
@@ -1,3 +1,9 @@
+GIT
+  remote: https://github.com/vmg/redcarpet.git
+  revision: 2f27273c10cc2779d539c48d605c4a25eb8e34a3
+  specs:
+    redcarpet (3.0.0)
+
 GEM
   remote: http://rubygems.org/
   specs:
@@ -92,7 +98,6 @@ GEM
       ffi (>= 0.5.0)
     rb-kqueue (0.2.0)
       ffi (>= 0.5.0)
-    redcarpet (3.0.0)
     rouge (0.3.10)
       thor
     ruby18_source_location (0.2)
@@ -123,6 +128,6 @@ DEPENDENCIES
   middleman-gh-pages
   middleman-livereload (~> 3.1.0)
   middleman-syntax
-  redcarpet
+  redcarpet!
   ruby18_source_location
   wdm (~> 0.1.0)
diff --git a/config.rb b/config.rb
@@ -50,7 +50,7 @@
 
 set :markdown_engine, :redcarpet
 
-set :markdown, :fenced_code_blocks => true, :smartypants => true, :disable_indented_code_blocks => true, :prettify => true, :tables => true
+set :markdown, :fenced_code_blocks => true, :smartypants => true, :disable_indented_code_blocks => true, :prettify => true, :tables => true, :with_toc_data => true
 
 # Activate the syntax highlighter
 activate :syntax

diff --git a/source/javascripts/jquery.tocify.js b/source/javascripts/jquery.tocify.js
@@ -388,7 +388,7 @@
 
             // ADDED BY ROBERT
             // actually add the hash value to the element's id
-            self.attr("id", "link-" + hashValue);
+            // self.attr("id", "link-" + hashValue);
 
             // Appends a list item HTML element to the last unordered list HTML element found within the HTML element calling the plugin
             item = $("<li/>", {
@@ -710,7 +710,16 @@
 
                             if(window.location.hash !== "#" + anchorText) {
 
-                                window.location.replace("#" + anchorText);
+                                if(history.replaceState) { 
+                                    history.replaceState({}, "", "#" + anchorText);
+                                // provide a fallback
+                                } else { 
+                                    scrollV = document.body.scrollTop;
+                                    scrollH = document.body.scrollLeft;
+                                    location.hash = "#" + anchorText;
+                                    document.body.scrollTop = scrollV;
+                                    document.body.scrollLeft = scrollH;
+                                }
 
                             }
 

diff --git a/source/layouts/layout.erb b/source/layouts/layout.erb
@@ -26,7 +26,10 @@
           hashGenerator: 'pretty',
           highlightOffset: 60,
           scrollTo: -2,
-          scrollHistory: true
+          scrollHistory: true,
+          hashGenerator: function(text, element) {
+            return element[0].getAttribute('id');
+          }
         });
         setupLanguages([
           <% current_page.data.languages.each do |lang| %>

diff --git a/source/stylesheets/all.css.scss b/source/stylesheets/all.css.scss
@@ -123,7 +123,7 @@ html, body {
 
     th {
       padding: 5px 10px;
-      border-bottom: 1px solid #666;
+      border-bottom: 1px solid #999;
       vertical-align: bottom;
       // @include background-image(linear-gradient(bottom, darken($main-bg, 3%), $main-bg));
       @include embedded-text;
@@ -134,8 +134,12 @@ html, body {
       padding: 10px;
     }
 
+    tr:last-child {
+      border-bottom: 1px solid #999;
+    }
+
     tr:nth-child(even) {
-      background-color: lighten($main-bg,4.2%);
+      background-color: lighten($main-bg,4.7%);
     }
   }
 
@@ -283,8 +287,3 @@ html, body {
       @include fancy-inset-border-bottom;
     }
 }
-
-/* Makes the font smaller for all subheader elements. */
-.tocify-subheader li {
-}
-