Added commenting feature

6 files changed, 123 insertions, 2 deletions

diff --git a/blog/urls.py b/blog/urls.py
index 5eadd0ee..2b4f8b6d 100644
--- a/blog/urls.py
+++ b/blog/urls.py
@@ -10,5 +10,7 @@ urlpatterns = [
     path('my/account', views.account, name='account'),
     path('register/', views.register, name='register'),
     path('register/refresh_captcha/', name='refresh_captcha', view=views.refresh_captcha),
+    path('post/<str:slug>', views.post, name='post'),
+    path('post/<str:slug>/comment', views.comment, name='comment'),
     # path('my/homepage', views.homepage, name='homepage'),
 ]
diff --git a/blog/views.py b/blog/views.py
index 4fbfb10b..2bbe343f 100644
--- a/blog/views.py
+++ b/blog/views.py
@@ -1,4 +1,3 @@
-from http.client import HTTPResponse
 from django.shortcuts import render, redirect
 from django.http import HttpResponse
 from users.models import UserProfile, CaptchaStore
@@ -9,6 +8,7 @@ from random import choice
 from string import ascii_letters, digits
 import base64
 import json
+from .models import Post, Comment
 
 # Create your views here.
 
@@ -84,3 +84,35 @@ def refresh_captcha(request):
     CaptchaStore.objects.create(captcha_string=random_string, csrf_token=csrf_token)
     response_data = {'captcha': base64_data}
     return HttpResponse(json.dumps(response_data), content_type="application/json")
+
+def post(request, slug):
+    try:
+        post = Post.objects.get(slug=slug)
+        tags = post.tags.all()
+        comments = Comment.objects.filter(post=post)
+        if post.is_public:
+            return render(request, 'blog/post.html', {'title': post.title, 'post': post, 'tags': tags, 'comments': comments})
+        else:
+            if request.user.is_authenticated and request.user.is_superuser or request.user.is_staff:
+                return render(request, 'blog/post.html', {'title': post.title, 'post': post, 'tags': tags, 'comments': comments})
+            else:
+                return HttpResponse('Post not found!', status=404)
+    except Post.DoesNotExist:
+        return HttpResponse('Post not found!', status=404)
+
+def comment(request, slug):
+    if request.method == 'POST':
+        if request.user.is_authenticated:
+            try:
+                post = Post.objects.get(slug=slug)
+                if post.is_public:
+                    Comment.objects.create(user=request.user, post=post, body=request.POST.get('comment'))
+                    return redirect('blog:post', slug=slug)
+                else:
+                    if request.user.is_authenticated and request.user.is_superuser or request.user.is_staff:
+                        Comment.objects.create(user=request.user, post=post, body=request.POST.get('comment'))
+                        return redirect('blog:post', slug=slug)
+                    else:
+                        return HttpResponse('Post not found!', status=404)
+            except Post.DoesNotExist:
+                return HttpResponse('Post not found!', status=404)
diff --git a/static/css/main.css b/static/css/main.css
index b3d26ecd..494f3197 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -227,6 +227,32 @@ summary {
     color: rgb(74, 5, 5);
 }
 
+.comment {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    margin-bottom: 20px;
+}
+
+.profile-picture > img {
+    width: 48px;
+    height: 48px;
+    border-radius: 50%;
+    margin-right: 15px;
+    display: inline-block;
+}
+
+.comment-header {
+    font-size: 0.8em;
+    margin-top: 0px;
+    margin-bottom: 10px;
+}
+
+.comment-body {
+    flex: 1;
+    margin-top: 0px;
+}
+
 /* Optimize for phones */
 @media only screen and (max-width: 480px) {
     body {
diff --git a/templates/blog/post.html b/templates/blog/post.html
new file mode 100644
index 00000000..0fe9ee07
--- /dev/null
+++ b/templates/blog/post.html
@@ -0,0 +1,53 @@
+{% extends 'blog/partials/base.html' %} {% block content %}
+<div class="main">
+  <section>
+    <h1 style="margin-bottom: 12px">{{ post.title }}</h1>
+    <p style="line-height: 1.6em;">
+        Posted on <em><u>{{ post.date | date:"M d, Y" }}</u></em> by <em><a href="#">{{ post.author }}</a> in <a href="#">{{ post.category }}</a></em>
+        <br>
+        <b>Tags:</b>
+        {% for tag in tags %}
+            <a href="#" class="tag">{{ tag.name }}</a>
+        {% endfor %}
+    </p>
+    
+    <hr>
+    <div>{{ post.body | safe }}</div>
+    <div id="comments" style="margin-top: 3rem;">
+        <h3>Comments</h3>
+        {% for comment in comments %}
+            <div class="comment">
+                {% load md5 %}
+                <div class="profile-picture">
+                    {% if comment.user.gravatar_email %}
+                        <img src="https://www.gravatar.com/avatar/{{ comment.user.gravatar_email | md5 }}?s=100" alt="Profile Picture">
+                    {% else %}
+                        <img src="https://www.gravatar.com/avatar/{{ comment.user.email | md5 }}?s=100" alt="Profile Picture">
+                    {% endif %}
+                </div>
+                <div>
+                    <p class="comment-header">
+                        <a href="#">{{ comment.user.username }}</a> on <em>{{ comment.created_at | date:"M d, Y" }}</em>
+                    </p>
+                    <p class="comment-body">{{ comment.body }}</p>
+                </div>
+            </div>
+        {% endfor %}
+        {% if user.is_authenticated %}
+        <form action="{% url 'blog:comment' post.slug %}" method="post">
+            {% csrf_token %}
+            <div class="form-group">
+                <label for="comment">Add Comment:</label>
+                <textarea name="comment" id="comment" class="form-control" rows="5"></textarea>
+            </div>
+            <div class="form-group">
+                <button type="submit" class="btn btn-primary">Submit</button>
+            </div>
+        </form>
+        {% else %}
+            <p><em>You must be logged in to comment.</em></p>
+        {% endif %}
+    </div>
+  </section>
+</div>
+{% endblock %}
diff --git a/templates/blog_admin/posts.html b/templates/blog_admin/posts.html
index ec1f462e..8c1e14aa 100644
--- a/templates/blog_admin/posts.html
+++ b/templates/blog_admin/posts.html
@@ -18,7 +18,7 @@
         <tbody>
           {% for post in posts %}
           <tr>
-            <td><a href="#">{{ post.title }}</a></td>
+            <td><a href="{% url 'blog:post' post.slug %}">{{ post.title }}</a></td>
             <td>{{ post.body|truncatechars:50|remove_tags }}</td>
             <td>{{ post.author }}</td>
             <td>{{ post.date }}</td>
diff --git a/thatcomputerscientist/templatetags/md5.py b/thatcomputerscientist/templatetags/md5.py
new file mode 100644
index 00000000..5c19d441
--- /dev/null
+++ b/thatcomputerscientist/templatetags/md5.py
@@ -0,0 +1,8 @@
+from django import template
+
+register = template.Library()
+
[email protected](name='md5')
+def md5(value):
+    import hashlib
+    return hashlib.md5(str(value).lower().encode('utf-8')).hexdigest()