Show tooltip when setting period on draw

This commit is contained in:
Hans5958 2022-04-29 11:29:58 +07:00
parent 5634f58b8d
commit 8c74460bf2
2 changed files with 15 additions and 4 deletions

View file

@ -285,7 +285,10 @@ @supports (backdrop-filter: blur()) or (-webkit-backdrop-filter: blur()) {
}
}
#timeControls:hover #timeControlsTooltip, #timeControlsSlider:focus + #timeControlsTooltip {
#timeControls:hover #timeControlsTooltip,
#timeControlsSlider:focus + #timeControlsTooltip,
body[data-canvas-loading][data-init-done] #timeControlsTooltip,
body[data-init-done] #timeControlsTooltip[data-force-visible] {
opacity: 1;
visibility: visible;
}

View file

@ -54,6 +54,7 @@ const image = document.getElementById("image");
let abortController = new AbortController()
let currentUpdateIndex = 0
let updateTimeout = setTimeout(null, 0)
let tooltipDelayHide = setTimeout(null, 0)
let currentVariation = "default"
const defaultPeriod = variationsConfig[currentVariation].default
@ -163,7 +164,8 @@ async function updateBackground(newPeriod = currentPeriod, newVariation = curren
}
async function updateTime(newPeriod = currentPeriod, newVariation = currentVariation) {
document.body.dataset.canvasLoading = true
updateTooltip(newPeriod, newVariation)
document.body.dataset.canvasLoading = ""
let configObject
[configObject, newPeriod, newVariation] = await updateBackground(newPeriod, newVariation)
@ -199,8 +201,14 @@ async function updateTime(newPeriod = currentPeriod, newVariation = currentVaria
})
}
dispatchTimeUpdateEvent(newPeriod, atlas)
document.body.dataset.canvasLoading = false
dispatchTimeUpdateEvent(newPeriod, atlas)
delete document.body.dataset.canvasLoading
tooltip.dataset.forceVisible = ""
clearTimeout(tooltipDelayHide)
tooltipDelayHide = setTimeout(() => {
delete tooltip.dataset.forceVisible
}, 1000)
}
function updateTooltip(newPeriod, newVariation) {