Fix #2814

- [frio] Add a wrapping `a` tag around the notification text
- Add an event listener preventing popup menus to close when they are
themselves clicked

diff --git a/js/main.js b/js/main.js
index 72bef8849038894b10b82dad76be4aad8e9617a6..aa6a48fcb64e9c79c558aefee48ac2e229005d5f 100644 (file)
--- a/js/main.js
+++ b/js/main.js
@@ -130,6 +130,7 @@
                function close_last_popup_menu() {
                        if(last_popup_menu) {
                                last_popup_menu.hide();
+                               last_popup_menu.off('click', function(e) {e.stopPropagation()});
                                last_popup_button.removeClass("selected");
                                last_popup_menu = null;
                                last_popup_button = null;
@@ -152,6 +153,7 @@
                                last_popup_button = null;
                        } else {
                                last_popup_menu = menu;
+                               last_popup_menu.on('click', function(e) {e.stopPropagation()});
                                last_popup_button = parent;
                                $('#nav-notifications-menu').perfectScrollbar('update');
                        }

diff --git a/view/theme/frio/templates/nav.tpl b/view/theme/frio/templates/nav.tpl
index 94f91bb4eb736e6199a14552d6b10cd41e03e5a7..497b8db979ccd917017d48457af27b675570823b 100644 (file)
--- a/view/theme/frio/templates/nav.tpl
+++ b/view/theme/frio/templates/nav.tpl
@@ -9,7 +9,7 @@
                {{if $nav.remote}}
                <a href="{{$baseurl}}"><div id="remote-logo-img"></div></a>
                {{else}}
-               {{* #logo-img is the the placeholder to insert a mask (friendica logo) into this div 
+               {{* #logo-img is the the placeholder to insert a mask (friendica logo) into this div
                For Firefox we have to call the paths of the mask (look at the bottom of this file).
                Because for FF we need relative paths we apply them with js after the page is loaded (look at theme.js *}}
                <a href="{{$baseurl}}"><div id="logo-img"></div></a>
@@ -276,13 +276,13 @@
 {{*The second part of the notifications dropdown menu. It handles the notifications *}}
 {{if $nav.notifications}}
 <ul id="nav-notifications-template" class="media-list" style="display:none;" rel="template"> <!-- needs further investigation. I thought the notifications have their own templates -->
-       <li class="{4} notif-entry" onclick="location.href='{0}';">
+       <li class="{4} notif-entry">
                <div class="notif-entry-wrapper media">
                        <div class="notif-photo-wrapper media-object pull-left"><a href="{6}"><img data-src="{1}"></a></div>
-                       <div class="notif-desc-wrapper media-body">
-                               {8}{7}
+                       <a href="{0}" class="notif-desc-wrapper media-body">
+                               {2}
                                <div><time class="notif-when time" data-toggle="tooltip" title="{5}">{3}</time></div>
-                       </div>
+                       </a>
                </div>
        </li>
 </ul>