integrated search; refactored some frontend code

common/lib/xmodule/xmodule/discussion_module.py

@@ -11,10 +11,11 @@ from datehelper import time_ago_in_words
 class DiscussionModule(XModule):
     def get_html(self):
         context = {
-            'threads': comment_client.get_threads(self.discussion_id, recursive=True),
+            'threads': comment_client.get_threads(self.discussion_id, recursive=False),
             'time_ago_in_words': time_ago_in_words,
             'parse': dateutil.parser.parse,
-            'commentable_id': self.discussion_id,
+            'discussion_id': self.discussion_id,
+            'search_bar': '',
         }
         return self.system.render_template('discussion/inline.html', context)
 

lms/static/coffee/src/discussion.coffee

 $ ->
 
-  #DEBUG = true
-  DEBUG = false
-
   if $('#accordion').length
     active = $('#accordion ul:has(li.active)').index('#accordion ul')
     $('#accordion').bind('accordionchange', @log).accordion
@@ -10,84 +7,14 @@ $ ->
       header: 'h3'
       autoHeight: false
     $('#open_close_accordion a').click @toggle
-
     $('#accordion').show()
 
-  $(".discussion-title").click ->
-    $thread = $(this).parent().children(".thread")
-    if $thread.css("display") == "none"
-      $thread.show()
-    else
-      $thread.hide()
-
-  $(".thread-title").click ->
-    $comments = $(this).parent().parent().children(".comments")
-    if $comments.css("display") == "none"
-      $comments.show()
-    else
-      $comments.hide()
-
-  getDiscussionContentLink = ($elem, selector) ->
-    $elem.children(".discussion-content-view").children(".info").children(selector)
-
-  discussionContentHoverIn = ->
-    status = $(this).attr("status") || "normal"
-    if status == "normal"
-      getDiscussionContentLink($(this), ".discussion-link").show()
-    else if status == "reply"
-      getDiscussionContentLink($(this), ".discussion-cancel-reply").show()
-      getDiscussionContentLink($(this), ".discussion-submit-reply").show()
-    else if status == "edit"
-      getDiscussionContentLink($(this), ".discussion-cancel-edit").show()
-      getDiscussionContentLink($(this), ".discussion-update-edit").show()
-
-  discussionContentHoverOut = ->
-    getDiscussionContentLink($(this), ".discussion-link").hide()
-
-  $(".discussion-content").hover(discussionContentHoverIn, discussionContentHoverOut)
-
-  $(".discussion-reply").click ->
-    handleReply(this)
-
-  $(".discussion-cancel-reply").click ->
-    handleCancelReply(this)
-
-  $(".discussion-new-post").click ->
-    handleSubmitNewThread(this)
-
-  discussionLink = (cls, txt, handler) ->
-    $("<a>").addClass("discussion-link").
-             attr("href", "javascript:void(0)").
-             addClass(cls).html(txt).
-             click(-> handler(this))
-
-  handleReply = (elem) ->
-    discussionContent = $(elem).parents(".discussion-content")
-    editView = discussionContent.children(".discussion-content-edit")
-    if editView.length
-      editView.show()
-    else
-      editView = $("<div>").addClass("discussion-content-edit")
-      editView.append($("<textarea>").addClass("comment-edit"))
-      $(elem).parents(".discussion-content").append(editView)
-    cancelReply = discussionLink("discussion-cancel-reply", "Cancel", handleCancelReply)
-    submitReply = discussionLink("discussion-submit-reply", "Submit", handleSubmitReply)
-    $(elem).parents(".info").children(".discussion-link").hide()
-    $(elem).after(submitReply).replaceWith(cancelReply)
-    discussionContent.attr("status", "reply")
-
-  handleCancelReply = (elem) ->
-    discussionContent = $(elem).parents(".discussion-content")
-    editView = discussionContent.children(".discussion-content-edit")
-    if editView.length
-      editView.hide()
-    getDiscussionContentLink(discussionContent, ".discussion-submit-reply").remove()
-    reply = discussionLink("discussion-reply", "Reply", handleReply)
-    $(elem).parents(".info").children(".discussion-link").show()
-    $(elem).replaceWith(reply)
-    discussionContent.attr("status", "normal")
-
-  urlFor = (name, param) ->
+  $("section.discussion").each (index, discussion) ->
+    Discussion.bindDiscussionEvents(discussion)
+
+Discussion =
+
+  urlFor: (name, param) ->
     {
       create_thread      : "/discussions/#{param}/threads/create"
       update_thread      : "/discussions/threads/#{param}/update"
@@ -101,44 +28,119 @@ $ ->
       downvote_comment   : "/discussions/comments/#{param}/downvote"
       upvote_thread      : "/discussions/threads/#{param}/upvote"
       downvote_thread    : "/discussions/threads/#{param}/downvote"
+      search             : "/discussions/forum/search"
     }[name]
 
-  handleSubmitReply = (elem) ->
-    $div = $(elem).parents(".discussion-content").parent()
-    if $div.hasClass("thread")
-      url = urlFor('create_comment', $div.attr("_id"))
-    else if $div.hasClass("comment")
-      url = urlFor('create_sub_comment', $div.attr("_id"))
-    else
-      return
-    $edit = $div.children(".discussion-content").find(".comment-edit")
-    body = $edit.val()
-    $.post url, {body: body}, (response, textStatus) ->
-      if textStatus == "success"
-        handleAnchorAndReload(response)
-      console.log response
-      console.log textStatus
-    , 'json'
-
-  handleSubmitNewThread = (elem) ->
-    $div = $(elem).parent()
-    title = $div.find(".new-post-title").val()
-    body = $div.find(".new-post-body").val()
-    url = urlFor('create_thread', $div.attr("_id"))
-    $.post url, {title: title, body: body}, (response, textStatus) ->
-      if textStatus == "success"
-        handleAnchorAndReload(response)
-      console.log response
-      console.log textStatus
-    , 'json'
-
-  handleSubmitUpdate = (elem) ->
-
-  handleSubmitVote = (elem) ->
-
-  console.log window.location.pathname
-
-  handleAnchorAndReload = (response) ->
-    if not DEBUG
-      window.location = window.location.pathname + "#" + response['id']
-      window.location.reload()
+  handleAnchorAndReload: (response) ->
+    window.location = window.location.pathname + "#" + response['id']
+    window.location.reload()
+
+  bindContentEvents: (content) ->
+
+    $content = $(content)
+    $discussionContent = $content.children(".discussion-content")
+    $local = (selector) -> $discussionContent.find(selector)
+
+    discussionContentHoverIn = ->
+      status = $discussionContent.attr("status") || "normal"
+      if status == "normal"
+        $local(".discussion-link").show()
+      else if status == "reply"
+        $local(".discussion-cancel-reply").show()
+        $local(".discussion-submit-reply").show()
+      else if status == "edit"
+        $local(".discussion-cancel-edit").show()
+        $local(".discussion-update-edit").show()
+
+    discussionContentHoverOut = ->
+      $local(".discussion-link").hide()
+
+    $discussionContent.hover(discussionContentHoverIn, discussionContentHoverOut)
+
+    generateDiscussionLink = (cls, txt, handler) ->
+      $("<a>").addClass("discussion-link").
+               attr("href", "javascript:void(0)").
+               addClass(cls).html(txt).
+               click(-> handler(this))
+
+    handleReply = (elem) ->
+      editView = $local(".discussion-content-edit")
+      if editView.length
+        editView.show()
+      else
+        editView = $("<div>").addClass("discussion-content-edit")
+        editView.append($("<textarea>").addClass("comment-edit"))
+        $discussionContent.append(editView)
+      cancelReply = generateDiscussionLink("discussion-cancel-reply", "Cancel", handleCancelReply)
+      submitReply = generateDiscussionLink("discussion-submit-reply", "Submit", handleSubmitReply)
+      $local(".discussion-link").hide()
+      $(elem).after(submitReply).replaceWith(cancelReply)
+      $discussionContent.attr("status", "reply")
+
+    handleCancelReply = (elem) ->
+      editView = $local(".discussion-content-edit")
+      if editView.length
+        editView.hide()
+      $local(".discussion-submit-reply").remove()
+      reply = generateDiscussionLink("discussion-reply", "Reply", handleReply)
+      $local(".discussion-link").show()
+      $(elem).replaceWith(reply)
+      $discussionContent.attr("status", "normal")
+
+    handleSubmitReply = (elem) ->
+      if $content.hasClass("thread")
+        url = Discussion.urlFor('create_comment', $content.attr("_id"))
+      else if $content.hasClass("comment")
+        url = Discussion.urlFor('create_sub_comment', $content.attr("_id"))
+      else
+        return
+      body = $local(".comment-edit").val()
+      $.post url, {body: body}, (response, textStatus) ->
+        if textStatus == "success"
+          Discussion.handleAnchorAndReload(response)
+      , 'json'
+
+    $local(".discussion-reply").click ->
+      handleReply(this)
+
+    $local(".discussion-cancel-reply").click ->
+      handleCancelReply(this)
+
+  bindDiscussionEvents: (discussion) ->
+    $discussion = $(discussion)
+    $discussionNonContent = $discussion.children(".discussion-non-content")
+    $local = (selector) -> $discussionNonContent.find(selector)
+
+    handleSearch = (text, isSearchWithinBoard) ->
+      if text.length
+        if $local(".discussion-search-within-board").is(":checked")
+          window.location = window.location.pathname + '?text=' + encodeURI(text)
+        else
+          window.location = Discussion.urlFor('search') + '?text=' + encodeURI(text)
+
+    handleSubmitNewThread = (elem) ->
+      title = $local(".new-post-title").val()
+      body = $local(".new-post-body").val()
+      url = Discussion.urlFor('create_thread', $local(".new-post-form").attr("_id"))
+      $.post url, {title: title, body: body}, (response, textStatus) ->
+        if textStatus == "success"
+          Discussion.handleAnchorAndReload(response)
+      , 'json'
+    
+    $local(".discussion-search-form").submit (event) ->
+      event.preventDefault()
+      text = $local(".discussion-search-text").val()
+      isSearchWithinBoard = $local(".discussion-search-within-board").is(":checked")
+      handleSearch(text, isSearchWithinBoard)
+
+    $local(".discussion-new-post").click ->
+      handleSubmitNewThread(this)
+
+    $local(".discussion-search").click ->
+      $local(".new-post-form").submit()
+
+    $discussion.find(".thread").each (index, thread) ->
+      Discussion.bindContentEvents(thread)
+
+    $discussion.find(".comment").each (index, comment) ->
+      Discussion.bindContentEvents(comment)

lms/static/sass/_discussion.scss

@@ -24,6 +24,19 @@ $discussion_input_width: 60%;
 }
 
 .discussion {
+  .discussion-search-form {
+    margin-bottom: 40px;
+    .discussion-search {
+      @include discussion-font;
+      color: #1d9dd9;
+      display: block;
+      margin-top: 10px;
+      font-weight: bold;
+    }
+    .discussion-search-text {
+      @include discussion-font;
+    }
+  }
   .discussion-title {
     @include discussion-font;
     @include discussion-clickable;

lms/templates/course_navigation.html

@@ -15,7 +15,7 @@ def url_class(url):
       <li class="info"><a href="${reverse('info', args=[course.id])}" class="${url_class('info')}">Course Info</a></li>
 % if user.is_authenticated():
       <li class="book"><a href="${reverse('book', args=[course.id])}" class="${url_class('book')}">Textbook</a></li>
-      <li class="discussion"><a href="${reverse('django_comment_client.forum.views.forum_form_discussion', args=[course.id.replace('/', '-'), 'general'])}" class="${url_class('discussion')}">Discussion</a></li>
+      <li class="discussion"><a href="${reverse('django_comment_client.forum.views.forum_form_discussion', args=[course.id.replace('/', '-'), course.id.replace('/', '_').replace('.', '_')])}" class="${url_class('discussion')}">Discussion</a></li>
 % endif
       <li class="wiki"><a href="${reverse('wiki_root', args=[course.id])}" class="${url_class('wiki')}">Wiki</a></li>
 % if user.is_authenticated():

lms/templates/discussion/accordion.html

@@ -2,10 +2,7 @@
 
 <%
 def url_for(board):
-  if board['category'] == 'General':
-    return reverse('django_comment_client.forum.views.forum_form_discussion', args=[course.id.replace('/', '-'), 'general'])
-  else:
-    return reverse('django_comment_client.forum.views.forum_form_discussion', args=[course.id.replace('/', '-'), board['discussion_id']])
+  return reverse('django_comment_client.forum.views.forum_form_discussion', args=[course.id.replace('/', '-'), board['discussion_id']])
 %>
 
 <%def name="make_category(category, boards)">

lms/templates/discussion/index.html

@@ -15,7 +15,7 @@
 </script>
 </%block>
 
-<%include file="../course_navigation.html" args="active_page='discussion'" />
+##<%include file="../course_navigation.html" args="active_page='discussion'" />
 
 <section class="container">
   <div class="course-wrapper">

lms/templates/discussion/inline.html

+<%! from django.core.urlresolvers import reverse %>
+
+<%
+def url_for(thread_id):
+  return reverse('django_comment_client.forum.views.single_thread', args=[thread_id])
+%>
+
+
+
 <section class="discussion">
-  <a class="discussion-title" href="javascript:void(0)">Discussion</a>
-  <div class="new-post-form" _id="${commentable_id}">
-    <input type="text" class="new-post-title" placeholder="Title"/>
-    <textarea class="new-post-body"></textarea>
-    <a class="discussion-new-post" href="javascript:void(0)">New Post</a>
+  <div class="discussion-non-content">
+    <a class="discussion-title" href="javascript:void(0)">Discussion</a>
+    ${search_bar}
+    <form class="new-post-form" _id="${discussion_id}">
+      <input type="text" class="new-post-title" placeholder="Title"/>
+      <textarea class="new-post-body"></textarea>
+      <a class="discussion-new-post" href="javascript:void(0)">New Post</a>
+    </form>
   </div>
   % for thread in threads:
-    <div class="thread" _id="${thread['id']}">
-      <div class="discussion-content">
-        <a class="thread-title" name="${thread['id']}" href="javascript:void(0)">${thread['title']}</a>
-        <div class="discussion-content-view">
-          <div class="thread-body">${thread['body']}</div>
-          <div class="info">
-            ${render_info(thread)}
+    ${render_thread(thread)}
+  % endfor
+</section>
+
+<%def name="render_thread(thread, edit_thread=False, show_comments=False)">
+  <div class="thread" _id="${thread['id']}">
+    <div class="discussion-content">
+      <a class="thread-title" name="${thread['id']}" href="${url_for(thread['id'])}">${thread['title']}</a>
+      <div class="discussion-content-view">
+        <div class="thread-body">${thread['body']}</div>
+        <div class="info">
+          ${render_info(thread)}
+          % if edit_thread:
             ${render_reply('')}
             ${render_edit('')}
-          </div>
+          % endif
         </div>
       </div>
+    </div>
+    % if show_comments:
       <div class="comments">
         ${render_comments(thread['children'])}
       </div>
-    </div>
-  % endfor
-</section>
+    % endif
+  </div>
+</%def>
 
 <%def name="render_comments(comments)">
   % for comment in comments:

lms/templates/discussion/search_bar.html

+<%! from django.core.urlresolvers import reverse %>
+
+<%
+def url_for_search():
+  return reverse('django_comment_client.forum.views.search')
+%>
+
+<form action="${url_for_search()}" method="get" class="discussion-search-form">
+  <input type="text" class="discussion-search-text" value="${text}"/>
+  <label for="discussion-search-within-board-${discussion_id}">search within board</label>
+  <input type="checkbox" id="discussion-search-within-board-${discussion_id}" class="discussion-search-within-board" checked/>
+  <a class="discussion-link discussion-search" href="javascript:void(0)">Search</a>
+</form>

lms/templates/discussion/single_thread.html

+<%! from django.core.urlresolvers import reverse %>
+
+<section class="discussion">
+  <a class="discussion-title" href="javascript:void(0)">Discussion</a>
+  ${render_thread(thread, edit_thread=True, show_comments=True)}
+</section>
+
+<%def name="render_thread(thread, edit_thread=False, show_comments=False)">
+  <div class="thread" _id="${thread['id']}">
+    <div class="discussion-content">
+      <a class="thread-title" name="${thread['id']}" href="javascript:void(0)">${thread['title']}</a>
+      <div class="discussion-content-view">
+        <div class="thread-body">${thread['body']}</div>
+        <div class="info">
+          ${render_info(thread)}
+          % if edit_thread:
+            ${render_reply('')}
+            ${render_edit('')}
+          % endif
+        </div>
+      </div>
+    </div>
+    % if show_comments:
+      <div class="comments">
+        ${render_comments(thread['children'])}
+      </div>
+    % endif
+  </div>
+</%def>
+
+<%def name="render_comments(comments)">
+  % for comment in comments:
+    <div class="comment" _id="${comment['id']}">
+      <div class="discussion-content">
+        <div class="discussion-content-view">
+          <a class="comment-body" name="${comment['id']}">${comment['body']}</a>
+          <div class="info">
+            ${render_info(comment)}
+            ${render_reply('')}
+            ${render_edit('')}
+          </div>
+        </div>
+      </div>
+      <div class="comments">
+        ${render_comments(comment['children'])}
+      </div>
+    </div>
+  % endfor
+</%def>
+
+<%def name="render_info(content)">
+  ${time_ago_in_words(parse(content['updated_at']))} ago by user No.${content['user_id']}
+</%def>
+
+<%def name="render_reply(url)">
+  <a class="discussion-link discussion-reply" href="javascript:void(0)">Reply</a>
+</%def>
+
+<%def name="render_edit(url)">
+  <a class="discussion-link discussion-edit" href="javascript:void(0)">Edit</a>
+</%def>