Sidebar positioning and height.

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

@@ -14,6 +14,7 @@ class @DiscussionRouter extends Backbone.Router
       @newPostView.on "thread:created", @navigateToThread
 
   allThreads: ->
+    @nav.updateSidebar()
     # TODO: Do something reasonable here
     # $(".discussion-column").html($('#blank-slate-template').html())
 
@@ -29,6 +30,8 @@ class @DiscussionRouter extends Backbone.Router
 
     @main = new DiscussionThreadView(el: $(".discussion-column"), model: @thread)
     @main.render()
+    @main.on "thread:responses:rendered", =>
+      @nav.updateSidebar()
 
   navigateToThread: (thread_id) =>
     thread = @discussion.get(thread_id)

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

@@ -11,9 +11,44 @@ class @DiscussionThreadListView extends Backbone.View
   initialize: ->
     @displayedCollection = new Discussion(@collection.models)
     @collection.on "change", @reloadDisplayedCollection
+    @sidebar_padding = 10
+    @sidebar_header_height = 87
 
   reloadDisplayedCollection: =>
     @displayedCollection.reset(@collection.models)
+    @updateSidebar()
+
+  updateSidebar: =>
+
+    scrollTop = $(window).scrollTop();
+    windowHeight = $(window).height();
+
+    $discussionBody = $(".discussion-body")
+    discussionsBodyTop = $discussionBody.offset().top;
+    discussionsBodyBottom = discussionsBodyTop + $discussionBody.height();
+
+    $sidebar = $(".sidebar")
+    if scrollTop > discussionsBodyTop - @sidebar_padding
+        $sidebar.addClass('fixed');
+        $sidebar.css('top', @sidebar_padding);
+    else
+        $sidebar.removeClass('fixed');
+        $sidebar.css('top', '0');
+
+    sidebarWidth = .32 * $discussionBody.width() - 10;
+    $sidebar.css('width', sidebarWidth + 'px');
+
+    sidebarHeight = windowHeight - Math.max(discussionsBodyTop - scrollTop, @sidebar_padding)
+
+    topAmount = scrollTop + windowHeight
+    bottomAmount = discussionsBodyBottom + @sidebar_padding
+    amount = Math.max(topAmount - bottomAmount, 0)
+
+    sidebarHeight = sidebarHeight - @sidebar_padding - amount
+    $sidebar.css 'height', Math.max(sidebarHeight, 400)
+
+    $postListWrapper = @$('.post-list-wrapper')
+    $postListWrapper.css('height', (sidebarHeight - @sidebar_header_height - 4) + 'px');
 
 
   # Because we want the behavior that when the body is clicked the menu is
@@ -25,6 +60,10 @@ class @DiscussionThreadListView extends Backbone.View
   render: ->
     @timer = 0
     @$el.html(@template())
+
+    $(window).bind "scroll", @updateSidebar
+    $(window).bind "resize", @updateSidebar
+
     @displayedCollection.on "reset", @renderThreads
     @renderThreads()
     @

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

@@ -54,6 +54,7 @@ class @DiscussionThreadView extends DiscussionContentView
         Content.loadContentInfos(data['annotated_content_info'])
         comments = new Comments(data['content']['children'])
         comments.each @renderResponse
+        @trigger "thread:responses:rendered"
 
   renderResponse: (response) =>
       view = new ThreadResponseView(model: response)

lms/static/js/discussions-temp.js

@@ -67,13 +67,13 @@ $(document).ready(function() {
 
 	$body.delegate('.browse-topic-drop-search-input, .form-topic-drop-search-input', 'keyup', filterDrop);
 
-	$(window).bind('resize', updateSidebar);
-	$(window).bind('scroll', updateSidebar);
-  $('.discussion-column').bind("input", function (e) {
-    console.log("resized");
-	  updateSidebar();
-  })
-	updateSidebar();
+// 	$(window).bind('resize', updateSidebar);
+// 	$(window).bind('scroll', updateSidebar);
+//   $('.discussion-column').bind("input", function (e) {
+//     console.log("resized");
+// 	  updateSidebar();
+//   })
+// 	updateSidebar();
 });
 
 function filterDrop(e) {