improved feed menu

4 files changed, 53 insertions, 8 deletions

diff --git a/newspipe/static/css/custom.css b/newspipe/static/css/custom.css
index 0488c441..33b0509c 100644
--- a/newspipe/static/css/custom.css
+++ b/newspipe/static/css/custom.css
@@ -53,6 +53,14 @@ a {
     color: #0082c9;
 }
 
+.bg-primary {
+    background-color: #0082c9 !important;
+    opacity: 1;
+    color: white;
+    text-align: center;
+}
+
+
 /* Sticky footer */
 .footer {
   position: absolute;
diff --git a/newspipe/static/js/articles.js b/newspipe/static/js/articles.js
index 5fb84b46..99a5df4a 100644
--- a/newspipe/static/js/articles.js
+++ b/newspipe/static/js/articles.js
@@ -105,16 +105,16 @@ function change_unread_counter(feed_id, increment) {
     $('.like').on('click', function() {
         var article_id = $(this).parent().parent().parent().attr("data-article");
         var data;
-        if ($(this).hasClass("fa-star")) {
+        if ($(this).hasClass("fa-heart")) {
             data = JSON.stringify({like: false})
-            $(this).removeClass('fa-star').addClass('fa-star-o');
+            $(this).removeClass('fa-heart').addClass('fa-heart-o');
             if(window.location.pathname.indexOf('/favorites') != -1) {
                 $(this).parent().parent().parent().remove();
             }
         }
         else {
             data = JSON.stringify({like: true})
-            $(this).removeClass('fa-star-o').addClass('fa-star');
+            $(this).removeClass('fa-heart-o').addClass('fa-heart');
         }
 
         // sends the updates to the server
diff --git a/newspipe/templates/home.html b/newspipe/templates/home.html
index 3238ad9e..96b30aaf 100644
--- a/newspipe/templates/home.html
+++ b/newspipe/templates/home.html
@@ -15,8 +15,8 @@
     </div>
 {% else %}
     <div class="row">
-    <div id="sidebar" class="col-2 d-none d-lg-block">
-        <ul class="nav flex-column" data-offset-top="0" data-offset-bottom="0" style="min-height: 650px;">
+    <div id="sidebar" class="col-2 d-none d-lg-block" style="min-height: 650px;">
+        <ul class="nav flex-column" data-offset-top="0" data-offset-bottom="0">
             <li class="nav-item feed-menu"><a class="nav-link" href="{{ gen_url(feed=0) }}">
                 {% if not feed_id %}<b>{% endif %}
                     {{ _('All feeds') }}
@@ -26,7 +26,35 @@
             <li class="nav-item feed-commands"><span class="nav-link">
                 <a href="{{ url_for('article.mark_as', new_value='read') }}"><i class="fa fa-check-square-o" aria-hidden="true" title="{{ _('Mark all as read') }}"></i></a>
             </span></li>
-        {% for fid, nbunread in unread|dictsort(by='value')|reverse %}
+        </ul>
+        {% for catid, nbunread in unread_by_cat.items() if catid %}
+            <ul class="nav flex-column">
+            <div class="bg-primary clearfix">{{ categories[catid].name }}</div>
+            {% for feed in categories[catid].feeds if feed.id in unread.keys() %}
+                <li class="nav-item feed-menu {% if in_error.get(feed.id, 0) > 0 %}d-none{% endif %}" data-feed="{{ feed.id }}"><a class="nav-link" href="{{ gen_url(feed=feed.id) }}">
+                    {% if feed_id == feed.id %}<b>{% endif %}
+                        {% if in_error.get(feed.id, 0) > 0 %}
+                            <span style="background-color: {{ "red" if in_error[feed.id] > 2 else "orange" }} ;" class="badge pull-right" title="Some errors occured while trying to retrieve that feed.">{{ in_error[fid] }}</span>
+                        {% endif %}
+                        <span id="unread-{{ feed.id }}" class="badge pull-right">{{ unread[feed.id] }}</span>
+                        <img src="{{ url_for('icon.icon', url=feeds[feed.id].icon_url) }}" width="16px">
+                        {{ feeds[feed.id].title | safe | truncate(25, True) }}
+                    {% if feed_id == feed.id %}</b>{% endif %}
+                </a></li>
+                <li class="nav-item feed-commands {% if in_error.get(fid, 0) > 0 %}d-none{% endif %}" data-feed="{{ feed.id }}"><span class="nav-link">
+                    <a href="/feed/{{ feed.id }}"><i class="fa fa-info" aria-hidden="true" title="{{ _('Details') }}"></i></a>
+                    <a href="{{ url_for('feed.form', feed_id=feed.id) }}"><i class="fa fa-pencil-square-o" aria-hidden="true" title="{{ _('Edit this feed') }}"></i></a>
+                    <a href="{{ url_for('article.mark_as', new_value='unread', feed_id=feed.id) }}"><i class="fa fa-square-o" aria-hidden="true" title="{{ _('Mark this feed as unread') }}"></i></a>
+                    <a href="{{ url_for('article.mark_as', new_value='read', feed_id=feed.id) }}"><i class="fa fa-check-square-o" aria-hidden="true" title="{{ _('Mark this feed as read') }}"></i></a>
+                    <a href="#"><i class="fa fa-times delete-feed" aria-hidden="true" title="{{ _('Delete this feed') }}"></i></a>
+                </span></li>
+            {% endfor %}
+            </ul>
+        {% endfor %}
+
+        <ul class="nav flex-column">
+        <div class="bg-primary clearfix">No category</div>
+        {% for fid, nbunread in unread|dictsort(by='value')|reverse if not feeds[fid].category_id  %}
             <li class="nav-item feed-menu {% if in_error.get(fid, 0) > 0 %}d-none{% endif %}" data-feed="{{ fid }}"><a class="nav-link" href="{{ gen_url(feed=fid) }}">
                 {% if feed_id == fid %}<b>{% endif %}
                     {% if in_error.get(fid, 0) > 0 %}
@@ -45,7 +73,9 @@
                 <a href="#"><i class="fa fa-times delete-feed" aria-hidden="true" title="{{ _('Delete this feed') }}"></i></a>
             </span></li>
         {% endfor %}
+        </ul>
 
+        <ul class="nav flex-column">
         {% for fid, feed in feeds.items() if not fid in unread %}
             <li class="nav-item feed-menu {% if in_error.get(fid, 0) > 0 %}d-none{% endif %}" data-feed="{{ fid }}"><a class="nav-link" href="{{ gen_url(feed=fid) }}">
                 {% if in_error.get(fid, 0) > 0 %}
@@ -66,6 +96,7 @@
         {% endfor %}
         </ul>
     </div>
+
     <div class="col-md-12 col-lg-10">
         <div id="filters" data-filter="{{ filter_ }}">
             <ul class="nav nav-tabs ml-auto">
@@ -114,9 +145,9 @@
                             <td>
                                 <a href="#"><i class="fa fa-times delete" aria-hidden="true" title="{{ _('Delete this article') }}"></i></a>
                                 {% if article.like %}
-                                    <a href="#"><i class="fa fa-star like" aria-hidden="true" title="{{ _('One of your favorites') }}"></i></a>
+                                    <a href="#"><i class="fa fa-heart like" aria-hidden="true" title="{{ _('One of your favorites') }}"></i></a>
                                 {% else %}
-                                    <a href="#"><i class="fa fa-star-o like" aria-hidden="true" title="{{ _('Click if you like this article') }}"></i></a>
+                                    <a href="#"><i class="fa fa-heart-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" aria-hidden="true" title="{{ _('Mark this article as unread') }}"></i></a>
diff --git a/newspipe/web/views/home.py b/newspipe/web/views/home.py
index 55739248..a74c5ec2 100644
--- a/newspipe/web/views/home.py
+++ b/newspipe/web/views/home.py
@@ -25,11 +25,15 @@ def home():
     """
     filters = _get_filters(request.args)
 
+    category_contr = CategoryController(current_user.id)
     art_contr = ArticleController(current_user.id)
+    categories = {cat.id: cat for cat in category_contr.read().all()}
 
     unread = art_contr.count_by_feed(readed=False)
     nb_unread = art_contr.read_light(readed=False).count()
 
+    unread_by_cat = art_contr.count_by_category(readed=False)
+
     feeds = {
         feed.id: feed
         for feed in sorted(
@@ -93,6 +97,8 @@ def home():
         filter_=filter_,
         limit=limit,
         feeds=feeds,
+        categories=categories,
+        unread_by_cat=unread_by_cat,
         liked=liked,
         unread=dict(unread),
         articles=articles.all(),