forked from deblan/side_menu
fix top menu generation; fix issue #66 by removing usage of setInterval
This commit is contained in:
parent
c2e6d24b95
commit
6f0c4e98e0
|
@ -1,4 +1,6 @@
|
||||||
let menuCache = null
|
let menuCache = null
|
||||||
|
let updateTopMenuIsRunning = false
|
||||||
|
let forceUpdateTopMenu = false
|
||||||
|
|
||||||
const breakpointMobileWidth = 1024
|
const breakpointMobileWidth = 1024
|
||||||
const usePercentualAppMenuLimit = 0.8
|
const usePercentualAppMenuLimit = 0.8
|
||||||
|
@ -58,6 +60,7 @@ const updateTopMenu = function() {
|
||||||
} else {
|
} else {
|
||||||
app.classList.remove('hidden')
|
app.classList.remove('hidden')
|
||||||
app.classList.add('app-external-site')
|
app.classList.add('app-external-site')
|
||||||
|
|
||||||
appShown.push(app)
|
appShown.push(app)
|
||||||
|
|
||||||
navigationAppsHtml = navigationAppsHtml + app.outerHTML
|
navigationAppsHtml = navigationAppsHtml + app.outerHTML
|
||||||
|
@ -66,6 +69,7 @@ const updateTopMenu = function() {
|
||||||
if (targetBlankApps.indexOf(dataId) !== -1) {
|
if (targetBlankApps.indexOf(dataId) !== -1) {
|
||||||
querySelector('a', app).setAttribute('target', '_blank')
|
querySelector('a', app).setAttribute('target', '_blank')
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
navigationApps.innerHTML = navigationAppsHtml
|
navigationApps.innerHTML = navigationAppsHtml
|
||||||
|
@ -88,12 +92,6 @@ const updateTopMenu = function() {
|
||||||
appCount = minAppsDesktop
|
appCount = minAppsDesktop
|
||||||
}
|
}
|
||||||
|
|
||||||
if (appCount === 0) {
|
|
||||||
menu.classList.add('hidden')
|
|
||||||
} else {
|
|
||||||
menu.classList.remove('hidden')
|
|
||||||
}
|
|
||||||
|
|
||||||
menu.style.opacity = 1
|
menu.style.opacity = 1
|
||||||
|
|
||||||
if (appShown.length - 1 - appCount >= 1) {
|
if (appShown.length - 1 - appCount >= 1) {
|
||||||
|
@ -107,20 +105,21 @@ const updateTopMenu = function() {
|
||||||
let k = 0
|
let k = 0
|
||||||
let notInHeader = 0
|
let notInHeader = 0
|
||||||
|
|
||||||
|
|
||||||
for (let app of appShown) {
|
for (let app of appShown) {
|
||||||
const name = app.getAttribute('data-id')
|
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) {
|
if (k < appCount && appCount > 0) {
|
||||||
app.classList.remove('hidden')
|
app.classList.remove('hidden')
|
||||||
lastShownApp = app
|
li.classList.add('in-header')
|
||||||
|
|
||||||
item.classList.add('in-header')
|
lastShownApp = app
|
||||||
} else {
|
} else {
|
||||||
app.classList.add('hidden')
|
app.classList.add('hidden')
|
||||||
notInHeader++
|
li.classList.remove('in-header')
|
||||||
|
|
||||||
item.classList.remove('in-header')
|
notInHeader++
|
||||||
|
|
||||||
const a = querySelector('a', app)
|
const a = querySelector('a', app)
|
||||||
|
|
||||||
|
@ -129,7 +128,7 @@ const updateTopMenu = function() {
|
||||||
app.classList.remove('hidden')
|
app.classList.remove('hidden')
|
||||||
notInHeader++
|
notInHeader++
|
||||||
|
|
||||||
item.classList.add('in-header')
|
li.classList.add('in-header')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -172,7 +171,7 @@ const updateTopMenu = function() {
|
||||||
const svg = querySelector('svg', app)
|
const svg = querySelector('svg', app)
|
||||||
|
|
||||||
if (querySelectorAll('svg defs', app).length > 0) {
|
if (querySelectorAll('svg defs', app).length > 0) {
|
||||||
return
|
continue
|
||||||
}
|
}
|
||||||
|
|
||||||
const defs = `
|
const defs = `
|
||||||
|
@ -202,4 +201,17 @@ const updateTopMenu = function() {
|
||||||
menuCache = menu.innerHTML + menu.nextSibling.innerHTML
|
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)
|
||||||
|
})
|
||||||
|
|
Loading…
Reference in a new issue