Mise à jour de la vue globale

* Nombre de non lus mis à jour automatiquement
* Mise à jour structure HTML
* Mise à jour design
Fusion manuelle depuis la 0.6-beta
https://github.com/marienfressinaud/FreshRSS/commit/0c96d3489b3a74e10804206f1be0789fb63a6949

5 files changed, 75 insertions, 40 deletions

diff --git a/app/views/helpers/view/global_view.phtml b/app/views/helpers/view/global_view.phtml
index 0eb29b11a..9a47100eb 100644
--- a/app/views/helpers/view/global_view.phtml
+++ b/app/views/helpers/view/global_view.phtml
@@ -1,30 +1,24 @@
 <?php $this->partial ('nav_menu'); ?>
 
-<div id="stream" class="global">
+<div id="stream" class="global categories">
 <?php
 	foreach ($this->cat_aside as $cat) {
 		$feeds = $cat->feeds ();
-		$catNotRead = $cat->nbNotRead ();
 		if (!empty ($feeds)) {
 ?>
-	<div class="category">
-		<div class="cat_header">
-			<a href="<?php echo _url ('index', 'index', 'get', 'c_' . $cat->id (), 'output', 'normal'); ?>">
-			<?php echo $cat->name(); ?><?php echo $catNotRead > 0 ? ' (' . $catNotRead . ')' : ''; ?>
+	<div class="box-category">
+		<div class="category">
+			<a data-unread="<?php echo $cat->nbNotRead (); ?>" class="btn" href="<?php echo _url ('index', 'index', 'get', 'c_' . $cat->id (), 'output', 'normal'); ?>">
+			<?php echo $cat->name(); ?>
 			</a>
 		</div>
-
 		<ul class="feeds">
 			<?php foreach ($feeds as $feed) { ?>
 			<?php $not_read = $feed->nbNotRead (); ?>
-			<li class="item">
+			<li id="f_<?php echo $feed->id (); ?>" class="item<?php echo $feed->inError () ? ' error' : ''; ?><?php echo $feed->nbEntries () == 0 ? ' empty' : ''; ?>">
 				<img class="favicon" src="<?php echo $feed->favicon (); ?>" alt="✇" />
-
-				<a href="<?php echo _url ('index', 'index', 'get', 'f_' . $feed->id (), 'output', 'normal'); ?>">
-				<?php echo $not_read > 0 ? '<b>' : ''; ?>
+				<a class="feed" data-unread="<?php echo $feed->nbNotRead (); ?>" data-priority="<?php echo $feed->priority (); ?>" href="<?php echo _url ('index', 'index', 'get', 'f_' . $feed->id (), 'output', 'normal'); ?>">
 				<?php echo $feed->name(); ?>
-				<?php echo $not_read > 0 ? ' (' . $not_read . ')' : ''; ?>
-				<?php echo $not_read > 0 ? '</b>' : ''; ?>
 				</a>
 			</li>
 			<?php } ?>
diff --git a/public/scripts/global_view.js b/public/scripts/global_view.js
index 2c95bdfb7..94580dc0d 100644
--- a/public/scripts/global_view.js
+++ b/public/scripts/global_view.js
@@ -35,11 +35,13 @@ function init_close_panel() {
 		init_close_panel();
 		$("#panel").slideToggle();
 		$("#overlay").fadeOut();
+
+		return false;
 	});
 }
 
 function init_global_view() {
-	$("#stream .category a").click(function () {
+	$("#stream .box-category a").click(function () {
 		var link = $(this).attr("href");
 
 		load_panel(link);
diff --git a/public/scripts/main.js b/public/scripts/main.js
index 21831bc9b..b86b1c856 100644
--- a/public/scripts/main.js
+++ b/public/scripts/main.js
@@ -68,15 +68,19 @@ function mark_read(active, only_not_read) {
 		//Update unread: all
 		if (feed_priority > 0) {
 			elem = $('#aside_flux .all').children(':first').get(0);
-			feed_unread = elem ? (parseInt(elem.getAttribute('data-unread'), 10) || 0) : 0;
-			elem.setAttribute('data-unread', Math.max(0, feed_unread + inc));
+			if (elem) {
+				feed_unread = elem ? (parseInt(elem.getAttribute('data-unread'), 10) || 0) : 0;
+				elem.setAttribute('data-unread', Math.max(0, feed_unread + inc));
+			}
 		}
 
 		//Update unread: favourites
 		if (active.closest('div').hasClass('favorite')) {
 			elem = $('#aside_flux .favorites').children(':first').get(0);
-			feed_unread = elem ? (parseInt(elem.getAttribute('data-unread'), 10) || 0) : 0;
-			elem.setAttribute('data-unread', Math.max(0, feed_unread + inc));
+			if (elem) {
+				feed_unread = elem ? (parseInt(elem.getAttribute('data-unread'), 10) || 0) : 0;
+				elem.setAttribute('data-unread', Math.max(0, feed_unread + inc));
+			}
 		}
 
 		//Update unread: title
diff --git a/public/themes/default/freshrss.css b/public/themes/default/freshrss.css
index 34ec1395c..650f8eef6 100644
--- a/public/themes/default/freshrss.css
+++ b/public/themes/default/freshrss.css
@@ -100,9 +100,8 @@
 }
 	.category {
 		display: block;
-		padding: 5px 0;
 		width: 220px;
-		margin: 5px auto;
+		margin: 10px auto;
 		text-align: left;
 		overflow: hidden;
 		white-space: nowrap;
@@ -362,7 +361,7 @@
 #stream.global {
 	text-align: center;
 }
-	#stream.global .category {
+	#stream.global .box-category {
 		display: inline-block;
 		width: 280px;
 		margin: 20px 10px;
@@ -373,29 +372,48 @@
 		text-align: left;
 		box-shadow: 0 0 5px #bbb;
 	}
-		#stream.global .cat_header {
+		#stream.global .category {
+			width: 100%;
+			margin: 0;
+		}
+		#stream.global .btn {
+			display: block;
+			width: auto;
 			height: 35px;
+			margin: 0;
 			padding: 0 10px;
 			background: #eee;
+			border: none;
 			border-bottom: 1px solid #aaa;
 			border-radius: 5px 5px 0 0;
 			line-height: 35px;
 			font-size: 120%;
 		}
-			#stream.global .cat_header a {
-				color: #333;
-				text-shadow: 0 -1px 0px #aaa;
+			#stream.global .btn:not([data-unread="0"]) {
+				font-weight:bold;
+			}
+			#stream.global .btn:first-child:not([data-unread="0"]):after {
+				top: 0; right: 5px;
+				border: 0;
+				background: none;
+				color: #666;
+				font-weight: bold;
+				box-shadow: none;
 			}
-		#stream.global .category .feeds {
+		#stream.global .box-category .feeds {
+			display: block;
 			max-height: 250px;
 			margin: 0;
 			list-style: none;
 			overflow: auto;
 		}
-			#stream.global .category .feeds .item {
+			#stream.global .box-category .feeds .item {
 				padding: 2px 10px;
 				font-size: 90%;
 			}
+		#stream.global .box-category .feed {
+			width: 220px;
+		}
 
 .content {
 	min-height: 300px;
diff --git a/public/themes/flat-design/freshrss.css b/public/themes/flat-design/freshrss.css
index 5c5d4e078..32dd72c42 100644
--- a/public/themes/flat-design/freshrss.css
+++ b/public/themes/flat-design/freshrss.css
@@ -94,9 +94,8 @@ body {
 }
 	.category {
 		display: block;
-		padding: 5px 0;
 		width: 220px;
-		margin: 5px auto;
+		margin: 10px auto;
 		text-align: left;
 		overflow: hidden;
 		white-space: nowrap;
@@ -123,7 +122,7 @@ body {
 			display:none;
 		}
 	.categories .feeds {
-		width: 220px;
+		width: 100%;
 		margin: 0 auto;
 		list-style: none;
 	}
@@ -347,39 +346,57 @@ body {
 #stream.global {
 	text-align: center;
 }
-	#stream.global .category {
+	#stream.global .box-category {
 		display: inline-block;
 		width: 280px;
 		margin: 20px 10px;
 		vertical-align: top;
-		border: 1px solid #aaa;
+		border: 1px solid #ddd;
 		border-radius: 5px;
 		text-align: left;
-		box-shadow: 0 0 5px #bbb;
 	}
-		#stream.global .cat_header {
+		#stream.global .category {
+			width: 100%;
+			margin: 0;
+		}
+		#stream.global .btn {
+			display: block;
+			width: auto;
 			height: 35px;
+			margin: 0;
 			padding: 0 10px;
-			background: #eee;
-			border-bottom: 1px solid #aaa;
+			background: #ecf0f1;
+			color: #333;
+			border-bottom: 1px solid #ddd;
 			border-radius: 5px 5px 0 0;
 			line-height: 35px;
 			font-size: 120%;
 		}
-			#stream.global .cat_header a {
+			#stream.global .btn:not([data-unread="0"]) {
+				font-weight:bold;
+			}
+			#stream.global .btn:first-child:not([data-unread="0"]):after {
+				top: 0; right: 5px;
+				border: 0;
+				background: none;
 				color: #333;
-				text-shadow: 0 -1px 0px #aaa;
+				font-weight: bold;
+				box-shadow: none;
 			}
-		#stream.global .category .feeds {
+		#stream.global .box-category .feeds {
+			display: block;
 			max-height: 250px;
 			margin: 0;
 			list-style: none;
 			overflow: auto;
 		}
-			#stream.global .category .feeds .item {
+			#stream.global .box-category .feeds .item {
 				padding: 2px 10px;
 				font-size: 90%;
 			}
+		#stream.global .box-category .feed {
+			width: 220px;
+		}
 
 .content {
 	min-height: 300px;