Show and hide search correctly. Added loading icon.

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

@@ -17,6 +17,7 @@ if Backbone?
       @sidebar_header_height = 87
       @boardName
       @template = _.template($("#thread-list-template").html())
+      @current_search = ""
 
     reloadDisplayedCollection: (thread) =>
       thread_id = thread.get('id')
@@ -133,6 +134,9 @@ if Backbone?
       @$("a[data-id='#{thread_id}']").addClass("active")
 
     showSearch: ->
+      @$(".browse").removeClass('is-dropped')
+      @hideTopicDrop()
+
       @$(".search").addClass('is-open')
       @$(".browse").removeClass('is-open')
       setTimeout (-> @$(".post-search-field").focus()), 200
@@ -142,16 +146,21 @@ if Backbone?
       @$(".search").removeClass('is-open')
       @$(".browse").addClass('is-open')
       @$(".browse").toggleClass('is-dropped')
+
       if @$(".browse").hasClass('is-dropped')
         @$(".browse-topic-drop-menu-wrapper").show()
         $(".browse-topic-drop-search-input").focus()
         $("body").bind "click", @toggleTopicDrop
         $("body").bind "keydown", @setActiveItem
       else
+        @hideTopicDrop()
+
+    hideTopicDrop: ->
       @$(".browse-topic-drop-menu-wrapper").hide()
       $("body").unbind "click", @toggleTopicDrop
       $("body").unbind "keydown", @setActiveItem
 
+
     setTopic: (event) ->
       item = $(event.target).closest('a')
       boardName = item.find(".board-name").html()
@@ -195,6 +204,10 @@ if Backbone?
       return name
 
     filterTopic: (event) ->
+      if @current_search != ""
+        @setTopic(event)
+        @clearSearch @filterTopic, event
+      else
         @setTopic(event)
         item = $(event.target).closest('li')
         if item.find("span.board-name").data("discussion_id") == "#all"
@@ -219,13 +232,23 @@ if Backbone?
     performSearch: (event) ->
       if event.which == 13
         event.preventDefault()
-        url = DiscussionUtil.urlFor("search")
         text = @$(".post-search-field").val()
+        @searchFor(text)
+
+    searchFor: (text, callback, value) ->
+      @current_search = text
+      url = DiscussionUtil.urlFor("search")
       DiscussionUtil.safeAjax
         $elem: @$(".post-search-field")
         data: { text: text }
         url: url
         type: "GET"
+        $loading: $
+        loadingCallback: =>
+          @$(".post-list").html('<li class="loading"><div class="loading-animation"></div></li>')
+        loadedCallback: =>
+          if callback
+            callback.apply @, [value]
         success: (response, textStatus) =>
           if textStatus == 'success'
             @collection.reset(response.discussion_data)
@@ -235,6 +258,10 @@ if Backbone?
             # so this would probably be necessary anyway
             @displayedCollection.reset(@collection.models)
 
+    clearSearch: (callback, value) ->
+      @$(".post-search-field").val("")
+      @searchFor("", callback, value)
+
     setActiveItem: (event) ->
       if event.which == 13
         $(".browse-topic-drop-menu-wrapper .focused").click()

lms/static/sass/_discussion.scss

@@ -1006,6 +1006,9 @@ body.discussion {
 
   .post-list {
     background-color: #ddd;
+    .loading {
+      padding: 15px 0;
+    }
 
     a {
       position: relative;