apply the new module_sequence_footer to discussion topics

fixes CNVS-8014

test plan:
 - add a discussion topic to a module.
 - navigate to the discussion topic and see the old module
   navigation at the bottom of the page.
 - enable draft state on the account. in the console:
     a = Account.find(your_account_id)
     a.enable_draft!
 - refresh the discussion topic page and see the new module
   navigation at the bottom of the page.
 - create and navigate to a group discussion and make sure
   there are no errors.
 - create a graded group discussion and add it to a module.
 - navigate to the graded group discussion as a teacher and
   make sure the new footer appears.
 - navigate to the graded group discussion as a student, which
   will redirect you to the student's specific group discussion.
   make sure the new footer appears.

Change-Id: Ib380fb6d3390ef3f4f5029349466b1a0e43ff8a1
Reviewed-on: https://gerrit.instructure.com/24201
Reviewed-by: Braden Anderson <banderson@instructure.com>
Tested-by: Jenkins <jenkins@instructure.com>
QA-Review: Cam Theriault <cam@instructure.com>
Product-Review: Jon Willesen <jonw@instructure.com>

Author: Jon Willesen

app/coffeescripts/bundles/discussion.coffee

@@ -14,6 +14,7 @@ require [
   'compiled/views/DiscussionTopic/TopicView'
   'compiled/views/DiscussionTopic/EntriesView'
   'compiled/jquery/sticky'
+  'compiled/jquery/ModuleSequenceFooter'
 ], (EntryView, DiscussionFilterState, DiscussionToolbarView, DiscussionFilterResultsView, MarkAsReadWatcher, $, _, Backbone, Entry, MaterializedDiscussionTopic, SideCommentDiscussionTopic, EntryCollection, TopicView, EntriesView) ->
 
   descendants = 5
@@ -169,6 +170,15 @@ require [
   topicView.render()
   toolbarView.render()
 
+  ##
+  # Add module sequence footer
+  if ENV.DISCUSSION.SEQUENCE?
+    $('#module_sequence_footer').moduleSequenceFooter(
+      assetType: 'Discussion'
+      assetID: ENV.DISCUSSION.SEQUENCE.ASSET_ID
+      courseID: ENV.DISCUSSION.SEQUENCE.COURSE_ID
+      )
+
   ##
   # Get the party started
   if ENV.DISCUSSION.INITIAL_POST_REQUIRED

app/coffeescripts/jquery/ModuleSequenceFooter.coffee

@@ -37,8 +37,6 @@ define [
         throw 'Option must be set with assetType and assetID'
         return
 
-      @addClass 'module-sequence-footer clearfix'
-
       # After fetching, @msfInstance will have the following
       # @hide: bool
       # @previous: Object

app/controllers/discussion_topics_controller.rb

@@ -355,6 +355,12 @@ def show
               :INITIAL_POST_REQUIRED => @initial_post_required,
               :THREADED => @topic.threaded?
             }
+            if @sequence_asset
+              env_hash[:SEQUENCE] = {
+                :ASSET_ID => @sequence_asset.id,
+                :COURSE_ID => @sequence_asset.context.id,
+              }
+            end
             if @topic.for_assignment? &&
                @topic.assignment.grants_right?(@current_user, session, :grade) && @presenter.allows_speed_grader?
               env_hash[:SPEEDGRADER_URL_TEMPLATE] = named_context_url(@topic.assignment.context,

app/stylesheets/base/module_sequence_footer.scss

@@ -1,22 +1,27 @@
 $bar-background: #eff2f5;
+$bar-height: 55px;
 $button-border-line: #d4d6d9;
 $top-bar-border: #bdc1c5;
 $top-bar-shadow: #dcdee0;
 $text: #3a4651;
 $button-hover: #dee5ea;
 
+.module-sequence-padding{
+  height: $bar-height;
+}
+
 .module-sequence-footer{
   background: $bar-background;
   position: absolute;
   left:0px;
   right:0px;
   bottom:0px;
-  height: 55px;
+  height: $bar-height;
   border-top: 1px solid $top-bar-border;
   box-shadow: inset 0px 1px 0px 0px $top-bar-shadow;
 
   a{
-    line-height: 55px;
+    line-height: $bar-height;
     font-weight: bold;
     color: $text;
     border-right: 1px solid $button-border-line;

app/views/discussion_topics/show.html.erb

@@ -246,9 +246,14 @@
 
 </div>
 
-<%=
-  render :partial => "shared/sequence_footer", :locals => {:asset => @sequence_asset, :context => @sequence_asset.context} if @sequence_asset
-%>
+<% if @context.draft_state_enabled? && @headers != false %>
+  <div id="module_sequence_footer"></div>
+<% else %>
+  <%=
+    render :partial => "shared/sequence_footer", :locals => {:asset => @sequence_asset, :context => @sequence_asset.context} if @sequence_asset
+  %>
+<% end %>
+
 <% if !@headers %>
   </div>
 <% end %>

app/views/jst/jquery/ModuleSequenceFooter.handlebars

@@ -1,7 +1,10 @@
+<div class='module-sequence-padding'></div>
+<div class='module-sequence-footer clearfix'>
 {{#if previous.show}}
   <a href="{{previous.url}}" class="pull-left" data-tooltip title="{{previous.tooltip}}"><i class="icon-mini-arrow-left"></i>&nbsp;{{#t 'previous'}}Previous{{/t}}</a>
 {{/if}}
 
 {{#if next.show}}
   <a href="{{next.url}}" class="pull-right bordered" data-tooltip title="{{next.tooltip}}">{{#t 'next'}}Next{{/t}}&nbsp;<i class="icon-mini-arrow-right"></i></a>
 {{/if}}
+</div>