Prettify comment form
- Author
- Maarten Vangeneugden
- Date
- April 9, 2018, 7:51 p.m.
- Hash
- a1d53e02a2a6f7e2a70d7fc89ef173960a6c4e78
- Parent
- 49d0aeaffe4cf708a597a2408cfe94e2de26ad54
- Modified files
- templates/blog/post.html
- views.py
templates/blog/post.html ¶
1 addition and 0 deletions.
View changes Hide changes
1 |
1 |
{% load humanize %} |
2 |
2 |
{% load i18n %} |
3 |
3 |
{% load static %} |
4 |
4 |
|
5 |
5 |
{% block stylesheets %} |
6 |
6 |
{{ block.super }} |
7 |
7 |
<link href="{% static "blog/stylesheet.css" %}" rel="stylesheet" media="screen, projection" /> |
8 |
8 |
{% endblock %} |
9 |
9 |
|
10 |
10 |
{% block description %} |
11 |
11 |
{{ article|safe|truncatewords_html:20 }} |
12 |
12 |
{% endblock description %} |
13 |
13 |
{% block title %}📚 {{ navbar_title }}{% endblock title %} |
14 |
14 |
|
15 |
15 |
|
16 |
16 |
{% block main %} |
17 |
17 |
{% with color="brown" accent_color="yellow" %} |
18 |
18 |
<div class="section {{ color }} lighten-1 z-depth-3"> |
19 |
19 |
<div class="container"> |
20 |
20 |
<article style="font-family:serif;"> |
21 |
21 |
{{ article|safe }} |
22 |
22 |
</article> |
23 |
23 |
|
24 |
24 |
|
25 |
25 |
<h5 class="white-text">{% trans "This article in other languages" %}</h5> |
26 |
26 |
|
27 |
27 |
{% get_language_info for 'nl' as LANG %} |
28 |
28 |
<a {% if dutch_link %} href="{{dutch_link}}" {% endif %} |
29 |
29 |
class="btn {{accent_color}} accent-4 black-text waves-effect |
30 |
30 |
{% if not dutch_link %}disabled{% endif %}"> |
31 |
31 |
🇧🇪 {{ LANG.name_translated}} 🇳🇱 |
32 |
32 |
</a> |
33 |
33 |
{% get_current_language as lang %} |
34 |
34 |
{% get_language_info for 'fr' as LANG %} |
35 |
35 |
<a {% if french_link %} href="{{french_link}}" {% endif %} |
36 |
36 |
class="btn {{accent_color}} accent-4 black-text waves-effect |
37 |
37 |
{% if not french_link %}disabled{% endif %}"> |
38 |
38 |
🇧🇪 {{ LANG.name_translated}} 🇫🇷 |
39 |
39 |
</a> |
40 |
40 |
{% get_language_info for 'en' as LANG %} |
41 |
41 |
<a {% if english_link %} href="{{english_link}}" {% endif %} |
42 |
42 |
class="btn {{accent_color}} accent-4 black-text waves-effect |
43 |
43 |
{% if not english_link %}disabled{% endif %}"> |
44 |
44 |
🇬🇧 {{ LANG.name_translated}} 🇺🇸 |
45 |
45 |
</a> |
46 |
46 |
{% get_language_info for 'de' as LANG %} |
47 |
47 |
<a {% if german_link %} href="{{german_link}}" {% endif %} |
48 |
48 |
class="btn {{accent_color}} accent-4 black-text waves-effect |
49 |
49 |
{% if not german_link %}disabled{% endif %}"> |
50 |
50 |
🇧🇪 {{ LANG.name_translated}} 🇩🇪 |
51 |
51 |
</a> |
52 |
52 |
{% get_language_info for 'es' as LANG %} |
53 |
53 |
<a {% if spanish_link %} href="{{spanish_link}}" {% endif %} |
54 |
54 |
class="btn {{accent_color}} accent-4 black-text waves-effect |
55 |
55 |
{% if not spanish_link %}disabled{% endif %}"> |
56 |
56 |
🇪🇸 {{ LANG.name_translated}} 🇲🇽 |
57 |
57 |
</a> |
58 |
58 |
|
59 |
59 |
<h5 class="white-text">{% trans "Comments" %}</h5> |
60 |
60 |
{% for comment in comments %} {# Whoops =P #} |
61 |
61 |
<span class="white-text">{{ comment.name|title }} | </span> |
62 |
62 |
<time class="grey-text" datetime="{{ comment.date|date:'c' }}">{{ comment.date|naturaltime }}</time> |
63 |
63 |
<br /> |
64 |
64 |
<p class="white-text">{{ comment.text|urlize }}</p> |
65 |
65 |
<hr /> |
66 |
66 |
{% endfor %} |
67 |
67 |
{# Form for new comment #} |
68 |
68 |
<form action="" method="POST"> |
69 |
69 |
{% csrf_token %} |
70 |
70 |
{{ form.name.label_tag }} |
+ |
71 |
{{ form.name.label_tag }} |
71 |
72 |
<input class="white-text browser-default" type="text" id="id_name" name="name" maxlength="64" required /> |
72 |
73 |
{{ form.text.label_tag }} |
73 |
74 |
<textarea id="id_text" class="white-text" name="text" maxlength="1000" required></textarea> |
74 |
75 |
<input type="submit" value="{% trans "Submit" %}" /> |
75 |
76 |
</form> |
76 |
77 |
|
77 |
78 |
|
78 |
79 |
{% comment %} |
79 |
80 |
<a href="{% url 'blog-post' post_slug %}" class="btn {{accent_color}} accent-4 black-text tooltipped" data-position="bottom" data-delay="50" data-tooltip="{% trans "Multilingual link. Links to the version in the viewer's preferred language." %}">🏳️🌈 {% trans "All available languages" %}</a> |
80 |
81 |
{# TODO: Change to rainbow flag when possible #} |
81 |
82 |
{% endcomment %} |
82 |
83 |
</div> |
83 |
84 |
|
84 |
85 |
</div> |
85 |
86 |
<div class="container"> |
86 |
87 |
{% for title, date, description, link in post_links %} |
87 |
88 |
<h2 class="{{ color}}-text">{{ title }}</h2> |
88 |
89 |
{# FIXME: Date is in all languages of the same format. Fix for each language #} |
89 |
90 |
<span class="grey-text">{{ date|date:"l j F Y" }}</span> |
90 |
91 |
{#<p class="hide-on-small-only">{{ description }}</p>#} |
91 |
92 |
<p class="hide-on-small-only">{% lorem %}</p> |
92 |
93 |
<a class="btn {{accent_color}} accent-3" href="{{link}}"> |
93 |
94 |
{% trans "Read on"%} |
94 |
95 |
</a> |
95 |
96 |
<hr /> |
96 |
97 |
{% endfor %} |
97 |
98 |
</div> |
98 |
99 |
{% endwith %} |
99 |
100 |
{% endblock main %} |
100 |
101 |
views.py ¶
1 addition and 0 deletions.
View changes Hide changes
1 |
1 |
import subprocess |
2 |
2 |
|
3 |
3 |
from django.utils.translation import ugettext as _ |
4 |
4 |
from django.shortcuts import get_object_or_404, render # This allows to render the template with the view here. It's pretty cool and important. |
5 |
5 |
from django.http import HttpResponseRedirect, HttpResponse |
6 |
6 |
from django.core.urlresolvers import reverse |
7 |
7 |
from django.template import loader # This allows to actually load the template. |
8 |
8 |
from .models import Post, Comment |
9 |
9 |
from .forms import CommentForm |
10 |
10 |
from django.core.exceptions import ObjectDoesNotExist |
11 |
11 |
from django.utils import translation |
12 |
12 |
|
13 |
13 |
GERMAN = "de" |
14 |
14 |
SPANISH = "es" |
15 |
15 |
FRENCH = "fr" |
16 |
16 |
DUTCH = "nl" |
17 |
17 |
ENGLISH = "en" |
18 |
18 |
|
19 |
19 |
footer_links = [ |
20 |
20 |
[_("Blog main page"), "/blog"], |
21 |
21 |
[_("Contact"), "mailto:maarten.vangeneugden@student.uhasselt.be"], |
22 |
22 |
] |
23 |
23 |
footer_description = _("Maarten's personal blog, with sprinkles and a dollop of healthy bugs.") |
24 |
24 |
|
25 |
25 |
# FIXME: Remove this template trash. THIS IS A VIEW, NOT A FUCKING TEMPLATE FFS |
26 |
26 |
context = { |
27 |
27 |
'materialDesign_color': "green", |
28 |
28 |
'materialDesign_accentColor': "purple", |
29 |
29 |
'navbar_title': "Blog", |
30 |
30 |
'navbar_fixed': True, |
31 |
31 |
'navbar_backArrow': True, |
32 |
32 |
#'footer_title': "Maarten's blog", |
33 |
33 |
#'footer_description': "My personal scribbly notepad.", |
34 |
34 |
#'footer_links': footer_links, |
35 |
35 |
} |
36 |
36 |
|
37 |
37 |
def org_to_html(file_path): |
38 |
38 |
""" Converts the given org formatted file to HTML. |
39 |
39 |
This function directly returns the resulting HTML code. This function uses |
40 |
40 |
the amazing Haskell library Pandoc to convert the file (and takes care |
41 |
41 |
of header id's and all that stuff). |
42 |
42 |
""" |
43 |
43 |
# FIXME: Remove hardcoded link to media. Replace with media tag! |
44 |
44 |
return subprocess.check_output(["pandoc", "--from=org", "--to=html", "/srv/django/website/media/"+file_path]) |
45 |
45 |
|
46 |
46 |
def get_available_post_languages(post): |
47 |
47 |
""" Returns the language codes for which a blog post exists. This function |
48 |
48 |
always returns English (because that field mustn't be empty). |
49 |
49 |
So say a blog post has an English, Dutch and French version (which means |
50 |
50 |
english_file, french_file and dutch_file aren't empty), the function will return {"en", |
51 |
51 |
"fr", "nl"}. """ |
52 |
52 |
available_languages = {ENGLISH} |
53 |
53 |
if post.german_file != "": |
54 |
54 |
available_languages.add(GERMAN) |
55 |
55 |
if post.spanish_file != "": |
56 |
56 |
available_languages.add(SPANISH) |
57 |
57 |
if post.french_file != "": |
58 |
58 |
available_languages.add(FRENCH) |
59 |
59 |
if post.dutch_file != "": |
60 |
60 |
available_languages.add(DUTCH) |
61 |
61 |
return available_languages |
62 |
62 |
|
63 |
63 |
def get_preferred_post_language(post, language): |
64 |
64 |
""" Returns the post language file that best suits the given language. This |
65 |
65 |
is handy if you know what language the user prefers, but aren't sure whether |
66 |
66 |
you can provide that language. This function will try to provide the file |
67 |
67 |
for that language, or return English if that's not possible. """ |
68 |
68 |
if language == GERMAN and post.german_file is not None: |
69 |
69 |
return post.german_file |
70 |
70 |
if language == SPANISH and post.spanish_file is not None: |
71 |
71 |
return post.spanish_file |
72 |
72 |
if language == FRENCH and post.french_file is not None: |
73 |
73 |
return post.french_file |
74 |
74 |
if language == DUTCH and post.dutch_file is not None: |
75 |
75 |
return post.dutch_file |
76 |
76 |
return post.english_file # Returned if all other choices wouldn't be satisfactory, or the requested language is English. |
77 |
77 |
|
78 |
78 |
def index(request): |
79 |
79 |
template = "blog/index.html" |
80 |
80 |
posts = Post.objects.all() |
81 |
81 |
language = translation.get_language() |
82 |
82 |
|
83 |
83 |
post_links = [] |
84 |
84 |
for post in posts: |
85 |
85 |
blog_file = get_preferred_post_language(post, language) |
86 |
86 |
# TODO: Find a cleaner way to determine the title. First and foremost: |
87 |
87 |
# If the language differs from English, the other language file needs to |
88 |
88 |
# be loaded. Plus: look for a built in function to remove the full path |
89 |
89 |
# and only return the file name. |
90 |
90 |
title = (blog_file.name.rpartition("/")[2]).rpartition(".")[0] |
91 |
91 |
human_title = title.replace("_"," ") |
92 |
92 |
date = post.published |
93 |
93 |
blog_text = org_to_html(blog_file.name) |
94 |
94 |
# TODO: The link can possibly be reversed in the DTL using the title, which is actually |
95 |
95 |
# a cleaner way to do it. Investigate. |
96 |
96 |
link = reverse("blog-post-language", args=[language, post.slug(language)]) |
97 |
97 |
post_links.append([human_title, date, blog_text, link]) |
98 |
98 |
|
99 |
99 |
context = { |
100 |
100 |
'posts': post_links, |
101 |
101 |
'materialDesign_color': "brown", |
102 |
102 |
'materialDesign_accentColor': "yellow", |
103 |
103 |
'navbar_title': _("Notepad from a student"), |
104 |
104 |
'navbar_backArrow': True, |
105 |
105 |
'footer_links': footer_links, |
106 |
106 |
'footer_description': footer_description, |
107 |
107 |
} |
108 |
108 |
return render(request, template, context) |
109 |
109 |
|
110 |
110 |
def post(request, post_slug, language=None): |
111 |
111 |
if request.method == "POST": # Handling a reply if one is sent |
112 |
112 |
form = CommentForm(request.POST) |
113 |
113 |
if form.is_valid(): |
+ |
114 |
if form.is_valid(): |
114 |
115 |
form.save() |
115 |
116 |
|
116 |
117 |
if language is not None: |
117 |
118 |
if translation.check_for_language(language): |
118 |
119 |
translation.activate(language) |
119 |
120 |
request.session[translation.LANGUAGE_SESSION_KEY] = language |
120 |
121 |
#return post(request, post_slug) |
121 |
122 |
else: |
122 |
123 |
language = translation.get_language() |
123 |
124 |
|
124 |
125 |
template = "blog/post.html" |
125 |
126 |
posts = Post.objects.all() |
126 |
127 |
#comments = Comment.objects.filter(post |
127 |
128 |
for post in posts: |
128 |
129 |
if post.slug(language) == post_slug: |
129 |
130 |
comments = Comment.objects.filter(post=post) |
130 |
131 |
form = CommentForm(initial={'post': post}) |
131 |
132 |
blog_file = get_preferred_post_language(post, language) |
132 |
133 |
blog_text = org_to_html(blog_file.name) |
133 |
134 |
context = { |
134 |
135 |
'comments': comments, |
135 |
136 |
'form' : form, |
136 |
137 |
'human_post_title': blog_file.name.replace("_"," "), |
137 |
138 |
'materialDesign_color': "brown", |
138 |
139 |
'materialDesign_accentColor': "yellow", |
139 |
140 |
'article': blog_text, |
140 |
141 |
'title': str(blog_file), |
141 |
142 |
'navbar_title': ((blog_file.name.rpartition("/")[2]).rpartition(".")[0]).replace("_"," "), |
142 |
143 |
'navbar_backArrow': False, |
143 |
144 |
'post_slug': post_slug, |
144 |
145 |
'footer_links': footer_links, |
145 |
146 |
'footer_description': footer_description, |
146 |
147 |
} |
147 |
148 |
|
148 |
149 |
# Getting all available article links |
149 |
150 |
available = get_available_post_languages(post) |
150 |
151 |
if ENGLISH in available: |
151 |
152 |
context['english_link'] = reverse("blog-post-language", args=[ENGLISH, post.slug(ENGLISH)]) |
152 |
153 |
if DUTCH in available: |
153 |
154 |
context['dutch_link'] = reverse("blog-post-language", args=[DUTCH, post.slug(DUTCH)]) |
154 |
155 |
|
155 |
156 |
if FRENCH in available: |
156 |
157 |
context['french_link'] = reverse("blog-post-language", args=[FRENCH, post.slug(FRENCH)]) |
157 |
158 |
|
158 |
159 |
if SPANISH in available: |
159 |
160 |
context['spanish_link'] = reverse("blog-post-language", args=[SPANISH, post.slug(SPANISH)]) |
160 |
161 |
|
161 |
162 |
if GERMAN in available: |
162 |
163 |
context['german_link'] = reverse("blog-post-language", args=[GERMAN, post.slug(GERMAN)]) |
163 |
164 |
|
164 |
165 |
return render(request, template, context) |
165 |
166 |