add pages vote

templates/blog/blog.html

@@ -2,10 +2,12 @@
 
 {% block js_media %}
     {% include "comments/media-js.html" %}
+    {% include "pagevotes/media-js.html" %}
 {% endblock %}
 
 {% block media %}
     {% include "comments/media-css.html" %}
+    {% include "pagevotes/media-css.html" %}
 {% endblock %}
 
 {% block title_row %}
@@ -46,6 +48,7 @@
         {{ post_to_facebook(request, post, '<i class="fa fa-facebook-official"></i>') }}
         {{ post_to_twitter(request, SITE_NAME + ':', post, '<i class="fa fa-twitter"></i>') }}
     </span>
+    {% include "pagevotes/list.html" %}
     {% include "comments/list.html" %}
 {% endblock %}
 

templates/pagevotes/list.html

@@ -0,0 +1,22 @@
+{% set logged_in = request.user.is_authenticated %}
+{% set profile = request.profile if logged_in else None %}
+<div class="page-vote">
+    <div class="page-vote-full" style="margin-right: 5px;">
+    {% if logged_in %}
+        <a href="javascript:pagevote_upvote({{ pagevote.id }})"
+        class="upvote-link fa fa-chevron-up fa-fw{% if pagevote.vote_score(request.profile) == 1 %} voted{% endif %}"></a>
+    {% else %}
+        <a href="javascript:alert('{{ _('Please log in to vote')|escapejs }}')" title="{{ _('Please log in to vote') }}"
+        class="upvote-link fa fa-chevron-up fa-fw"></a>
+    {% endif %}
+    <br>
+    <div class="pagevote-score"> {{ pagevote.score }} </div>
+    {% if logged_in %}
+        <a href="javascript:pagevote_downvote({{ pagevote.id }})"
+        class="downvote-link fa fa-chevron-down fa-fw{% if pagevote.vote_score(request.profile) == -1 %} voted{% endif %}"></a>
+    {% else %}
+        <a href="javascript:alert('{{ _('Please log in to vote')|escapejs }}')" title="{{ _('Please log in to vote') }}"
+        class="downvote-link fa fa-chevron-down fa-fw"></a>
+    {% endif %}
+    </div>  
+</div>

templates/pagevotes/media-css.html

@@ -0,0 +1,19 @@
+<style>
+    .page-vote {
+        border: 1px solid #ccc;
+        display: flex;
+        justify-content: center;
+    }
+    .pagevote-score {
+        text-align: center;
+        font-weight: bold;
+    }
+
+    .upvote-link, .downvote-link {
+        color: black;
+    }
+
+    .voted {
+        text-shadow: 0 0 4px black, 0 0 9px blue;
+    }
+</style>

templates/pagevotes/media-js.html

@@ -0,0 +1,54 @@
+<script src="{{ static('libs/featherlight/featherlight.min.js') }}" type="text/javascript"></script>
+{% compress js %}
+    <script type="text/javascript">
+        $(document).ready(function () {
+            function ajax_vote(url, id, delta, on_success) {
+                return $.ajax({
+                    url: url,
+                    type: 'POST',
+                    data: {
+                        id: id
+                    },
+                    success: function (data, textStatus, jqXHR) {
+                        var score = $('.page-vote-full' + ' .pagevote-score').first();
+                        score.text(parseInt(score.text()) + delta);
+                        if (typeof on_success !== 'undefined')
+                            on_success();
+                    },
+                    error: function (data, textStatus, jqXHR) {
+                        alert('Could not vote: ' + data.responseText);
+                    }
+                });
+            }
+
+            var get_$votes = function () {
+                var $post = $('.page-vote-full');
+                return {
+                    upvote: $post.find('.upvote-link').first(),
+                    downvote: $post.find('.downvote-link').first()
+                };
+            };
+
+            window.pagevote_upvote = function (id) {
+                ajax_vote('{{ url('pagevote_upvote') }}', id, 1, function () {
+                    var $votes = get_$votes();
+                    if ($votes.downvote.hasClass('voted'))
+                        $votes.downvote.removeClass('voted');
+                    else
+                        $votes.upvote.addClass('voted');
+                });
+            };
+
+            window.pagevote_downvote = function (id) {
+                ajax_vote('{{ url('pagevote_downvote') }}', id, -1, function () {
+                    var $votes = get_$votes();
+                    if ($votes.upvote.hasClass('voted'))
+                        $votes.upvote.removeClass('voted');
+                    else
+                        $votes.downvote.addClass('voted');
+                });
+            };
+
+        });
+    </script>
+{% endcompress %}