From adfc3eb9cbcb7989ac24ced6bcc8c9a97c1c9659 Mon Sep 17 00:00:00 2001
From: Olesia
Date: Wed, 8 Oct 2014 17:48:30 +0300
Subject: [PATCH] Likes through ajax
---
trip_journal_app/static/javascript/story.js | 69 +++++++++++++++++++
trip_journal_app/templates/story.html | 6 +-
trip_journal_app/templates/story_content.html | 6 +-
trip_journal_app/urls.py | 12 ++--
trip_journal_app/views.py | 22 ++----
5 files changed, 88 insertions(+), 27 deletions(-)
diff --git a/trip_journal_app/static/javascript/story.js b/trip_journal_app/static/javascript/story.js
index 78c8a66..5d8a0ac 100644
--- a/trip_journal_app/static/javascript/story.js
+++ b/trip_journal_app/static/javascript/story.js
@@ -1,11 +1,31 @@
window.onload = function() {
add_markers();
+
+ var likes = likeObjectsArray();
+ for (var i = 0; i < likes.length; i++) {
+ ( function (i) {
+ likes[i].likeLink.addEventListener('click', function(e){
+ e.preventDefault();
+ likeRequest(likes[i]);
+ }, 'false');
+ })(i);
+ }
}
var map;
var geocoder;
var markers = [];
+function getCookie(name) {
+ var value = '; ' + document.cookie;
+ var parts = value.split('; ' + name + '=');
+ if (parts.length === 2) {
+ return parts.pop().split(';').shift();
+ } else {
+ return undefined;
+ }
+}
+
function add_markers() {
var marker;
var blocks = document.getElementsByClassName('saved');
@@ -63,3 +83,52 @@ function centerMap(pos) {
map.setCenter(pos);
}
+function likeObjectsArray () {
+ var likes = [].slice.call(
+ document.getElementsByClassName('like')
+ );
+ likes.push(document.getElementById('like_story'));
+ var likesObjects = [];
+ for (var i = 0; i < likes.length; i++) {
+ console.log(likes[i]);
+ likesObjects.push(formObjectToLike(likes[i]));
+ }
+ return likesObjects;
+}
+
+function formObjectToLike(element) {
+ var objToLike = {},
+ children = element.childNodes;
+ for (var i = 0; i < children.length; i++) {
+ if (children[i].className === "likes_count") {
+ objToLike.likesCount = children[i];
+ }
+ else if (children[i].tagName === 'A') {
+ objToLike.url = children[i].getAttribute("href");
+ objToLike.likeLink = children[i];
+ }
+ }
+ return objToLike;
+}
+
+/*
+* Sends like POST request to picture or story url with id of that item.
+* When the response is returned adds 'liked' class to corresponding heart.
+* objToLike should have the following properties: url, element that contains
+* like count and link element to which class "liked" should be added.
+* */
+function likeRequest(objToLike) {
+ function showNewLike() {
+ if (xhr.readyState === 4 && xhr.status === 200) {
+ var likesCount = xhr.responseText;
+ objToLike.likesCount.innerHTML = likesCount;
+ objToLike.likeLink.classList.add("liked");
+ }
+ }
+ var xhr = new XMLHttpRequest();
+ xhr.open('POST', objToLike.url);
+ xhr.onreadystatechange = showNewLike;
+ xhr.setRequestHeader('X-CSRFToken', getCookie('csrftoken'));
+ xhr.setRequestHeader('X_REQUESTED_WITH', 'XMLHttpRequest');
+ xhr.send();
+}
diff --git a/trip_journal_app/templates/story.html b/trip_journal_app/templates/story.html
index 51aab47..8dff208 100644
--- a/trip_journal_app/templates/story.html
+++ b/trip_journal_app/templates/story.html
@@ -26,9 +26,9 @@
by
{{ story.user }}
- {{ story.likes_count }}
- Like
+ {{ story.likes_count }}
+ Like
diff --git a/trip_journal_app/templates/story_content.html b/trip_journal_app/templates/story_content.html
index 29f420a..0ee43fd 100644
--- a/trip_journal_app/templates/story_content.html
+++ b/trip_journal_app/templates/story_content.html
@@ -12,10 +12,10 @@
{{story_block.marker}}
-
+
Like
- {{ story_block.pic.likes_count }}
+ {{ story_block.pic.likes_count }}
{% elif page == 'edit' %}
{{ story_block.pic|get_stored_pic_by_size:800 }}
diff --git a/trip_journal_app/urls.py b/trip_journal_app/urls.py
index 1bf7d4f..b097bf8 100755
--- a/trip_journal_app/urls.py
+++ b/trip_journal_app/urls.py
@@ -15,11 +15,13 @@
# list of user stories
url(r'^my_stories/$', views.user_stories, name='user_stories'),
# add likes to stories
- url(r'^story/addrating/(?P\d+)/$', views.addrating,
- name='addrating'),
+ url(r'^story/like/(?P\d+)/$', views.like,
+ {'item_to_like': 'Story'},
+ name='like_story'),
# add likes to pictures
- url(r'^story/addrating_to_pictures/$', views.addrating_to_pictures,
- name='addrating_to_pictures'),
+ url(r'^picture/like/(?P\d+)/$', views.like,
+ {'item_to_like': 'Picture'},
+ name='like_picture'),
# list of near by pictures
url(r'^pictures_near_by/$', views.show_picture_near_by_page,
name='pictures_near_by'),
@@ -27,7 +29,7 @@
url(r'^stories_near_by/$', views.show_story_near_by_page,
name='stories_near_by'),
url(r'^search_items_near_by/', views.search_items_near_by,
- name='search_items_near_by'),
+ name='search_items_near_by'),
url(r'^$', views.home, name='home'),
# toggling publish state for story
url(r'^publish/(?P\d+)$', views.publish, name='publish'),
diff --git a/trip_journal_app/views.py b/trip_journal_app/views.py
index 920b496..27df931 100755
--- a/trip_journal_app/views.py
+++ b/trip_journal_app/views.py
@@ -164,23 +164,13 @@ def make_paging_for_items_search(request):
@login_required
-def addrating(request, story_id):
- story = get_object_or_404(Story, pk=int(story_id))
- user = auth.get_user(request)
- story.likes.add(user)
- story.save()
- return redirect('/story/' + str(story_id))
-
-
-@login_required
-def addrating_to_pictures(request):
- story_id = request.GET['story']
- picture_id = request.GET['picture']
- pic = get_object_or_404(Picture, pk=int(picture_id))
+@require_POST
+def like(request, item_id, item_to_like):
+ item = get_object_or_404(globals()[item_to_like], pk=int(item_id))
user = auth.get_user(request)
- pic.likes.add(user)
- pic.save()
- return redirect('/story/' + str(story_id))
+ item.likes.add(user)
+ item.save()
+ return HttpResponse(item.likes_count())
@login_required