diff --git a/templates/js/_topMenuApps.js b/templates/js/_topMenuApps.js index 9a6af72..188382f 100644 --- a/templates/js/_topMenuApps.js +++ b/templates/js/_topMenuApps.js @@ -1,4 +1,6 @@ let menuCache = null +let updateTopMenuIsRunning = false +let forceUpdateTopMenu = false const breakpointMobileWidth = 1024 const usePercentualAppMenuLimit = 0.8 @@ -58,6 +60,7 @@ const updateTopMenu = function() { } else { app.classList.remove('hidden') app.classList.add('app-external-site') + appShown.push(app) navigationAppsHtml = navigationAppsHtml + app.outerHTML @@ -66,6 +69,7 @@ const updateTopMenu = function() { if (targetBlankApps.indexOf(dataId) !== -1) { querySelector('a', app).setAttribute('target', '_blank') } + } navigationApps.innerHTML = navigationAppsHtml @@ -88,12 +92,6 @@ const updateTopMenu = function() { appCount = minAppsDesktop } - if (appCount === 0) { - menu.classList.add('hidden') - } else { - menu.classList.remove('hidden') - } - menu.style.opacity = 1 if (appShown.length - 1 - appCount >= 1) { @@ -107,20 +105,21 @@ const updateTopMenu = function() { let k = 0 let notInHeader = 0 + for (let app of appShown) { const name = app.getAttribute('data-id') - const item = querySelector('#apps li[data-id=' + name + '].app-external-site') + const li = querySelector('#apps li[data-id=' + name + '].app-external-site') if (k < appCount && appCount > 0) { app.classList.remove('hidden') - lastShownApp = app + li.classList.add('in-header') - item.classList.add('in-header') + lastShownApp = app } else { app.classList.add('hidden') - notInHeader++ + li.classList.remove('in-header') - item.classList.remove('in-header') + notInHeader++ const a = querySelector('a', app) @@ -129,7 +128,7 @@ const updateTopMenu = function() { app.classList.remove('hidden') notInHeader++ - item.classList.add('in-header') + li.classList.add('in-header') } } @@ -172,7 +171,7 @@ const updateTopMenu = function() { const svg = querySelector('svg', app) if (querySelectorAll('svg defs', app).length > 0) { - return + continue } const defs = ` @@ -202,4 +201,17 @@ const updateTopMenu = function() { menuCache = menu.innerHTML + menu.nextSibling.innerHTML } -setInterval(updateTopMenu, 1000) + +for (let timeout of [300, 500, 700]) { + setTimeout(updateTopMenu, timeout) +} + +let resizeTimeout = null; + +window.addEventListener('resize', () => { + if (resizeTimeout !== null) { + clearTimeout(resizeTimeout) + } + + resizeTimeout = setTimeout(updateTopMenu, 100) +})