Hide read feeds and read categories when in unread mode

https://github.com/marienfressinaud/FreshRSS/issues/430
There are some repeated HTML attributes (`data-unread` and `active`)
which could maybe be simplified.
If some people do not like this behaviour, we could consider having an
option.

app/layout/aside_flux.phtml

@@ -1,4 +1,4 @@
-<div class="aside aside_flux" id="aside_flux">
+<div class="aside aside_flux<?php if (($this->state & FreshRSS_Entry::STATE_NOT_READ) && !($this->state & FreshRSS_Entry::STATE_READ)) echo ' state_unread'; ?>" id="aside_flux">
 	<a class="toggle_aside" href="#close"><?php echo FreshRSS_Themes::icon('close'); ?></a>
 
 	<ul class="categories">
@@ -41,11 +41,11 @@
 		foreach ($this->cat_aside as $cat) {
 			$feeds = $cat->feeds ();
 			if (!empty ($feeds)) {
-				?><li><?php
 				$c_active = false;
 				if ($this->get_c == $cat->id ()) {
 					$c_active = true;
 				}
+				?><li data-unread="<?php echo $cat->nbNotRead(); ?>"<?php if ($c_active) echo ' class="active"'; ?>><?php
 				?><div class="category stick<?php echo $c_active ? ' active' : ''; ?>"><?php
 					?><a data-unread="<?php echo formatNumber($cat->nbNotRead()); ?>" class="btn<?php echo $c_active ? ' active' : ''; ?>" href="<?php $arUrl['params']['get'] = 'c_' . $cat->id(); echo Minz_Url::display($arUrl); ?>"><?php echo $cat->name (); ?></a><?php
 					?><a class="btn dropdown-toggle" href="#"><?php echo FreshRSS_Themes::icon($c_active ? 'up' : 'down'); ?></a><?php
@@ -55,7 +55,7 @@
 					$feed_id = $feed->id ();
 					$nbEntries = $feed->nbEntries ();
 					$f_active = ($this->get_f == $feed_id);
-					?><li id="f_<?php echo $feed_id; ?>" class="item<?php echo $f_active ? ' active' : ''; ?><?php echo $feed->inError () ? ' error' : ''; ?><?php echo $nbEntries == 0 ? ' empty' : ''; ?>"><?php
+					?><li id="f_<?php echo $feed_id; ?>" class="item<?php echo $f_active ? ' active' : ''; ?><?php echo $feed->inError () ? ' error' : ''; ?><?php echo $nbEntries == 0 ? ' empty' : ''; ?>" data-unread="<?php echo $feed->nbNotRead(); ?>"><?php
 						?><div class="dropdown"><?php
 							?><div class="dropdown-target"></div><?php
 							?><a class="dropdown-toggle" data-fweb="<?php echo $feed->website (); ?>"><?php echo FreshRSS_Themes::icon('configure'); ?></a><?php

p/scripts/main.js

@@ -69,6 +69,10 @@ function incUnreadsFeed(article, feed_id, nb) {
 		feed_priority = elem ? str2int(elem.getAttribute('data-priority')) : 0;
 	if (elem) {
 		elem.setAttribute('data-unread', numberFormat(feed_unreads + nb));
+		elem = $(elem).closest('li').get(0);
+		if (elem) {
+			elem.setAttribute('data-unread', feed_unreads + nb);
+		}
 	}
 
 	//Update unread: category
@@ -76,6 +80,10 @@ function incUnreadsFeed(article, feed_id, nb) {
 	feed_unreads = elem ? str2int(elem.getAttribute('data-unread')) : 0;
 	if (elem) {
 		elem.setAttribute('data-unread', numberFormat(feed_unreads + nb));
+		elem = $(elem).closest('li').get(0);
+		if (elem) {
+			elem.setAttribute('data-unread', feed_unreads + nb);
+		}
 	}
 
 	//Update unread: all

p/themes/Dark/template.css

@@ -309,6 +309,9 @@ a.btn {
 	list-style: none;
 	margin: 0;
 }
+.state_unread li:not(.active)[data-unread="0"] {
+	display: none;
+}
 .category {
 	display: block;
 	overflow: hidden;

p/themes/Flat/template.css

@@ -309,6 +309,9 @@ a.btn {
 	list-style: none;
 	margin: 0;
 }
+.state_unread li:not(.active)[data-unread="0"] {
+	display: none;
+}
 .category {
 	display: block;
 	overflow: hidden;

p/themes/Origine/template.css

@@ -309,6 +309,9 @@ a.btn {
 	list-style: none;
 	margin: 0;
 }
+.state_unread li:not(.active)[data-unread="0"] {
+	display: none;
+}
 .category {
 	display: block;
 	overflow: hidden;

p/themes/base-theme/template.css

@@ -309,6 +309,9 @@ a.btn {
 	list-style: none;
 	margin: 0;
 }
+.state_unread li:not(.active)[data-unread="0"] {
+	display: none;
+}
 .category {
 	display: block;
 	overflow: hidden;