Merge branch 'feature/tomg/new-discussions' of github.com:MITx/mitx into…

Merge branch 'feature/tomg/new-discussions' of github.com:MITx/mitx into feature/tomg/new-discussions

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

@@ -30,7 +30,7 @@ class @DiscussionThreadListView extends Backbone.View
     windowHeight = $(window).height();
 
     discussionBody = $(".discussion-article")
-    discussionsBodyTop = discussionBody.offset().top;
+    discussionsBodyTop = if discussionBody[0] then discussionBody.offset().top;
     discussionsBodyBottom = discussionsBodyTop + discussionBody.outerHeight();
 
     sidebar = $(".sidebar")
@@ -194,22 +194,23 @@ class @DiscussionThreadListView extends Backbone.View
       return
     event.preventDefault()
 
-    totalItems = $(".browse-topic-drop-menu-wrapper a").length
-    index = $(".browse-topic-drop-menu-wrapper .focused").parent().index()
-    firstShownIndex = $($(".browse-topic-drop-menu-wrapper a").not('.hidden')[0]).parent().index()
+    itemHeight = $(".browse-topic-drop-menu a").outerHeight()
+    items = $.makeArray($(".browse-topic-drop-menu-wrapper a").not(".hidden"))
+    index = items.indexOf($('.browse-topic-drop-menu-wrapper .focused')[0])
 
     if event.which == 40
-      index = index + 1
-    else if event.which == 38
-      index = index - 1
-      while $(".browse-topic-drop-menu-wrapper li").eq(index).find('a').hasClass('hidden')
-        index--;
-    if index == totalItems
-      index = 0
-
-    while $(".browse-topic-drop-menu-wrapper li").eq(index).find('a').hasClass('hidden')
-        index++;
+        index = Math.min(index + 1, items.length - 1)
+    if event.which == 38
+        index = Math.max(index - 1, 0)
 
     $(".browse-topic-drop-menu-wrapper .focused").removeClass("focused")
-    $(".browse-topic-drop-menu-wrapper li").eq(index).find('a').addClass("focused")
-    $(".browse-topic-drop-menu-wrapper").attr("data-focused", index)
+    $(items[index]).addClass("focused")
+
+    scrollTarget = Math.min(index * itemHeight, $(".browse-topic-drop-menu").scrollTop())
+    scrollTarget = Math.max(index * itemHeight - $(".browse-topic-drop-menu").height() + itemHeight, scrollTarget)
+    $(".browse-topic-drop-menu").scrollTop(scrollTarget)
+
+
+
+
+

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

@@ -30,15 +30,16 @@ class @NewPostView extends Backbone.View
     toggleTopicDropdown: (event) ->
         event.stopPropagation()
         if @menuOpen
-            @hideTopicDropdown()
+            @hideTopicDropdown()            
         else
-            @showTopicDropdown()
+            @showTopicDropdown()            
     
     showTopicDropdown: () ->
         @menuOpen = true
         @dropdownButton.addClass('dropped')
         @topicMenu.show()
 
+        $('body').bind 'keydown', @setActiveItem
         $('body').bind 'click', @hideTopicDropdown
 
         # Set here because 1) the window might get resized and things could
@@ -51,6 +52,7 @@ class @NewPostView extends Backbone.View
         @dropdownButton.removeClass('dropped')
         @topicMenu.hide()
 
+        $('body').unbind 'keydown', @setActiveItem
         $('body').unbind 'click', @hideTopicDropdown
 
     setTopic: (event) ->
@@ -156,3 +158,30 @@ class @NewPostView extends Backbone.View
                 #threadView = new ThreadView el: $thread[0], model: thread
                 #thread.updateInfo response.annotated_content_info
                 #@cancelNewPost()
+
+    setActiveItem: (event) ->
+        if event.which == 13
+          $(".topic_menu_wrapper .focused").click()
+          return
+        if event.which != 40 && event.which != 38
+          return
+        event.preventDefault()
+
+        itemHeight = $(".topic_menu_wrapper a").outerHeight()
+        items = $.makeArray($(".topic_menu_wrapper a").not(".hidden"))
+        index = items.indexOf($('.topic_menu_wrapper .focused')[0])
+
+        if event.which == 40
+            index = Math.min(index + 1, items.length - 1)
+        if event.which == 38
+            index = Math.max(index - 1, 0)
+
+        $(".topic_menu_wrapper .focused").removeClass("focused")
+        $(items[index]).addClass("focused")
+
+        scrollTarget = Math.min(index * itemHeight, $(".topic_menu").scrollTop())
+        scrollTarget = Math.max(index * itemHeight - $(".topic_menu").height() + itemHeight, scrollTarget)
+        $(".topic_menu").scrollTop(scrollTarget)
+
+
+

lms/static/js/discussions-temp.js

@@ -123,7 +123,7 @@ function filterDrop(e) {
 	 * single query
 	 */
 
-	var $drop = $(e.target).parents('.form-topic-drop-menu-wrapper, .browse-topic-drop-menu-wrapper');
+	var $drop = $(e.target).parents('.topic_menu_wrapper, .browse-topic-drop-menu-wrapper');
 	var query = $(this).val();
 	var $items = $drop.find('a');
 
@@ -134,7 +134,7 @@ function filterDrop(e) {
 
 	$items.addClass('hidden');
 	$items.each(function(i) {
-		var thisText = $(this).children().not('.unread').text();
+		var thisText = $(this).not('.unread').text();
 		$(this).parents('ul').siblings('a').not('.unread').each(function(i) {
 			thisText = thisText  + ' ' + $(this).text();
 		});
@@ -150,10 +150,10 @@ function filterDrop(e) {
 			$(this).removeClass('hidden');
 
 			// show children
-			$(this).parent().find('a').show();
+			$(this).parent().find('a').removeClass('hidden');
 
 			// show parents
-			$(this).parents('ul').siblings('a').show();
+			$(this).parents('ul').siblings('a').removeClass('hidden');
 		}
 	});
 }

lms/static/sass/_discussion.scss

@@ -303,8 +303,10 @@ body.discussion {
           font-weight: 700;
           line-height: 18px;
           color: #eee;
+          @include transition(none);
 
-          &:hover {
+          &:hover,
+          &.focused {
             background-color: #666;
           }
         }
@@ -1027,6 +1029,7 @@ body.discussion {
 
 
 
+
   .bottom-post-status {
     padding: 30px;
     font-size: 20px;
@@ -1077,6 +1080,10 @@ body.discussion {
       font-size: 12px;
       font-style: italic;
       color: #888;
+
+      span {
+        font-style: italic;
+      }
     }
 
     .post-context{

lms/templates/discussion/_underscore_templates.html

@@ -7,9 +7,13 @@
                 <h1>${'<%- title %>'}</h1>
                 <p class="posted-details">
                     <span class="timeago" title="${'<%- created_at %>'}">${'<%- created_at %>'}</span> by
-                    <a href="${'<%- user_url %>'}">${'<%- username %>'}</a>
+                    <a href="${'<%- user_url %>'}">${'<%- username %>'}</a> 
+                    <span class="post-status-closed top-post-status" style="display: none">
+                      • This thread is closed.
+                    </span>
                 </p>
             </header>
+            
             <div class="post-body">
                 ${'<%- body %>'}
             </div>
@@ -18,9 +22,7 @@
                 (this post is about <a href="../../jump_to/${'<%- courseware_location %>'}">${'<%- courseware_title %>'}</a>)
             </div>
             ${'<% } %>'}
-            <div class="post-status-closed" style="display: none">
-              This thread is closed.
-            </div>
+                        
             <ul class="moderator-actions">
                 <li style="display: none"><a class="action-edit" href="javascript:void(0)"><span class="edit-icon"></span> Edit</a></li>
                 <li style="display: none"><a class="action-delete" href="javascript:void(0)"><span class="delete-icon"></span> Delete</a></li>

lms/templates/discussion/index.html

@@ -28,7 +28,7 @@
         <div class="sidebar"></div>
         <div class="discussion-column">
         	<div class="blank-slate">
-	        	<h1>${course.title} discussion forum</h1>
+	        	<h1>${course.title} discussions</h1>
 
         	</div>
         </div>