From 239ae8afd4e06c9a84cf474b8b6c352fe291eaf3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=BD=A6=E4=BA=AE=E4=BA=AE?= Date: Wed, 16 Nov 2016 23:15:50 +0800 Subject: [PATCH] =?UTF-8?q?=E8=AF=84=E8=AE=BA=E5=8A=9F=E8=83=BD=EF=BC=8C?= =?UTF-8?q?=E5=BE=85=E5=AE=8C=E5=96=84=E8=AF=84=E8=AE=BA=E5=B1=82=E7=BA=A7?= =?UTF-8?q?=E5=B1=95=E7=A4=BA=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- DjangoBlog/settings.py | 2 + blog/models.py | 5 +- blog/static/blog/css/style.css | 353 ++++++++++++++++++++++ blog/templatetags/blog_tags.py | 27 +- blog/views.py | 7 +- comments/views.py | 3 +- templates/blog/articledetail.html | 13 +- templates/blog/tags/sidebar.html | 19 +- templates/comments/tags/comment_list.html | 301 ++++++++++++++++++ templates/comments/tags/post_comment.html | 6 +- 10 files changed, 721 insertions(+), 15 deletions(-) mode change 100644 => 100755 blog/static/blog/css/style.css mode change 100644 => 100755 templates/blog/articledetail.html create mode 100644 templates/comments/tags/comment_list.html diff --git a/DjangoBlog/settings.py b/DjangoBlog/settings.py index 605df1d..4f73e37 100644 --- a/DjangoBlog/settings.py +++ b/DjangoBlog/settings.py @@ -144,6 +144,8 @@ BOOTSTRAP_COLOR_TYPES = [ # 侧边栏文章数目 SIDEBAR_ARTICLE_COUNT = 10 +#侧边栏评论数目 +SIDEBAR_COMMENT_COUNT = 5 # cache setting """ diff --git a/blog/models.py b/blog/models.py index 10ef92e..dbc7669 100644 --- a/blog/models.py +++ b/blog/models.py @@ -4,7 +4,6 @@ from django.conf import settings class Article(models.Model): - """文章""" STATUS_CHOICES = ( ('d', '草稿'), @@ -59,6 +58,10 @@ class Article(models.Model): self.views += 1 self.save(update_fields=['views']) + def comment_list(self): + comments = self.comment_set.all() + parent_comments = comments.filter(parent_comment=None) + class Category(models.Model): """文章分类""" diff --git a/blog/static/blog/css/style.css b/blog/static/blog/css/style.css old mode 100644 new mode 100755 index b5eddd5..e79c64f --- a/blog/static/blog/css/style.css +++ b/blog/static/blog/css/style.css @@ -1996,4 +1996,357 @@ div { #wp-auto-top-bottom:hover { background-position: right -68px; +} + +/* ------------------------------------------------------------------------- * + * Comments +/* ------------------------------------------------------------------------- */ +#comments { + margin-top: 20px; +} + +#pinglist-container { + display: none; +} + +.comment-tabs { + margin-bottom: 20px; + font-size: 15px; + border-bottom: 2px solid #e5e5e5; +} + +.comment-tabs li { + float: left; + margin-bottom: -2px; +} + +.comment-tabs li a { + display: block; + padding: 0 10px 10px; + font-weight: 600; + color: #aaa; + border-bottom: 2px solid #e5e5e5; +} + +.comment-tabs li a:hover { + color: #444; + border-color: #ccc; +} + +.comment-tabs li span { + margin-left: 8px; + padding: 0 6px; + border-radius: 4px; + background-color: #e5e5e5; +} + +.comment-tabs li i { + margin-right: 6px; +} + +.comment-tabs li.active a { + color: #e8554e; + border-bottom-color: #e8554e; +} + +.commentlist, .pinglist { + margin-bottom: 20px; +} + +.commentlist li, .pinglist li { + padding-left: 60px; + font-size: 14px; + line-height: 22px; + font-weight: 400; +} + +.commentlist .comment-body, .pinglist li { + position: relative; + padding-bottom: 20px; + clear: both; +} + +.commentlist .comment-author, +.commentlist .comment-meta, +.commentlist .comment-awaiting-moderation { + float: left; + display: block; + font-size: 13px; + line-height: 22px; +} + +.commentlist .comment-author { + margin-right: 6px; +} + +.commentlist .fn, .pinglist .ping-link { + color: #444; + font-size: 13px; + font-style: normal; + font-weight: 600; +} + +.commentlist .says { + display: none; +} + +.commentlist .avatar { + position: absolute; + left: -60px; + top: 0; + width: 48px; + height: 48px; + border-radius: 100%; +} + +.commentlist .comment-meta:before, .pinglist .ping-meta:before { + content: "\f017"; + vertical-align: 4%; + margin-right: 3px; + font-size: 10px; + font-family: FontAwesome; + color: #ccc; +} + +.commentlist .comment-meta a, .pinglist .ping-meta { + color: #aaa; +} + +.commentlist .reply { + font-size: 13px; + line-height: 16px; +} + +.commentlist .reply a, +.commentlist .comment-reply-chain { + color: #aaa; +} + +.commentlist .reply a:hover, +.commentlist .comment-reply-chain:hover { + color: #444; +} + +.comment-awaiting-moderation { + color: #e8554e; + font-style: normal; +} + +/* pings */ +.pinglist li { + padding-left: 0; +} + +/* comment text */ +.commentlist .comment-body p { + margin-bottom: 8px; + color: #777; + clear: both; +} + +.commentlist .comment-body strong { + font-weight: 600; +} + +.commentlist .comment-body ol li { + margin-left: 2em; + padding: 0; + list-style: decimal; +} + +.commentlist .comment-body ul li { + margin-left: 2em; + padding: 0; + list-style: square; +} + +/* post author & admin comment */ +.commentlist li.bypostauthor > .comment-body:after, +.commentlist li.comment-author-admin > .comment-body:after { + display: block; + position: absolute; + content: "\f040"; + width: 12px; + line-height: 12px; + font-style: normal; + font-family: FontAwesome; + text-align: center; + color: #fff; + background-color: #e8554e; +} + +.commentlist li.comment-author-admin > .comment-body:after { + content: "\f005"; /* star for admin */ +} + +.commentlist li.bypostauthor > .comment-body:after, +.commentlist li.comment-author-admin > .comment-body:after { + padding: 3px; + top: 32px; + left: -28px; + font-size: 12px; + border-radius: 100%; +} + +.commentlist li li.bypostauthor > .comment-body:after, +.commentlist li li.comment-author-admin > .comment-body:after { + padding: 2px; + top: 22px; + left: -26px; + font-size: 10px; + border-radius: 100%; +} + +/* child comment */ +.commentlist li ul { +} + +.commentlist li li { + margin: 0; + padding-left: 48px; +} + +.commentlist li li .avatar { + top: 0; + left: -48px; + width: 36px; + height: 36px; +} + +.commentlist li li .comment-meta { + left: 70px; +} + +/* comments : nav +/* ------------------------------------ */ +.comments-nav { + margin-bottom: 20px; +} + +.comments-nav a { + font-weight: 600; +} + +.comments-nav .nav-previous { + float: left; +} + +.comments-nav .nav-next { + float: right; +} + +/* comments : form +/* ------------------------------------ */ +.logged-in-as, +.comment-notes, +.form-allowed-tags { + display: none; +} + +#respond { + position: relative; +} + +#reply-title { + margin-bottom: 20px; +} + +li #reply-title { + margin: 0 !important; + padding: 0; + height: 0; + font-size: 0; + border-top: 0; +} + +#cancel-comment-reply-link { + display: block; + position: absolute; + bottom: 26px; + right: 20px; + font-size: 12px; + color: #999; +} + +#cancel-comment-reply-link:hover { + color: #777; +} + +#commentform { + margin-bottom: 20px; + padding: 10px 20px 20px; + border-radius: 4px; + background-color: #e5e5e5; +} + +#commentform p.comment-form-author { + float: left; + width: 48%; +} + +#commentform p.comment-form-email { + float: right; + width: 48%; +} + +#commentform p.comment-form-url, +#commentform p.comment-form-comment { + clear: both; +} + +#commentform label { + display: block; + padding: 6px 0; + font-weight: 600; +} + +#commentform input[type="text"], +#commentform textarea { + max-width: 100%; + width: 100%; +} + +#commentform textarea { + height: 100px; +} + +#commentform p.form-submit { + margin-top: 10px; +} + +.logged-in #reply-title { + margin-bottom: 20px; +} + +.logged-in #commentform p.comment-form-comment { + margin-top: 10px; +} + +.logged-in #commentform p.comment-form-comment label { + display: none; +} + +.heading, +#reply-title { + margin-bottom: 1em; + font-size: 18px; + font-weight: 600; + text-transform: uppercase; + color: #222; +} + +.heading i { + margin-right: 6px; + font-size: 22px; +} + +.group:before { + content: ""; + display: table; +} + +.group:after { + content: ""; + display: table; + clear: both; } \ No newline at end of file diff --git a/blog/templatetags/blog_tags.py b/blog/templatetags/blog_tags.py index cd6e6e1..5b90e47 100644 --- a/blog/templatetags/blog_tags.py +++ b/blog/templatetags/blog_tags.py @@ -21,6 +21,9 @@ from django.utils.safestring import mark_safe import random from blog.models import Article, Category, Tag, Links from django.utils.encoding import force_text +import hashlib +import urllib +from comments.models import Comment register = template.Library() @@ -93,13 +96,15 @@ def load_sidebar(): most_read_articles = Article.objects.filter(status='p').order_by('-views')[:settings.SIDEBAR_ARTICLE_COUNT] dates = Article.objects.datetimes('created_time', 'month', order='DESC') links = Links.objects.all() + commment_list = Comment.objects.order_by('-id')[:settings.SIDEBAR_COMMENT_COUNT] # tags= return { 'recent_articles': recent_articles, 'sidebar_categorys': sidebar_categorys, 'most_read_articles': most_read_articles, 'article_dates': dates, - 'sidabar_links': links + 'sidabar_links': links, + 'sidebar_comments': commment_list } @@ -118,6 +123,26 @@ def load_article_detail(article, isindex): } +# return only the URL of the gravatar +# TEMPLATE USE: {{ email|gravatar_url:150 }} +@register.filter +def gravatar_url(email, size=40): + email = email.encode('utf-8') + + default = "https://avatar.duoshuo.com/avatar-50/928/120117.jpg".encode('utf-8') + + return "https://www.gravatar.com/avatar/%s?%s" % ( + hashlib.md5(email.lower()).hexdigest(), urllib.parse.urlencode({'d': default, 's': str(size)})) + + +# return an image tag with the gravatar +# TEMPLATE USE: {{ email|gravatar:150 }} +@register.filter +def gravatar(email, size=40): + url = gravatar_url(email, size) + return mark_safe('' % (url, size, size)) + + """ @register.tag def parseCategoryName(parser,token): diff --git a/blog/views.py b/blog/views.py index 11f1cac..406c783 100644 --- a/blog/views.py +++ b/blog/views.py @@ -13,6 +13,7 @@ from django.template.defaultfilters import stringfilter from django.utils.safestring import mark_safe from django.core.exceptions import ObjectDoesNotExist from comments.forms import CommentForm +from comments.models import Comment class ArticleListView(ListView): @@ -62,9 +63,13 @@ class ArticleDetailView(DetailView): if self.request.user.is_authenticated(): user = self.request.user form.fields["email"].initial = user.email - form.fields["name"].initial=user.username + form.fields["name"].initial = user.username + article_comments = self.object.comment_set.all() + print(article_comments) kwargs['form'] = form + kwargs['article_comments'] = article_comments + kwargs['comment_count'] = len(article_comments) if article_comments else 0; next_article = get_article(articleid + 1) prev_article = get_article(articleid - 1) kwargs['next_article'] = next_article diff --git a/comments/views.py b/comments/views.py index 2a04c9a..daf0293 100644 --- a/comments/views.py +++ b/comments/views.py @@ -44,4 +44,5 @@ class CommentPostView(FormView): comment.article = article comment.save(True) - return HttpResponseRedirect('/') + + return HttpResponseRedirect(article.get_absolute_url()) diff --git a/templates/blog/articledetail.html b/templates/blog/articledetail.html old mode 100644 new mode 100755 index 535fc69..20b614d --- a/templates/blog/articledetail.html +++ b/templates/blog/articledetail.html @@ -26,12 +26,15 @@ class="meta-nav">→ {% endif %} - {% if article.comment_status == "o" %} - {% comment %}{% load comments_tags %} - {% load_post_comment article from %}{% endcomment %} - {% include 'comments/tags/post_comment.html' %} - {% endif %} + + {% if article.comment_status == "o" %} + + {% comment %}{% load comments_tags %} + {% load_post_comment article from %}{% endcomment %} + {% include 'comments/tags/comment_list.html' %} + {% include 'comments/tags/post_comment.html' %} + {% endif %} {% endblock %} diff --git a/templates/blog/tags/sidebar.html b/templates/blog/tags/sidebar.html index b70675f..3549fbb 100755 --- a/templates/blog/tags/sidebar.html +++ b/templates/blog/tags/sidebar.html @@ -33,11 +33,22 @@ {% endif %} - - + + + {% endif %} {% if recent_articles %}