Merge pull request #778 from ankitjavalkar/cruise-comments-under-video

[Rebased] Comments under video lesson

5 files changed, 342 insertions, 128 deletions

diff --git a/yaksh/templates/yaksh/course_forum.html b/yaksh/templates/yaksh/course_forum.html
index 4724981..acd6861 100644
--- a/yaksh/templates/yaksh/course_forum.html
+++ b/yaksh/templates/yaksh/course_forum.html
@@ -4,132 +4,169 @@
     {{course.name}}: Discussion Forum
 {% endblock title %}
 {% block content %}
-    <div class="container">
-        <div>
-            <h2><center>{{course.name}}</center></h2>
-            <center>Discussion Forum</center>
-        </div>
-        <div class="d-flex p-2 bd-highlight">
-            <div class="col-md-4">
-                {% if moderator %}
-                    <a href="{% url 'yaksh:course_detail' course.id %}" class="btn btn-primary">
-                        <i class="fa fa-arrow-left"></i>&nbsp;Back
-                    </a>
-                {% else %}
-                    <a href="{% url 'yaksh:course_modules' course.id %}" class="btn btn-primary">
-                        <i class="fa fa-arrow-left"></i>&nbsp;Back
-                    </a>
-                {% endif %}
+    <div id="wrapper" class="d-flex">
+        {% include "yaksh/sidebar.html" %}
+        <div class="container" id="page-content-wrapper">
+            <div>
+                <h2><center>{{course.name}}</center></h2>
+                <center>Discussion Forum</center>
             </div>
-            <div class="col-md">
-                <button type="button" class="btn btn-success pull-right" data-toggle="modal" data-target="#newPostModal">
-                    <i class="fa fa-plus-circle"></i>&nbsp;New Post
-                </button>
+            <div class="d-flex p-2 bd-highlight">
+                <div class="col-md-4">
+                    {% if moderator %}
+                        <a href="{% url 'yaksh:course_detail' course.id %}" class="btn btn-primary">
+                            <i class="fa fa-arrow-left"></i>&nbsp;Back
+                        </a>
+                    {% else %}
+                        <a href="{% url 'yaksh:course_modules' course.id %}" class="btn btn-primary">
+                            <i class="fa fa-arrow-left"></i>&nbsp;Back
+                        </a>
+                    {% endif %}
+                </div>
+                <div class="col-md">
+                    <button type="button" class="btn btn-success pull-right" data-toggle="modal" data-target="#newPostModal">
+                        <i class="fa fa-plus-circle"></i>&nbsp;New Post
+                    </button>
+                </div>
             </div>
-        </div>
-        <!-- Modal -->
-        <div id="newPostModal" class="modal fade" role="dialog">
-          <div class="modal-dialog">
+           {% if messages %}
+                <div>
+                  <center>
+                      {% for message in messages %}
+                          <div class="alert alert-dismissible alert-{{ message.tags }}">
+                              <button type="button" class="close" data-dismiss="alert">
+                                  <i class="fa fa-close"></i>
+                              </button>
+                              <strong>{{ message }}</strong>
+                          </div>
+                      {% endfor %}
+                  </center>
+               </div>
+           {% endif %}
+            <!-- Modal -->
+            <div id="newPostModal" class="modal fade" role="dialog">
+              <div class="modal-dialog">
 
-            <!-- Modal content-->
-            <div class="modal-content">
-              <div class="modal-header">
-                <h4 class="modal-title">Create a new Post</h4>
-                <button type="button" class="close" data-dismiss="modal">&times;</button>
-              </div>
-              <div class="modal-body">
-                <form action="." method="POST" enctype='multipart/form-data'>
-                    <div class="form-group">
-                        {% csrf_token %}
-                        {{form}}
-                    </div>
-                    <input type="submit" class="btn btn-primary" value="Create Post">
-                </form>
-              </div>
-              <div class="modal-footer">
-                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+                <!-- Modal content-->
+                <div class="modal-content">
+                  <div class="modal-header">
+                    <h4 class="modal-title">Create a new Post</h4>
+                    <button type="button" class="close" data-dismiss="modal">&times;</button>
+                  </div>
+                  <div class="modal-body">
+                    <form action="." method="POST" enctype='multipart/form-data'>
+                        <div class="form-group">
+                            {% csrf_token %}
+                            {{form}}
+                        </div>
+                        <input type="submit" class="btn btn-primary" value="Create Post">
+                    </form>
+                  </div>
+                  <div class="modal-footer">
+                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+                  </div>
+                </div>
               </div>
             </div>
-            
-          </div>
-        </div>
-        <br>
-        <div class="row justify-content-center">
-            <div class="col-md-6">
-                <form class="my-2 my-lg-0" action="" method="GET">
-                    <div class="input-group">
-                        <input type="search" placeholder="Search Post" name="search_post" class="form-control">
-                        <span class="input-group-append">
-                            <button class="btn btn-outline-info">
-                                <i class="fa fa-search"></i>&nbsp;Search
-                            </button>
-                        </span>
+            <br>
+            {% with objects as posts %}
+                {% if posts %}
+                    <div class="row justify-content-center">
+                        <div class="col-md-6">
+                            <form class="my-2 my-lg-0" action="" method="GET">
+                                <div class="input-group">
+                                    <input type="search" placeholder="Search Post" name="search_post" class="form-control">
+                                    <span class="input-group-append">
+                                        <button class="btn btn-outline-info">
+                                            <i class="fa fa-search"></i>&nbsp;Search
+                                        </button>
+                                    </span>
+                                </div>
+                            </form>
+                        </div>
+                        <div class="col-md-4">
+                            <a class="btn btn-outline-danger" href="{% url 'yaksh:course_forum' course.id %}">
+                                <i class="fa fa-times"></i>&nbsp;Clear Search
+                            </a>
+                        </div>
                     </div>
-                </form>
-            </div>
-            <div class="col-md-4">
-                <a class="btn btn-outline-danger" href="{% url 'yaksh:course_forum' course.id %}">
-                    <i class="fa fa-times"></i>&nbsp;Clear Search
-                </a>
-            </div>
+                    <br>
+                    {% include "yaksh/paginator.html" %}
+                    <br>
+                    <table id="posts_table" class="tablesorter table">
+                        <thead class="thread-inverse">
+                            <tr>
+                                <th width="700">Posts</th>
+                                <th>Created by</th>
+                                <th>Replies</th>
+                                <th>Last reply</th>
+                                <th></th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            {% for post in posts %}
+                                <tr>
+                                    <td>
+                                        <a href="{% url 'yaksh:post_comments' course.id post.uid %}">{{post.title}}</a>
+                                        <small class="text-muted d-block">{{ post.description|truncatewords:30 }}</small>
+                                        <small class="text-muted"><strong>Last updated: {{post.modified_at}}</strong></small>
+                                    </td>
+                                    <td>
+                                        {% if post.anonymous %}
+                                            Anonymous
+                                        {% else %}
+                                            {{post.creator.username}}
+                                        {% endif %}
+                                    </td>
+                                    <td>{{post.get_comments_count}}</td>
+                                    <td>
+                                        {% with post.get_last_comment as last_comment %}
+                                            {% if last_comment %}
+                                                {{last_comment.creator}}
+                                            {% else %}
+                                                None
+                                            {% endif %}
+                                        {% endwith %}
+                                    </td>
+                                    <td>
+                                        {% if user == course.creator %}
+                                            <small><a href="{% url 'yaksh:hide_post' course.id post.uid %}" class="pull-right fa fa-trash"></i></a></small>
+                                        {% endif %}
+                                    </td>
+                                </tr>
+                            {% endfor %}
+                        </tbody>
+                    </table>
+                    <br>
+                    {% include "yaksh/paginator.html" %}
+                {% else %}
+                    <center>No discussion posts are there yet. Create one to start discussing.</center>
+                {% endif %}
+            {% endwith %}
         </div>
-        <br>
-        {% with objects as posts %}
-        {% if posts %}
-            {% include "yaksh/paginator.html" %}
-            <br>
-            <table id="posts_table" class="tablesorter table">
-                <thead class="thread-inverse">
-                    <tr>
-                        <th width="700">Posts</th>
-                        <th>Created by</th>
-                        <th>Replies</th>
-                        <th>Last reply</th>
-                        <th></th>
-                    </tr>
-                </thead>
-                <tbody>
-                    {% for post in posts %}
-                        <tr>
-                            <td>
-                                <a href="{% url 'yaksh:post_comments' course.id post.uid %}">{{post.title}}</a>
-                                <small class="text-muted d-block">{{ post.description|truncatewords:30 }}</small>
-                                <small class="text-muted"><strong>Last updated: {{post.modified_at}}</strong></small>
-                            </td>
-                            <td>{{post.creator.username}}</td>
-                            <td>{{post.get_comments_count}}</td>
-                            <td>
-                                {% with post.get_last_comment as last_comment %}
-                                    {% if last_comment %}
-                                        {{last_comment.creator}}
-                                    {% else %}
-                                        None
-                                    {% endif %}
-                                {% endwith %}
-                            </td>
-                            <td>
-                                {% if user.profile.is_moderator %}
-                                    <small><a href="{% url 'yaksh:hide_post' course.id post.uid %}" class="pull-right btn btn-danger">Delete</i></a></small>
-                                {% endif %}
-                            </td>
-                        </tr>
-                    {% endfor %}
-                </tbody>
-            </table>
-            <br>
-            {% include "yaksh/paginator.html" %}
-        {% else %}
-            No discussion posts are there yet. Create one to start discussing.
-        {% endif %}
-        {% endwith %}
     </div>
 {% endblock content %}
 {% block script %}
       <script type="text/javascript" src="{% static 'yaksh/js/mathjax/MathJax.js' %}?config=TeX-MML-AM_CHTML"></script>
       <script type="text/javascript" src="{% static 'yaksh/js/jquery.tablesorter.min.js' %}"></script>
+      <script type="text/javascript" src="{% static 'yaksh/js/tinymce/js/tinymce/tinymce.min.js' %}"></script>
       <script type="text/javascript">
         $(document).ready(() => {
             $("#posts_table").tablesorter();
+             $(function() {
+                tinymce.init({
+                    selector: 'textarea#id_description',
+                    setup : function(ed) {
+                          ed.on('change', function(e) {
+                             tinymce.triggerSave();
+                          });
+                    },
+                    max_height: 400,
+                    height: 400,
+                    plugins: "image code link",
+                    convert_urls: false
+                });
+            });
         });
       </script>
 {% endblock script %}
\ No newline at end of file
diff --git a/yaksh/templates/yaksh/lessons_forum.html b/yaksh/templates/yaksh/lessons_forum.html
new file mode 100644
index 0000000..250536d
--- /dev/null
+++ b/yaksh/templates/yaksh/lessons_forum.html
@@ -0,0 +1,80 @@
+{% extends base_template %}
+{% load static %}
+{% block title %}
+    {{course.name}}: Lessons Forum
+{% endblock title %}
+{% block content %}
+    <div id="wrapper" class="d-flex">
+        {% include "yaksh/sidebar.html" %}
+        <div class="container" id="page-content-wrapper">
+            <div class="d-flex p-2 bd-highlight">
+                <div class="col-md-4">
+                    {% if moderator %}
+                        <a href="{% url 'yaksh:course_detail' course.id %}" class="btn btn-primary">
+                            <i class="fa fa-arrow-left"></i>&nbsp;Back
+                        </a>
+                    {% else %}
+                        <a href="{% url 'yaksh:course_modules' course.id %}" class="btn btn-primary">
+                            <i class="fa fa-arrow-left"></i>&nbsp;Back
+                        </a>
+                    {% endif %}
+                </div>
+            </div>
+            {% if posts %}
+                <div>
+                    <h2><center>{{course.name}}</center></h2>
+                    <center>Discussion Forum</center>
+                </div>
+                <table class="table">
+                    <thead class="thread-inverse">
+                        <tr>
+                            <th width="700">Posts</th>
+                            <th>Created by</th>
+                            <th>Replies</th>
+                            <th>Last reply</th>
+                            <th></th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        {% for post in posts %}
+                                <tr>
+                                    <td>
+                                        <a href="{% url 'yaksh:post_comments' course.id post.uid %}">{{post.title}}</a>
+                                        <small class="text-muted d-block">{{ post.description|truncatewords:30 }}</small>
+                                        <small class="text-muted"><strong>Last updated: {{post.modified_at}}</strong></small>
+                                    </td>
+                                    <td>
+                                        {% if post.anonymouse %}
+                                            Anonymous
+                                        {% else %}
+                                            {{post.creator.username}}
+                                        {% endif %}
+                                    </td>
+                                    <td>{{post.get_comments_count}}</td>
+                                    <td>
+                                        {% with post.get_last_comment as last_comment %}
+                                            {% if last_comment %}
+                                                {{last_comment.creator}}
+                                            {% else %}
+                                                None
+                                            {% endif %}
+                                        {% endwith %}
+                                    </td>
+                                    <td>
+                                        {% if user == course.creator %}
+                                            <small><a href="{% url 'yaksh:hide_post' course.id post.uid %}" class="pull-right fa fa-trash"></i></a></small>
+                                        {% endif %}
+                                    </td>
+                                </tr>
+                            {% endfor %}
+                    </tbody>
+                </table>
+            {% else %}
+                <div>
+                    <center>No Lesson posts here. They will appear when someone comments on video lessons.</center>
+                </div>
+            {% endif %}
+        </div>
+    </div>
+{% endblock content %}
+
diff --git a/yaksh/templates/yaksh/post_comments.html b/yaksh/templates/yaksh/post_comments.html
index b16b80c..bc452e0 100644
--- a/yaksh/templates/yaksh/post_comments.html
+++ b/yaksh/templates/yaksh/post_comments.html
@@ -6,24 +6,44 @@
 
 {% block content %}
     <div class="container">
-        <a class="btn btn-primary" href="{% url 'yaksh:course_forum' post.course.id %}">
+        <a class="btn btn-primary" href="{% url 'yaksh:course_forum' course.id %}">
             <i class="fa fa-arrow-left"></i>&nbsp;Back to Posts
         </a>
         <br>
         <br>
+       {% if messages %}
+            <div>
+              <center>
+                  {% for message in messages %}
+                      <div class="alert alert-dismissible alert-{{ message.tags }}">
+                          <button type="button" class="close" data-dismiss="alert">
+                              <i class="fa fa-close"></i>
+                          </button>
+                          <strong>{{ message }}</strong>
+                      </div>
+                  {% endfor %}
+              </center>
+           </div>
+       {% endif %}
         <div class="card mb-2 border-dark">
             <div class="card-header text-white bg-dark py-2 px-3">
                 {{post.title}}
                 <br>
                 <small>
-                    <strong>{{post.creator.username}}</strong>
+                    <strong>
+                        {% if post.anonymous %}
+                            Anonymous
+                        {% else %}
+                            {{post.creator.username}}
+                        {% endif %}
+                    </strong>
                     {{post.created_at}}
-                    {% if user.profile.is_moderator %}<a href="{% url 'yaksh:hide_post' post.course.id post.uid %}" class="pull-right btn btn-danger">Delete</a>{% endif %}
+                    {% if user == course.creator %}<a href="{% url 'yaksh:hide_post' post.target.id post.uid %}" class="pull-right fa fa-trash"></a>{% endif %}
                 </small>
 
             </div>
             <div class="card-body">
-                <p class="card-text description">{{post.description}}</p>
+                <p class="card-text description">{{post.description|safe}}</p>
                 {% if post.image %}
                     <a href="{{post.image.url}}" target="_blank">
                         <center><img src="{{post.image.url}}" class="post_image thumbnail" alt=""></center>
@@ -31,6 +51,16 @@
                 {% endif %}
             </div>
         </div>
+        <div>
+            <b><u>Add comment:</u></b>
+            <form action="" method="POST" enctype='multipart/form-data'>
+                <div class="form-group">
+                    {% csrf_token %}
+                    {{form}}
+                </div>
+                <input type="submit" value="Submit" class="btn btn-success">
+            </form>
+        </div>
         <br>
         {% if comments %}
             {% for comment in comments %}
@@ -38,13 +68,19 @@
                     <div class="card-body p-3">
                         <div class="row mb-3">
                             <div class="col-6">
-                                <strong class="text-muted">{{comment.creator.username}}</strong>
+                                <strong class="text-muted">
+                                    {% if comment.anonymous %}
+                                        Anonymous
+                                    {% else %}
+                                        {{comment.creator.username}}
+                                    {% endif %}
+                                </strong>
                             </div>
                             <div class="col-6 text-right">
-                                <small class="text-muted">{{comment.created_at}} {% if user.profile.is_moderator %} <a href="{% url 'yaksh:hide_comment' post.course.id comment.uid %}" class="btn btn-danger">Delete</a>{% endif %}</small>
+                                <small class="text-muted">{{comment.created_at}} {% if user == course.creator %} <a href="{% url 'yaksh:hide_comment' post.target.id comment.uid %}" class="fa fa-trash"></a>{% endif %}</small>
                             </div>
                         </div>
-                        <p class="card-text description">{{comment.description}}</p>
+                        <p class="card-text description">{{comment.description|safe}}</p>
                         <div>
                             {% if comment.image %}
                                 <a href="{{comment.image.url}}" target="_blank">
@@ -57,18 +93,27 @@
             {% endfor %}
         {% endif %}
         <br>
-        <div>
-            <b><u>Add comment:</u></b>
-            <form action="{% url 'yaksh:post_comments' post.course.id post.uid %}" method="POST" enctype='multipart/form-data'>
-                <div class="form-group">
-                    {% csrf_token %}
-                    {{form}}
-                </div>
-                <input type="submit" value="Submit" class="btn btn-success">
-            </form>
-        </div>
     </div>
 {% endblock content %}
 {% block script %}
       <script type="text/javascript" src="{% static 'yaksh/js/mathjax/MathJax.js' %}?config=TeX-MML-AM_CHTML"></script>
+      <script type="text/javascript" src="{% static 'yaksh/js/tinymce/js/tinymce/tinymce.min.js' %}"></script>
+      <script type="text/javascript">
+       $(document).ready(() => {
+             $(function() {
+                tinymce.init({
+                    selector: 'textarea#id_description',
+                    setup : function(ed) {
+                          ed.on('change', function(e) {
+                             tinymce.triggerSave();
+                          });
+                    },
+                    max_height: 400,
+                    height: 400,
+                    plugins: "image code link",
+                    convert_urls: false
+                });
+            });
+        });
+      </script>
 {% endblock script %}
\ No newline at end of file
diff --git a/yaksh/templates/yaksh/show_video.html b/yaksh/templates/yaksh/show_video.html
index 9e9d0b4..6e3cabb 100644
--- a/yaksh/templates/yaksh/show_video.html
+++ b/yaksh/templates/yaksh/show_video.html
@@ -16,6 +16,7 @@
 <script src="{% static 'yaksh/js/jquery-sortable.js' %}"></script>
 <script type="text/javascript" src="{% static 'yaksh/js/mathjax/MathJax.js' %}?config=TeX-MML-AM_CHTML">
 </script>
+<script type="text/javascript" src="{% static 'yaksh/js/tinymce/js/tinymce/tinymce.min.js' %}"></script>
 {% endblock %}
 {% block css %}
 <link rel="stylesheet" href="{% static 'yaksh/css/jquery-ui/jquery-ui.css' %}">
@@ -227,6 +228,49 @@
                 </div>
             </div>
         {% endif %}
+        {% if state == 'lesson' %}
+            <div>
+                <b><u>Add comment:</u></b>
+                <form action="" method="POST" enctype='multipart/form-data'>
+                    <div class="form-group">
+                        {% csrf_token %}
+                        {{form}}
+                    </div>
+                    <input type="submit" value="Submit" class="btn btn-success">
+                </form>
+            </div>
+        {% endif %}
+        <br>
+        {% if comments %}
+            {% for comment in comments %}
+                <div class="card mb-2">
+                    <div class="card-body p-3">
+                        <div class="row mb-3">
+                            <div class="col-6">
+                                <strong class="text-muted">
+                                    {% if comment.anonymous %}
+                                        Anonymous
+                                    {% else %}
+                                        {{comment.creator.username}}
+                                    {% endif %}
+                                </strong>
+                            </div>
+                            <div class="col-6 text-right">
+                                <small class="text-muted">{{comment.created_at}} {% if user.profile.is_moderator %} <a href="{% url 'yaksh:hide_comment' course.id comment.uid %}" class="fa fa-trash"></a>{% endif %}</small>
+                            </div>
+                        </div>
+                        <p class="card-text description">{{comment.description|safe}}</p>
+                        <div>
+                            {% if comment.image %}
+                                <a href="{{comment.image.url}}" target="_blank">
+                                    <center><img src="{{comment.image.url}}" class="comment_image thumbnail" alt=""></center>
+                                </a>
+                            {% endif %}
+                        </div>
+                    </div>
+                </div>
+            {% endfor %}
+        {% endif %}
     </div>
 </div>
 <div id="dialog"></div>
diff --git a/yaksh/templates/yaksh/sidebar.html b/yaksh/templates/yaksh/sidebar.html
new file mode 100644
index 0000000..7d0ac74
--- /dev/null
+++ b/yaksh/templates/yaksh/sidebar.html
@@ -0,0 +1,8 @@
+<!-- Sidebar -->
+<div class="bg-light border-right" id="sidebar-wrapper">
+  <div class="list-group list-group-flush">
+    <a href="{% url 'yaksh:course_forum' course.id %}" class="list-group-item list-group-item-action {% if '/course_forum/' in request.path %}active{% endif %}">Course Forum</a>
+    <a href="{% url 'yaksh:lessons_forum' course.id %}" class="list-group-item list-group-item-action {% if '/lessons_forum/' in request.path %}active{% endif %}">Lessons Forum</a>
+  </div>
+</div>
+<!-- /#sidebar-wrapper -->