From fc4e21d4c4d5df2b83d22c03d534094cee2a0acc Mon Sep 17 00:00:00 2001
From: Rocky Duan <dementrock@gmail.com>
Date: Thu, 26 Jul 2012 17:35:09 -0400
Subject: [PATCH] use wmd editor for comments

---
 lms/static/coffee/src/customwmd.coffee  | 13 ++++++++++++-
 lms/static/coffee/src/discussion.coffee | 20 +++++++++++++++-----
 lms/static/sass/_discussion.scss        |  2 +-
 lms/templates/discussion/inline.html    | 10 +++-------
 lms/templates/discussion/thread.html    | 19 +++++++++++--------
 5 files changed, 42 insertions(+), 22 deletions(-)

diff --git a/lms/static/coffee/src/customwmd.coffee b/lms/static/coffee/src/customwmd.coffee
index e8012d8f42..8a3a2d7c97 100644
--- a/lms/static/coffee/src/customwmd.coffee
+++ b/lms/static/coffee/src/customwmd.coffee
@@ -109,7 +109,18 @@ $ ->
         converter.hooks.chain "postConversion", processor.replaceMath
         converter
 
-    Markdown.makeWmdEditor = (appended_id) ->
+    Markdown.makeWmdEditor = (elem, appended_id) ->
+      $elem = $(elem)
+      if not $elem.length
+        console.log "warning: elem for makeWmdEditor doesn't exist"
+        return
+      if not $elem.find(".wmd-panel").length
+        _append = appended_id || ""
+        $wmdPanel = $("<div>").addClass("wmd-panel")
+                   .append($("<div>").attr("id", "wmd-button-bar#{_append}"))
+                   .append($("<textarea>").addClass("wmd-input").attr("id", "wmd-input#{_append}"))
+                   .append($("<div>").attr("id", "wmd-preview#{_append}").addClass("wmd-panel wmd-preview"))
+        $elem.append($wmdPanel)
       converter = Markdown.getMathCompatibleConverter()
       editor = new Markdown.Editor(converter, appended_id)
       delayRenderer = new MathJaxDelayRenderer()
diff --git a/lms/static/coffee/src/discussion.coffee b/lms/static/coffee/src/discussion.coffee
index 50bc95d8e8..e430e38674 100644
--- a/lms/static/coffee/src/discussion.coffee
+++ b/lms/static/coffee/src/discussion.coffee
@@ -13,7 +13,6 @@ $ ->
     Discussion.bindDiscussionEvents(discussion)
     Discussion.initializeDiscussion(discussion)
 
-  Markdown.makeWmdEditor()
 
 generateLocal = (elem) ->
   (selector) -> $(elem).find(selector)
@@ -52,6 +51,7 @@ Discussion =
     window.location.reload()
 
   initializeDiscussion: (discussion) ->
+
     initializeVote = (index, content) ->
       $content = $(content)
       $local = generateLocal($content.children(".discussion-content"))
@@ -87,6 +87,10 @@ Discussion =
         watchDiscussion = generateDiscussionLink("discussion-watch-discussion", "Watch", handleWatchDiscussion)
         $local(".discussion-title-wrapper").append(watchDiscussion)
 
+      newPostBody = $(discussion).find(".new-post-body")
+      if newPostBody.length
+        Markdown.makeWmdEditor newPostBody, "-new-post-body-#{$(discussion).attr('_id')}"
+
     initializeWatchThreads = (index, thread) ->
       $thread = $(thread)
       id = $thread.attr("_id")
@@ -149,7 +153,7 @@ Discussion =
       else
         editView = $("<div>").addClass("discussion-content-edit")
 
-        textarea = $("<textarea>").addClass("comment-edit")
+        textarea = $("<div>").addClass("comment-edit")
         editView.append(textarea)
 
         anonymousCheckbox = $("<input>").attr("type", "checkbox")
@@ -158,7 +162,8 @@ Discussion =
         anonymousLabel = $("<label>").attr("for", "discussion-post-anonymously-#{id}")
                                      .html("post anonymously")
         editView.append(anonymousCheckbox).append(anonymousLabel)
-        
+
+
         if $discussionContent.parent(".thread").attr("_id") not in $$user_info.subscribed_thread_ids
           watchCheckbox = $("<input>").attr("type", "checkbox")
                                       .addClass("discussion-auto-watch")
@@ -169,6 +174,8 @@ Discussion =
           editView.append(watchCheckbox).append(watchLabel)
         
         $discussionContent.append(editView)
+
+        Markdown.makeWmdEditor $local(".comment-edit"), "-comment-edit-#{id}"
       cancelReply = generateDiscussionLink("discussion-cancel-reply", "Cancel", handleCancelReply)
       submitReply = generateDiscussionLink("discussion-submit-reply", "Submit", handleSubmitReply)
       $local(".discussion-link").hide()
@@ -192,7 +199,8 @@ Discussion =
         url = Discussion.urlFor('create_sub_comment', id)
       else
         return
-      body = $local(".comment-edit").val()
+
+      body = $local("#wmd-input-comment-edit-#{id}").val()
 
       anonymous = false || $local(".discussion-post-anonymously").is(":checked")
       autowatch = false || $local(".discussion-auto-watch").is(":checked")
@@ -227,6 +235,8 @@ Discussion =
     $discussionNonContent = $discussion.children(".discussion-non-content")
     $local = (selector) -> $discussionNonContent.find(selector)
 
+    id = $discussion.attr("_id")
+
     handleSearch = (text, isSearchWithinBoard) ->
       if text.length
         if $local(".discussion-search-within-board").is(":checked")
@@ -236,7 +246,7 @@ Discussion =
 
     handleSubmitNewThread = (elem) ->
       title = $local(".new-post-title").val()
-      body = $local(".new-post-body").val()
+      body = $local("#wmd-input-new-post-body-#{id}").val()
       url = Discussion.urlFor('create_thread', $local(".new-post-form").attr("_id"))
       $.post url, {title: title, body: body}, (response, textStatus) ->
         if textStatus == "success"
diff --git a/lms/static/sass/_discussion.scss b/lms/static/sass/_discussion.scss
index ae739c9589..84414f33ef 100644
--- a/lms/static/sass/_discussion.scss
+++ b/lms/static/sass/_discussion.scss
@@ -91,6 +91,7 @@ $discussion_input_width: 60%;
   .discussion-right-wrapper {
     min-height: 40px;
     float: left;
+    width: 70%;
   }
   .new-post-form {
     .new-post-title, .new-post-body {
@@ -190,7 +191,6 @@ $discussion_input_width: 60%;
 
 .wmd-panel
 {
-  margin-left: 25%;
   margin-right: 25%;
   width: 50%;
   min-width: 500px;
diff --git a/lms/templates/discussion/inline.html b/lms/templates/discussion/inline.html
index 6cdcb47926..8dbc50e337 100644
--- a/lms/templates/discussion/inline.html
+++ b/lms/templates/discussion/inline.html
@@ -8,14 +8,10 @@
     ${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>
+      <div class="new-post-body">
+      </div>
       <a class="discussion-new-post" href="javascript:void(0)">New Post</a>
-        <div class="wmd-panel">
-          <div id="wmd-button-bar"></div>
-          <textarea class="wmd-input" id="wmd-input">
-          </textarea>
-          <div id="wmd-preview" class="wmd-panel wmd-preview"></div>
-        </div>
+        
     </form>
   </div>
   % for thread in threads:
diff --git a/lms/templates/discussion/thread.html b/lms/templates/discussion/thread.html
index 5997b1b70c..52eb17c107 100644
--- a/lms/templates/discussion/thread.html
+++ b/lms/templates/discussion/thread.html
@@ -41,14 +41,17 @@
   % for comment in comments:
     <div class="comment" _id="${comment['id']}">
       <div class="discussion-content">
-        ${render_vote(comment)}
-        <div class="discussion-right-wrapper">
-          <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 class="discussion-upper-wrapper clearfix">
+          ${render_vote(comment)}
+          <div class="discussion-right-wrapper">
+            <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>
         </div>