Add possibility to open notification in JavaScript + new message

Notifications can be opened directly in JavaScript
Class .notification is now id #notification
New message when there is no feed to refresh
See 06abbd02c2d10934155b2464f73d8ecdb2a68de1 (comments)

4 files changed, 62 insertions, 25 deletions

diff --git a/p/scripts/main.js b/p/scripts/main.js
index e94df2a39..88ef670cd 100644
--- a/p/scripts/main.js
+++ b/p/scripts/main.js
@@ -665,23 +665,51 @@ function init_actualize() {
 	}
 }
 
+
+// <notification>
+var notification = null,
+	notification_interval = null,
+	notification_working = false;
+
+function openNotification(msg, status) {
+	if (notification_working === true) {
+		return false;
+	}
+
+	notification_working = true;
+
+	notification.removeClass();
+	notification.addClass(status);
+	notification.find(".msg").html(msg);
+	notification.fadeIn(300);
+
+	notification_interval = window.setInterval(closeNotification, 4000);
+}
+
 function closeNotification() {
-	$(".notification").fadeOut(600, function () {
-		$(".notification").remove();
+	notification.fadeOut(600, function() {
+		notification.removeClass();
+		notification.addClass('closed');
+
+		window.clearInterval(notification_interval);
+		notification_working = false;
 	});
 }
 
 function init_notifications() {
-	var notif = $(".notification");
-	if (notif.length > 0) {
-		window.setInterval(closeNotification, 4000);
+	notification = $("#notification");
 
-		notif.find("a.close").click(function () {
-			closeNotification();
-			return false;
-		});
+	notification.find("a.close").click(function () {
+		closeNotification();
+		return false;
+	});
+
+	if (notification.find(".msg").html().length > 0) {
+		notification_working = true;
+		notification_interval = window.setInterval(closeNotification, 4000);
 	}
 }
+// </notification>
 
 function refreshUnreads() {
 	$.getJSON('./?c=javascript&a=nbUnreadsPerFeed').done(function (data) {
diff --git a/p/themes/Dark/freshrss.css b/p/themes/Dark/freshrss.css
index e54a0eadd..380dee877 100644
--- a/p/themes/Dark/freshrss.css
+++ b/p/themes/Dark/freshrss.css
@@ -558,7 +558,7 @@
 	}
 
 /*** NOTIFICATION ***/
-.notification {
+#notification {
 	position: absolute;
 	top: 10px;
 	left: 25%; right: 25%;
@@ -573,13 +573,16 @@
 	font-weight: bold;
 	z-index: 10;
 }
-	.notification.good {
+	#notification.closed {
+		display: none;
+	}
+	#notification.good {
 		border:1px solid #f4f899;
 	}
-	.notification.bad {
+	#notification.bad {
 		border:1px solid #f4a899;
 	}
-	.notification a.close {
+	#notification a.close {
 		display: inline-block;
 		width: 16px;
 		height: 16px;
@@ -590,10 +593,10 @@
 		border-radius: 50px;
 		line-height: 16px;
 	}
-	.notification.good a.close{
+	#notification.good a.close{
 		border:1px solid #f4f899;
 	}
-	.notification.bad a.close{
+	#notification.bad a.close{
 		border:1px solid #f4a899;
 	}
 
diff --git a/p/themes/Flat/freshrss.css b/p/themes/Flat/freshrss.css
index 19f5967ea..edd67e17c 100644
--- a/p/themes/Flat/freshrss.css
+++ b/p/themes/Flat/freshrss.css
@@ -561,7 +561,7 @@ body {
 	}
 
 /*** NOTIFICATION ***/
-.notification {
+#notification {
 	position: absolute;
 	top: 10px;
 	left: 25%; right: 25%;
@@ -575,15 +575,18 @@ body {
 	font-weight: bold;
 	z-index: 10;
 }
-	.notification.good {
+	#notification.closed {
+		display: none;
+	}
+	#notification.good {
 		background: #1abc9c;
 		color: #fff;
 	}
-	.notification.bad {
+	#notification.bad {
 		background: #e74c3c;
 		color: #fff;
 	}
-	.notification a.close {
+	#notification a.close {
 		display: inline-block;
 		width: 16px;
 		height: 16px;
@@ -593,10 +596,10 @@ body {
 		border-radius: 3px;
 		line-height: 16px;
 	}
-		.notification.good a.close {
+		#notification.good a.close {
 			background: #1abc9c;
 		}
-		.notification.bad a.close {
+		#notification.bad a.close {
 			background: #e74c3c;
 		}
 
diff --git a/p/themes/Origine/freshrss.css b/p/themes/Origine/freshrss.css
index 85a23140c..80fac05cd 100644
--- a/p/themes/Origine/freshrss.css
+++ b/p/themes/Origine/freshrss.css
@@ -569,7 +569,7 @@
 	}
 
 /*** NOTIFICATION ***/
-.notification {
+#notification {
 	position: absolute;
 	top: 10px;
 	left: 25%; right: 25%;
@@ -584,13 +584,16 @@
 	font-weight: bold;
 	z-index: 10;
 }
-	.notification.good {
+	#notification.closed {
+		display: none;
+	}
+	#notification.good {
 		background: #f4f899;
 	}
-	.notification.bad {
+	#notification.bad {
 		background: #f4a899;
 	}
-	.notification a.close {
+	#notification a.close {
 		display: inline-block;
 		width: 16px;
 		height: 16px;