Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] Comment reply should not refresh the page #4

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open

[BUG] Comment reply should not refresh the page #4

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
5744eda
Create ajax version of comment submission on events
rocity Nov 7, 2016
a1aac6a
Remove reloading of page when user submits a comment
rocity Nov 8, 2016
fb3da42
Remove reloading of page when submitting comment replies
rocity Nov 8, 2016
a7170c2
Remove commented code
rocity Nov 10, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 17 additions & 24 deletions assets/css/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,67 +2,54 @@
font-family: 'Lato-Thin';
src: url(../fonts/Lato-Thin.ttf);
}

@font-face {
font-family: 'Lato-Regular';
src: url(../fonts/Lato-Regular.ttf);
}

@font-face {
font-family: 'Lato-LightItalic';
src: url(../fonts/Lato-LightItalic.ttf);
}

@font-face {
font-family: 'Lato-Light';
src: url(../fonts/Lato-Light.ttf);
}

@font-face {
font-family: 'Montserrat-Light';
src: url(../fonts/Montserrat-Light.otf);
}

@font-face {
font-family: 'Montserrat-Hairline';
src: url(../fonts/Montserrat-Hairline.otf);
}

@font-face {
font-family: 'Montserrat-Regular';
src: url(../fonts/Montserrat-Regular.otf);
}

@font-face {
font-family: 'Montserrat-SemiBold';
src: url(../fonts/Montserrat-SemiBold.otf);
}

@font-face {
font-family: 'Montserrat-UltraLight';
src: url(../fonts/Montserrat-UltraLight.otf);
}

@font-face {
font-family: 'OpenSans-Light';
src: url(../fonts/OpenSans-Light.ttf);
}

@font-face {
font-family: 'OpenSans-Regular';
src: url(../fonts/OpenSans-Regular.ttf);
}

@font-face {
font-family: 'Georgia-Regular';
src: url(../fonts/georgia.ttf);
}

@font-face {
font-family: 'FabfeltScript';
src: url(../fonts/FabfeltScript-Bold.otf);
}

/* line 56, ../sass/_typography.scss */
body {
-webkit-font-smoothing: antialiased;
Expand Down Expand Up @@ -1636,51 +1623,57 @@ body {
color: #1f62ae;
transition: 1s;
}
/* line 232, ../sass/_event.scss */
.comment-section .actions .author {
color: #303030;
font-weight: 700;
margin: 0;
}

/* line 236, ../sass/_event.scss */
/* line 241, ../sass/_event.scss */
.event-sidebar .owl-carousel {
background: none;
margin: 0;
}
/* line 241, ../sass/_event.scss */
/* line 246, ../sass/_event.scss */
.event-sidebar .participants img {
border-radius: 5px;
}
/* line 245, ../sass/_event.scss */
/* line 250, ../sass/_event.scss */
.event-sidebar .author {
display: block;
margin-left: 4em;
line-height: 50%;
margin-top: 1em;
}
/* line 250, ../sass/_event.scss */
/* line 255, ../sass/_event.scss */
.event-sidebar .author a {
color: #303030;
font-weight: 700;
font-size: 1.2em;
}
/* line 256, ../sass/_event.scss */
/* line 261, ../sass/_event.scss */
.event-sidebar .about-author {
margin: 3em 0;
}
/* line 258, ../sass/_event.scss */
/* line 263, ../sass/_event.scss */
.event-sidebar .about-author p {
font-style: italic;
color: #666666;
font-weight: 400;
line-height: 150%;
text-align: justify;
}
/* line 267, ../sass/_event.scss */
/* line 272, ../sass/_event.scss */
.event-sidebar .form .form-control {
border: #888888 solid 1px;
border-radius: 2px;
}
/* line 270, ../sass/_event.scss */
/* line 275, ../sass/_event.scss */
.event-sidebar .form .form-control:focus {
box-shadow: none;
}
/* line 274, ../sass/_event.scss */
/* line 279, ../sass/_event.scss */
.event-sidebar .form .subscribe-btn {
color: #fff;
background: #ed145b;
Expand All @@ -1691,7 +1684,7 @@ body {
.gradient1 {
background: #556270;
/* fallback for old browsers */
background: -webkit-linear-gradient(to left, #556270, #ff6b6b);
background: -webkit-linear-gradient(to left, #556270, #FF6B6B);
/* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #556270, #ff6b6b);
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
Expand All @@ -1701,7 +1694,7 @@ body {
.reef {
background: #50C9C3;
/* fallback for old browsers */
background: -webkit-linear-gradient(to left, #50c9c3, #96deda);
background: -webkit-linear-gradient(to left, #50C9C3, #96DEDA);
/* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #50c9c3, #96deda);
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
Expand Down
4 changes: 1 addition & 3 deletions assets/js/message.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,14 @@ $(function () {
var data = $(this).serialize();
$.post(url, data).done(function(response){
$('#result').prepend(response);
location.reload();
$('.form-comments').trigger("reset");
data = {};
});
return false;
});

//reply to a comment
$('.reply').on('click', function (e) {
$(document).on('click', '.reply', function (e) {
e.preventDefault();
var parent = $(this).parent();

Expand All @@ -28,7 +27,6 @@ $(function () {

$.post(url, form).done(function (response) {
parent.find('.reply-list').append(response);
location.reload();
$('.form-reply').trigger("reset");
data = {};
});
Expand Down
31 changes: 27 additions & 4 deletions events/api.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,10 @@
from rest_framework.viewsets import ViewSet
from rest_framework.response import Response
from rest_framework.permissions import AllowAny
from rest_framework.renderers import JSONRenderer, TemplateHTMLRenderer
from .models import Event, EventComment, Feedback
from .serializers import EventSerializer, EventCommentSerializer, FeedbackSerializer
from .forms import EventCommentForm

from braces.views import LoginRequiredMixin

Expand Down Expand Up @@ -61,6 +63,7 @@ class EventCommentsAPI(LoginRequiredMixin, ViewSet):
"""API endpoint for the list of comments for specific event
"""
serializer_class = EventCommentSerializer
renderer_classes = (TemplateHTMLRenderer, JSONRenderer)

def list(self, *args, **kwargs):
event_id = kwargs.get('event_id')
Expand All @@ -78,8 +81,22 @@ def create_comment(self, request, **kwargs):
event_title=event_id,
user=self.request.user.id))
if serializer.is_valid():
serializer.save()
return Response(serializer.data, status=201)
saved_data = serializer.save()

# build comment dict to be used on the comment template
result_comment = {
'event': { 'id': event_id },
'comment': { 'id': saved_data.id },
'form': EventCommentForm(),
'profile': saved_data.user,
'message': {
'message': saved_data.comment,
'get_full_name': saved_data.user.get_full_name(),
'message_date': saved_data.comment_date
}
}

return Response(result_comment, status=201, template_name='events/comment.html')
return Response(serializer.errors, status=400)

def get_comment(self, request, **kwargs):
Expand All @@ -105,6 +122,7 @@ class EventCommentReplyAPI(LoginRequiredMixin, ViewSet):
"""API endpoint for the list of replies for a specific comment
"""
serializer_class = EventCommentSerializer
renderer_classes = (TemplateHTMLRenderer, JSONRenderer)

def list(self, *args, **kwargs):
event_id = kwargs.get('event_id')
Expand All @@ -125,8 +143,13 @@ def create_reply(self, request, **kwargs):
user=self.request.user.id,
parent=comment_id))
if serializer.is_valid():
serializer.save()
return Response(serializer.data, status=201)
saved_data = serializer.save()

# build comment dict to be used on the comment template
result_reply = {
'reply': saved_data,
}
return Response(result_reply, status=201, template_name='events/reply.html')
return Response(serializer.errors, status=400)

def get_reply(self, request, **kwargs):
Expand Down
2 changes: 1 addition & 1 deletion events/models.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -96,4 +96,4 @@ class EventComment(models.Model):
comment_date = models.DateTimeField(auto_now_add=True)

def __str__(self):
return "{user} {comment}".format(user=self.user, comment=self.comment)
return "{user} {comment}".format(user=self.user, comment=self.comment)
20 changes: 11 additions & 9 deletions templates/events/comment.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,22 +17,24 @@
{{ message.message }}
</p>
</div>

<div class="actions">
<div class="reply-list">
</div>
<a href="#" class="reply">Reply</a>
<a href="#" class="favorite"><i class="fa fa-heart " aria-hidden="true"></i> <span>1</span> Favorite</a>
<div class="comment-reply hide">
<form class="form-messages" method="post" >
{% csrf_token %}
<div class="event-content">
<input type="hidden" class="parent-id" value="{{ message.id }}"/>
{{ form.message }}
<div class="comment-reply hide">
<form class="form-reply" action="{% url 'reply_list' event.id comment.id %}">
{% csrf_token %}
<input type="hidden" class="parent-id" value="{{ comment.id }}"/>
{{ form.comment }}
<div class="text-right">
<button class="btn post">Post</button>
<button class="btn post">Reply</button>
</div>
</div>
</form>
</form>
</div>
</div>

</div>
</div>
</div>
41 changes: 21 additions & 20 deletions templates/events/detail.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,26 @@ <h5>
</p>
<div class="actions">
<div class="reply-list">
{% for reply in comment.replies.all %}

<div class="comment">
<a href="#" class="avatar">
<img src="{{ reply.user.profile_picture|get_image_url }}">
</a>
<div class="content">
<a href="#" class="pull-right close"><i class="fa fa-times" aria-hidden="true"></i></a>
<a href="#" class="author">{{ reply.user.get_full_name }}</a>
<div class="metadata">
<span class="date">{{ reply.comment_date | timesince }}</span>
</div>
<div class="text">
<p>
{{ reply.comment }}
</p>
</div>
</div>
</div>
{% endfor %}
</div>
<a href="#" class="reply">Reply</a>
<a href="#" class="favorite"><i class="fa fa-heart " aria-hidden="true"></i> <span>1</span> Favorite</a>
Expand All @@ -82,26 +102,7 @@ <h5>
</div>
</div>

{% for reply in comment.replies.all %}

<div class="comment">
<a href="#" class="avatar">
<img src="{{ reply.user.profile_picture|get_image_url }}">
</a>
<div class="content">
<a href="#" class="pull-right close"><i class="fa fa-times" aria-hidden="true"></i></a>
<a href="#" class="author">{{ reply.user.get_full_name }}</a>
<div class="metadata">
<span class="date">{{ reply.comment_date | timesince }}</span>
</div>
<div class="text">
<p>
{{ reply.comment }}
</p>
</div>
</div>
</div>
{% endfor %}

</div>
</div>
</div>
Expand Down
31 changes: 14 additions & 17 deletions templates/events/reply.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,23 +1,20 @@
{% load staticfiles profile %}


<div class="event-content comment-section">
<div class="comment">
<a href="#" class="avatar">
<img src="{{ profile.profile_picture|get_image_url }}">
</a>
<div class="content">
<a href="#" class="pull-right close"><i class="fa fa-times" aria-hidden="true"></i></a>
<a href="#" class="author">{{ message.user.get_full_name }}</a>
<div class="metadata">
<span class="date">{{ message.message_date | timesince }}</span>
</div>
<div class="text">
<p>
{{ message.message }}
</p>
</div>

<div class="comment">
<a href="#" class="avatar">
<img src="{{ reply.user.profile_picture|get_image_url }}">
</a>
<div class="content">
<a href="#" class="pull-right close"><i class="fa fa-times" aria-hidden="true"></i></a>
<a href="#" class="author">{{ reply.user.get_full_name }}</a>
<div class="metadata">
<span class="date">{{ reply.comment_date | timesince }}</span>
</div>
<div class="text">
<p>
{{ reply.comment }}
</p>
</div>
</div>
</div>