fix #23: hidden icons in the top menu
This commit is contained in:
parent
e4f9765247
commit
3db0c1ccd2
|
@ -5,7 +5,7 @@ var updateTopMenu = function() {
|
||||||
var menu = $('#appmenu')
|
var menu = $('#appmenu')
|
||||||
var apps = menu.find('li')
|
var apps = menu.find('li')
|
||||||
var minAppsDesktop = 8
|
var minAppsDesktop = 8
|
||||||
var usePercentualAppMenuLimit = 0.9
|
var usePercentualAppMenuLimit = 0.8
|
||||||
var isMobile = $(window).width() < breakpointMobileWidth
|
var isMobile = $(window).width() < breakpointMobileWidth
|
||||||
var lastShownApp = null
|
var lastShownApp = null
|
||||||
var appShown = []
|
var appShown = []
|
||||||
|
@ -42,18 +42,20 @@ var updateTopMenu = function() {
|
||||||
|
|
||||||
var rightHeaderWidth = $('.header-right').outerWidth()
|
var rightHeaderWidth = $('.header-right').outerWidth()
|
||||||
var headerWidth = $('header').outerWidth()
|
var headerWidth = $('header').outerWidth()
|
||||||
var availableWidth = headerWidth - $('#nextcloud').outerWidth() - $('#header .side-menu-opener').outerWidth() - (rightHeaderWidth > 210 ? rightHeaderWidth : 210)
|
var availableWidth = headerWidth - $('#nextcloud').outerWidth()
|
||||||
|
- $('#header .side-menu-opener').outerWidth()
|
||||||
|
- (rightHeaderWidth > 230 ? rightHeaderWidth : 230)
|
||||||
|
|
||||||
if (!isMobile) {
|
if (!isMobile) {
|
||||||
availableWidth = availableWidth * usePercentualAppMenuLimit
|
availableWidth = availableWidth * usePercentualAppMenuLimit
|
||||||
}
|
}
|
||||||
|
|
||||||
|
appCount = Math.floor(availableWidth / $('#appmenu li').width())
|
||||||
|
|
||||||
if (isMobile && appCount > minAppsDesktop) {
|
if (isMobile && appCount > minAppsDesktop) {
|
||||||
appCount = minAppsDesktop
|
appCount = minAppsDesktop
|
||||||
} else if (!isMobile && appCount < minAppsDesktop) {
|
} else if (!isMobile && appCount < minAppsDesktop) {
|
||||||
appCount = minAppsDesktop
|
appCount = minAppsDesktop
|
||||||
} else {
|
|
||||||
appCount = Math.floor(availableWidth / $('#appmenu li').width())
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (appCount === 0) {
|
if (appCount === 0) {
|
||||||
|
@ -102,6 +104,35 @@ var updateTopMenu = function() {
|
||||||
k++
|
k++
|
||||||
})
|
})
|
||||||
|
|
||||||
|
$('#apps li.app-external-site').each(function(i, app) {
|
||||||
|
app = $(app)
|
||||||
|
var appId = app.attr('data-id')
|
||||||
|
|
||||||
|
if (app.hasClass('in-header')) {
|
||||||
|
app.find('svg').find('defs').remove()
|
||||||
|
} else {
|
||||||
|
var svg = app.find('svg');
|
||||||
|
|
||||||
|
if (svg.find('defs').length > 0) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var defs = `
|
||||||
|
<defs>
|
||||||
|
<filter id="invertMenuMore-${appId}">
|
||||||
|
<feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"></feColorMatrix>
|
||||||
|
</filter>
|
||||||
|
</defs>`
|
||||||
|
|
||||||
|
svg.prepend(defs)
|
||||||
|
svg.find('image').attr('filter', `url(#invertMenuMore-${appId})`)
|
||||||
|
|
||||||
|
var html = svg.get(0).innerHTML.replace(/fecolormatrix/g, 'feColorMatrix');
|
||||||
|
|
||||||
|
svg.html(html)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
if (notInHeader === 0) {
|
if (notInHeader === 0) {
|
||||||
moreApps.hide()
|
moreApps.hide()
|
||||||
navigation.hide()
|
navigation.hide()
|
||||||
|
|
Loading…
Reference in a new issue