From 86009bfcaca86962dc55c665410ec32cc880143e Mon Sep 17 00:00:00 2001
From: Amaia Castro <amaia@amaiac.net>
Date: Wed, 14 Dec 2016 18:51:01 +0100
Subject: [PATCH] Render TOC for legislation draft versions

---
 app/models/legislation/draft_version.rb         |  8 +++++++-
 .../legislation/draft_versions/show.html.erb    | 17 +++++++++++++++--
 2 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/app/models/legislation/draft_version.rb b/app/models/legislation/draft_version.rb
index 0cb0b99fc..562e48cea 100644
--- a/app/models/legislation/draft_version.rb
+++ b/app/models/legislation/draft_version.rb
@@ -11,6 +11,12 @@ class Legislation::DraftVersion < ActiveRecord::Base
   validates :status, presence: true, inclusion: { in: VALID_STATUSES }
 
   def body_in_html
-    body_html || Redcarpet::Markdown.new(Redcarpet::Render::HTML.new).render(body)
+    renderer = Redcarpet::Render::HTML.new(with_toc_data: true)
+    toc_renderer = Redcarpet::Render::HTML_TOC.new(with_toc_data: true)
+
+    body_html = Redcarpet::Markdown.new(renderer).render(body)
+    toc = Redcarpet::Markdown.new(toc_renderer).render(body)
+
+    return toc, body_html
   end
 end
diff --git a/app/views/legislation/draft_versions/show.html.erb b/app/views/legislation/draft_versions/show.html.erb
index b924870c8..3a1ec15cf 100644
--- a/app/views/legislation/draft_versions/show.html.erb
+++ b/app/views/legislation/draft_versions/show.html.erb
@@ -6,7 +6,20 @@
     <%= link_to t('.see_changes'), legislation_process_draft_version_changes_path(@process, @draft_version) %>
   </div>
 
-  <div>
-    <%= @draft_version.body_in_html.html_safe %>
+  <% toc, body = @draft_version.body_in_html %>
+
+  <div class="small-12 medium-3 column">
+    <%= toc.html_safe %>
   </div>
+
+  <div class="small-12 medium-9 column">
+    <section data-annotatable-type="legislation_draft_version"
+             data-annotatable-id="<%= @draft_version.id %>">
+
+      <div id="legislation_draft_version_body">
+        <%= body.html_safe %>
+      </div>
+    </section>
+  </div>
+
 </div>