create new post

common/lib/xmodule/xmodule/discussion_module.py

@@ -14,6 +14,7 @@ class DiscussionModule(XModule):
             'threads': comment_client.get_threads(self.discussion_id, recursive=True),
             'time_ago_in_words': time_ago_in_words,
             'parse': dateutil.parser.parse,
+            'commentable_id': self.discussion_id,
         }
         return self.system.render_template('discussion.html', context)
 

lms/static/coffee/src/discussion.coffee

@@ -1,6 +1,7 @@
 $ ->
 
-  DEBUG = true
+  #DEBUG = true
+  DEBUG = false
 
   $(".discussion-title").click ->
     $thread = $(this).parent().children(".thread")
@@ -41,6 +42,9 @@ $ ->
   $(".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)").
@@ -75,7 +79,7 @@ $ ->
 
   urlFor = (name, param) ->
     {
-      create_thread      : "TODO" # TODO
+      create_thread      : "/discussions/#{param}/threads/create"
       update_thread      : "/discussions/threads/#{param}/update"
       create_comment     : "/discussions/threads/#{param}/reply"
       delete_thread      : "/discussions/threads/#{param}/delete"
@@ -89,24 +93,6 @@ $ ->
       downvote_thread    : "/discussions/threads/#{param}/downvote"
     }[name]
 
-  renderComment = (comment) ->
-    """
-    <div class="comment" _id="#{comment['id']}">
-      <div class="discussion-content">
-        <div class="discussion-content-view">
-          <div class="comment-body">#{comment['body']}</div>
-          <div class="info">
-            less than a minute ago by user No.#{comment['user_id']}
-            <a class="discussion-link discussion-reply" href="javascript:void(0)">Reply</a>
-            <a class="discussion-link discussion-edit" href="javascript:void(0)">Edit</a>
-          </div>
-        </div>
-      </div>
-      <div class="comments">
-      </div>
-    </div>
-    """
-
   handleSubmitReply = (elem) ->
     $div = $(elem).parents(".discussion-content").parent()
     if $div.hasClass("thread")
@@ -117,19 +103,32 @@ $ ->
       return
     $edit = $div.children(".discussion-content").find(".comment-edit")
     body = $edit.val()
-    $.post url, {body: body}, (response, textStatus) ->
+    $.post url, {body: body}, handleAnchorAndReload(response, textStatus) ->
       if textStatus == "success"
-        if not DEBUG
-          window.location = window.location.pathname + "#" + response['id']
-          window.location.reload()
+        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()

lms/static/sass/_discussion.scss

@@ -3,6 +3,7 @@ $discussion_title_size: 1.6em;
 $comment_title_size: 1.2em;
 $comment_body_size: 1.0em;
 $comment_info_size: 0.75em;
+$discussion_input_width: 60%;
 
 @mixin discussion-font {
   font-family: "Comic Sans MS", cursive, sans-serif !important;
@@ -24,6 +25,23 @@ $comment_info_size: 0.75em;
     margin-bottom: 20px;
     display: block;
   }
+  .new-post-form {
+    .new-post-title, .new-post-body {
+      @include discussion-font;
+      display: block !important;
+      width: $discussion_input_width !important;
+    }
+    .new-post-body {
+      margin-top: 10px;
+    }
+    .discussion-new-post {
+      @include discussion-font;
+      color: #1d9dd9;
+      display: block;
+      margin-top: 10px;
+      font-weight: bold;
+    }
+  }
   .thread {
     //display: none;
     margin-top: 30px;
@@ -70,6 +88,7 @@ $comment_info_size: 0.75em;
       .discussion-content-edit {
         .comment-edit {
           @include discussion-font;
+          width: $discussion_input_width !important;
           margin-left: $comment_margin_left;
           font-size: $comment_body_size;
           margin-top: 10px;

lms/templates/discussion.html

@@ -1,5 +1,10 @@
 <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>
   % for thread in threads:
     <div class="thread" _id="${thread['id']}">
       <div class="discussion-content">