Display comments and active thread.

lms/static/coffee/src/discussion/discussion_router.coffee

@@ -6,22 +6,19 @@ class @DiscussionRouter extends Backbone.Router
   initialize: (options) ->
       @user = options['user']
       @discussion = options['discussion']
-      @displayNav()
-      @forum = null
+      @nav = new DiscussionThreadListView(collection: @discussion, el: $(".post-list"))
+      @nav.on "thread:selected", @navigateToThread
+      @nav.render()
 
   allThreads: ->
       true
 
   showThread: (forum_name, thread_id) ->
-    @forum = forum_name
+    @nav.setActiveThread(thread_id)
     thread = @discussion.get(thread_id)
     view = new DiscussionThreadView(el: $(".discussion-column"), model: thread, user: @user)
     view.render()
 
-  displayNav: ->
-    view = new DiscussionThreadListView(collection: @discussion, el: $(".post-list"))
-    view.on "thread:selected", @navigateToThread
-    view.render()
-
   navigateToThread: (thread_id) =>
-    @navigate("#{@forum}/threads/#{thread_id}", trigger: true)
+    thread = @discussion.get(thread_id)
+    @navigate("#{thread.get("commentable_id")}/threads/#{thread_id}", trigger: true)

lms/static/coffee/src/discussion/views/discussion_thread_list_view.coffee

@@ -9,4 +9,10 @@ class @DiscussionThreadListView extends Backbone.View
     @$el.append(view.el)
 
   threadSelected: (thread_id) =>
+    @setActiveThread(thread_id)
     @trigger("thread:selected", thread_id)
+
+  setActiveThread: (thread_id) ->
+    @$("a").removeClass("active")
+    @$("a[data-id='#{thread_id}']").addClass("active")
+

lms/static/coffee/src/discussion/views/discussion_thread_view.coffee

@@ -18,9 +18,20 @@ class @DiscussionThreadView extends Backbone.View
 
     if @user.voted(@model)
       @$(".vote-btn").addClass("is-cast")
-
+    @$("span.timeago").timeago()
+    @renderResponses()
     @
 
+  renderResponses: ->
+    $.ajax @model.id, success: (data, textStatus, xhr) =>
+      comments = new Comments(data['content']['children'])
+      comments.each @renderResponse
+
+  renderResponse: (response) =>
+      view = new ThreadResponseView(model: response)
+      view.render()
+      @$(".responses").append(view.el)
+
   toggleVote: ->
     @$(".vote-btn").toggleClass("is-cast")
     if @$(".vote-btn").hasClass("is-cast")

lms/static/coffee/src/discussion/views/response_comment_view.coffee

@@ -0,0 +1,6 @@
+class @ResponseCommentView extends Backbone.View
+  tagName: "li"
+  template: _.template($("#response-comment-template").html())
+  render: ->
+    @$el.html(@template(@model.toJSON()))
+    @

lms/static/coffee/src/discussion/views/thread_response_view.coffee

@@ -0,0 +1,15 @@
+class @ThreadResponseView extends Backbone.View
+  tagName: "li"
+  template: _.template($("#thread-response-template").html())
+  render: ->
+    @$el.html(@template(@model.toJSON()))
+    @renderComments()
+    @
+
+  renderComments: ->
+      @model.get("comments").each @renderComment
+
+  renderComment: (comment) =>
+    view = new ResponseCommentView(model: comment)
+    view.render()
+    @$(".comments").append(view.el)

lms/templates/discussion/_single_thread.html

@@ -30,4 +30,3 @@
 </article>
 
 <%include file="_js_data.html" />
-<script type="text/javascript">$(document).ready(function() { $("span.timeago").timeago() })</script>

lms/templates/discussion/single_thread.html

@@ -125,8 +125,18 @@
   </article>
 </script>
 
+<script type="text/template" id="thread-response-template">
+  <div class="response-body">${"<%= body %>"}</div>
+  <ol class="comments">
+  </ol>
+</script>
+
+<script type="text/template" id="response-comment-template">
+  <p>${'<%= body %>'}</p>
+</script>
+
 <script type="text/template" id="thread-list-item-template">
-    <a href="${'<%= id %>'}"><span class="title">${"<%= title %>"}</span> <span class="comments-count">${"<%= comments_count %>"}</span><span class="votes-count">+${"<%= votes['up_count'] %>"}</span></a>
+    <a href="${'<%= id %>'}" data-id="${'<%= id %>'}"><span class="title">${"<%= title %>"}</span> <span class="comments-count">${"<%= comments_count %>"}</span><span class="votes-count">+${"<%= votes['up_count'] %>"}</span></a>
 </script>
 
 <script>