From 9f2d613c07d3230fb989925dd9a67a3b89a81fe8 Mon Sep 17 00:00:00 2001 From: Hadi Nategh Date: Tue, 6 Mar 2018 18:33:42 +0100 Subject: [PATCH] * Notifications: New actions Prev and Next in order to navigate through messages --- notifications/js/notificationajaxpopup.js | 51 ++++++++++++++++++++++- pixelegg/css/mobile.css | 30 +++++++++++++ pixelegg/css/pixelegg.css | 30 +++++++++++++ pixelegg/less/layout_messages.less | 26 ++++++++++++ pixelegg/mobile/fw_mobile.css | 30 +++++++++++++ 5 files changed, 166 insertions(+), 1 deletion(-) diff --git a/notifications/js/notificationajaxpopup.js b/notifications/js/notificationajaxpopup.js index 2ba70100a7..776e4b6956 100644 --- a/notifications/js/notificationajaxpopup.js +++ b/notifications/js/notificationajaxpopup.js @@ -153,7 +153,7 @@ for(var index in indexes) { var id = indexes[index]; - var $message, $mark, $delete, $inner_container, + var $message, $mark, $delete, $inner_container, $nav_prev, $nav_next, $more_info, $top_toolbar, $open_entry, $date, $collapse; var message_id = 'egwpopup_message_'+id; var time_label = this.getTimeLabel(notifymessages[id]['created'], notifymessages[id]['current']); @@ -209,6 +209,18 @@ .click(jQuery.proxy(this.open_entry, this,[$message])) .prependTo($top_toolbar); } + // Previous button + $nav_prev = jQuery(document.createElement('span')) + .addClass('egwpopup_nav_prev') + .attr('title',egw.lang('previous message')) + .click(jQuery.proxy(this.nav_button, this,[$message, "prev"])) + .prependTo($top_toolbar); + // Next button + $nav_next = jQuery(document.createElement('span')) + .addClass('egwpopup_nav_next') + .attr('title',egw.lang('next message')) + .click(jQuery.proxy(this.nav_button, this,[$message, "next"])) + .prependTo($top_toolbar); // Delete button $delete = jQuery(document.createElement('span')) .addClass('egwpopup_delete') @@ -313,6 +325,7 @@ cloned.remove(); _node[0].removeClass('egwpopup_expanded'); _node[0].css('z-index', 0); + this.checkNavButtonStatus(); }; /** @@ -335,8 +348,44 @@ } var zindex = jQuery('.egwpopup_expanded').length; _node[0].addClass('egwpopup_expanded').css('z-index', zindex++); + this.checkNavButtonStatus(); }; + notifications.prototype.nav_button = function (_params, _event){ + var $expanded = jQuery('.egwpopup_expanded'); + var $messages = jQuery('.egwpopup_message').not('.egwpopup_message_clone'); + var self = this; + var current = 0; + $messages.each(function(i, j){if (j.id == _params[0][0].id) current = i;}); + $expanded.each(function(index, item){ + self.collapseMessage([jQuery(item)], _event); + }); + if (_params[1] == "prev") + { + $messages[current-1].click(); + } + else + { + $messages[current+1].click(); + } + } + + notifications.prototype.checkNavButtonStatus = function (){ + var top = 0; + var $expanded = jQuery('.egwpopup_expanded'); + var $messages = jQuery('.egwpopup_message').not('.egwpopup_message_clone'); + $expanded.removeClass('egwpopup_nav_disable'); + $expanded.each(function(index, item){ + if (item.style.getPropertyValue('z-index') > $expanded[top].style.getPropertyValue('z-index')) + { + top = index; + } + }); + var $topNode = jQuery($expanded[top]); + if ($topNode[top] == $messages[0]) $topNode.find('.egwpopup_nav_prev').addClass('egwpopup_nav_disable'); + if ($topNode[top] == $messages[$messages.length-1]) $topNode.find('.egwpopup_nav_next').addClass('egwpopup_nav_disable'); + } + /** * Display or hide notifcation-bell * diff --git a/pixelegg/css/mobile.css b/pixelegg/css/mobile.css index 0cf36215a5..191ef16dd9 100644 --- a/pixelegg/css/mobile.css +++ b/pixelegg/css/mobile.css @@ -3684,6 +3684,10 @@ td.lettersearch { padding-top: 5px; padding-bottom: 5px; } +#egwpopup #egwpopup_list .egwpopup_message span.egwpopup_nav_prev, +#egwpopup #egwpopup_list .egwpopup_message span.egwpopup_nav_next { + display: none; +} #egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded { position: fixed; top: 4vh; @@ -3714,6 +3718,32 @@ td.lettersearch { #egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded .egwpopup_message_more_info { display: none; } +#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded span.egwpopup_nav_prev { + display: inline-block; + float: right; + width: 24px; + height: 24px; + background-image: url(../images/left-grey.png); + background-repeat: no-repeat; + background-position: center; + background-size: 16px; + cursor: pointer; +} +#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded .egwpopup_nav_disable { + opacity: 0.5; + pointer-events: none; +} +#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded span.egwpopup_nav_next { + display: inline-block; + float: right; + width: 24px; + height: 24px; + background-image: url(../images/right-grey.png); + background-repeat: no-repeat; + background-position: center; + background-size: 16px; + cursor: pointer; +} #egwpopup #egwpopup_list .egwpopup_message_seen .egwpopup_mark { cursor: auto; background: none; diff --git a/pixelegg/css/pixelegg.css b/pixelegg/css/pixelegg.css index 0be290049e..455be68584 100644 --- a/pixelegg/css/pixelegg.css +++ b/pixelegg/css/pixelegg.css @@ -3673,6 +3673,10 @@ td.lettersearch { padding-top: 5px; padding-bottom: 5px; } +#egwpopup #egwpopup_list .egwpopup_message span.egwpopup_nav_prev, +#egwpopup #egwpopup_list .egwpopup_message span.egwpopup_nav_next { + display: none; +} #egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded { position: fixed; top: 4vh; @@ -3703,6 +3707,32 @@ td.lettersearch { #egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded .egwpopup_message_more_info { display: none; } +#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded span.egwpopup_nav_prev { + display: inline-block; + float: right; + width: 24px; + height: 24px; + background-image: url(../images/left-grey.png); + background-repeat: no-repeat; + background-position: center; + background-size: 16px; + cursor: pointer; +} +#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded .egwpopup_nav_disable { + opacity: 0.5; + pointer-events: none; +} +#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded span.egwpopup_nav_next { + display: inline-block; + float: right; + width: 24px; + height: 24px; + background-image: url(../images/right-grey.png); + background-repeat: no-repeat; + background-position: center; + background-size: 16px; + cursor: pointer; +} #egwpopup #egwpopup_list .egwpopup_message_seen .egwpopup_mark { cursor: auto; background: none; diff --git a/pixelegg/less/layout_messages.less b/pixelegg/less/layout_messages.less index e95bfe3863..adfd4bc4bf 100755 --- a/pixelegg/less/layout_messages.less +++ b/pixelegg/less/layout_messages.less @@ -136,6 +136,9 @@ padding-top: 5px; padding-bottom: 5px; } + span.egwpopup_nav_prev, span.egwpopup_nav_next { + display: none; + } } .egwpopup_message.egwpopup_expanded { position: fixed; @@ -163,6 +166,29 @@ cursor: pointer;display: inline-block } .egwpopup_message_more_info {display: none;} + span.egwpopup_nav_prev { + display: inline-block; + float: right; + width: 24px; + height: 24px; + background-image: url(../images/left-grey.png); + background-repeat: no-repeat; + background-position: center; + background-size: 16px; + cursor: pointer; + } + .egwpopup_nav_disable {opacity:0.5; pointer-events: none;} + span.egwpopup_nav_next { + display: inline-block; + float: right; + width: 24px; + height: 24px; + background-image: url(../images/right-grey.png); + background-repeat: no-repeat; + background-position: center; + background-size: 16px; + cursor: pointer; + } } .egwpopup_message_seen { .egwpopup_mark {cursor: auto;background:none;border-color: #666c6e;} diff --git a/pixelegg/mobile/fw_mobile.css b/pixelegg/mobile/fw_mobile.css index e797753352..69aa37c226 100644 --- a/pixelegg/mobile/fw_mobile.css +++ b/pixelegg/mobile/fw_mobile.css @@ -3695,6 +3695,10 @@ td.lettersearch { padding-top: 5px; padding-bottom: 5px; } +#egwpopup #egwpopup_list .egwpopup_message span.egwpopup_nav_prev, +#egwpopup #egwpopup_list .egwpopup_message span.egwpopup_nav_next { + display: none; +} #egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded { position: fixed; top: 4vh; @@ -3725,6 +3729,32 @@ td.lettersearch { #egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded .egwpopup_message_more_info { display: none; } +#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded span.egwpopup_nav_prev { + display: inline-block; + float: right; + width: 24px; + height: 24px; + background-image: url(../images/left-grey.png); + background-repeat: no-repeat; + background-position: center; + background-size: 16px; + cursor: pointer; +} +#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded .egwpopup_nav_disable { + opacity: 0.5; + pointer-events: none; +} +#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded span.egwpopup_nav_next { + display: inline-block; + float: right; + width: 24px; + height: 24px; + background-image: url(../images/right-grey.png); + background-repeat: no-repeat; + background-position: center; + background-size: 16px; + cursor: pointer; +} #egwpopup #egwpopup_list .egwpopup_message_seen .egwpopup_mark { cursor: auto; background: none;