extern/egroupware_official
1
0
Fork 0
mirror of https://github.com/EGroupware/egroupware.git synced 2024-11-21 23:43:17 +01:00
Code Issues Packages Projects Releases Wiki Activity

Implement new indicator for topmenu items in fw such as displaying unread messages for notifications

Browse Source
This commit is contained in:
Hadi Nategh 2019-12-02 14:09:45 +01:00
parent 9e2b72f868
commit 9233c93e4f
7 changed files with 111 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
notifications/js/notificationajaxpopup.js
View File

@ -802,13 +802,12 @@
if (counter > 0)
{
$topmenu_info_notifications.addClass('egwpopup_notify');
if (jQuery('#egw_fw_topmenu:visible').length == 0) $topmenu_info_notifications.append($popup_note);
$popup_note.text(egw.lang('You have %1 unread notifications', counter));
framework.topmenu_info_notify('notifications', true, counter,egw.lang('You have %1 unread notifications', counter));
setTimeout(function (){$popup_note.remove();}, 4000);
}
else
{
$topmenu_info_notifications.removeClass('egwpopup_notify');
framework.topmenu_info_notify('notifications', false);
}
};

15
pixelegg/css/mobile.css
View File

@ -5078,6 +5078,21 @@ td.message span.message {
background-image: url(../images/notification_message.svg);
border-left: 1px solid #636262;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications .egw_fw_topmenu_info_notify {
position: absolute;
background-color: #c14343;
bottom: 0px;
height: 17px;
white-space: nowrap;
line-height: 16px;
width: 17px;
border-top-right-radius: 50%;
margin-left: -3px;
color: #fff9fb;
border: 2px solid #ffffff;
text-align: center;
border-radius: 50%;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications .popup_note {
position: absolute;
width: 280px;

15
pixelegg/css/monochrome.css
View File

@ -5067,6 +5067,21 @@ td.message span.message {
background-image: url(../images/notification_message.svg);
border-left: 1px solid #636262;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications .egw_fw_topmenu_info_notify {
position: absolute;
background-color: #c14343;
bottom: 0px;
height: 17px;
white-space: nowrap;
line-height: 16px;
width: 17px;
border-top-right-radius: 50%;
margin-left: -3px;
color: #fff9fb;
border: 2px solid #ffffff;
text-align: center;
border-radius: 50%;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications .popup_note {
position: absolute;
width: 280px;

15
pixelegg/css/pixelegg.css
View File

@ -5078,6 +5078,21 @@ td.message span.message {
background-image: url(../images/notification_message.svg);
border-left: 1px solid #636262;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications .egw_fw_topmenu_info_notify {
position: absolute;
background-color: #c14343;
bottom: 0px;
height: 17px;
white-space: nowrap;
line-height: 16px;
width: 17px;
border-top-right-radius: 50%;
margin-left: -3px;
color: #fff9fb;
border: 2px solid #ffffff;
text-align: center;
border-radius: 50%;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications .popup_note {
position: absolute;
width: 280px;

34
pixelegg/js/fw_pixelegg.js
View File

@ -71,6 +71,40 @@
et2_loadingFinished: function() {
this._super.apply(this, arguments);
setTimeout(function(){jQuery('#egw_fw_firstload').remove();}, 1000);
},
/**
* Set a notification message for topmenu info item
*
* @param {string} _id id of topmenu info item with its prefix
* @param {string} _message message that should be displayed
* @param {string} _tooltip hint text as tooltip
*/
topmenu_info_notify: function(_id, _switch, _message, _tooltip) {
var $items = jQuery('#egw_fw_topmenu_info_items').children();
var prefix = "topmenu_info_";
$items.each(function(i,item){
if (item.id == prefix+_id || item.id == _id)
{
var $notify = jQuery(item).find('.egw_fw_topmenu_info_notify');
if (_switch)
{
if ($notify.length == 0)
{
$notify = jQuery(document.createElement('div'))
.addClass('egw_fw_topmenu_info_notify')
.prop('title', _tooltip)
.appendTo(item);
}
$notify.text(_message);
}
else
{
$notify.remove();
}
}
});
}
});

15
pixelegg/less/layout_raster_buttons.less
View File

@ -119,6 +119,21 @@
opacity: 0.4;
background-image: url(../images/notification_message.svg);
border-left: 1px solid #636262;
.egw_fw_topmenu_info_notify {
position: absolute;
background-color: #c14343;
bottom: 0px;
height: 17px;
white-space: nowrap;
line-height: 16px;
width: 17px;
border-top-right-radius: 50%;
margin-left: -3px;
color: #fff9fb;
border: 2px solid #ffffff;
text-align: center;
border-radius: 50%;
}
.popup_note {
position: absolute;
width: 280px;

15
pixelegg/mobile/fw_mobile.css
View File

@ -5089,6 +5089,21 @@ td.message span.message {
background-image: url(../images/notification_message.svg);
border-left: 1px solid #636262;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications .egw_fw_topmenu_info_notify {
position: absolute;
background-color: #c14343;
bottom: 0px;
height: 17px;
white-space: nowrap;
line-height: 16px;
width: 17px;
border-top-right-radius: 50%;
margin-left: -3px;
color: #fff9fb;
border: 2px solid #ffffff;
text-align: center;
border-radius: 50%;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications .popup_note {
position: absolute;
width: 280px;