change to some nav ids, notice in empty notifications popup

diff --git a/include/main.js b/include/main.js
index dc39a72816c5a4dc8398c2a3952e92d686fa47a5..3574e6eb8dbc07e793e4d31565bc5cd69fc1f147 100644 (file)
--- a/include/main.js
+++ b/include/main.js
@@ -61,8 +61,9 @@
 
                /* popup menus */
                $('a[rel^=#]').click(function(e){
-                       e.stopPropagation();
                        menu = $( $(this).attr('rel') );
+                       e.stopPropagation();
+                       if (menu.attr('popup')=="false") return false;
                        $(this).parent().toggleClass("selected");
                        menu.toggle();
                        return false;
@@ -72,6 +73,7 @@
 
                /* notifications template */
                var notifications_tpl= unescape($("#nav-notifications-template[rel=template]").html());
+               var notifications_empty = unescape($("#nav-notifications-menu").html());
                
                /* nav update event  */
                $('nav').bind('nav-update', function(e,data){;
@@ -88,12 +90,15 @@
                        if (notif>0){
                                nnm = $("#nav-notifications-menu");
                                nnm.html("");
+                               nnm.attr('popup','true');
                                eNotif.children("note").each(function(){
                                        e = $(this);
                                        text = e.text().format("<span class='contactname'>"+e.attr('name')+"</span>");
                                        html = notifications_tpl.format(e.attr('href'),e.attr('photo'), text, e.attr('date'));
                                        nnm.append(html);
                                });
+                       } else {
+                               $("#nav-notifications-menu").html(notifications_empty);
                        }
                        if(notif == 0) { notif = ''; $('#notify-update').removeClass('show') } else { $('#notify-update').addClass('show') }
                        $('#notify-update').html(notif);

diff --git a/view/nav.tpl b/view/nav.tpl
index 454d7ebd0da989a648819fb328e0170f8e3eda54..5a8a904a61c1c7e08bfed777f7e4cb3e69dcb736 100644 (file)
--- a/view/nav.tpl
+++ b/view/nav.tpl
@@ -5,7 +5,7 @@
 </header>
 <nav>
        <ul>
-               <li id="nav-user-link" class="nav-menu-icon"><a href="#" rel="#nav-user-menu" title="$sitelocation"><img src="http://localhost/~fabio/friendika/photo/52728a08b979618a787e43664bfbae98-6.jpg" alt="User"></a>
+               <li id="nav-user-linkmenu" class="nav-menu-icon"><a href="#" rel="#nav-user-menu" title="$sitelocation"><img src="http://localhost/~fabio/friendika/photo/52728a08b979618a787e43664bfbae98-6.jpg" alt="User"></a>
                        <ul id="nav-user-menu" class="menu-popup">
                                <li><a href="profile">Profile</a></li>
                                <li><a href="photos">Photos</a></li>
@@ -34,9 +34,10 @@
                {{ endif }}
                
                {{ if $nav.notifications }}
-                       <li  id="nav-notifications-link" class="nav-menu-icon"><a href="#" rel="#nav-notifications-menu" title="$nav.notifications.1"><span class="icon s22 notify">$nav.notifications.1</span></a>
+                       <li  id="nav-notifications-linkmenu" class="nav-menu-icon"><a href="$nav.notifications.0" rel="#nav-notifications-menu" title="$nav.notifications.1"><span class="icon s22 notify">$nav.notifications.1</span></a>
                                <span id="notify-update" class="nav-notify"></span>
                                <ul id="nav-notifications-menu" class="menu-popup">
+                                       <li class="empty">Nothing new here</li>
                                </ul>
                        </li>           
                {{ endif }}
@@ -47,7 +48,7 @@
                
                
                
-               <li id="nav-site-link" class="nav-menu-icon"><a href="#" rel="#nav-site-menu"><span class="icon s22 gear">Site</span></a>
+               <li id="nav-site-linkmenu" class="nav-menu-icon"><a href="#" rel="#nav-site-menu"><span class="icon s22 gear">Site</span></a>
                        <ul id="nav-site-menu" class="menu-popup">
                                {{ if $nav.settings }}<li><a class="$nav.settings.2" href="$nav.settings.0" title="$nav.settings.3">$nav.settings.1</a></li>{{ endif }}
                                {{ if $nav.admin }}<li><a class="$nav.admin.2" href="$nav.admin.0" title="$nav.admin.3" >$nav.admin.1</a></li>{{ endif }}

diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css
index ec5231290580ac3fcc0737a5d361a9904e5dc1b8..9ded4172109fbfdf028423b29122dd8be07b8963 100644 (file)
--- a/view/theme/quattro/style.css
+++ b/view/theme/quattro/style.css
@@ -144,14 +144,14 @@ nav .nav-notify {
 nav .nav-notify.show {
   display: block;
 }
-nav #nav-site-link {
+nav #nav-site-linkmenu {
   float: right;
 }
-nav #nav-site-link .menu-popup {
+nav #nav-site-linkmenu .menu-popup {
   right: 0px;
   left: auto;
 }
-nav #nav-notifications-link.selected .icon.s22.notify {
+nav #nav-notifications-linkmenu.selected .icon.s22.notify {
   background-image: url("../../../images/icons/notify_on_22.png");
 }
 ul.menu-popup {
@@ -183,6 +183,11 @@ ul.menu-popup li {
   height: auto;
   display: block;
 }
+ul.menu-popup .empty {
+  padding: 5px;
+  text-align: center;
+  color: #9eabb0;
+}
 #nav-notifications-menu {
   width: 400px;
 }

diff --git a/view/theme/quattro/style.less b/view/theme/quattro/style.less
index 53f833cfd654ef1a49ee72573efdea0207b50642..a2c1a1eae48d2cf11b8a74e990cb678532a4bf33 100644 (file)
--- a/view/theme/quattro/style.less
+++ b/view/theme/quattro/style.less
@@ -188,12 +188,12 @@ nav {
                
                
                
-               #nav-site-link { 
+               #nav-site-linkmenu { 
                        float: right;
                        .menu-popup{ right: 0px; left: auto; }
                }
        
-               #nav-notifications-link.selected .icon.s22.notify { background-image: url("../../../images/icons/notify_on_22.png") }
+               #nav-notifications-linkmenu.selected .icon.s22.notify { background-image: url("../../../images/icons/notify_on_22.png") }
                
 }
 
@@ -213,6 +213,12 @@ ul.menu-popup {
                a:hover { background-color: @Metalic1; }
                .menu-sep  { border-top: 1px solid @Metalic2; }
                li { float: none;  overflow: auto; height: auto; display: block; }
+               
+               .empty {
+                       padding: 5px;
+                       text-align: center;
+                       color: @Metalic2;
+               }
 }
 
 #nav-notifications-menu {