diff options
Diffstat (limited to 'newspipe')
-rw-r--r-- | newspipe/static/js/articles.js | 48 | ||||
-rw-r--r-- | newspipe/templates/article.html | 8 | ||||
-rw-r--r-- | newspipe/templates/home.html | 6 |
3 files changed, 47 insertions, 15 deletions
diff --git a/newspipe/static/js/articles.js b/newspipe/static/js/articles.js index 1075a7ef..103074f4 100644 --- a/newspipe/static/js/articles.js +++ b/newspipe/static/js/articles.js @@ -22,8 +22,6 @@ API_ROOT = '/api/v2.0/' function change_unread_counter(feed_id, increment) { - console.log(document.getElementById("unread-"+feed_id)); - el = document.getElementById("unread-"+feed_id) if (el != null) { var new_value = parseInt(el.textContent) + increment; @@ -49,7 +47,7 @@ document.getElementsByClassName('open-article').onclick = function fun() { }; -// Mark an article as read or unread. +// Mark an article as read or unread from the home page var nodes = document.getElementsByClassName('readed'); Array.prototype.map.call(nodes, function(node) { node.onclick = function() { @@ -103,6 +101,40 @@ Array.prototype.map.call(nodes, function(node) { }); +// Mark an article as read or unread from the article page +var nodes = document.getElementsByClassName('readed-article-page'); +Array.prototype.map.call(nodes, function(node) { + node.onclick = function() { + var article_id = node.parentNode.parentNode.parentNode.getAttribute("data-article"); + + var data; + if (node.classList.contains('fa-square-o')) { + data = JSON.stringify({readed: false}) + node.classList.remove('fa-square-o'); + node.classList.add('fa-check-square-o'); + } + else { + data = JSON.stringify({readed: true}) + node.classList.remove('fa-check-square-o'); + node.classList.add('fa-square-o'); + } + + // sends the updates to the server + fetch(API_ROOT + "article/" + article_id, { + method: "PUT", + headers: { + 'Content-Type': 'application/json', + }, + body: data + }).then(res => { + console.log("Request complete! response:", res); + }).catch((error) => { + console.error('Error:', error); + });; + } +}); + + // Like or unlike an article var nodes = document.getElementsByClassName('like'); @@ -110,18 +142,18 @@ Array.prototype.map.call(nodes, function(node) { node.onclick = function() { var article_id = node.parentNode.parentNode.parentNode.getAttribute('data-article'); var data; - if (node.classList.contains("fa-heart")) { + if (node.classList.contains("fa-star")) { data = JSON.stringify({like: false}); - node.classList.remove('fa-heart'); - node.classList.add('fa-heart-o'); + node.classList.remove('fa-star'); + node.classList.add('fa-star-o'); if(window.location.pathname.indexOf('/favorites') != -1) { node.parentNode.parentNode.parentNode.remove(); } } else { data = JSON.stringify({like: true}) - node.classList.remove('fa-heart-o'); - node.classList.add('fa-heart'); + node.classList.remove('fa-star-o'); + node.classList.add('fa-star'); } // sends the updates to the server diff --git a/newspipe/templates/article.html b/newspipe/templates/article.html index 00ec3bde..5eff64e7 100644 --- a/newspipe/templates/article.html +++ b/newspipe/templates/article.html @@ -1,7 +1,7 @@ {% extends "layout.html" %} {% block content %} -<div class="container" data-article="{{ article.id }}"> - <div class="row"> +<div class="container"> + <div class="row" data-article="{{ article.id }}" id="filters" data-filter="{{ filter_ }}"> <div class="col"> <h2><a href="{{ article.link }}" target="_blank">{{ article.title|safe }}</a></h2> <h3>{{ _('from') }} <a href="/feed/{{ article.source.id }}">{{ article.source.title }}</a></h3> @@ -12,9 +12,9 @@ <a href="#"><i class="fa fa-star-o like" aria-hidden="true" title="{{ _('Click if you like this article') }}"></i></a> {% endif %} {% if article.readed %} - <a href="#"><i class="fa fa-square-o readed" title="{{ _('Mark this article as unread') }}"></i></a> + <a href="#"><i class="fa fa-square-o readed-article-page" title="{{ _('Mark this article as unread') }}"></i></a> {% else %} - <a href="#"><i class="fa fa-check-square-o readed" aria-hidden="true" aria-hidden="true" title="{{ _('Mark this article as read') }}"></i></a> + <a href="#"><i class="fa fa-check-square-o readed-article-page" aria-hidden="true" aria-hidden="true" title="{{ _('Mark this article as read') }}"></i></a> {% endif %} <h6>{{ article.date | datetime }}</h6> </div> diff --git a/newspipe/templates/home.html b/newspipe/templates/home.html index ce9e39e8..46d96d0f 100644 --- a/newspipe/templates/home.html +++ b/newspipe/templates/home.html @@ -125,7 +125,7 @@ <a class="nav-link {% if filter_ == 'unread' %}active{% endif %}" href="{{ gen_url(filter_='unread') }}">{{ _('Unread') }}</a> </li> <li id="tab-unread" class="px-5 nav-item"> - <a class="nav-link {% if liked %}active{% endif %}" href="{{ gen_url(liked=not liked) }}"><i class="fa fa-heart" aria-hidden="true"></i> {{ _('Liked') }}</a> + <a class="nav-link {% if liked %}active{% endif %}" href="{{ gen_url(liked=not liked) }}"><i class="fa fa-star" aria-hidden="true"></i> {{ _('Liked') }}</a> </li> <li id="tab-nbdisplay" class="px-5 nav-item d-none d-lg-block"> <div id="nbdisplay"> @@ -166,9 +166,9 @@ <a href="#"><i class="fa fa-check-square-o readed" aria-hidden="true" title="{{ _('Mark this article as read') }}"></i></a> {% endif %} {% if article.like %} - <a href="#"><i class="fa fa-heart like" aria-hidden="true" title="{{ _('One of your favorites') }}"></i></a> + <a href="#"><i class="fa fa-star like" aria-hidden="true" title="{{ _('One of your favorites') }}"></i></a> {% else %} - <a href="#"><i class="fa fa-heart-o like" aria-hidden="true" title="{{ _('Click if you like this article') }}"></i></a> + <a href="#"><i class="fa fa-star-o like" aria-hidden="true" title="{{ _('Click if you like this article') }}"></i></a> {% endif %} </th> {% if not feed_id %} |