Load infos and notices via ping and show them with js popup

4 files changed, 33 insertions, 3 deletions

diff --git a/view/head.tpl b/view/head.tpl
index a18bcdd5e..b6d78da39 100644
--- a/view/head.tpl
+++ b/view/head.tpl
@@ -1,9 +1,12 @@
 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
 <base href="$baseurl/" />
 <meta name="generator" content="$generator" />
-<link rel="stylesheet" type="text/css" href="$stylesheet" media="all" />
 <link rel="stylesheet" href="$baseurl/library/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
 <link rel="stylesheet" href="$baseurl/library/tiptip/tipTip.css" type="text/css" media="screen" />
+<link rel="stylesheet" href="$baseurl/library/jgrowl/jquery.jgrowl.css" type="text/css" media="screen" />
+
+<link rel="stylesheet" type="text/css" href="$stylesheet" media="all" />
+
 <link rel="shortcut icon" href="$baseurl/images/friendika-32.png" />
 <link rel="search"
          href="$baseurl/opensearch" 
@@ -16,6 +19,7 @@
 <script type="text/javascript" src="$baseurl/js/jquery.js" ></script>
 <script type="text/javascript" src="$baseurl/library/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
 <script type="text/javascript" src="$baseurl/library/tiptip/jquery.tipTip.minified.js"></script>
+<script type="text/javascript" src="$baseurl/library/jgrowl/jquery.jgrowl_minimized.js"></script>
 <script type="text/javascript" src="$baseurl/library/tinymce/jscripts/tiny_mce/tiny_mce_src.js" ></script>
 <script type="text/javascript" src="$baseurl/js/acl.js" ></script>
 <script type="text/javascript" src="$baseurl/js/main.js" ></script>
diff --git a/view/theme/quattro/colors.less b/view/theme/quattro/colors.less
index 6015c61ee..3d3074d60 100644
--- a/view/theme/quattro/colors.less
+++ b/view/theme/quattro/colors.less
@@ -59,5 +59,8 @@
 @AsideConnectBg: @Blue3;
 @AsideConnectHoverBg: @Blue1;
 
+@InfoColor: @Grey1;
+@InfoBackgroundColor: @Metalic3;
 
-
+@NoticeColor: @Grey1;
+@NoticeBackgroundColor: #511919;
diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less
index c7cbe7ebb..2c4e0464a 100644
--- a/view/theme/quattro/quattro.less
+++ b/view/theme/quattro/quattro.less
@@ -38,6 +38,19 @@ a:hover {color: @LinkHover; text-decoration: underline; }
 	.icon { float: right; }
 }
 
+/* popup notifications */
+div.jGrowl div.notice {
+	background: @NoticeBackgroundColor url("../../../images/icons/48/notice.png") no-repeat 5px center;
+	color: 	@NoticeColor;
+	padding-left: 58px;
+}
+div.jGrowl div.info {
+	background: @InfoBackgroundColor url("../../../images/icons/48/info.png") no-repeat 5px center;
+	color: 	@InfoColor;
+	padding-left: 58px;
+}
+
+
 
 /* header */
 header {
@@ -237,4 +250,3 @@ section {
 }
 
 
-
diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css
index 2b950c3ef..0fce02f03 100644
--- a/view/theme/quattro/style.css
+++ b/view/theme/quattro/style.css
@@ -95,6 +95,17 @@ a:hover {
 .tool .icon {
   float: right;
 }
+/* popup notifications */
+div.jGrowl div.notice {
+  background: #511919 url("../../../images/icons/48/notice.png") no-repeat 5px center;
+  color: #ffffff;
+  padding-left: 58px;
+}
+div.jGrowl div.info {
+  background: #364e59 url("../../../images/icons/48/info.png") no-repeat 5px center;
+  color: #ffffff;
+  padding-left: 58px;
+}
 /* header */
 header {
   position: fixed;