display simple threaded comment

common/lib/xmodule/xmodule/discussion_module.py

@@ -1,15 +1,27 @@
+from lxml import etree
+
 from xmodule.x_module import XModule
 from xmodule.raw_module import RawDescriptor
 
+import comment_client
+import dateutil
+from dateutil.tz import tzlocal
+from datehelper import time_ago_in_words
 
 class DiscussionModule(XModule):
     def get_html(self):
-        return "Discussion: To be implemented"
+        context = {
+            'threads': comment_client.get_threads(self.discussion_id, recursive=True),
+            'time_ago_in_words': time_ago_in_words,
+            'parse': dateutil.parser.parse,
+        }
+        return self.system.render_template('discussion.html', context)
 
     def __init__(self, system, location, definition, instance_state=None, shared_state=None, **kwargs):
         XModule.__init__(self, system, location, definition, instance_state, shared_state, **kwargs)
-        print "Initialized"
-        print definition
+        xml_data = etree.fromstring(definition['data'])
+        self.discussion_id = xml_data.attrib['id']
+        self.title = xml_data.attrib['for']
 
 class DiscussionDescriptor(RawDescriptor):
     module_class = DiscussionModule

lms/lib/comment_client.py

@@ -0,0 +1 @@
+/Users/dementrock/coding/cs_comments_client_python/comment_client.py

lms/static/sass/_discussion.scss

@@ -0,0 +1,30 @@
+.discussion {
+  .title {
+    font-size: 20px;
+    line-height: 20px;
+    font-weight: bold;
+  }
+  .thread {
+    margin-top: 10px;
+    margin-bottom: 10px;
+    .title {
+      font-size: 16px;
+      line-height: 16px;
+    }
+    .body {
+      font-size: 14px;
+      line-height: 14px;
+    }
+    .comments {
+      margin-left: 20px;
+      .comment {
+        .body {
+        }
+        .subcomments {
+          margin-left: 20px;
+        }
+      }
+    }
+  }
+
+}

lms/templates/discussion.html

@@ -0,0 +1,31 @@
+<section class="discussion">
+  <div class="title">
+    Discussion
+  </div>
+  % for thread in threads:
+    <div class="thread">
+      <div class="title">${thread['title']}</div>
+      <div class="body">${thread['body']}</div>
+      <div class="info">
+        ${time_ago_in_words(parse(thread['updated_at']))} ago by user No.${thread['user_id']}
+      </div>
+      <div class="comments">
+        ${render_comments(thread['children'])}
+      </div>
+    </div>
+  % endfor
+</section>
+
+<%def name="render_comments(comments)">
+  % for comment in comments:
+    <div class="comment">
+      <div class="body">${comment['body']}</div>
+      <div class="info">
+        ${time_ago_in_words(parse(comment['updated_at']))} ago by user No.${comment['user_id']}
+      </div>
+      <div class="subcomments">
+        ${render_comments(comment['children'])}
+      </div>
+    </div>
+  % endfor
+</%def>